:root { --text: #f6f1fb; --muted: rgba(255,255,255,0.78); --panel: rgba(124,94,156,0.30); --panel-border: rgba(255,255,255,0.20); --rocket-a: #a7ecff; --rocket-b: #6c7cff; --bg: #050713; --text: #f8f8ff; --muted: #a9adc2; --card: rgba(255,255,255,0.06); --line: rgba(255,255,255,0.12); --accent: #8d7cff; }
.mobile-service-arrows { display: none; }
.loader-wrap { position: fixed; inset: 0; background: #050505; z-index: 999999; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.rocket-loader { width: 320px; text-align: center; color: #fff; font-family: Arial,sans-serif; }
.rocket { font-size: 48px; margin-bottom: 20px; transform: translateX(-130px); }
.rocket-loader h2 { font-size: 32px; margin-bottom: 22px; letter-spacing: 2px; text-transform: uppercase; }
.progress-box { width: 100%; height: 6px; background: rgba(255,255,255,0.15); border-radius: 50px; overflow: hidden; }
.progress-fill { width: 0%; height: 100%; background: #fff; border-radius: 50px; }
.progress-text { margin-top: 14px; font-size: 18px; letter-spacing: 1px; }
/* MENU */
.serviceDropDown li.dropdown-item.submenu { background-color: transparent !important; }
/* .serviceDropDown ul.dropdown-menu{background-color: #00000000; backdrop-filter: blur(5px); }
 */
li.dropdown-item.submenu.active {
  /* background-color:#9922c4 !important;*/
  /* color:#fff !important;*/
  
}
.logo-marquee .swiper-slide img.banner-img.img-fluid { width: 230px; display: flex; align-items: center; height: 90px; object-fit: contain; object-position: center center; aspect-ratio: 16/9; }
/* .homePage{background-image: url(../../img/homepage.webp); background-size: cover; background-position: center center; background-repeat: no-repeat; }
 */
.topleftcircle { background-image: url(../../img/mainbodyleft.webp); position: absolute; width: 100vw; height: 100vw; left: 0; top: -80%; z-index: 1; background-size: contain; background-repeat: no-repeat; }
.topmiddlecircle { background-image: url(../../img/mainbodyrightmiddle.webp); background-position: right; position: absolute; width: 100vw; height: 100vw; right: 0; top: 0; z-index: 999999; background-size: contain; background-repeat: no-repeat; z-index: -1; }
.topbottomcircle { background-image: url(../../img/mainbodlyleftbottom.webp); background-position: left; position: absolute; width: 100vw; height: 100vw; left: 0; top: 50%; transform: translateY(-50%); z-index: 999999; background-size: contain; background-repeat: no-repeat; z-index: -1; }
a#openPopup::before { content: ""; font-size: 24px; position: absolute; top: 1px; left: 53%; transform: translate(-50%,-50%) rotate(-130deg); margin: 0; width: 20px; height: 20px; border-right: 2px solid #ffffff; border-bottom: 2px solid #ffffff; background-color: #fff; }
div#popupOverlay .contact-wrap { width: 100%; }
#herosec video { width: 100%; height: 100%; }
section { position: relative; }
div#serviceNav,div#progressLabel { display: none; }
#stage { position: fixed; inset: 0; z-index: 0; }
#stage canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
html { scroll-behavior: auto !important; }
body { cursor: none; }
p { line-height: 1.5; font-size: 18px; font-weight: 400; font-family: "HaasGrot-Disp"; margin: 0; }
.rocket-cursor { position: fixed; top: 0; left: 0; width: 70px; height: 70px; pointer-events: none; z-index: 999999; will-change: transform; }
.rocket-cursor img { width: 100%; height: 100%; object-fit: contain; transform-origin: center center; }
a.themeBtn { background-color: #9C1EC5; padding: 10px 30px 10px 30px; line-height: 1 !important; border-radius: 30px; margin: auto; display: table; font-family: 'Spaced'; font-size: 22px; line-height: 32px; display: flex; width: fit-content; transition: 0.5s; }
a.leftalignBtn { margin-left: 0 !important; }
a.themeBtn:hover { background-color: #fff; color: #000; }
.fluid-section { position: relative; overflow: hidden; }
.testimonial-slider-arrows { display: none; }
.fluidCanvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; pointer-events: none; }
.nav-down { transform: translateY(-100px); transition: 0.5s; }
/* SECTION BREAK */
/* HERO SECTION */
.wrapper { position: relative; top: 0; width: 100%; height: 100vh; overflow: hidden; z-index: 1; }
.sticky_layer { justify-content: center; align-items: center; height: 100vh; display: flex; position: -webkit-sticky; position: sticky; top: 0; overflow: hidden; }
.video-container { width: 100%; height: 100vh; position: absolute; overflow: hidden; }
.zoom { flex-direction: column; justify-content: center; display: flex; position: relative; height: 100vh; align-item: center; }
.svg { width: 100%; position: relative; box-shadow: inset 0 0 0 2px #eef7ff,0 0 0 50vw #eff7ff; }
.newpage { position: relative; padding-top: 0 !important; }
.MobileVideo { display: none; }
/* SECTION BREAK */
.wwsf_section { padding: 150px 0; position: relative; overflow: visible; color: #fff; }
.wwsf_heading { font-family: "Return-Space"; font-size: 100px !important; line-height: 1 !important; }
section.wwsf_section .sectionHeading.text-center { z-index: 99999; position: relative; }
span.freefalltext { background-color: #9C1EC5; color: #fff !important; padding: 6px 20px; border-radius: 0; position: absolute; transform: rotate(-15deg); bottom: -15px; }
/*****************************************
 SECOND SECTION 
 *****************************************/.werepresent { overflow: hidden; position: relative; height: 100vh; display: flex; align-items: center; justify-content: center; }
.animateText { z-index: 9999999; position: relative; width: 100%; text-align: center; display: flex; justify-content: center; align-items: center; }
.weRepresent-section { position: relative; min-height: auto; overflow: hidden; color: #fff; }
/* #weRepresentSection{background-image: url(../../img/homewerepresent.webp); background-repeat: no-repeat; background-repeat: no-repeat; background-size: cover; background-position: 0% 10%; }
 */
.bg-layer-top { position: absolute; inset: 0; background: #1d0f1e; z-index: 0; }
canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; z-index: 1; }
.bg-layer-center { pointer-events: none; position: absolute; inset: 0; background: radial-gradient(circle at center,transparent 10%,rgba(0,0,0,0.03) 100%); z-index: 2; }
.content-wrap { pointer-events: all; position: relative; z-index: 10; margin: 0 auto; min-height: 100vh; display: flex; align-items: center; padding: 64px 24px; z-index: 99999999999; }
.content-box { display: flex; align-items: center; justify-content: center; width: 100%; margin: 0; gap: 30px; }
.content-box .bigAnimateText { font-family: "Return-Space"; font-size: 260px !important; line-height: 1 !important; }
.content-box .typeWriteText { font-family: "Return-Space"; font-size: 120px !important; line-height: 1 !important; color: #8FF8FF; }
.content-box .typeWriteText .typewriter-text { animation: blink .5s step-end infinite alternate; border-right: 5px solid; }
@keyframes blink {
  50% { border-color: transparent }
}
.bottom-fade {
  /* pointer-events:none;*/
  /* position:absolute;*/
  /* inset-inline:0;*/
  /* bottom:0;*/
  /* height:120px;*/
  /* background:linear-gradient(to top,rgba(22,49,61,0.30),transparent);*/
  /* z-index:3;*/
  
}
/*****************************************
            SECOND SECTION END
 *****************************************//****************************************
           SERVICE SECTION START 
 ****************************************/.services-space { position: relative; width: 100%; min-height: 100vh; height: 100vh; padding: 78px 5vw 54px; display: flex; flex-direction: column; justify-content: center; overflow: visible; isolation: isolate; background-image: url("../../img/ourservices.webp"); background-size: cover; background-position: center; background-repeat: no-repeat; }
.section-head { width: min(820px,100%); margin: 0 auto 28px; text-align: center; position: relative; z-index: 20; }
.services-space .section-head h2 { margin-top: 16px; line-height: 1.02; font-family: "Return-Space"; font-size: 79px !important; letter-spacing: .28em; text-transform: uppercase; color: rgba(255,255,255,0.9); }
.orbit-stage { width: 100%; height: min(660px,68vh); min-height: 530px; position: relative; perspective: 1400px; transform-style: preserve-3d; touch-action: pan-y; cursor: grab; }
.orbit-stage { z-index: 1; }
.skip-services-btn { position: absolute; bottom: 0; right: -50px; z-index: 9999; padding: 12px 22px; border: 1px solid rgba(255,255,255,.2); border-radius: 40px; background: rgba(255,255,255,.08); backdrop-filter: blur(10px); color: #fff; font-size: 14px; font-weight: 600; cursor: pointer; transition: .3s ease; height: auto; top: auto !important; }
.skip-services-btn:hover { background: #fff; color: #000; transform: translateY(-2px); }
@media(max-width:768px) {
  .skip-services-btn { top: 15px; right: 15px; padding: 10px 18px; font-size: 13px; }
}
#cards { z-index: 1; }
.section-head { z-index: 10; }
.active-service-panel { z-index: 50; }
.rocket-progress { z-index: 40; }
.orbit-stage:active { cursor: grabbing; }
.orbit-ring { position: absolute; width: min(960px,82vw); height: min(390px,34vw); min-height: 245px; left: 50%; top: 35%; transform: translate(-50%,-50%); border: 0; border-radius: 50%; opacity: 0; z-index: -1; }
/* Any custom cursor must be visual only. */
.custom-cursor,.mouse-cursor,.cursor-dot,.cursor-outline,.rocket-cursor,.cursor-rocket { pointer-events: none !important; }
#cards { position: absolute; inset: 0; pointer-events: none; transform-style: preserve-3d; }
.service-card { --planet-a: #7766ff; --planet-b: #281b72; --planet-glow: rgba(114,92,255,.58); position: absolute; left: 50%; top: 35%; width: clamp(300px,42vw,560px); padding: 20px 18px 18px; transform-style: preserve-3d; transform-origin: center; will-change: transform,opacity,filter; user-select: none; text-align: center; pointer-events: none !important; }
.planet-wrap { width: clamp(150px,17vw,220px); aspect-ratio: 1; margin: 0 auto; position: relative; display: grid; place-items: center; transform-style: preserve-3d; pointer-events: none; }
.planet { position: relative; width: 100%; height: 100%; border-radius: 50%; overflow: hidden; background: #11162a; box-shadow: -22px 24px 58px rgba(0,0,0,.5),0 0 58px var(--planet-glow),inset -32px -18px 60px rgba(0,0,0,.44); isolation: isolate; }
.planet img { width: 100%; height: 100%; display: block; object-fit: cover; border-radius: inherit; transform: scale(1.08); filter: saturate(1.08) contrast(1.08); }
.planet::before,.planet::after { content: ""; position: absolute; border-radius: inherit; pointer-events: none; }
.planet::before { inset: 0; background: radial-gradient(circle at 28% 24%,rgba(255,255,255,.46),transparent 20%),radial-gradient(circle at 72% 72%,transparent 28%,rgba(0,0,0,.62) 78%); mix-blend-mode: screen; z-index: 2; }
.planet::after { inset: -1px; background: linear-gradient( 115deg,rgba(255,255,255,.22),transparent 30%,transparent 62%,rgba(0,0,0,.42) ); z-index: 3; }
.ringed .planet-ring { position: absolute; width: 148%; height: 42%; border: 13px solid color-mix(in srgb,var(--planet-a),white 35%); border-left-color: transparent; border-right-color: transparent; border-radius: 50%; transform: rotate(-16deg); filter: drop-shadow(0 0 14px var(--planet-glow)); z-index: 0; }
.ringed .planet { z-index: 1; }
.planet-moon { position: absolute; width: 28px; height: 28px; right: 1%; top: 8%; border-radius: 50%; background: radial-gradient(circle at 30% 30%,#fff,#aaa 25%,#353545 70%); box-shadow: 0 0 20px rgba(255,255,255,.25); }
.active-service-panel { position: absolute; left: 50%; bottom: 35px; width: min(1199px,calc(100% - 150px)); transform: translateX(-50%); z-index: 99999; text-align: center; pointer-events: auto; isolation: isolate; }
.active-service-panel__inner { position: relative; z-index: 2; pointer-events: auto; }
.active-service-panel .service-index { display: NONE; margin-bottom: 8px; font-size: 12px; font-weight: 800; letter-spacing: 0.2em; }
.active-service-panel h3 { position: relative; z-index: 2; letter-spacing: -0.035em; color: #fff; margin: 0; font-family: "Spaced"; font-size: clamp(40px,3.8vw,45px) !important; line-height: 1.2; letter-spacing: .24em; text-transform: uppercase; font-weight: 500; text-shadow: 0 10px 34px rgb(0 0 0/26%); width: 100%; margin: auto; border: 1px solid rgba(255,255,255,.2); border-radius: 40px; background: rgba(255,255,255,.08); backdrop-filter: blur(10px); padding: 10px 35px 10px 35px; transition: 0.5s !important; }
.active-service-panel p { position: relative; z-index: 2; max-width: 560px; margin: 11px auto 0; color: rgba(255,255,255,0.75); font-size: 13px; line-height: 1.65; font-family: "HaasGrot-Disp"; margin: 16px auto 0; max-width: 840px; color: #FFF; font-size: clamp(18px,.95vw,13px); line-height: 1.75; }
.active-service-panel .service-btn { position: relative; pointer-events: auto; cursor: pointer; PADDING: 10px 30px 10px 30px; margin-top: 20px; }
.service-btn:hover,.service-btn:focus-visible { background: #fff; color: #080a13; transform: translateY(-2px); }
.service-btn span { font-size: 16px; }
.controls { position: absolute; left: 50%; bottom: 12px; transform: translateX(-50%); display: flex; align-items: center; z-index: -99999999; pointer-events: auto; }
.dots { display: NONE; gap: 7px; pointer-events: auto; }
.dot { width: 7px; height: 7px; border: 0; border-radius: 50%; background: rgba(255,255,255,.25); cursor: pointer; transition: .3s ease; pointer-events: auto; }
.dot.active { width: 25px; border-radius: 8px; background: #fff; }
.rocket-progress { position: absolute; right: clamp(16px,3.2vw,56px); top: 50%; width: 62px; height: min(390px,58vh); min-height: 270px; transform: translateY(-50%); z-index: 1200; display: flex; justify-content: center; pointer-events: none; }
.rocket-track { position: relative; width: 4px; height: 100%; border-radius: 999px; background: rgba(255,255,255,.13); }
.rocket-fill { position: absolute; left: 0; bottom: 0; width: 100%; height: 0%; border-radius: inherit; background: linear-gradient(to top,#6957ff,#b7adff,#fff); }
#rocketFireCanvas { width: 22px; height: 46px; position: relative; pointer-events: none; }
#rocketFireCanvas::before { content: ""; position: absolute; left: 50%; top: 0; width: 18px; height: 42px; transform: translateX(-50%); border-radius: 50% 50% 45% 45%; background: radial-gradient(circle at 50% 20%,#fff 0%,#ffd36b 22%,#ff7a1a 52%,rgba(255,60,0,0) 78%); filter: blur(1px); transform-origin: top center; animation: rocketFire 0.12s infinite alternate ease-in-out; }
@keyframes rocketFire {
  from { transform: translateX(-50%) scaleY(0.85) scaleX(0.9); opacity: 0.65; }
  to { transform: translateX(-50%) scaleY(1.15) scaleX(1.08); opacity: 1; }
}
.progress-rocket { position: absolute; left: 50%; bottom: 0; width: 65px; height: 65px; margin-left: -32px; margin-bottom: -32px; display: flex; align-items: center; flex-direction: column; justify-content: center; font-size: 34px; line-height: 1; pointer-events: none; z-index: 10; transform: none; will-change: bottom; }
.progress-rocket { pointer-events: none !important; }
.rocket-percent { position: absolute; left: 18px; bottom: 0%; transform: translateY(50%); min-width: 44px; padding: 5px 8px; border: 1px solid rgba(255,255,255,.14); border-radius: 999px; color: #fff; background: rgba(8,10,24,.72); font-size: 10px; font-weight: 800; text-align: center; letter-spacing: .08em; pointer-events: none; }
.drag-hint { position: absolute; right: 4vw; bottom: 25px; color: rgba(255,255,255,.45); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; pointer-events: none; }
@media (max-width:460px) {
  .services-space .section-head h2 { font-size: 35px !important; }
  .rocket-progress { display: NONE; }
  .active-service-panel h3 { font-size: 25px !important; }
  .active-service-panel p { font-size: 12px; }
}
@media (max-width:768px) {
  .services-space { padding: 58px 16px 28px; }
  .section-head { margin-bottom: 4px; }
  .orbit-stage { height: 610px; min-height: 610px; }
  .orbit-ring { width: 680px; height: 285px; top: 34%; }
  .service-card { top: 34%; width: min(88vw,500px); }
  .planet-wrap { width: 165px; }
  .controls { bottom: 3px; }
  .rocket-progress { right: 4px; height: 330px; min-height: 250px; transform: translateY(-45%) scale(.88); }
  .drag-hint { display: none; }
  .mobile-service-arrows,.rocket-progress { display: none; }
  .services-space { min-height: auto; height: auto; overflow: hidden; padding-top: 60px; padding-bottom: 60px; }
  .services-space.is-mobile-slider { position: relative !important; inset: auto !important; transform: none !important; }
  .services-space.is-mobile-slider .orbit-stage { touch-action: pan-y; cursor: grab; }
  .services-space.is-mobile-slider .orbit-stage:active { cursor: grabbing; }
  .mobile-service-arrows { position: absolute; left: 50%; top: 5px; z-index: 150; display: flex; align-items: center; gap: 14px; transform: translateX(-50%); }
  .mobile-service-arrow { width: 30px; height: 30px; padding: 0; border: 1px solid rgb(62 45 98); border-radius: 50%; background: rgb(60 41 94); color: #fff; font-size: 10px; line-height: 14px !important; display: flex; align-items: center; justify-content: center; cursor: pointer; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); transition: opacity 0.25s ease,background 0.25s ease,transform 0.25s ease; }
  .mobile-service-arrow:active { transform: scale(0.92); }
  .mobile-service-arrow:disabled { opacity: 0.3; cursor: not-allowed; }
  .active-service-panel { padding-bottom: 75px; }
}
@media (max-width:460px) {
  .section-head h2 { font-size: 37px; }
  .orbit-stage { height: 590px; min-height: 590px; }
  .service-card { width: min(92vw,430px); }
  .planet-wrap { width: 145px; }
  .active-service-panel { width: calc(100% - 42px); transform: translate(-50%,125px); }
  .active-service-panel h3 { font-size: 25px; }
  .active-service-panel p { font-size: 12px; }
}
/****************************************
           SERVICE SECTION END 
 ****************************************/@media (max-width:767px) {
  /* .dektopVideo{display: none; }.MobileVideo{display: block; object-fit: cover; }
  */
  .maintestdiv.position-relative { position: relative !important; width: 100%; display: block; }
  .testimonial-cards .card { padding: 15px !important; }
  .cards-scroll-section { padding: 0 10px !important; }
}
/**********************************
        SERVICE END 
***********************************//**********************************
    WHAT WE STAND FOR SECTION 
***********************************/.animation-container {
  height:100vh;width:100%;overflow:visible;display:flex;justify-content:center;align-items:center;perspective:1500px;/* 3D depth ke liye */
  position:relative;
}
.card-wrapper { position: relative; width: 90%; max-width: 1130px; height: 690px; display: flex; justify-content: center; align-items: center; margin: auto; }
.card-wrapper.mobile-view { display: none; }
.card-group { display: grid; grid-template-columns: repeat(2,1fr); gap: 20px; position: absolute; width: 100%; }
.Customcard { background: linear-gradient(135deg,#00b4db,#0083b0); color: white; display: flex; justify-content: center; align-items: center; border-radius: 15px !important; box-shadow: 0 10px 30px rgba(0,0,0,0.5); backface-visibility: hidden; display: flex; padding: 10px; flex-direction: row !important; min-width: 100%; border: 0; }
.card.Customcard { background-image: url(../../img/videsecbg.webp); background-size: 120%; background-repeat: no-repeat; background-position: center; animation: bgMove 8s ease-in-out infinite alternate; }
@keyframes bgMove {
  0% { background-position: left center; }
  50% { background-position: center center; }
  100% { background-position: right center; }
}
.Customcard * { pointer-events: none; color: #000 !important; }
.Customcard { pointer-events: auto; }
.Customcard .content h3 { line-height: 1.5; font-size: 34px !important; font-weight: 500; font-family: "HaasGrot-Disp"; margin: 0; text-transform: capitalize; }
.Customcard .content p { line-height: 1.5; font-size: 18px; font-weight: 500; font-family: "HaasGrot-Disp"; margin: 0; }
.Customcard .content { text-align: left; margin-left: 20px; width: 100%; }
/* Group 2 initial state */
.group-2 .Customcard { opacity: 0; }
.videoHover { width: 245px; height: 100%; background-color: #fff; border-radius: 15px; overflow: hidden; }
.card.Customcard { height: 220px; }
.videoHover video { width: 100%; height: 100%; object-fit: cover; }
.videoEditinSlider .swiper-slide.swiper-slide-active button.story-play-btn { display: block; }
.videoEditinSlider .swiper-slide button.story-play-btn,.videoEditinSlider .swiper-slide.swiper-slide-active button.story-play-btn.hide { display: none; }
/**********************************
  WHAT WE STAND FOR SECTION END
***********************************/.ourlegacy { position: relative; width: 100%; overflow: visible; padding: 150px 0 50px 0; }
.legacyContent { z-index: 99999; position: relative; }
h2.legacy-heading { font-family: 'Return-Space'; font-size: 100px !important; line-height: 1; }
.legacyContent h3.subHeading { font-size: 38px !important; font-family: 'Spaced'; line-height: 1; }
.logo-marquee { margin-top: 150px; }
.logo-marquee .swiper-container { margin: 50px 0; }
/* CAROUSEL */
.swiper-container { width: 100%; height: 100%; position: relative; }
.swiper-container.swiper--bottom:after { animation-direction: reverse; }
.swiper-wrapper { -webkit-transition-timing-function: linear !important; transition-timing-function: linear !important; position: relative; }
.swiper-slide { display: flex; justify-content: center; align-items: center; width: auto; position: relative; overflow: hidden; padding: 0 50px; }
@keyframes line-slide {
  0% { background-position: -5% 0; }
  100% { background-position: 100% 0; }
}
/* COUNTER */
.countnumber { position: relative; width: 100%; overflow: visible; padding: 150px 0; }
.animCounter { font-family: "Return-Space"; font-size: 125px !important; line-height: 1; }
span.animCounterr { margin: 0 10px; }
.super-lead-text { font-family: "Spaced"; font-size: 45px !important; line-height: 1; }
/* TESTIMONAIL SECTION */
/* BRANPACSECTION */
.spacer { position: relative; width: 100%; overflow: hidden; height: 80vh; display: flex; justify-content: center; align-items: center; }
.marqueApposition { position: absolute; z-index: -1; top: 50%; left: 50%; transform: translate(-50%,-50%); }
.scrolling-text { overflow: hidden; width: 100% !important; display: flex; align-items: center; }
.scrolling-text .rail { display: flex; }
.scrolling-text .rail h4 { -webkit-text-stroke: 3px #ffffff38; -webkit-text-fill-color: transparent; color: #333; white-space: nowrap; line-height: 1em; font-family: "Metropolis"; font-size: 300px !important; list-style: 1.2; }
.branpac-content h3 { font-family: 'Return-Space'; font-size: 100px !important; line-height: 1; margin-bottom: 20px; z-index: 99999; }
.branpac-content p { font-family: 'HaasGrot-Disp'; font-size: 18px !important; line-height: 28px; font-weight: 500; }
.margin-tb-5 { margin-top: 40px !important; }
/* TESTIMONIAL */
.testimonial { position: relative; display: flex; justify-content: center; align-items: center; min-height: 100vh; overflow: hidden; }
.testimonialHeading { padding-bottom: 60px; }
.testimonialHeading h2 { font-family: 'Return-Space' !important; font-size: 100px !important; line-height: 105px; }
.testimonialHeading h3 { font-family: 'Spaced' !important; font-size: 38px !important; line-height: 1; }
.testimonial-cards-wrap {
  position:relative;z-index:5;/* display:flex;*/
  /* justify-content:center;*/
  
}
.testimonial-cards { padding: 0; margin: 0; display: grid; width: 70svw; }
.testimonial-cards>* { grid-area: 1/1/2/2; }
.testimonial-cards li { list-style: none; }
.testimonial-cards .card { height: 60svh; display: flex; min-height: auto; padding: 30px; background: #9C1EC5; background: radial-gradient(circle,rgba(156,30,197,1) 0%,rgba(30,15,30,1) 100%); align-items: center; justify-content: center; border-top-right-radius: 200px; border-bottom-left-radius: 200px; border: 2px solid #fff; }
.testimonial-cards-wrap li.card { text-align: center; }
.testimonial-cards-wrap li.card img { width: 150px; }
.testimonial-cards .card .flair { width: 60%; }
.testimonial-cards .card .flair .clinettitle { font-family: 'spaced' !important; font-size: 75px !important; line-height: 1 !important; padding-top: 35px; }
.testimonial-cards .card .flair .clientReview { padding-top: 40px; font-family: 'HaasGrot-Disp'; font-size: 20px; line-height: 30px; }
.testimonial-cards .card .flair .bottomtext { padding-top: 40px; font-family: 'spaced' !important; font-size: 18px; line-height: 28px; color: #8FF8FF; }
/* FOOTER SOCIAL */
.footerLogo { display: flex; justify-content: center; width: 100%; margin-bottom: 50px; }
.footerLogo img.footerLogoImage { max-width: 184px; }
ul.footerSocial { margin: 0; padding: 0; display: flex; justify-content: center; }
.footer-heding { font-family: 'HaasGrot-Disp'; font-size: 18px !important; font-weight: 500; line-height: 1.2; margin-bottom: 20px; letter-spacing: 19%; }
ul.footerUL { margin: 0; padding: 0; }
footer.modern-footer .footer-container { position: relative; z-index: 99; }
.masked-text { font-size: 20vw !important; font-family: "Metropolis"; font-weight: bold; color: transparent; background-image: url(../../img/footermasking.webp); background-size: 110%; background-position: 0 50%; background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: animate-background 10s infinite alternate linear; line-height: 0.85; position: relative; width: 100%; left: 49%; transform: translateX(-50%); bottom: -45px; margin: 0; }
@keyframes animate-background {
  0% { background-position: 0 50%; }
  100% { background-position: 100% 50%; }
}
.social-buttons { border-radius: 5px; display: flex; flex-wrap: wrap; justify-content: center; margin-top: -10px; }
.social-buttons__button { margin: 5px; }
.social-button { border-radius: 50%; position: relative; display: flex; justify-content: center; align-items: center; outline: none; width: 40px; height: 40px; text-decoration: none; }
.social-icons { width: 100%; }
.social-button__inner { font-size: 2.3rem; position: relative; display: flex; align-items: center; justify-content: center; width: calc(100% - 2px); height: calc(100% - 2px); border-radius: 100%; background: #9c1ec5; text-align: center; }
.social-button:hover .social-button__inner { color: #000 }
.social-button i,.social-button svg { position: relative; z-index: 1; transition: 0.3s; }
.social-button i { font-size: 20px; }
.social-button svg { height: 40%; width: 40%; }
.social-button::after { content: ""; position: absolute; top: 0; left: 50%; display: block; width: 0; height: 0; border-radius: 100%; transition: 0.3s; }
.social-button:focus,.social-button:hover { color: #fff; text-decoration: none; }
.social-button:focus::after,.social-button:hover::after { width: 100%; height: 100%; margin-left: -50%; }
.social-button--facebook { color: #fff; }
.social-button--facebook::after { background: #fff; }
.social-button--linkedin { color: #fff; }
.social-button--linkedin::after { background: #fff; }
.social-button--github { color: #000; }
.social-button--github::after { background: #fff; }
.social-button--codepen { color: #000; }
.social-button--codepen::after { background: #fff; }
.social-button--instagram { color: #fff; }
.social-button--instagram::after { background: #fff; }
/* social media icons end  */
/* FIRE CSS */
#rocketFireCanvas { width: 22px; height: 35px; position: relative; pointer-events: none; }
#rocketFireCanvas::before { content: ""; position: absolute; left: 50%; top: -9px; width: 18px; height: 42px; transform: translateX(-50%) !important; border-radius: 50% 50% 45% 45%; background: radial-gradient(circle at 50% 20%,#fff 0%,#ffd36b 22%,#ff7a1a 52%,rgba(255,60,0,0) 78%); filter: blur(1px); transform-origin: top center; animation: rocketFire 0.12s infinite alternate ease-in-out; }
@keyframes rocketFire {
  from { transform: translateX(-50%) scaleY(0.85) scaleX(0.9); opacity: 0.65; }
  to { transform: translateX(-50%) scaleY(1.15) scaleX(1.08); opacity: 1; }
}
/* CLENT SECTION */
.clients { position: relative; width: 100%; overflow: hidden; padding: 150px 0; }
.magazine-section { overflow: hidden; position: relative; display: flex; align-items: center; justify-content: center; }
.magazine-section h2 { position: absolute; top: -58px; left: 50%; transform: translateX(-50%); color: #fff; font-size: clamp(95px,16vw,245px); font-weight: 900; line-height: 0.9; letter-spacing: -12px; z-index: 1; user-select: none; pointer-events: none; }
.magazine-stack { position: relative; width: 100%; height: 610px; z-index: 3; margin-top: 120px; }
.mag-card { position: absolute; width: 320px; height: 465px; top: 50%; left: 50%; transform-origin: center bottom; cursor: pointer; transition: transform 0.7s cubic-bezier(.18,.76,.2,1),filter 0.28s ease; will-change: transform; background: #111; }
.mag-card::after { content: ""; position: absolute; inset: 0; background: linear-gradient(105deg,transparent 0%,rgba(255,255,255,0.18) 44%,transparent 70%); opacity: 0.35; pointer-events: none; mix-blend-mode: screen; }
.mag-card img { width: 100%; height: 100%; object-fit: cover; display: block; border: 1px solid rgba(255,255,255,0.16); box-shadow: 0 5px 5px rgba(0,0,0,0.194); }
.card-1 { transform: translate(-650px,-205px) rotate(-14deg); z-index: 1; }
.card-2 { transform: translate(-445px,-260px) rotate(-7deg); z-index: 2; }
.card-3 { transform: translate(-170px,-290px) rotate(1deg); z-index: 3; }
.card-4 { transform: translate(95px,-285px) rotate(6deg); z-index: 4; }
.card-5 { transform: translate(335px,-250px) rotate(12deg); z-index: 5; }
.magazine-stack:hover .mag-card:not(:hover) { filter: brightness(0.46); }
.mag-card.is-hovered { z-index: 20 !important; }
.mag-slider-controls { position: absolute; left: 50%; bottom: 70px; transform: translateX(-50%); z-index: 6; display: flex; gap: 10px; }
.mag-slider-controls button { width: 38px; height: 38px; border-radius: 50%; border: 1px solid rgba(255,255,255,0.28); background: rgba(255,255,255,0.08); color: #fff; font-size: 18px; cursor: pointer; backdrop-filter: blur(8px); }
.hint { position: absolute; left: 50%; bottom: 28px; transform: translateX(-50%); z-index: 5; color: rgba(255,255,255,0.68); font-size: 13px; letter-spacing: 0.08em; text-transform: uppercase; text-align: center; }
.book-modal { position: fixed; inset: 0; display: none; align-items: center; justify-content: center; background: radial-gradient(circle at center,rgba(28,28,28,0.96),rgba(0,0,0,0.97)); z-index: 9999; perspective: 2200px; user-select: none; }
.book-modal.active { display: flex; }
.book-close { position: absolute; top: 22px; right: 34px; z-index: 10002; color: #fff; font-size: 48px; line-height: 1; cursor: pointer; }
.book-wrap { height: min(650px,80vh); position: relative; display: flex; background: #f7f2ea; border-radius: 6px; transform-style: preserve-3d; filter: drop-shadow(0 35px 70px rgba(0,0,0,0.75)); touch-action: none; }
.page-number { display: none; }
.book-page { width: 50%; height: 100%; position: relative; overflow: hidden; background: #fff; padding: 0; backface-visibility: hidden; }
.book-page.left { border-radius: 3px 0 0 3px; box-shadow: inset -20px 0 34px rgba(0,0,0,0.12); cursor: grab; }
.book-page.right { border-radius: 0 3px 3px 0; box-shadow: inset 20px 0 34px rgba(0,0,0,0.1); cursor: grab; }
.book-page img,.flip-face img { width: 100%; height: 100%; object-fit: contain; display: block; background: #fff; pointer-events: none; user-select: none; backface-visibility: hidden; }
.book-page::after,.flip-face::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg,rgba(255,255,255,0.08),transparent 22%,rgba(0,0,0,0.04)); opacity: 0.5; }
.flip-sheet { position: absolute; top: 10px; width: calc(50% - 10px); height: calc(100% - 20px); z-index: 40; display: none; transform-style: preserve-3d; pointer-events: none; will-change: transform; }
.flip-sheet.is-visible { display: block; }
.flip-sheet.is-next { left: 50%; transform-origin: left center; }
.flip-sheet.is-prev { left: 10px; transform-origin: right center; }
.flip-sheet.is-animating { transition: transform 0.88s cubic-bezier(.18,.82,.16,1); }
.turn-shadow.is-animating,.paper-highlight.is-animating,.paper-shadow.is-animating { transition: opacity 0.88s cubic-bezier(.18,.82,.16,1),transform 0.88s cubic-bezier(.18,.82,.16,1); }
.flip-face { position: absolute; inset: 0; overflow: hidden; background: #fff; box-shadow: 0 18px 38px rgba(0,0,0,0.28); backface-visibility: hidden; transform-style: preserve-3d; }
.flip-face.front { transform: rotateY(0deg); }
.flip-face.back { transform: rotateY(180deg); }
.paper-highlight,.paper-shadow { position: absolute; inset: 0; pointer-events: none; z-index: 6; opacity: 0; }
.paper-highlight { background: linear-gradient(90deg,transparent 5%,rgba(255,255,255,0.32),transparent 72%); mix-blend-mode: screen; }
.paper-shadow { background: linear-gradient(90deg,rgba(0,0,0,0.36),transparent 54%,rgba(0,0,0,0.2)); mix-blend-mode: multiply; }
.turn-shadow { position: absolute; top: 10px; width: calc(50% - 10px); height: calc(100% - 20px); z-index: 28; pointer-events: none; opacity: 0; will-change: transform,opacity; }
.turn-shadow.is-next { left: 50%; background: radial-gradient(ellipse at left center,rgba(0,0,0,0.42),transparent 68%); }
.turn-shadow.is-prev { left: 10px; background: radial-gradient(ellipse at right center,rgba(0,0,0,0.42),transparent 68%); }
.page-number { position: absolute; right: 12px; bottom: 12px; padding: 5px 8px; border-radius: 999px; background: rgba(0,0,0,0.55); color: #fff; font-size: 12px; line-height: 1; z-index: 10; }
.book-controls { position: absolute; left: 50%; bottom: 68px; transform: translateX(-50%); display: flex; gap: 12px; z-index: 10001; }
.book-controls,.modal-note { display: none; }
.book-controls button { border: 1px solid rgba(255,255,255,0.3); border-radius: 999px; background: rgba(255,255,255,0.1); color: #fff; padding: 10px 16px; font-size: 13px; cursor: pointer; }
.book-controls button:disabled { opacity: 0.35; cursor: not-allowed; }
.modal-note { position: absolute; left: 50%; bottom: 28px; transform: translateX(-50%); color: rgba(255,255,255,0.65); font-size: 13px; letter-spacing: 0.06em; text-transform: uppercase; text-align: center; }
html.popup-open,body.popup-open { overflow: hidden !important; height: 100%; }
/* CONTACT FORM */
.get-quote { position: fixed; right: -115px; right: -58px; top: 50%; transform: translateY(-50%); transition: 0.5s; z-index: 99; height: 150px; display: flex; align-items: center; }
a#openPopup { background-color: #fff; color: #000; transform: rotate(-90deg); padding: 20px 30px; border-radius: 15px; border-top-right-radius: 0; }
.get-quote:hover { /* right: -58px; */ }
.page-wrap { width: 100%; min-height: 100vh; display: flex; align-items: center; justify-content: center; background: radial-gradient(circle at 50% 35%,rgba(148,92,204,0.20),transparent 26%),linear-gradient(180deg,rgba(18,8,37,1),rgba(4,3,11,1)); }
.open-popup-btn { height: 54px; padding: 0 42px; border-radius: 999px; border: none; cursor: pointer; background: #fff; color: #fff; font-size: 14px; letter-spacing: 0.08em; text-transform: uppercase; box-shadow: 0 0 40px rgba(177,31,255,0.45); transition: 0.3s ease; }
.open-popup-btn:hover { transform: scale(1.04); }
.popup-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.75); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); overflow: hidden; display: flex; align-items: center; justify-content: right; padding: 0; z-index: 999; opacity: 0; visibility: hidden; transition: 0.3s ease; /* right: 0; */ }
.popup-overlay.active { opacity: 1; visibility: visible; }
.popup-box { width: 100%; max-width: 600px; max-height: 100vh; height: 100vh; overflow-y: auto; overflow-x: hidden; border-radius: 0; position: relative; transform: scale(0.9); transition: 0.3s ease; -webkit-overflow-scrolling: touch; }
.popup-overlay.active .popup-box { transform: scale(1); }
.close-popup { position: absolute; top: 18px; right: 18px; width: 44px; height: 44px; border-radius: 50%; border: none; cursor: pointer; background: rgba(0,0,0,0.7); color: #fff; font-size: 28px; z-index: 20; transition: 0.25s ease; }
.close-popup:hover { background: #d22cff; transform: rotate(90deg); }
.contact-section { width: 100%; position: relative; overflow: hidden; height: 100vh; display: flex; align-items: center; justify-content: center; padding: 40px 24px; background: radial-gradient(circle at 50% 35%,rgba(148,92,204,0.38),transparent 26%),radial-gradient(circle at 88% 8%,rgba(95,64,180,0.22),transparent 20%),linear-gradient(180deg,rgba(18,8,37,0.9),rgba(4,3,11,1)); }
.contact-section::before { content: ""; position: absolute; inset: 0; opacity: 0.7; background-image: url(../../img/form.webp); background-size: cover; pointer-events: none; }
.contact-section::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 46%; background: radial-gradient(ellipse at center,rgba(210,201,229,0.34),rgba(118,83,147,0.20) 42%,transparent 70%); filter: blur(4px); pointer-events: none; }
.weRepresent-section .contact-wrap { position: relative; z-index: 2; width: 100%; max-width: 1180px; }
.contact-heading { text-align: center; margin-bottom: 32px; }
.eyebrow { font-size: 13px; letter-spacing: 0.22em; text-transform: uppercase; margin-bottom: 20px; color: rgba(255,255,255,0.85); }
.contact-heading h1 { font-size: clamp(30px,6vw,40px) !important; line-height: 0.95; letter-spacing: 3px; text-transform: uppercase; font-weight: 300; }
.contact-form { display: flex; flex-direction: column; gap: 28px; }
.form-grid { display: grid; grid-template-columns: repeat(1,1fr); gap: 20px; }
.field,.message-field,.phone-field { width: 100%; border: 1px solid rgba(255,255,255,0.85); background: rgba(255,255,255,0.30); color: #fff; outline: none; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); transition: 0.25s ease; font-family: 'Spaced' !important; font-size: 14px !important; }
.field,.phone-field { height: 44px; border-radius: 999px; padding: 0 20px; font-size: 13px; text-transform: uppercase; letter-spacing: 0.06em; }
.message-field { min-height: 170px; border-radius: 26px; padding: 20px; resize: none; font-size: 13px; text-transform: uppercase; letter-spacing: 0.06em; font-family: inherit; }
.field::placeholder,.message-field::placeholder,.phone-field::placeholder { color: rgba(255,255,255,0.9); }
.field:focus,.message-field:focus,.phone-field:focus { border-color: #d22cff; background: rgba(255,255,255,0.35); }
.phone-wrap { width: 100%; }
div#service-status { text-align: center; }
/* flags path fix */
.iti { width: 100%; --iti-path-flags-1x: url("https://cdn.jsdelivr.net/npm/intl-tel-input@25.3.1/build/img/flags.webp"); --iti-path-flags-2x: url("https://cdn.jsdelivr.net/npm/intl-tel-input@25.3.1/build/img/flags@2x.webp"); }
.iti__selected-country { padding-left: 14px !important; }
.iti__selected-dial-code { color: #fff; font-size: 12px; }
.iti__arrow { border-top-color: #fff !important; }
/* dropdown should stay above popup */
.iti__dropdown-content { z-index: 999999 !important; background: #fff !important; color: #111 !important; max-height: 280px !important; overflow: hidden !important; overscroll-behavior: contain; }
.field::placeholder,.message-field::placeholder,.phone-field::placeholder { font-size: 16px; font-weight: 400; font-family: 'Spaced'; }
/* actual country list scroll */
.iti__country-list { max-height: 230px !important; overflow-y: auto !important; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; touch-action: pan-y; }
.iti input.phone-field { padding-left: 104px !important; }
.button-wrap { display: flex; justify-content: center; padding-top: 28px; }
.submit-btn { width: 260px; border: none; border-radius: 999px; cursor: pointer; background-color: #9C1EC5; color: #fff; background-color: #9C1EC5; font-size: 16px; line-height: 1.2; letter-spacing: 0.08em; text-transform: uppercase; transition: 0.25s ease; font-family: 'Spaced'; padding: 10px !important; padding-bottom: 10px !important; }
.submit-btn:hover { transform: scale(1.03); }
/* RESPONSIVE */
@media (max-width:1875px) {
  .card-wrapper { position: relative; width: 90%; max-width: 1130px; height: 555px; display: flex; justify-content: center; align-items: center; margin: auto; }
}
@media (max-width:1600px) {
  .dropdown-div { transform: translate(-29%,10px) !important; }
  .active-service-panel h3 { font-size: clamp(35px,3.8vw,30px) !important; }
  .navbar .dropdown-menu .dropdown-item { flex: 0 0 215px; }
  .navbar .dropdown-menu .dropdown-item .dropdowntext a.dropTitle { font-size: 16px; }
  .dropdowntext a.themeBtn.leftalignBtn { font-size: 12px; padding: 5px 11px 5px 11px; }
  .accordion-menu { font-size: 22px; }
  .navbar .navbar-nav .nav-link { font-size: 14px; padding: 15px 25px 10px 25px; }
  h1.bannerHed { font-family: "Spaced"; font-size: 70px !important; line-height: 80px !important; }
  a#openPopup { padding: 15px 20px; height: auto; }
  /* .get-quote{right: -92px; }*/
  .get-quote { right: -45px; }
  .open-popup-btn { font-size: 12px; }
  .section-tag { font-size: 55px; }
  .wwsf_heading { font-family: "Return-Space"; font-size: 65px !important; line-height: 1 !important; }
  .card.Customcard { height: 190px; }
  .Customcard .content h3 { font-size: 26px !important; }
  .Customcard .content p { font-size: 16px; }
  .card-wrapper { height: 550px; }
  h2.legacy-heading { font-family: 'Return-Space'; font-size: 75px !important; line-height: 1; }
  .animCounter { font-family: "Return-Space"; font-size: 80px !important; line-height: 1; }
  .testimonialHeading { padding-bottom: 40px; }
  .super-lead-text { font-family: "Spaced"; font-size: 35px !important; line-height: 1; }
  .testimonialHeading h2 { font-family: 'Return-Space' !important; font-size: 60px !important; line-height: 70px; }
  .testimonial-cards .card .flair .clientReview { padding-top: 15px; font-family: 'HaasGrot-Disp'; font-size: 16px; line-height: 26px; }
  .testimonial-cards .card .flair .clinettitle { font-family: 'spaced' !important; font-size: 50px !important; line-height: 1.2 !important; padding-top: 10px; }
  .active-service-panel { bottom: 50px; }
  .services-space .section-head h2 { font-size: 50px !important; }
  .planet-wrap { width: clamp(150px,17vw,190px); }
}
@media (max-width:1440px) {
  .active-service-panel h3 { font-size: clamp(40px,3.8vw,35px) !important; width: 60%; }
  .content-wrap { pointer-events: all; position: relative; z-index: 10; margin: 0 auto; min-height: 60vh; display: flex; align-items: center; padding: 64px 24px; z-index: 99999999999; }
  .navbar .dropdown-menu .dropdown-item { flex: 0 0 200px; }
}
@media (max-width:1366px) {
  .testimonial-cards-wrap li.card img { width: 100px; }
  .testimonial-cards .card { height: 50svh; }
  .testimonial-cards .card .flair .clinettitle { font-size: 48px !important; padding-top: 15px; }
  .scrolling-text .rail h4 { font-size: 250px !important; }
  .testimonial-cards .card .flair .clientReview { padding-top: 25px; }
  .testimonial-cards .card .flair .clientReview { font-size: 16px; }
  .testimonial-cards .card .flair { width: 85%; }
  section.getwebsite .container { max-width: 100%; }
  .navbar .dropdown-menu .dropdown-item { flex: 0 0 190px; }
  .skip-services-btn { top: 0; }
}
@media (max-width:1280px) {
  .navbar .navbar-nav .nav-link { font-size: 16px; }
  h1.bannerHed { font-size: 65px !important; line-height: 75px !important; }
  a.themeBtn { font-size: 18px; line-height: 28px; display: flex; width: fit-content; }
  .testimonial { align-items: start; padding-top: 25px !important; }
  .branpac-content h3 { font-size: 70px !important; }
  .rocket-progress { right: clamp(0px,0vw,56px); }
  .navbar .dropdown-menu .dropdown-item { flex: 0 0 180px; }
  .dropdown-div { transform: translate(-22%,10px) !important; }
  .testimonialHeading h2 { font-size: 38px !important; line-height: 70px; }
  .testimonialHeading h3 { font-size: 28px !important; }
  .testimonial-cards .card .flair .clinettitle { font-size: 38px !important; padding-top: 15px; }
  .testimonial-cards .card .flair .clientReview { font-size: 14px; }
  .testimonial-cards-wrap li.card img { width: 80px; }
  .testimonial-cards-wrap li.card img { width: 80px; }
  .testimonial-cards .card { border-top-right-radius: 140px; border-bottom-left-radius: 140px; }
  .scrolling-text .rail h4 { font-size: 220px !important; }
  .Customcard .content h3 { font-size: 22px !important; }
  .Customcard .content p { font-size: 14px; }
  .card.Customcard { height: 170px; }
  .videoHover { width: 190px; }
  .card-wrapper { height: 460px; }
  .wwsf_heading { font-size: 50px !important; }
  span.freefalltext { padding: 4px 15px; font-size: 12px; }
  .skip-services-btn { bottom: 30px; font-size: 12px; font-weight: 400; }
}
@media (max-width:1199px) {
  .navbar .dropdown-menu .dropdown-item { flex: 0 0 170px; }
}
@media (max-width:1024px) {
  .navbar .dropdown-menu .dropdown-item { flex: 0 0 140px; }
  .navbar .dropdown-menu .dropdown-item .dropdowntext { top: 15px; left: 10px; }
  .navbar .navbar-nav .nav-link { padding: 15px 10px 10px 15px; font-size: 14px; }
  .weRepresent-section,.content-wrap { min-height: 70vh; }
  .content-box .bigAnimateText { font-size: 180px !important; }
  .content-box .typeWriteText { font-size: 80px !important; }
  /* SERVICES */
  .section-tag { font-size: 50px; }
  .wwsf_heading { font-size: 55px !important; }
  .card-wrapper { height: 500px; }
  .testimonialHeading h2 { font-size: 80px !important; line-height: 90px; }
  .testimonialHeading h3 { font-size: 28px !important; }
  p { font-size: 14px; }
}
@media (max-width:1100px) {
  .magazine-section { padding: 120px 0 90px; }
  .magazine-section h2 { top: 20px; font-size: clamp(72px,14vw,140px); letter-spacing: -4px; }
  .magazine-stack { width: 1180px; height: 590px; margin-top: 80px; transform: scale(0.88); transform-origin: center top; }
  .book-wrap { height: 68vh; }
  .cardcustomarrow { background-color: #9C1EC5 !important; border-radius: 50%; width: 20px; height: 20px; top: 55%; }
  .cardcustomarrow::after { font-size: 9px; color: #fff; height: auto !important; }
  .swiper-button-prev,.swiper-container-rtl .swiper-button-next { left: 5px; }
  .swiper-button-next,.swiper-container-rtl .swiper-button-prev { right: 5px; }
}
@media (max-width:991px) {
  .topnav { display: flex; align-items: center; width: 100%; justify-content: center; flex-direction: row-reverse; padding: 10px 0; }
  .topnav .menu-icon.cursor-pointer { margin-right: auto; }
  section.wwsf_section.animation-container .container.z-3 { width: 100% !important; max-width: 100%; }
  .contact-section { height: 100vh; overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch !important; align-items: baseline !important; }
  .contact-section::before { height: 150%; }
  .super-lead-text { font-size: 24px !important; }
  .animCounter { font-size: 50px !important; }
  .topnav .menu-icon.cursor-pointer { position: absolute; left: 10px; }
  span.hamIcon { background-color: #fff; width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; border-radius: 50%; }
}
@media (max-width:768px) {
  .skip-services-btn { display: none; }
  .testimonial-slider-arrows { display: flex; justify-content: center; margin-top: 20px; gap: 20px; }
  .magazine-section { min-height: auto; padding: 20px 0 0px; }
  .card-wrapper.mobile-view { display: block; }
  .card-wrapper.desktop-view { display: none; }
  .card-wrapper.mobile-view { height: 100% !important; padding: 80px 20px 30px 20px; width: 100%; }
  .wwsf_section { height: 100%; padding: 50px 0 !important; }
  .wwsf_heading { font-size: 45px !important; }
  span.freefalltext { padding: 4px 17px; bottom: -18px; font-size: 12px; }
  .magazine-section h2 { top: 24px; font-size: clamp(56px,16vw,100px); letter-spacing: -3px; text-align: center; width: 100%; }
  .magazine-stack { width: 1180px; height: 500px; margin-top: 70px; transform: scale(0.7); transform-origin: center top; }
  .mag-slider-controls { bottom: 42px; }
  .Customcard .content h3 { font-size: 18px !important; }
  .hint { bottom: 8px; font-size: 11px; width: 90%; }
  .book-modal { padding: 18px 10px; }
  .book-wrap { height: 52vh; min-height: 320px; padding: 6px; border-radius: 4px; }
  .book-wrap::before { width: 14px; }
  .book-page.left { box-shadow: inset -10px 0 18px rgba(0,0,0,0.1); }
  .book-page.right { box-shadow: inset 10px 0 18px rgba(0,0,0,0.08); }
  .flip-sheet { top: 6px; width: calc(50% - 6px); height: calc(100% - 12px); }
  .turn-shadow { top: 6px; width: calc(50% - 6px); height: calc(100% - 12px); }
  .book-controls { bottom: 26px; gap: 8px; }
  .book-controls button { padding: 8px 14px; font-size: 12px; }
  .modal-note { display: none; }
  .book-close { top: 12px; right: 18px; font-size: 36px; }
  .testimonial-cards .card .flair .clinettitle { font-size: 32px !important; }
  .testimonial-cards .card .flair .clientReview { font-size: 14px; }
  .testimonial-cards { width: 85svw; }
  .testimonial-cards .card { height: auto; }
  .testimonial-cards .card .flair .bottomtext { padding-top: 15px; font-size: 16px; }
  .testimonial { overflow: hidden; min-height: auto; padding: 60px 0; }
  .testimonial-cards-wrap {
    /* overflow:hidden;*/
    width:100%;margin:auto;
  }
  .testimonial-cards {
    display:flex;/* flex-wrap:nowrap;*/
    width:100%;padding:0;/* gap:10px;*/
    margin:0;
  }
  .testimonial-cards .card { flex: 0 0 100%; width: 100%; transform: none !important; }
  .testimonial-slider-arrows button { background-color: transparent; color: #fff; box-shadow: none; border: 1px solid #ffff; border-radius: 50%; width: 25px; display: flex; height: 25px; align-items: center; justify-content: center; }
  .testimonial-slider-arrows button svg { width: 17px; }
  .form-grid { grid-template-columns: 1fr; }
  .contact-heading h1 { letter-spacing: 0.07em; }
  .Customcard .content p { font-size: 11px !important; margin: 0; }
  .card.Customcard { height: 180px; }
  .Customcard .content { margin-left: 5px; }
  .Customcard .content h3 { font-size: 14px !important; }
  .animCounter { font-size: 45px !important; }
  .super-lead-text { font-size: 20px !important; }
  .logo-marquee { margin-top: 60px; }
  .countnumber { padding: 55px 0; }
  .testimonial-cards .card { border-top-right-radius: 100px; border-bottom-left-radius: 100px; }
  .jobsOpeningSec { padding: 60px 15px !important; }
  .jobsOpeningSecInnerDiv .accordianHeader { flex-direction: column; align-items: flex-start !important; }
  .process-slider .cardcustomarrow { top: 61%; }
}
@media (max-height:800px) {
  .planet-wrap { width: clamp(150px,17vw,165px); }
  .active-service-panel h3 { font-size: clamp(30px,3.8vw,30px) !important; width: 60%; }
  .active-service-panel p { font-size: clamp(16px,.95vw,12px); }
  .active-service-panel .service-btn { PADDING: 8px 25px 8px 25px; font-size: 16px; }
}
/* Traditional Syntax:Same result as above */
@media (max-height:690px) {
  .spacer { height: 70vh !important; }
}
@media (max-width:690px) {
  .active-service-panel__inner { top: 15px; }
  .contact-heading h1 { font-size: 20px !important; line-height: 20px !important; }
  .field,.phone-field { height: 35px; }
  .close-popup { width: 35px; height: 35px; font-size: 16px; }
  .field::placeholder,.message-field::placeholder,.phone-field::placeholder { font-size: 14px; font-weight: 400; font-family: 'Spaced'; }
  .accordion-menu { font-size: 16px !important; }
  .footercolumsMobile .social-buttons { margin: 0px !important; }
  .footerUL { font-size: 14px !important; text-align: left; }
  .footercolumsMobile ul.footerSocial { justify-content: left; }
  .footercolums .accordion-menu { box-shadow: none !important; }
  .branpac-content h3 { margin-bottom: 10px; }
  .margin-tb-5 { margin-top: 10px !important; }
  footer.modern-footer.pt-80 { padding-top: 30px !important; }
  .testimonial-cards .card .flair .clientReview { padding-top: 10px; }
  section#herosec img.banner-img.img-fluid { height: 100vw; object-fit: cover; }
  section#herosec img.banner-img.img-fluid { height: 100vw; object-fit: cover; }
  .content-box .bigAnimateText { font-size: 100px !important; }
  .content-box .typeWriteText { font-size: 60px !important; }
  h1.bannerHed { font-size: 32px !important; line-height: 42px !important; }
  /* .herosec-content{bottom: 15px; }*/
  .section-tag { font-size: 38px; text-align: center; line-height: 1; }
  .masked-text { bottom: 0; }
  .footercolums .col-lg-4 { margin-bottom: 30px; }
  h2.legacy-heading { font-family: 'Return-Space'; font-size: 34px !important; line-height: 1; }
  .legacyContent h3.subHeading { font-size: 22px !important; }
  .logo-marquee { margin-top: 30px; }
  .logo-marquee .swiper-slide img { width: 100px; }
  .swiper-slide { padding: 0 10px; }
  .ourlegacy { padding: 30px 0; }
  .card-wrapper { height: 320px; overflow: hidden; position: relative; }
  .magazine-section { padding: 60px 0 0 0; height: 100vw; }
  .mag-slider-controls { bottom: 45px; }
  .countnumber { padding: 30px 0; }
  .animCounter { font-size: 45px !important; }
  .super-lead-text { font-size: 20px !important; }
  .card-group { position: absolute; width: 100%; top: 0; left: 0; }
  .mobile-slider-nav { display: flex; justify-content: center; gap: 12px; margin-top: 20px; }
  .mobile-slider-nav button { width: 45px; height: 45px; border-radius: 50%; border: none; background: #111; color: #fff; font-size: 20px; cursor: pointer; }
  .branpac-content h3 { font-size: 34px !important; }
  .branpac-content p { font-size: 14px !important; line-height: 24px; }
  .scrolling-text .rail h4 { font-size: 190px !important; }
  a.themeBtn { padding: 8px 15px 10px 15px !important; font-size: 14px; line-height: 1.2; }
  .spacer { height: 60vh; }
  .marqueApposition { top: 35%; }
  .branpac-content p br { display: none; }
  .testimonial-cards .card .flair .clientReview { font-size: 14px; line-height: 1.2; }
  .testimonial-cards .card { border-top-right-radius: 60px; border-bottom-left-radius: 60px; }
  section.countnumber.fluid-section .row .col-12.col-sm-4 { width: 50%; padding-bottom: 15px; }
  section.countnumber.fluid-section .row { justify-content: center; }
  a#openPopup { padding: 10px 15px; font-size: 11px; height: 40px; }
  .get-quote { position: fixed; right: -40px; top: 50%; transform: translateY(-50%); transition: 0.5s; z-index: 99; width: fit-content; height: 150px; }
  .footerLogo { margin-bottom: 0px; }
  .active-service-panel h3 { font-size: clamp(40px,3.8vw,35px) !important; width: 100%; }
  .accordion-menu { display: flex; justify-content: space-between; align-items: center; cursor: pointer; }
  .accordion .accordion-group { border-bottom: 1px solid #fff; padding: 15px 0; }
  .accordion-menu { font-size: 32px; font-family: "Spaced"; color: white; padding: 10px 0 10px 0; cursor: pointer; box-shadow: 0 2px 5px 0 rgba(0,0,0,.26); }
  .accordion-menu.active .accoridanArrow { transform: rotate(220deg); }
  .accordion-content { height: 0; overflow: hidden; font-size: 18px; Letter-spacing: 10%; }
  .accordion-content.expanded { height: 0; overflow: hidden; }
  .accoridanArrow { width: 10px; height: 10px; border-right: 2px solid #ffffff; border-bottom: 2px solid #ffffff; transform: rotate(45deg); transition: transform 0.3s ease; margin-left: 10px; flex-shrink: 0; }
  /* Open state */
  .accoridanArrow { transition: transform 0.3s ease; }
}
@media (max-width:540px) {
  .magazine-stack { width: 100%; height: 100vw; transform: scale(0.58); transform-origin: center top; }
  .mag-slider-controls button { width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; }
  .mag-slider-controls { bottom: 80px; }
  .mag-slider-controls button { width: 34px; height: 34px; }
  .book-wrap { height: auto; min-height: auto; }
  .page-number { font-size: 10px; padding: 4px 6px; }
  .testimonial-cards-wrap li.card img { width: 60px; }
  .testimonial-cards { width: 100%; }
}
@media (max-width:480px) {
  form#contactForm { margin-top: 25px !important; }
  .button-wrap { padding-top: 0 !important; }
  section.futCreation { padding-top: 35px; }
  section#moThBr { padding-top: 45px; padding-bottom: 40px; }
  section.workWithUs.creativeWorkWithUs { padding-bottom: 30px; padding-top: 30px; }
  section.faqs.webdevfaq { padding-top: 30px; }
  section.workWithUs.websitePage { padding-top: 30px; }
  .getwebsite { padding-top: 40px !important; }
  section.getwebsite.creativeServices { padding-top: 15px !important; }
  .smmservicesFaq { padding-top: 40px !important; }
  section.wednd.websiteDevPage { padding-top: 30px; }
  section.sywtp.creativeinfluencer h2.Hedtitle br { display: block !important; }
  .footerLogo img.footerLogoImage { max-width: 135px; }
  .smmservices { padding-top: 60px !important; padding-bottom: 10px !important; }
  #herosec video { width: 100%; height: auto; }
  .weRepresent-section,.content-wrap { min-height: 40vh; }
  .content-box .typeWriteText { font-size: 32px !important; }
  .content-box { gap: 10px; }
  .content-box .bigAnimateText { font-size: 60px !important; }
  footer.modern-footer.pt-80 { padding-top: 0px !important; }
  .testimonial-cards .card .flair .clientReview { font-size: 12px; line-height: 1.2; }
  .branpac-content h3 { font-size: 28px !important; }
  .active-service-panel p { max-width: 100%; font-size: clamp(14px,.95vw,13px); }
  .active-service-panel h3 { font-size: clamp(20px,3.8vw,25px) !important; width: 100%; padding: 5px 5px 5px 5px!important; top: 5px; }
  .active-service-panel { width: 100%; padding: 0 15px; }
  .active-service-panel { bottom: 80px; }
  .planet-wrap { width: clamp(175px,12vw,190px); }
  .service-card { top: 35%; width: min(88vw,500px); }
  .services-space .section-head h2 { font-size: 38px !important; }
  .content-wrap { padding: 90px 24px 64px 24px; }
  section.csgetwebsite { margin-top: 0 !important; padding-bottom: 0; padding-top: 0 !important; }
  .testimonialHeading h2 { font-size: 28px !important; line-height: 38px; }
  .testimonialHeading h3 { font-size: 18px !important; margin-top: 15px; }
}
@media (max-width:430px) {
  .planet-wrap { width: clamp(150px,12vw,190px); }
  .service-card { top: 39%; }
  .mag-slider-controls { bottom: 70px; }
}
@media (max-width:414px) {
  .mag-slider-controls { bottom: 30px; }
  section.magazine-section .hint { display: none; }
  .testimonial-cards .card .flair { width: 100%; }
  .testimonial-cards .card .flair .bottomtext { padding-top: 15px; font-size: 14px; }
  .testimonial-cards .card .flair .clientReview { padding-top: 10px; }
  .scrolling-text .rail h4 { font-size: 150px !important; }
  .book-page img,.flip-face img { object-fit: contain; }
  .book-wrap { height: auto; min-height: auto; }
  .bran-difference h2.section-title,.preformanceMarketingProcess-content h2.section-title,.howitworkheading .htwheading,.contacttopheading,.faqheading,.sectionTitle .Hedtitle,.bran-difference h2.section-title .smalltext,.preformanceMarketingProcess-content h2.section-title .smalltext,.howitworkheading .htwheading .smalltext,.faqSubheading,.sectionTitle .smalltext { font-size: 28px !important; line-height: 38px !important; margin-bottom: 5px !important; }
  .services-space .section-head h2 { font-size: 28px !important; }
  .service-card { top: 36%; }
}
@media (max-width:375px) {
  .accordion .accordion-group { border-bottom: 1px solid #fff; padding: 15px 0; }
  .accordion-menu { font-size: 32px; font-family: "Spaced"; color: white; padding: 10px 0 10px 0; cursor: pointer; box-shadow: 0 2px 5px 0 rgba(0,0,0,.26); }
  .accordion-menu.active .accoridanArrow { transform: rotate(220deg); }
  .accordion-content { height: 0; overflow: hidden; font-size: 18px; Letter-spacing: 10%; }
  .accordion-content.expanded { height: 0; overflow: hidden; }
  .accoridanArrow { width: 10px; height: 10px; border-right: 2px solid #ffffff; border-bottom: 2px solid #ffffff; transform: rotate(45deg); transition: transform 0.3s ease; margin-left: 10px; flex-shrink: 0; }
  /* Open state */
  .accoridanArrow { transition: transform 0.3s ease; }
}