/* font-size was a hard 40px, and the next step down (30px) only fires at
 * max-width:1440px - but the card keeps shrinking above that, so between roughly
 * 1441px and 1650px the longest names ("Aero Fleet Solutions", "cross dock
 * trading llc") outgrew the card and wrapped onto a second line, breaking the
 * bottom-aligned label. Poppins is wider than the DM Sans this was measured
 * against, which is why it only started showing after the retheme.
 * Fluid instead of stepped: 2.1vw meets 30px exactly at 1440px, so it hands off
 * to the media queries below without a jump. */
.portfolio__title {color: #fff; font-size: clamp(30px, 2.1vw, 40px); font-weight: 400; display: inline-block !important; position: unset !important; text-transform: capitalize;position: relative;z-index: 9;}
.portfolio_logo {width: 150px; height: auto; object-fit: contain; background-color: 404040; padding: 10px; border-radius: 10px; }
.contact-hero {background-position: top center; }
section.cases.wk_container.ce_cases.uk_cases {/* padding-bottom: 0; */ margin-bottom: 30px; }
section.portfolio_banner {overflow: hidden;}
section.the_work {overflow: hidden;background-color: #fff;z-index: 9;position: relative;}
section.strategy .wk_flex {align-items: start !important; }
section.top-info-section {padding-bottom: 0 !important; }
section.app_imp .user-apps-content {margin-top: 50px !important; }
.app_imp p.primary-pera.wk_white {padding: 0 !important; }
div#gallery {backdrop-filter: blur(10px); }
button.btn-primary.arrow span.position-relative {z-index: 9; }



article.case {position: relative; } 
article.case:before {content: ""; width: 100%; height: 100%; background-image: linear-gradient(0deg, black, transparent, transparent); position: absolute; z-index: 9; left: 0; right: 0; }


section.hero p.text-wrap-balance {font-weight: 200; } 
strong {font-weight: 700; }
.zf-rail a {font-weight: 200 !important; }
.zf-rail a span.p {color: #fff !important; }
.zf-pill {background: #ffffff14 !important; border: 1px solid #0000001a !important; }


.zf-pill .zf-clip::after, .zf-pill .zf-clip::before {content: "" !important; position: absolute !important; left: 50% !important; transform: translateX(-50%) !important; width: 230px !important; height: 10px !important; pointer-events: none !important; }
.zf-pill .zf-clip::before {top: 0; background: radial-gradient(ellipse at center top, rgb(7 52 71) 0%, rgb(7 52 71 / 31%) 30%, rgb(7 52 71 / 6%) 60%, rgb(7 52 71 / 0%) 100%) !important; }
.zf-pill .zf-clip::after {bottom: 0; background: radial-gradient(ellipse at center top, rgb(7 52 71) 0%, rgb(7 52 71 / 31%) 30%, rgb(7 52 71 / 6%) 60%, rgb(7 52 71 / 0%) 100%) !important; transform: rotate(180deg); }
.zf-header {border-bottom: 0px solid #ffffff12 !important; /* filter: unset !important; */ background-color: transparent !important; backdrop-filter: unset !important; }
img.wk_hero_img {left: -40px; }
/*section.hero {height: 100vh; }*/
.service-item .hh4 {font-weight: 600 !important; }

section.our-services .service-item .container {position: relative; }
section.our-services .service-item .container:before {content: ""; width: 50%; height: 10px; background-color: var(--color-deep); position: absolute; top: -80px; right: 0; box-shadow: 0px 0px 45px 90px var(--color-deep); background-image: linear-gradient(0deg, var(--color-deep), transparent); }
section.our-services .hh2 {position: relative; z-index: 9; }
section.our-services .service-item .container:after {width: 100%; height: 1px; background-color: var(--color-on-deep-line); position: absolute; top: -41px; left: 0; content: ""; }

.uk_img_container {float: right; }
.wk_process .wk_text_con {padding: 50px; margin-bottom: 35px; }

.section-tag, .section-tag-dark {&::before {filter: brightness(0); } }

/*.zf-lang {background: var(--color-deep) !important; border: 1px solid #ffffff1a; }*/
.zf-lang {background: #ffffff14 !important; border: 1px solid #ffffff1a !important; font-size: 20px; font-family: system-ui; font-weight: 300; backdrop-filter: blur(23px) !important; }
span.car {color: #fff; }
section#services .section-tag-dark:before {filter: unset !important; }
img.app_cta_img {float: right; width: 90%; }
/*img.web_baner_img {width: 50%; position: absolute; right: 0; top: 0; }*/
/*h1.wk_hero_h span {display: inline-block; width: 100%; }*/
/* The laptop mockup was blowing 20% past its column and getting cut off at the
   hero's bottom edge. The scale is a leftover: this image used to be
   position:absolute (see the commented rule above), where right/top placed it
   and the scale filled the corner. It is static now, so right/top do nothing
   and only the scale survived - overflowing with nothing to position it back.
   Let it fill its column instead; the inline width="100%" already sizes it.
   The <=991px override further down sets scale(1) too, so this is now the
   same on both sides of that breakpoint. */
img.web_baner_img {max-width: 100%; height: auto; }
/* The model's right hand runs off the right edge of cta2.webp itself, so the
   slice is baked into the file. It only read as "cut" because the image stopped
   short of the screen: theme.css gives `section.wk_cta_sec2 > *` position:
   relative, which makes .container the containing block, so right:0 lands on the
   container edge and leaves the page gutter beside it. Pull it out to the
   viewport edge instead - calc((100% - 100vw)/2) is exactly minus one gutter -
   so the slice falls off-screen and reads as a bleed. The section clips it, so
   overshooting by the scrollbar width cannot produce a horizontal scrollbar.
   The <=991px block below resets this to position:unset, so mobile is untouched. */
.wd_cta2 {overflow: hidden; }
.web_cta2_img {position: absolute; width: 842px; right: calc((100% - 100vw) / 2); bottom: 0; }
section.web_cta_sec {background-size: 100%; padding: 150px 0; }
.dm_cta3_img {width: 90%; }


.fb_banner_img:before {content: ""; width: 100%; height: 100%; background-image: url("https://cdn.360kreations.us/assets/img/service/fb-marketing-banner-before.webp"); position: absolute; background-size: 100% 100%; transform: scale(1.9); background-position: center; }
.uk_img_container {position: relative; background-image: none !important;}
img.wk_hero_img {width: 80%; }

img.fb_cta2_img {width: auto; float: right; }
section.fb_cta2 {background-repeat: no-repeat; background-size: cover; padding: 35px 0; }

img.fb_cta3_img {width: auto;border-radius: 30px; }
section.wk_cta3_sec {padding: 25px 0; }

section.logo_cta {padding: 160px 0; background-position: center right; }


section.hero .section-tag, .section-tag-dark {
    &::before {
        filter: unset !important;
    }
}
.portfolio_banner_img {width: 100% !important; transform: scale(1.5); }


.inner-case-study .zf-rail a span.p {color: var(--color-ink) !important; } 
.inner-case-study button.zf-lang.wk_hide {background: #67676714 !important; color: #000 !important; font-weight: 400; }
.inner-case-study button.zf-lang.wk_hide span.car {color: var(--color-ink); }

.inner-case-study header.stickedHeader .zf-rail a {color: #fff; } 
.inner-case-study header.stickedHeader .zf-rail a span.p {color: #fff !important; } 
.inner-case-study header.stickedHeader button.zf-lang.wk_hide {color: #fff !important; } 
.inner-case-study header.stickedHeader button.zf-lang.wk_hide span.car {color: #fff !important; }
.inner-case-study header.stickedHeader .has-sub .zf-sub a {color: var(--color-ink) !important;}
header.stickedHeader .zf-wrap .wk_logo svg path[fill="white"] {fill: #fff !important;}

footer.site-footer {padding-top: 40px; background-color: var(--color-deep) !important; background-image: url("https://cdn.360kreations.us/assets/img/footer-bg.png") !important; background-size: contain !important; background-position: left; box-shadow: 0px -16px 60px 0px var(--color-brand); }
.uk_footer_copyright {align-items: end !important; }
.qa_ze_footer .ft-list li a {font-size: 17px !important; }
.ft-list li {margin: 15px 0 !important; }

.qa_banner_content { max-width: 100% !important; }
section.hero-home .hh2 {font-size: 60px; line-height: 65px; letter-spacing: 1px; font-weight: 600; }


header.stickedHeader {top: 0px !important; transform: unset; transition: .5s !important; background-color: rgba(7, 52, 71, 0.86) !important; backdrop-filter: blur(10px) !important; z-index: 999;}
section.cta-contact.am_cta_sec .uk_img_container:before {display: none;}
div#graphic-design .container:before {display: none !important; }

/*************OWL CAROUSEL CSS*/
.owl-nav {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
}
.owl-stage-outer { position: relative; }
.owl-nav .owl-prev,
.owl-nav .owl-next {position: unset;top: 50%;/* transform: translateY(-50%); */width: 56px;height: 56px;border-radius: 50%;display: flex;align-items: center;justify-content: center;cursor: pointer;z-index: 20;border: 1px solid rgba(0,0,0,0.06);box-shadow: 0 6px 18px rgba(10,10,10,0.06), inset 0 1px 0 rgba(255,255,255,0.6);transition: transform 180ms ease, box-shadow 180ms ease, background 180ms ease;-webkit-tap-highlight-color: transparent;font-size: 0;background: rgba(255, 255, 255, 0.65);backdrop-filter: blur(25px);}
.owl-nav .owl-prev {left: -30px;}
.owl-nav .owl-next {right: -30px;}
.owl-nav .owl-prev span, .owl-nav .owl-next span { display: none !important; }
.owl-nav .owl-prev::after, .owl-nav .owl-next::after {content: "";display: block;width: 12px;height: 12px;border-top: 2.5px solid var(--color-body);border-right: 2.5px solid var(--color-body);box-sizing: border-box;transform-origin: center;transition: transform 180ms ease, border-color 180ms ease;left: 0px;position: relative;}
.owl-nav .owl-next::after {transform: rotate(45deg); } 
.owl-nav .owl-prev::after {transform: rotate(-135deg); }
.owl-nav .owl-prev:hover, .owl-nav .owl-next:hover, .owl-nav .owl-prev:focus, .owl-nav .owl-next:focus {/* transform: translateY(-50%) scale(1.03); */box-shadow: 0 10px 26px rgba(10,10,10,0.10), inset 0 1px 0 rgba(255,255,255,0.65);background: linear-gradient(180deg, #ffffff 0%, #efefef 100%);}
.owl-nav .owl-prev:hover::after, .owl-nav .owl-next:hover::after {border-color: #333333; }
/*************OWL CAROUSEL CSS*/



img.fb_cta2_img {width: 100%; }

section.logo_cta {padding: 100px 0; background-position: center right; background-size: 80%; background-repeat: no-repeat; background-color: var(--color-surface-soft); }



section.wk-case .wk_container {max-width: 100% !important; }
.wk-case .swiper-button-next, .wk-case .swiper-button-prev {top: 150px !important; }

.wk-case-slide .swiper-wrapper {padding-left: 260px !important; }

.glass-form {background-color: #fff !important; }


section.top-info-section {padding-top: 100px; }
.cases__title {margin-bottom: 20px; }
section.our-services .service-item:first-child .container:before {display: none !important; }


.ve_work_img {bottom: 70px; }

section.the_work .wk_col img {border: 1px solid #00000033; border-radius: 30px; }

.fb_img_wrap:before {content: ""; width: 100%; height: 100%; background-image: url("https://cdn.360kreations.us/assets/img/service/fb-marketing-banner-before.webp"); position: absolute; background-size: 100% 100%; transform: scale(1.9); background-position: center; }
.container, .wk_container  {max-width: 90% !important; }

.owl-dots{display: flex; gap: 18px; justify-content: center; align-items: center; padding: 10px 0; margin: 0; } 
.owl-dots span {display: inline-block; width: 10px; height: 10px; padding: 0; border: none; border-radius: 50%; background: #e9e9e9; box-shadow: inset 0 -3px 6px rgba(0,0,0,0.04); cursor: pointer; transition: transform .22s ease, background .22s ease, box-shadow .22s ease; -webkit-appearance: none; appearance: none; } 
.owl-dots .active span,
.owl-dots .active span:hover{background: linear-gradient(180deg, var(--color-brand) 0%, var(--color-brand) 60%); transform: scale(1.06); box-shadow: 0 6px 16px var(--color-brand-15), inset 0 -3px 6px rgba(0,0,0,0.06); } 
.owl-dots .active span:focus{outline: none; box-shadow: 0 0 0 6px var(--color-brand-08); }


section#industries .row {align-items: end; }

/* app-development hero art. The source asset (app.webp) is cut flat across its own
   bottom edge — the arm runs out of frame by design — so that flat edge has to land
   past the section boundary rather than floating above it, which reads as a severed
   hand. Two things make that reliable at every desktop width:
     - the image column is bottom-aligned, because the row's `align-items:center`
       otherwise re-centres the image and absorbs half of any margin change (at 1200px
       and 992px the text column is the taller one, which is where the gap grew to 82px);
     - the bottom margin exceeds the hero's 100px padding-bottom, so the bleed is
       gap = 100px - 115px = -15px regardless of which column drives the height.
   The section clips the 15px excess so it never paints over the white band below.
   Scoped to .app_development only — web_baner_img and the other service pages are
   untouched. Below 991px the layout stacks and the image is already flush, so the
   mobile rules further down are deliberately left alone. */
section.hero.app_development {overflow: clip; }
section.hero.app_development .row > .col-lg-6:last-child {align-self: flex-end; }
.app_development img.ad_baner_img {width: 66%; margin-right: 0; margin-bottom: -115px; }
section.ad_cta3 {background-repeat: no-repeat; background-size: cover; padding: 50px 0; }

/* ctl.png is ALREADY cropped in the source file: the wrist runs straight off
   the bottom edge of the 799x689 png, so there is no "full hand" for CSS to
   reveal. The trick is therefore to ANCHOR that flat cut to the section's own
   bottom line, so it reads as the image running into the edge instead of a
   wrist ending in mid-air halfway up the panel.
   The row is `align-items: center`, which vertically centred the image column
   and left the cut floating well above the boundary — bottom-align just that
   column so the negative margin below can carry the image down to the edge. */
section.ad_cta3 .row > .col-lg-6:first-child {align-self: flex-end; }
section.ad_cta3 img.ad_cta3_img {margin: -130px 0 -50px; vertical-align: bottom; }
/* ctas.png is cropped in the source too — the rocks run flat off the bottom of
   the 1200x977 file. Same treatment as .ad_cta3_img: sit that cut ON the
   section's bottom line. The section's padding-bottom is 120px, so -110px left
   a 10px strip of green under the rocks and made the crop read as floating. */
img.app_cta2_img {position: absolute; right: 0; width: 28vw; bottom: -120px; }

section.contact-cta {background-size: 55%; }



section.portfolio_banner .portfolio_banner_img {bottom: -50px; }
section.portfolio_banner p.text-wrap-balance {padding-right: 30%; }



h1 {font-size: 75px; line-height: 80px; }



section.wk-case h4.primary-title.wk_pading {padding-left: 2%; }
article.case {position: relative; box-shadow: unset !important; }


section.cta-contact.wk_cta_sec {background-size: 60%;}

/* graphic-design is the only .cta-contact whose artwork still comes from the
   generic rule in media-queries.css, and audience-bg2.png is a 1920x682
   landscape banner. Sizing that by height (auto 90%) makes it 1748px wide, so
   it hangs 148px off a 1600px section and 272px off a 1440px one. Width-based
   sizing is correct for landscape artwork; auto 90% is for the portrait
   ready-to-transform.jpg. Drop this line if the banner is ever swapped for a
   tall one. */
section.cta-contact.am_gd_cta {background-size: 50%;}




.uk_case img {transform: scale(1) !important; } 
.uk_case:hover img {transform: scale(1.1) !important; }


.tst__name {font-weight: 700; font-size: 18.57px; color: var(--color-deep); }
.tst__role{font-size: 12.38px; /* line-height: 1; */ color: #252525 }

.author-img img {border-radius: 50%; object-fit: cover; }




@media (max-width: 2000px) {
    section.cta-contact.wk_cta_sec {background-size: 90%;} 
    img.app_cta2_img {position: absolute; right: 0; width: 38vw; bottom: -120px; }
    .wk-case-slide .swiper-wrapper {padding-left: 220px !important; }
    body.gulf-event-connect_page .primary-title br {display: none; }
    .primary-pera br {display: none; }
}
@media (max-width: 1800px) {
    .wk-case-slide .swiper-wrapper {
        padding-left: 190px !important;
    }
}
@media (max-width: 1600px) {
    h1 {font-size: 72px; line-height: 77px; font-weight: 700; }
    .zf-rail {column-gap: 0 !important; }
    .hh2 {font-size: 60px; line-height: 65px; }
    .wk_text_con h4 {font-size: 30px; }
    section.contact-cta {background-size: 50%; }
    section.portfolio_banner .portfolio_banner_img {transform: scale(1.6); bottom: -10px; }
    section.portfolio_banner p.text-wrap-balance{padding-right: 10% !important; }
    section.strategy h1.primary-title {font-size: 45px; }
    .wk-case-slide .swiper-wrapper {padding-left: 170px !important; }
   
}

@media (max-width: 1500px) {
    .hh2 {font-size: 55px; line-height: 60px; }
}

@media (max-width: 1440px) {
    section.inner-contact-cta.wk_pading.uk_inner-contact-cta br {display: none; }


    .wk-case .swiper-button-next, .wk-case .swiper-button-prev {top: 90px !important; }
    .app_development img.ad_baner_img {margin-right: 0; margin-bottom: -115px; width: 70%; }
    .qa_ze_readyTransform .hh2 {font-size: 50px; line-height: 55px; }
    .section-tag, .section-tag-dark {margin-bottom: 15px; }
    section.wk_cta_sec2 {padding-top: 80px; }
    .wk_cta2_img {margin-top: -120px; }
    .mt-30.mobile-text-center {margin-top: 15px; }

    .wk-case .swiper-button-next, .wk-case .swiper-button-prev {top: 105px; }
    .wk-case-slide .swiper-wrapper {padding-left: 145px; }
    .portfolio__title {font-size: 30px; }
    .portfolio_logo {width: 120px; }
    section.contact-hero .wk-col {width: 40%; }
    section.portfolio_banner {padding-top: 170px; padding-bottom: 90px; }
    .ve_banner_img2 {right: -35px; }
    h1 {font-size: 65px; line-height: 70px; }
    .wk-case-slide .swiper-wrapper {padding-left: 145px !important; }
    .qa_ze_industriesContent .hh2 {font-size: 55px; line-height: 60px; }
}

@media (max-width: 1366px) {
    img.app_cta2_img {width: 43vw; }
    .zf-rail a {font-size: 15px !important; padding: 10px 10px !important; }
    .zf-rail {padding: 12px 10px !important; }
    .zf-header .zf-actions .btn-primary.arrow {font-size: 15px; }
    .hh2 {font-size: 47px !important; line-height: 52px !important;}
    .review-box .logo img {width: 150px; height: 30px; object-fit: contain; }
    .qa_ze_footer .ft-list li a {font-size: 15px; }
    p.uk_p_16 br {display: none; }
    .am_cta_sec {padding: 50px 0 !important; }
    .service-item .d-flex {gap: 15px !important; display: flex !important; }
    .service-item .d-flex .btn-primary {margin-top: 25px; }
    .app_development img.ad_baner_img {margin-bottom: -115px; }
    .qa_ze_readyTransform .hh2 {font-size: 48px; letter-spacing: unset;}
    h1 {font-size: 50px; line-height: 60px; }
    .section-tag, .section-tag-dark {margin-bottom: 10px; }
    p.text-wrap-balance {margin-top: 0; }
    section.wk_cta3_sec .mt-30 {margin-top: 10px; }
    .portfolio__title {font-size: 26px; }
    .portfolio_logo {width: 100px; }
    .contact-hero {height: auto !important; }
    section.contact-hero .wk-col {width: 45%; }
    section.portfolio_banner {padding-bottom: 80px; }
    .wk-case-slide .swiper-wrapper {padding-left: 140px !important; }

}

@media (max-width: 1199px) {
    p.live-label {margin-top: 20px; }
    section.wk-case h4.primary-title.wk_pading {padding-left: 30px; }
    section.wk-case .wk_container {margin: auto !important; width: 100%; }
    .wk-case-slide .swiper-wrapper {padding-left: 0 !important; }
    section.wk-case .wk_container {margin: auto !important; }

    .zf-rail a {font-size: 12px !important; }
    /*.hh2 {font-size: 35px !important;}*/
    .qa_ze_readyTransform .hh2 {font-size: 38px !important; line-height: 43px !important;}
    section.cta-contact.wk_app_cta {background-size: cover; padding: 50px 0 !important; }
    section.wk_cta_sec2 {padding-top: 50px; }
    .wk_cta2_img {margin-top: -100px; }
    section.contact-hero .wk-col {width: 100%; }
    section.contact-hero .wk_container {flex-wrap: wrap; }
    .qa_contact-hero .map-card {max-width: 100%; }
    .qa_contact-hero .glass-form {width: 100%; position: unset !important;}
    section.portfolio_banner h1 {font-size: 40px; line-height: 50px; }
    section.portfolio_banner {padding-bottom: 60px; }

    .schedule {padding: 46px; }
    .author .img {width: 70px; HEIGHT: 70px; } 
    .author .img img {width: 100%; }
    .author .name {font-size: 20px;}
    .author .icon{margin: 0;}

    .gallery_wrapper .modal-content {height: 80vh !important;}
    section.contact-cta {background-size: 50%; }
    section.cases.wk_container.container.ce_cases.uk_cases .cases__title {width: 250px; }
    section.cases.wk_container.container.ce_cases.uk_cases {padding-top: 50px !important; }

}

@media (max-width: 1100px) {
    section.hero-home br {display: none !important; }
    /* bottom margin only has to cancel the section's 50px padding now that the
       column is bottom-aligned; -201px overshot the edge by 151px */
    section.ad_cta3 img.ad_cta3_img {margin: -230px 0 -50px; width: 110%; left: -50px; }
    .zf-burger {width: 123px !important; height: 50px; background: #0e0e0e30 !important; border-radius: 30px !important; display: flex !important; justify-content: center; align-items: center; gap: 10px; }
    .portfolio__title {font-size: 22px; }
    .tab {padding: 0 16px; min-width: 110px; }
    .cases__tabs {gap: 12px; }
    section.wk-case .wk_container {margin-left: 0 !important; margin-right: 0px !important; max-width: 100% !important; width: 100% !important; }
    section.wk-case h4.primary-title.wk_pading {padding-left: 30px; }
    .wk-case .swiper-button-next, .wk-case .swiper-button-prev {top: 74px !important; }
}

@media (max-width: 1024px) {

    .wk_col.the_work-col1 {max-width: 100% !important; }
    section.the_work .wk_col {width: 100% !important;}
    h3.primary-title.uk_primarytitle br {display: none; }
    /* same as above: -164px originally, then -130px; both overshot once the
       column became bottom-aligned. -50px lands the cut exactly on the edge. */
    section.ad_cta3 img.ad_cta3_img {margin: -230px 0 -50px; width: 140%; left: -150px; }
    .live-site-con.riam {padding-top: 30px !important; }
    h1 {font-size: 45px; line-height: 50px; }
    .wk_cta2_img {margin-top: 0px; }
    .qa_ze_testimonials .hh2 {font-size: 45px; }
    p.live-label {position: unset; margin-top: 0; color: #fff !important; font-size: 13px }
    .live-site-con {margin: 0px 0px 0px 0px; }
    .wk-case .swiper-button-next, .wk-case .swiper-button-prev {top: 35px; }
    .wk-case-slide .swiper-wrapper {padding-left: 0; }

    .wk-col {width: 100%; }
    
    .wk-case .swiper-button-next, .wk-case .swiper-button-prev {top: 40px; }
    
    .case__title {font-size: 26px; }
    .case__cta {height: 34px;}
    .uk_footer_copyright {flex-wrap: wrap !important; }
    .uk_footer_copyright div {width: 100%; text-align: center; justify-content: center; margin-top: 12px;}
    .live-site-con {margin: 0px 0px 0px 0px; }
    section.top-info-section.wk_pading {margin-bottom: 0px; }
    .wk-col {width: 100%; }


    section.hero-home .hh2 {font-size: 44px !important; }

    .author .img {width: 60px; height: 60px; }
    section#contact .col-lg-5.mt-5.mt-md-0 {width: 100% !important; }
    section.contact {.contact-form-wrapper {padding: 25px !important; } }
    section#contact .hh4.mb-40.mt-20.text-md-start.text-center {margin-bottom: 30px; }
    form#frm .col-lg-6 {width: 100%; text-align: center; }
    form#frm .prefer-email {margin-top: 20px; }
    label.btn.btn-outline-primary {margin-bottom: 7px !important; }
    section#contact .qa_btm_contact  .hh4 {font-size: 28px; }
    section#contact .qa_btm_contact p.uk_p_16 {font-size: 14px;}
    .map.mt-md-5.mt-3.mt-md-0{max-width: 100% !important; }
    section#contact .col-lg-5 {width: 100% !important; max-width: 100% !important; margin-top: 25px !important; }
    section#contact .col-lg-5 {width: 100%; }
    p.live-label.uk_live-label.uk_res_mt-0 {display: none; } .wk_fram {display: none; }
    .wk_fram_mob {display: block !important; }
    section.strategy .wk-col {width: 100%;}
    section.strategy .col2-img {margin: 0px 0px !important; }
    .cta_col {height: 300px; }
    h5.primary-title br {display: none !important; }
    section.the_work.vc_work .wk-col {width: 48%; }
    .wk_col.col2img {width: 100%; flex-direction: row; }
    .wk_col.ve_wokflow_col2 {width: 100%; }

}

@media (max-width: 991px) {
        .wk-case .swiper-button-next, .wk-case .swiper-button-prev {top: 20px !important; }
    .wk_col.col2img {width: 100%; flex-direction: column !important; }
    section.the_work.vc_work .wk-col {width: 100% !important; margin-top: 30px; }
    .wk-col.ve_work_contentBox {text-align: center; }
    section.the_work .ve_work_contentBox .primary-pera {padding-right: 0; }
    /*HOME PAGE*/
    div#testimonials {text-align: center; }
    .testimonial-box .content p {text-align: center !important; }
    .d-flex.gap-2.mt-30.ml-30 {justify-content: center; margin-left: 0 !important; }
    .wk_counter {width: 100%; display: flex; justify-content: center; align-items: center; gap: 5px; }
    .wk_counter {padding: 10px 15px; margin: 0px 0 30px 0; border: 1px solid #ffffff17; border-radius: 30px; backdrop-filter: blur(10px) !important; }
    section.hero-home {text-align: center; }
    section.hero-home .hh2 {text-align: center; justify-content: center; margin: auto; }
    .fs-90.fw-600.wk_counter1 {font-size: 20px;font-weight: 300; }
    section.hero-home .fs-20.wk_counter2 {font-size: 16px !important; font-weight: 300; }
    .wk_main_counter {justify-content: center !important; }
    section.hero-home .row {flex-direction: column-reverse; }
    svg.wk_hide {display: none; }
    section.hero-home span {display: inline-block; }
    section.facts .col-lg-6.reviews.p-5 > * {padding: 0 !important; } 
    section.facts  .col-lg-6.stats.h-auto {padding: 30px 20px; }
    section.facts .stat-num {font-size: 140px !important; }
    section.facts .stat-title {font-size: 30px !important;}
    section.cta-contact.wk_mob_only {background-image: url("https://cdn.360kreations.us/assets/img/home/cta-bg.png") !important; background-size: 100% 100% !important; padding: 80px 0; }
    .author img {width: 100% !important; }
    .author .img {width: 50px; height: 50px; }
    
    a.btn-primary.arrow.wk_mob_only.uk_btn_primary {margin-top: 25px !important; }
    .section-tag, .section-tag-dark {font-size: 15px !important; font-weight: 400; }

    .hh3.qa_ze_contact_hh3.text-md-start.text-center.aos-init.aos-animate {text-align: center !important; }
    section#blogs a.qa_ze_contact_link.link {margin: 30px auto 0; }
    header.stickedHeader {padding: 10px 0; }
    section#contact .col-lg-5.mt-5.mt-md-0 {width: 100% !important; }
    .impact__wrap.wk_container.container.wk_flex {justify-content: center; }
    header#header {padding: 14px 0 !important; } 
        .service-item .d-flex {justify-content: center; margin: auto;}

    section#services p {display: inline-block; width: 100% !important; text-align: center; }
    /*HOME PAGE*/



    .portfolio_banner_img {width: 100% !important; transform: scale(1) !important; }
        section.wk-case h4.primary-title.wk_pading {padding-left: 0px !important; }



    /* stacked: cancel the section's 50px padding-bottom so the flat rock cut
       meets the section's bottom line instead of floating above it */
    img.app_cta2_img {position: unset !important; width: auto !important; margin-top: 30px; margin-bottom: -50px; vertical-align: bottom; }
    /* Stacked layout: the image is the last thing in the section, so sit its
       cut edge exactly ON the section's bottom line — no padding under it and
       no negative margin dragging it past onto the footer. */
    section.ad_cta3 {padding-bottom: 0 !important; }
    img.ad_cta3_img {width: 100% !important; margin: 25px 0 0 0 !important; left: 0 !important; }
    section.hero{padding-left: 0 !important;padding-right: 0 !important; }
    .container {padding: 0 !important; }

    section#industries {padding: 50px 0; }
    
    section.stickySection {margin-top: 0px; }
    .hh2 {font-size: 42px; }
    .portfolio-slider {padding: 0 30px; }
    .qa_btm_contact .map {max-width: 100% !important; margin-bottom:25px; }
    section.hero {text-align: center;}
    section.cta-contact.wk_cta_sec {background-image: unset !important; }
    
    .wk_cta2_img {margin-top: 25px; }
    section.wk_cta3_sec {padding-top: 50px; }
    section.am_cta .wk_cta2_img {margin-top: 25px !important; }
    .section-tag {padding: 0; }
    .section-tag:before {display: none !important; }

    
    .wk_fram_mob {margin-top: 40px; }

    .cases__top {display: flex; flex-wrap: wrap; gap: 25px; }

    .section-tag-dark:before{display: none;}
    .section-tag-dark{padding: 0 !important;}
    img.wk_hero_img {transform: scale(1) !important; }
    section.portfolio_banner {padding-bottom: 0px !important; }
    .user-sec {height: auto !important; }
    .wk_col.col2img {width: 100%; }
    img.pluto_logo_img {height: auto; object-fit: cover !important; }
    .pluto_img {height: auto; object-fit: cover !important; }
    .live-site-con.riam {padding-top: 100px !important; }
    p.live-label {margin-top: 40px; }
    .live-site-con.riam.uk_live-site-con.pt-0 {padding-top: 20px !important; }
    section.hero-home .hh2 {font-size: 42px !important; }
    .wk-col {width: 100% !important; }

    section.hero {height: auto; }
    img.wk_hero_img{left: 0 !important;}
    section.our-services .service-item .container:before {display: none !important;}
    section#services,section.cta-contact, section.wk_why_sec, section.wk_process, section.cta-contact-2, section.wk_testimonial, section#industries, .ad_cta3,section#work{text-align: center; }
    .wk_stky {position: unset !important; }
    .uk_img_container {float: unset !important; }
    section.wk_testimonial .clients-slider .testimonial-box .content:before {left: 0; right: 0; margin: auto; }
    section.wk_testimonial .clients-slider .testimonial-box .content p {text-align: center; font-size: 17px; }
    .author {justify-content: center; text-align: left; }
    section.wk_testimonial .d-flex.gap-2.mt-30.ml-30 {justify-content: center; margin: 40px 0 0 0; }
    .app_development img.ad_baner_img {/* margin-bottom: -150px; */ margin: 10px 0px 0px !important; width: 58%; }
    img.app_cta_img {float: unset; }
    /* stacked: cancel the section's 50px padding-bottom so the flat rock cut
       meets the section's bottom line instead of floating above it */
    img.app_cta2_img {position: unset !important; width: auto !important; margin-top: 30px; margin-bottom: -50px; vertical-align: bottom; }
    section.wk_cta_sec2 {text-align: center; background-position: 100% 100%; background-image: linear-gradient(45deg, var(--color-deep), var(--color-brand)) !important; padding: 50px 0px; }
    section.wk_cta3_sec {text-align: center; padding-bottom: 0; }
    section.app_development {padding-bottom: 0; }

    .responsive_slider .col-lg-4 {width: 100% !important; } 
    .responsive_slider .col-lg-4 img {width: auto; margin: auto; }
    .responsive_slider img {width: auto !important; margin: auto; }
    .wk_process .wk_text_con {padding: 30px; margin: 0px !important; box-shadow:unset !important; } 
    .wk_text_con h4 {font-size: 23px; }
    /*.responsive_slider .owl-stage {display: flex; } */
    /*.responsive_slider .owl-stage .wk_text_con {height: 100%; }*/
    img.web_baner_img {transform: scale(1) !important; right: 0; top: 20px; }
    section.cta-contact {background-image: none !important; background-color: var(--color-surface-soft); padding: 50px 0px; }
    .web_cta2_img {position: unset !important; width: 100% !important; margin-top: 20px; }
    img.wk_cta3_img.aos-init.aos-animate {position: unset !important; width: 100%; margin: 20px 0 0 0; }
    .wk_why_sec {padding-top: 50px; padding-bottom: 50px; }
    section.wk_process {padding-top: 50px; padding-bottom: 50px; }
    div#testimonials {padding-top: 50px; padding-bottom: 50px; }
    img.wk_hero_img {transform: scale(1) !important; width: 100%; }
    section.hero.wk_service {padding-bottom: 0; }
    section#industries .section-tag-dark {color: var(--color-ink); }
    .uk_img_container:before {transform: scale(1.3); }
    img.fb_cta2_img {width: auto; float: unset; max-width: 100%; margin: auto; display: table; }
    section.wk_cta3_sec {text-align: center; padding-bottom: 50px !important; }
    img.fb_cta3_img {max-width: 100%; margin-top: 30px !important; }
    section.fb_cta2 {text-align: center; }
    img.fb_cta2_img {margin-top: 25px; }

    section.logo_cta {padding: 50px 0; background-position: center right; background-color: var(--color-surface-soft); background-image: unset !important; }
    section.contact-cta {text-align: center; }
    .qa_contact_cta .cases__title {margin-bottom: 16px; margin: auto; }
    .qa_contact_cta .primary-pera {max-width: 100% !important; }
    section.contact-cta {background-image: unset; text-align: center; padding: 50px 0px !important; }
    section.impact.wk_hide {text-align: center; } 
    section.stories {text-align: center; } 
    .tst__stars {justify-content: center; margin-top:20px; }
    .qa_stories .primary-title {max-width: 100% !important; }
    .qa_stories .cases__title {justify-content: center; } 
    .tst__author {justify-content: center; text-align: left; }
    .qa_stories_arrows {display: flex; justify-content: center; align-items: center; margin-top: 50px; gap: 15px; } 
    .qa_stories_arrows button {position: unset; } 
    section.stories.qa_stories.uk_client_sec {padding-bottom: 0; }
    .ft-intro {max-width: 100% !important; }
    .impact__stat {text-align: left; margin: 20px auto 0; display: inline; text-align: center; }
    .cases__tabs {justify-content: center; }
    .ve_work_img {bottom: 0 !important; }
    .link, .link.white {font-size: 15px; margin: 0; }

    .row.wk_why.responsive_slider .owl-stage-outer.owl-height .wk_text_con {padding: 20px; margin: 0 !important; box-shadow: unset !important; border: 1px solid #00000038; width: 92% !important; margin: auto !important; }
    .wd_cta2 {padding-bottom: 0 !important; }
    section#work .col-lg-5.d-flex.justify-content-end.align-items-end.mt-sm-0.mt-4 {justify-content: center !important; margin-top: 25px !important; }
    section#services .d-flex.gap-2.mt-30.ml-30 {justify-content: center; margin: 30px 0 0 !important; }
    .testimonial-box .content:before {left: 0 !important; right: 0 !important; margin: auto; }
    section#services div#testimonials .testimonial-box .content p {text-align: center; }
    section#industries .col-lg-4.d-flex.justify-content-md-end.align-items-end.mt-mb-0.mt-4 {justify-content: center !important; }
    .cases__top {justify-content: center; }
    .wk_col.the_work-col1 {max-width: 100%; }
    section.the_work .wk_col {width: 100%; }
    section.the_work .wk_col img {width: 100%; }
    .veracity_page .imp_sec p.primary-pera.wk_white {padding-right: 0; }
    /*.wk_container.wk_pading.top-info-con {text-align: center; }*/
    /*.cases__title {justify-content: center; }*/
    /*section.app-work-sec .cases__title, section.the_work .cases__title, section.complex .cases__title {justify-content: center; }*/
    /*h3.primary-title.uk_primarytitle {text-align: center; }*/
    .info-item {text-align: center; border: none; } 
    .peralax.wk_pading.uk-res-plf {text-align: center; } 
    .peralax.wk_pading.uk-res-plf .cases__title {justify-content: center; }
    ul.wk_chips {max-width: 100%; justify-content: center; }
}


@media (max-width: 767px) {
    .wk_container.wk_pading.top-info-con {text-align: center; }
    .cases__title {justify-content: center; }
    .d_none_767{display: none !important;}


    section.cases.wk_container.ce_cases.uk_cases .cases__tabs {justify-content: center;}



    
    /*HOME*/
    .ind_slide_content img {margin-bottom: 0px !important; }
    .ind_slide_content {font-size: 17px; text-align: left !important; align-items: start !important; }
    section.cases.wk_container.container.ce_cases.uk_cases {text-align: center; padding-top: 40px !important; }
    section.app-work-sec .cases__title, section.the_work .cases__title, section.complex .cases__title {margin-bottom: 20px; justify-content: center; }

    /*HOME*/
    article.case .case__tags {display: none !important; }
    .stp {right: 20px; top: 20px; font-size: 15px; }
    .qa_banner_content {max-width: 100%; }
    .qa_btm_contact .map {margin-bottom: 0px; }
    h1 {font-size: 45px; line-height: 50px; }
    .w-85 {max-width: 100% !important; }
    section.wk_cta3_sec {padding-top: 50px; }
    .wk_cta3_img {margin-top: 25px; }
    .hh2 {font-size: 35px !important;line-height: 40px !important;}
    .qa_ze_readyTransform .hh2 {font-size: 32px !important; line-height: 37px !important;}
    .clients {
        & .testimonial-box {
            padding-inline: 0;
        }
    }
    .uk_res_pt-60 {padding-top: 17px; }
    .uk_case__tags {position: unset !important; margin-bottom: 20px; justify-content: center; }
    .wk-case .swiper-button-next, .wk-case .swiper-button-prev {position: unset; display: inline-block; margin: 20px 0 0; }
    .uk_case__tags {position: unset !important; margin-bottom: 20px; justify-content: center; margin: 0 auto 30px; /* display: table; */ }
    section.wk-case .wk_container {margin-left: 0px; }
    h4.primary-title.wk_pading {text-align: center; }
    .swiper_slier_bonts {display: flex; gap: 10px; justify-content: center; }
    .uk_case .case__cta {justify-content: space-between; }
    .uk_case_img {margin: 0px auto 20px; display: table;}
    div#testimonials {padding: 60px 0; }
    section.portfolio_banner h1 {font-size: 35px; line-height: 45px; }
    img.vc_banner_img {bottom: 25px !important; }
    section.stickySection {margin-top: -30px; }
    .strategy {padding: 0px 0px 0px 0px !important; }
    section.the_work {padding-top: 0px; padding-bottom: 0; }
    section.wk-case {padding: 0px 25px !important; }
    .uk_res_pt-60 .uk_overflow_unset {padding-top: 50px !important; }
    .veracity_banner .ve_topInfo {padding-bottom: 0; }
    br{display: none;}
    /*.swiper-slide {margin: 0 !important; padding: 0px 20px; }*/
    .case {min-height: auto !important; }
    .btn-primary.arrow {margin: 30px auto 0 !important; display: table; }
    .prefer-email {text-align: center; margin-top: 30px; }

    /*HOME*/
    section.hero-home {font-size: 15px; font-weight: 300; }
    section.hero-home .hh2 {font-size: 35px !important; line-height: 40px !important; }
    .footer_copyright .ft-legal {width: 100%; flex-direction: unset; }
    .d-flex.gap-3.flex-wrap.uk_pills {width: 100% !important;} 
    .my_pills .pill {width: auto !important; display: inline-block; text-align: left !important; font-size: 10px !important; margin: 5px 0; } 
    .my_pills {text-align: left; }
    
    .uk_banner_content .primary-title {font-size: 32px !important; }
    .uk_res_pt-60 {padding-bottom: 15px; }
    section.inner-contact-cta .primary-title {font-size: 32px !important; line-height: 37px; }
    section.inner-contact-cta.wk_pading.uk_inner-contact-cta .cases__title {margin-bottom: 0; }
    section.inner-contact-cta.wk_pading.uk_inner-contact-cta p.primary-pera {margin: 0; }
    .inner-contact-cta .wk_flex {gap: 30px; }
    /*HOME*/
    .full-veiw {border-radius: 10px 10px 0px 0px !important; overflow: hidden; }
    .wk_container {padding-left: 0 !important; padding-right: 0 !important; }
    .solution_clm {text-align: left; }
     p.live-label.ve_live-label {border-radius: 30px; border: 1px solid rgba(255, 255, 255, 0.50); background: rgba(255, 255, 255, 0.40); backdrop-filter: blur(3px); color: #000 !important; margin-top: 15px; }
}

@media (max-width: 575px) {
    section.strategy.bg-white.peralax {margin-top: 30px !important; }

    .info-item:first-child {border-left: none !important; }
    .info-row.uk_klenza_infoRows {justify-content: start; text-align: left !important; padding: 20px 0px;} 
    .info-row.uk_klenza_infoRows .info-item {width: auto; text-align: left; text-transform: uppercase; } 
    .info-row.uk_klenza_infoRows .info-item:last-child {width: 100%; text-align: left; } 
    .info-row.uk_klenza_infoRows .info-item:last-child:nth-child(2) {border: 1px solid #000 !important; } 
    .info-item:nth-child(2) {border-left: 1px solid; padding-left: 30px; }
    .wk_container.wk_flex.user-sec.ve_work_content.ve_work_padding.bold_new.uk_ve_workContent {margin-bottom: 20px; }
    ul.wk_chips li {width: 170px; }
    section.hero-home .hh2 {text-align: center;  }
    .hh2 {font-size: 32px !important;line-height: 37px !important;}
    section {padding-block: 50px; } 
    section.am_cta {padding: 60px 0 !important; }
    .author {gap:10px;}
    .author .name {font-size: 16px !important; } 
    .author .designation {font-size: 13px !important; } 
    .author .img img {width: 55px; } 
    .author .icon img {width: 40px !important; }
    .author .content {gap:10px !important;}
    p.live-label {margin: 0px auto 25px; }
    .qa_contact-hero .glass-form {padding: 25px; }
    img.vc_banner_img {width: 300px; bottom: 11px !important; }
    .peralax {padding: 30px 0px 0px; }
    /*.swiper-backface-hidden .swiper-slide {margin: 0 !important; }*/
    section.app-work-sec .wk_container {margin-bottom: 0; padding: 0; }
    section.app-work-sec {padding: 0 !important; }
    section.complex {padding-top: 0; } 
    section.complex .wk_container {padding: 0 !important; }

    .gallery_wrapper .modal-content {height: 50vh !important; }
    .gallery_wrapper {max-width: 98% !important;}
    .container {max-width: 100%; }

    /*HOME*/
    section.hero-home a.btn-primary.arrow {width: 100%; padding: 12px 45px 12px 35px;}
    section.hero-home {& .btn-primary.arrow {&::after {left: 15px; top: 19px; } } }
    button.btn-primary.arrow {width: 100%; }
    .prefer-email {margin-top: 15px !important; }
    .uk_ft-legal .ft-copy {font-size: 13px; font-weight: 400; }
    section.contact {& .contact-form-wrapper {label {padding: 7px 10px; font-size: 12px !important; } } }
    .uk_banner_content {padding-bottom: 0px; }
        .primary-title {font-size: 33px !important; line-height: 38px; }
        .p_mb_0{padding-bottom: 0 !important;}
        .py_md_35px{padding-top: 35px !important; padding-bottom: 35px !important;}
        section.strategy .primary-title {font-size: 29px !important; line-height: 34px; }
        section.the_work .wk_col img { border-radius: 10px; }
        .wk_flex.work_flow {padding: 15px; margin: 40px auto;} 
    /*HOME*/
        .full-veiw {left: 0px !important; right: 0 !important; margin: auto; bottom: -9px; }
        .veracity_page .ve_work_content {border-radius: 10px; position: unset !important; padding: 0px 22px 20px !important; background-image: unset !important; box-shadow: 0px 0px 35px 0px #0000003b; margin-top: 30px; background-color: var(--color-surface-alt) !important; }
        ul.solution_list.uk_klenza_solution_list {text-align: left; }
        h2.primary-title.uk_primarytitle {text-align: center; }

}

@media (max-width: 414px) {
    /* Icon is 46px at every breakpoint now (matched to brochure-design's
       .brx-cap icon size), so no override needed here -- a wider mobile
       value would stretch it since height stays 46px from the base rule. */
    .wk_text_con h4 {font-size: 25px; }
    h1 {font-size: 35px; line-height: 40px; }
    p {font-size: 15px; }
    section.hero-home .hh2 {text-align: center;}
    .hh2 {font-size: 28px !important;line-height: 32px !important;}
    .app_development img.ad_baner_img {margin-right: 0; margin-bottom: -20%; width: 72%; }
    section.portfolio_banner h1 {font-size: 29px; line-height: 37px; }
    .gallery_wrapper .modal-content {height: 40vh !important; }
    .cta_col a {margin-top: 0px; }
    .cta_col p {width: 100%; margin: 0 auto 0; font-size: 14px !important; }
    .wk-col.cta_col.wk_pading {height: auto;padding: 25px !important; }
    .cta_col {height: auto !important; padding: 25px !important; }
    section.wk_pading.imp_sec .primary-title {font-size: 30px !important; }
    

}


.container {
    position: static;
}