/**

 * Site-wide mobile overlay menu (≤1200px).

 * Desktop overlay / hover submenu behavior is unchanged.

 */



/* Mobile-only submenu chrome — never show in desktop hover flyout */

#mainnav .submenu-services-heading {

  display: none !important;

}

/* Desktop: never show the mobile-only logo + GPTW row */
.footer-mobile-brand {
  display: none !important;
}

/* Desktop: keep industries heading on one line (br only for mobile) */
body.services-page .look-what-industry .header-text h6 br.svc-h6-br {
  display: none;
}

/* Blog article body: keep copy left-aligned on all blog detail pages */
body.blog-detail .blog-content,
body.blog-detail .blog-content .content-width,
body.blog-detail .blog-content .card-body,
body.blog-detail .blog-content .card-body p,
body.blog-detail .blog-content .card-body h5,
body.blog-detail .blog-content p,
body.blog-detail .blog-content h4 {
  text-align: left;
}

/* Related / listing card meta under images — left on desktop */
body.blog-detail .our-thoughts-perspective .cards .card-body,
body.blog-detail .subscriber-with-us .our-thoughts-perspective .cards .card-body,
body.home-page .our-thoughts-perspective .cards .card-body {
  text-align: left;
}

body.blog-detail .our-thoughts-perspective .cards .card-body p,
body.blog-detail .our-thoughts-perspective .cards .card-body h5,
body.blog-detail .subscriber-with-us .our-thoughts-perspective .cards .card-body p,
body.blog-detail .subscriber-with-us .our-thoughts-perspective .cards .card-body h5,
body.home-page .our-thoughts-perspective .cards .card-body p,
body.home-page .our-thoughts-perspective .cards .card-body h5 {
  text-align: left;
}

/* Mobile: center article meta (category/date + byline) only */
@media screen and (max-width: 1200px) {
  body.blog-detail .blog-content .content-width > .card-body,
  body.blog-detail .blog-content .content-width > .card-body p,
  body.blog-detail .blog-content .content-width > .card-body h5 {
    text-align: center !important;
  }

  body.blog-detail .our-thoughts-perspective .cards .card-body,
  body.blog-detail .our-thoughts-perspective .cards .card-body p,
  body.blog-detail .our-thoughts-perspective .cards .card-body h5,
  body.blog-detail .subscriber-with-us .our-thoughts-perspective .cards .card-body,
  body.blog-detail .subscriber-with-us .our-thoughts-perspective .cards .card-body p,
  body.blog-detail .subscriber-with-us .our-thoughts-perspective .cards .card-body h5 {
    text-align: center !important;
  }
}



@media screen and (max-width: 1200px) {

  /*
   * Particles sit position:fixed at z-index 11 over the whole page and were
   * swallowing taps on the footer location tabs. Keep the dots visual only.
   */
  #particles-js,
  #particles-js .particles-js-canvas-el,
  #particles-js-second,
  #particles-js-second .particles-js-canvas-el {
    pointer-events: none !important;
  }

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

  /* 0a. Banner typewriter — stable size so typing never shifts layout   */

  /*     (all pages with .about_banner; desktop unchanged)               */

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

  .about_banner .texttypo {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }

  .about_banner .texttypo p {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
    font-size: clamp(24px, 7vw, 40px) !important;
    line-height: 1.35 !important;
    white-space: normal !important;
  }

  /*
   * Typewriter on its own full-width line. Reserve 3 lines of height
   * (use lh so it matches line-height; em alone was under-counting and
   * still let long phrases wrap and push .img_banner down).
   */
  .about_banner .texttypo p > .typewriter,
  .about_banner .texttypo p > span.typewriter-blog {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
    line-height: 1.35 !important;
    margin-top: 0.12em;
    /* Always reserve 3 lines so long phrases don't push content */
    min-height: calc(1.35em * 3) !important;
    min-height: 3lh !important;
  }

  .about_banner .texttypo p .Typewriter__wrapper {
    display: inline !important;
    line-height: inherit !important;
    margin: 0 !important;
  }

  .about_banner .texttypo .Typewriter__cursor {
    display: inline !important;
    position: relative !important;
    top: 0 !important;
    line-height: inherit !important;
    vertical-align: baseline;
  }

  /* Breathing room above banner title (below fixed mobile navbar) */
  .about_banner {
    padding-top: 32px !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
  }

  /* ------------------------------------------------------------------ */
  /* 0b. CTA buttons — match homepage mobile layout (non-home only)     */
  /*     Homepage keeps its own rules in mobile-home.css unchanged.     */
  /* ------------------------------------------------------------------ */
  body:not(.home-page) .default-button {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    vertical-align: middle;
    height: 40px;
    max-width: 100%;
    padding: 0 6px 0 18px;
    box-sizing: border-box;
    border-radius: 20px;
    overflow: hidden;
    background-color: transparent;
    letter-spacing: 1.5px;
    transform: none;
    -webkit-transform: none;
  }

  body:not(.home-page) .default-button .text {
    position: relative;
    z-index: 3;
    padding: 0 !important;
    font-size: 11px;
    line-height: 1;
    letter-spacing: 1.5px;
    white-space: nowrap;
    opacity: 1;
    transform: none;
    -webkit-transform: none;
  }

  /* Circle sits behind the plus icon on the right */
  body:not(.home-page) .default-button .button-background .left,
  body:not(.home-page) .default-button .button-background .right {
    left: auto;
    right: 6px;
    top: 50%;
    width: 28px;
    height: 28px;
    align-items: center;
    justify-content: center;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
  }

  body:not(.home-page) .default-button .button-background .left:before,
  body:not(.home-page) .default-button .button-background .right:before {
    width: 28px;
    height: 28px;
    transform: scale(1);
    -webkit-transform: scale(1);
  }

  body:not(.home-page) .default-button .plus-icon {
    flex: none;
    width: 28px;
    height: 28px;
    margin: 0 0 0 10px;
    opacity: 1;
    z-index: 2;
  }

  body:not(.home-page) .default-button .plus-icon:before,
  body:not(.home-page) .default-button .plus-icon:after {
    top: 50%;
    left: 50%;
    width: 9px;
    margin: -0.5px 0 0 -4.5px;
  }

  /* Portfolio list: intentional gap between title and image */
  .portfolio-list .about_banner {
    padding-top: 32px !important;
    padding-bottom: 24px !important;
    margin-bottom: 0 !important;
  }

  .portfolio-list .about_banner .texttypo,
  .portfolio-list .about_banner .texttypo p {
    min-height: 4.2em !important;
  }

  .portfolio-list .img_banner {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  /* Tighter space after banner image before first portfolio card */
  .portfolio-list .our-thoughts-perspective {
    padding-top: 24px !important;
  }

  .portfolio-list .our-thoughts-perspective .custom-row {
    padding-top: 0 !important;
  }

  .portfolio-list .porfolio_lising .custom-row > .column-50:first-child {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  .portfolio-list .img_banner img {
    width: 100% !important;
    height: min(52vw, 280px) !important;
    min-height: 220px;
    object-fit: cover;
    object-position: center;
    display: block;
  }

  /* Global img_banner height — shorter on all pages (mobile only) */
  .img_banner > img {
    width: 100% !important;
    height: min(52vw, 280px) !important;
    min-height: 220px;
    object-fit: cover;
    object-position: center;
    display: block;
  }

  /* Blog listing banner — matching dark overlay (overlay is 100% of image) */
  body.blog-listing .img_banner {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  body.blog-listing .img_banner > img {
    width: 100% !important;
    height: min(52vw, 280px) !important;
    min-height: 220px;
    object-fit: cover;
    object-position: center;
    display: block;
  }

  /* CSR page banner — mobile only */
  body.csr-page .img_banner {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  body.csr-page .img_banner > img {
    width: 100% !important;
    height: min(52vw, 280px) !important;
    min-height: 220px;
    object-fit: cover;
    object-position: center;
    display: block;
  }

  body.csr-page .our-purpose-section.about_section .text-left h2 {
    font-size: 16px !important;
    line-height: 26px !important;
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
  }

  /* Space above Let’s Roll CTA — mobile only (beats about-us top:-44px) */
  body.csr-page .our-purpose-section.about_section .text-left > a.default-button,
  body.csr-page .our-purpose-section .text-left .default-button {
    display: inline-flex !important;
    position: relative !important;
    top: 0 !important;
    margin-top: 48px !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    transform: none !important;
  }

  /* Tighten space after CSR photo grid before Remarkable CTA */
  body.csr-page .our-sub-team-section,
  body.csr-page .our-sub-team-section.team-block {
    padding-top: 0 !important;
    padding-bottom: 16px !important;
    margin-bottom: 0 !important;
  }

  /* ------------------------------------------------------------------ */
  /* Team page (body.team-page) — 1 column, ~2 cards visible at a time */
  /* ------------------------------------------------------------------ */

  body.team-page .our-sub-team-section.team-block {
    padding: 32px 0 24px !important;
    overflow-x: hidden !important;
  }

  body.team-page .our-sub-team-section .content-width {
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 auto !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
  }

  body.team-page .team-block .team-row {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    align-items: center !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    gap: 36px !important;
  }

  body.team-page .team-block .row-item {
    flex: 0 0 auto !important;
    -webkit-box-flex: 0 !important;
    max-width: 300px !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    float: none !important;
    clear: none !important;
  }

  body.team-page .team-block figure {
    position: relative !important;
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 0 0 96px !important;
    box-sizing: border-box !important;
    overflow: visible !important;
  }

  body.team-page .team-block .team-card {
    width: 100% !important;
    max-width: 300px !important;
    margin: 0 auto !important;
    padding-bottom: 100% !important;
    line-height: 0 !important;
    /* Keep visible — name overlays the photo edge */
    overflow: visible !important;
  }

  body.team-page .team-block .card-front {
    overflow: hidden !important;
  }

  body.team-page .team-block .team-card img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }

  body.team-page .team-block figcaption {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    /* Shifted down so ascenders clear the photo crop */
    bottom: 15px !important;
    width: 100% !important;
    padding: 0 8px !important;
    box-sizing: border-box !important;
    text-align: center !important;
    z-index: 3 !important;
    overflow: visible !important;
  }

  /*
   * Name straddles the photo edge: top half white (on image),
   * bottom half black (below image). Extra line-height + padding so
   * Brittany Signature ascenders/descenders are not clipped.
   */
  body.team-page .team-block figcaption .heading-quaternary {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    font-family: "Brittany Signature", cursive !important;
    font-size: 58px !important;
    line-height: 1.45 !important;
    margin: 0 0 6px !important;
    padding: 16px 0 14px !important;
    overflow: visible !important;
    color: transparent !important;
    -webkit-text-fill-color: transparent !important;
    background-image: linear-gradient(
      to top,
      #000000 50%,
      #ffffff 50%
    ) !important;
    background-color: transparent !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
  }

  body.team-page .team-block .heading-quinary {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    font-size: 12px !important;
    letter-spacing: 1.5px !important;
    line-height: 1.4 !important;
    white-space: normal !important;
    margin: 0 !important;
    padding: 2px 0 0 !important;
    color: #141414 !important;
  }

  /* Intro CTA — undo about-us negative top pull; clear space under copy */
  body.team-page .our-purpose-section .text-left .default-button {
    top: auto !important;
    position: relative !important;
    margin-top: 32px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    display: inline-flex !important;
  }

  /* ------------------------------------------------------------------ */
  /* Sand's Speak — stacked testimonial: image → quote → name/role    */
  /* ------------------------------------------------------------------ */

  body.team-page .employee-testimonials {
    padding: 40px 0 48px !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  body.team-page .employee-testimonials .content-width {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
    box-sizing: border-box !important;
  }

  body.team-page #testimonial-area {
    position: relative !important;
    overflow: hidden !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Title: relative + padding so it isn't clipped at the top */
  body.team-page #testimonial-area > h3 {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    right: auto !important;
    display: block !important;
    width: 100% !important;
    margin: 0 0 28px !important;
    padding: 12px 0 0 !important;
    text-align: center !important;
    font-size: 14px !important;
    letter-spacing: 2.5px !important;
    line-height: 1.4 !important;
    text-transform: uppercase !important;
    color: #141414 !important;
  }

  /* Fixed frame — no expand/contract when swipe changes quote length */
  body.team-page .testi-wrap {
    position: relative !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 440px !important;
    min-height: 440px !important;
    max-height: 440px !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: flex-start !important;
    column-gap: 14px !important;
    row-gap: 24px !important;
    touch-action: pan-y !important;
    -webkit-user-select: none !important;
    user-select: none !important;
  }

  body.team-page .testi-wrap .client-single.active .client-comment p {
    -webkit-user-select: text !important;
    user-select: text !important;
  }

  body.team-page .testi-wrap:after {
    display: none !important;
  }

  /* Hide inactive avatars on mobile — active testimonial only */
  body.team-page .testi-wrap .client-single:not(.active) {
    display: none !important;
  }

  /* Slight dissolve on auto/manual swipe */
  body.team-page .testi-wrap .client-single.active {
    opacity: 1 !important;
    transition: opacity 0.35s ease !important;
  }

  body.team-page .testi-wrap.is-dissolving .client-single.active {
    opacity: 0 !important;
  }

  @media (prefers-reduced-motion: reduce) {
    body.team-page .testi-wrap .client-single.active {
      transition: none !important;
    }
  }

  /* Active card — full-width stack: image → quote → designation */
  body.team-page .testi-wrap .client-single.active {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    order: 1 !important;
    flex: 0 0 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
    z-index: 1 !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  body.team-page .testi-wrap .client-single.active .client-img {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
    width: 88px !important;
    height: 88px !important;
    margin: 0 auto 24px !important;
    border-radius: 50% !important;
    overflow: hidden !important;
  }

  body.team-page .testi-wrap .client-single .client-img img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
  }

  body.team-page .testi-wrap .client-single.active .client-comment {
    position: relative !important;
    top: auto !important;
    right: auto !important;
    left: auto !important;
    flex: 1 1 auto !important;
    max-width: 100% !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    -webkit-transform: none !important;
    text-align: center !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  body.team-page .testi-wrap .client-single.active .client-comment p {
    font-size: 17px !important;
    line-height: 28px !important;
    font-weight: 300 !important;
    color: #141414 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 196px !important;
    min-height: 196px !important;
    max-height: 196px !important;
    padding: 0 4px !important;
    margin: 0 0 20px !important;
    text-align: center !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 7 !important;
  }

  body.team-page .testi-wrap .client-single.active .client-comment h3 {
    font-size: 40px !important;
    line-height: 1.15 !important;
    color: #fe6571 !important;
    font-family: "Brittany Signature", cursive !important;
    margin: 0 !important;
    padding: 8px 0 0 !important;
    text-align: center !important;
    flex: 0 0 auto !important;
    width: 100% !important;
  }

  body.team-page .testi-wrap .client-single.active .client-comment h3 span {
    display: block !important;
    font-size: 13px !important;
    line-height: 1.4 !important;
    letter-spacing: 2.5px !important;
    color: #141414 !important;
    font-family: "Josefin Sans", sans-serif !important;
    font-weight: 400 !important;
    text-transform: uppercase !important;
    margin-top: 6px !important;
  }

  /* Team certifications marquee — stop logo overlap on narrow screens */
  body.team-page .team_certificat .meet-our-client {
    overflow: hidden !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body.team-page .team_certificat .meet-our-client .js-marquee-wrapper {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    padding: 28px 0 !important;
  }

  body.team-page .team_certificat .meet-our-client .js-marquee,
  body.team-page .team_certificat .meet-our-client .team_cetification_logo {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    width: max-content !important;
    max-width: none !important;
  }

  body.team-page .team_certificat .meet-our-client .js-marquee .item,
  body.team-page .team_certificat .meet-our-client .team_cetification_logo .item {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
    padding: 0 18px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  body.team-page .team_certificat .meet-our-client .js-marquee .item img,
  body.team-page .team_certificat .meet-our-client .team_cetification_logo .item img {
    display: block !important;
    width: 110px !important;
    max-width: 110px !important;
    min-width: 0 !important;
    height: auto !important;
    opacity: 0.7 !important;
  }

  /* Culture gallery — wider slides so photos aren't tiny strips */
  body.team-page .banner_wrapper.culture-sec .swiper {
    overflow: hidden !important;
    width: 100% !important;
    padding: 0 16px 8px !important;
    box-sizing: border-box !important;
    height: auto !important;
    max-height: none !important;
  }

  body.team-page .banner_wrapper.culture-sec .swiper-wrapper {
    gap: 0 !important;
    align-items: stretch !important;
  }

  body.team-page .banner_wrapper.culture-sec .swiper-slide {
    width: min(78vw, 340px) !important;
    max-width: min(78vw, 340px) !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: hidden !important;
    align-items: stretch !important;
    display: flex !important;
    flex-shrink: 0 !important;
    box-sizing: border-box !important;
  }

  body.team-page .banner_wrapper.culture-sec .swiper-slide .img_block {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    gap: 12px !important;
  }

  body.team-page .banner_wrapper.culture-sec .swiper-slide img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 180px !important;
    object-fit: cover !important;
    object-position: center center !important;
    margin: 0 auto !important;
  }

  /* Founder name — solid white, no wrap, readable on the pink panel */
  body.team-page .emly-title {
    font-size: 20px !important;
    letter-spacing: 0.16em !important;
    color: #fff !important;
    min-width: 440px !important;
    white-space: nowrap !important;
    transform: rotate(-92deg) translate(228px, -152px) !important;
  }

  body.team-page .strategies-block-bg-pink .emly-title span,
  body.team-page .strategies-block-bg-yellow .emly-title span,
  body.team-page .strategies-block-bg-blue .emly-title span {
    font-size: 80px !important;
    letter-spacing: 0.05em !important;
    white-space: nowrap !important;
    /* Solid white — pink→white gradient was invisible / looked like a blank strip */
    background: none !important;
    background-image: none !important;
    -webkit-background-clip: border-box !important;
    background-clip: border-box !important;
    -webkit-text-fill-color: #ffffff !important;
    color: #ffffff !important;
  }

  /*
   * Founder card on team page uses the same composite SVG as About Us —
   * reset the old scaled/rotated composition overrides.
   */
  body.team-page .senior-strategies-block {
    --k: 1 !important;
    margin-bottom: 28px !important;
    padding-bottom: 0 !important;
    -webkit-transform: none !important;
    transform: none !important;
  }

  @supports (transform: scale(tan(atan2(2px, 1px)))) {
    body.team-page .senior-strategies-block {
      --k: 1 !important;
    }
  }

  /* Keep founder card fully visible; no bottom clip / blank strip */
  body.team-page .team-partners,
  body.team-page .team-partners .content-width,
  body.team-page #our-founders,
  body.team-page #our-founders .owl-stage-outer,
  body.team-page #our-founders .owl-stage,
  body.team-page #our-founders .owl-item {
    overflow: visible !important;
  }

  body.team-page #our-founders .owl-item {
    height: auto !important;
  }

  /* Beat body.about-us .we-are-mutual-firm-about padding (same classes on this block) */
  body.team-page.about-us .team-partners.we-are-mutual-firm-about {
    padding-top: 40px !important;
    padding-bottom: 56px !important;
  }

  /* "Bunch of misfits" intro — smaller type, less top air */
  body.team-page .about_section.team-list-main.padding-m {
    padding-top: 8px !important;
    padding-bottom: 12px !important;
  }

  body.team-page .about_section.team-list-main .text-left p {
    font-size: 15px !important;
    line-height: 24px !important;
    letter-spacing: 0.2px !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  /* ------------------------------------------------------------------ */
  /* About Us page (body.about-us) — mobile only                        */
  /* ------------------------------------------------------------------ */

  /*
   * 1) No hero photo here — a flat brand-pink panel carries the caption.
   *    The banner sets its own height since no image supplies one.
   *    Team / Careers also use body.about-us — keep their photo banners.
   */
  body.about-us:not(.team-page):not(.careers-page) .img_banner {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    height: min(52vw, 280px) !important;
    min-height: 220px;
  }

  body.about-us:not(.team-page):not(.careers-page) .img_banner > img {
    display: none !important;
  }

  body.about-us:not(.team-page):not(.careers-page) .img_banner .text_box {
    background: #fe6571 !important;
  }

  /* 2) Mission statement reads as copy, not a display heading */
  body.about-us .our-purpose-section.about_section .text-left h2 {
    font-size: 16px !important;
    line-height: 26px !important;
  }

  /*
   * Consistent vertical rhythm for every content section on About Us.
   * Banner/hero keeps its own height; everything else uses the same 60px band.
   */
  body.about-us .our-purpose-section,
  body.about-us .vision_section,
  body.about-us .we-are-mutual-firm-about,
  body.about-us .our_values,
  body.about-us .black-theme-section,
  body.about-us .client-review-section,
  body.about-us .why-with-uswork,
  body.about-us .banner_wrapper {
    padding-top: 60px !important;
    padding-bottom: 60px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  /* Mission block sits a bit lower under the pink banner */
  body.about-us .our-purpose-section {
    padding-top: 120px !important;
  }

  /* What We Deliver — same extra top band so the heading isn't flush */
  body.about-us .vision_section {
    padding-top: 90px !important;
  }

  body.about-us .our_values {
    padding-top: 90px !important;
  }

  /* Testimonials — centered full-width stack on the phone frame */
  body.about-us .client-review-section {
    padding-left: 20px !important;
    padding-right: 20px !important;
    padding-bottom: 24px !important;
    max-width: 100% !important;
    width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
    text-align: center !important;
    overflow: hidden !important;
  }

  body.about-us .client-name {
    display: block !important;
    width: 100% !important;
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  body.about-us .client-review-section #tetimonial {
    margin-top: 24px !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body.about-us #tetimonial .owl-nav {
    display: none !important;
  }

  body.about-us #tetimonial .owl-stage-outer,
  body.about-us #tetimonial .owl-stage,
  body.about-us #tetimonial .owl-item,
  body.about-us #tetimonial .owl-item.active,
  body.about-us #tetimonial .item,
  body.about-us #tetimonial .slider-item {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    left: 0 !important;
    right: 0 !important;
    float: none !important;
    box-sizing: border-box !important;
    text-align: center !important;
  }

  body.about-us #tetimonial .owl-stage-outer {
    overflow: hidden !important;
  }

  body.about-us #tetimonial .owl-stage {
    transform: none !important;
    display: block !important;
  }

  body.about-us .client-review-section .testimonial-desc {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    text-align: center !important;
  }

  body.about-us .client-review-section p,
  body.about-us .client-review-section .slider-item .testimonial-desc p {
    font-size: 15px !important;
    line-height: 24px !important;
    letter-spacing: 0.3px !important;
    padding-bottom: 12px !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    text-align: center !important;
  }

  body.about-us .client-review-section h3 {
    font-size: 32px !important;
    line-height: 40px !important;
    text-align: center !important;
  }

  body.about-us .client-review-section span,
  body.about-us .client-review-section .slider-item span {
    font-size: 10px !important;
    line-height: 16px !important;
    letter-spacing: 1.5px !important;
    text-align: center !important;
  }

  body.about-us .client-review-section .owl-dots {
    margin-top: 16px !important;
    text-align: center !important;
  }

  body.about-us .why-with-uswork {
    padding-top: 24px !important;
  }

  body.about-us .banner_wrapper h2 {
    font-size: 24px !important;
    line-height: 32px !important;
    padding-bottom: 20px !important;
  }

  /*
   * 3) The banner, process, review and clients sections already centre their
   *    copy on mobile; these three were the only left-aligned holdouts. The
   *    CTAs are inline-flex, so they follow the text alignment.
   */
  body.about-us .our-purpose-section,
  body.about-us .our-purpose-section .text-left,
  body.about-us .vision_section,
  body.about-us .vision_section .column-50,
  body.about-us .our_values {
    text-align: center !important;
  }

  /* Core Values title block — smaller type and tighter eyebrow gap */
  body.about-us .our_values .sticky_title h2 {
    font-size: 22px !important;
    line-height: 30px !important;
    padding-bottom: 23px !important;
  }

  body.about-us .our_values .sticky_title h2 span {
    font-size: 12px !important;
    letter-spacing: 2px !important;
    padding-bottom: 12px !important;
  }

  /* Desktop leaves 180px under the sticky title for the pin; keep a modest gap on mobile */
  body.about-us .our_values .sticky_title {
    padding-bottom: 36px !important;
  }

  body.about-us .our_values .floatR ul li {
    margin-bottom: 40px !important;
  }

  /* Match the button's 6px right inset so its label lands on centre */
  body.about-us .default-button {
    padding-left: 6px !important;
  }

  /*
   * Mission CTA sits 70px below the copy. Nudge it up with top rather than
   * margin so the button keeps its layout box and the section height holds.
   * CSR keeps normal spacing (its own Let’s Roll rule below).
   */
  body.about-us:not(.csr-page):not(.team-page):not(.careers-page) .our-purpose-section .text-left .default-button {
    top: -44px;
  }

  /* 4) What We Deliver — tighten type; section pad comes from the shared rhythm */
  body.about-us .vision_section h6 {
    line-height: 1.4 !important;
    padding-bottom: 12px !important;
  }

  body.about-us .vision_section .column-50 p {
    font-size: 16px !important;
    line-height: 26px !important;
    padding-bottom: 28px !important;
  }

  body.about-us .vision_section .column-50:last-child img {
    max-width: min(88vw, 340px) !important;
    width: 100% !important;
    height: auto !important;
    display: block !important;
    margin: 28px auto 32px !important;
    object-fit: contain !important;
  }

  body.about-us:not(.team-page):not(.careers-page) .client-review-section .slick-slide img,
  body.about-us:not(.team-page):not(.careers-page) .client-review-section .slider-item > img,
  body.about-us:not(.team-page):not(.careers-page) .client-review-section img {
    max-width: 110px !important;
    width: 110px !important;
    height: auto !important;
    margin: 0 auto 20px auto !important;
    float: none !important;
    transform: none !important;
    display: block !important;
    object-fit: cover !important;
    border-radius: 50% !important;
  }

  /* Client logo marquee — fewer, larger logos on the phone frame */
  body.about-us:not(.team-page):not(.careers-page) .meet-our-valuable-partner {
    padding-left: 0 !important;
    padding-right: 0 !important;
    overflow: hidden !important;
  }

  body.about-us:not(.team-page):not(.careers-page) .meet-our-valuable-partner .header-text {
    padding-left: 20px !important;
    padding-right: 20px !important;
  }

  body.about-us:not(.team-page):not(.careers-page) .meet-our-valuable-partner h6.newadd_client {
    font-size: 22px !important;
    line-height: 1.3 !important;
    margin-bottom: 8px !important;
  }

  body.about-us:not(.team-page):not(.careers-page) .meet-our-client {
    padding: 12px 0 8px !important;
  }

  body.about-us:not(.team-page):not(.careers-page) .meet-our-client .splide__track {
    overflow: visible !important;
    padding: 16px 0 !important;
  }

  body.about-us:not(.team-page):not(.careers-page) .meet-our-client .splide__slide {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  body.about-us:not(.team-page):not(.careers-page) .meet-our-client .splide__slide .item {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    padding: 0 10px !important;
    box-sizing: border-box !important;
  }

  body.about-us:not(.team-page):not(.careers-page) .meet-our-client .splide__slide img,
  body.about-us:not(.team-page):not(.careers-page) .meet-our-client .item img {
    width: auto !important;
    max-width: 170px !important;
    min-width: 130px !important;
    height: auto !important;
    max-height: 88px !important;
    object-fit: contain !important;
    margin: 0 auto !important;
    display: block !important;
  }

  /* Studio peek gallery — wider slides so photos aren't thin cropped strips */
  body.about-us:not(.team-page):not(.careers-page) .banner_wrapper.section {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  body.about-us:not(.team-page):not(.careers-page) .banner_wrapper .swiper-team,
  body.about-us:not(.team-page):not(.careers-page) .banner_wrapper .swiper {
    overflow: hidden !important;
    padding-bottom: 24px !important;
    padding-left: 16px !important;
    height: auto !important;
    max-height: none !important;
  }

  body.about-us:not(.team-page):not(.careers-page) .banner_wrapper .swiper-team .swiper-wrapper {
    gap: 0 !important;
    align-items: stretch !important;
  }

  body.about-us:not(.team-page):not(.careers-page) .banner_wrapper .swiper-slide {
    width: min(78vw, 340px) !important;
    max-width: min(78vw, 340px) !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: hidden !important;
    align-items: stretch !important;
    flex-shrink: 0 !important;
    box-sizing: border-box !important;
  }

  body.about-us:not(.team-page):not(.careers-page) .banner_wrapper .swiper-slide img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: min(62vw, 440px) !important;
    min-height: 280px !important;
    max-height: 480px !important;
    object-fit: cover !important;
    object-position: center center !important;
    margin: 0 auto !important;
  }

  /*
   * 5) Founder card — mobile uses composite SVG (portrait + pink panel +
   *    name + Founder label). Hide the HTML overlays so they don't double up.
   *    Desktop still uses the photo + rotated panel composition.
   */
  body.about-us #our-founders .senior-strategies-block,
  body.team-page #our-founders .senior-strategies-block {
    --k: 1 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin: 0 auto 28px !important;
    max-width: min(92vw, 420px) !important;
    width: 100% !important;
    -webkit-transform: none !important;
    transform: none !important;
    position: relative !important;
  }

  body.about-us #our-founders .strategies-block-bg-pink,
  body.about-us #our-founders .emly-title,
  body.about-us #our-founders .senior-text,
  body.team-page #our-founders .strategies-block-bg-pink,
  body.team-page #our-founders .emly-title,
  body.team-page #our-founders .senior-text {
    display: none !important;
  }

  body.about-us #our-founders .strategies-block,
  body.team-page #our-founders .strategies-block {
    position: relative !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 auto !important;
    -webkit-transform: none !important;
    transform: none !important;
  }

  body.about-us #our-founders .strategies-block picture,
  body.team-page #our-founders .strategies-block picture,
  body.about-us #our-founders .owl-item img,
  body.team-page #our-founders .owl-item img,
  body.about-us #our-founders .strategies-block img,
  body.team-page #our-founders .strategies-block img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 auto !important;
  }

  body.about-us #our-founders .owl-stage-outer,
  body.team-page #our-founders .owl-stage-outer,
  body.about-us #our-founders .owl-stage,
  body.team-page #our-founders .owl-stage,
  body.about-us #our-founders .owl-item,
  body.team-page #our-founders .owl-item {
    overflow: visible !important;
    height: auto !important;
  }

  body.about-us #our-founders .social-media-icon,
  body.team-page #our-founders .social-media-icon {
    position: relative !important;
    top: auto !important;
    bottom: auto !important;
    right: auto !important;
    left: auto !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 12px !important;
    margin: 16px auto 0 !important;
    opacity: 1 !important;
    -webkit-transform: none !important;
    transform: none !important;
  }

  /*
   * 6) Process steps: desktop opens the step copy on :hover, which never fires
   *    on touch. Collapse by default and open when the card enters the
   *    viewport (driven by .is-in-view from mobile-nav.js). Shrink the type so
   *    the intro and labels don't crowd the phone frame.
   */
  body.about-us .the-way-we-work .header-text p {
    font-size: 14px !important;
    line-height: 22px !important;
    letter-spacing: 0.4px !important;
    padding-bottom: 36px !important;
  }

  /* Extra top band so the heading isn't flush with the section edge */
  body.about-us .black-theme-section.padding-m {
    padding-top: 100px !important;
  }

  body.about-us .the-way-we-work .header-text h6 {
    margin-top: 0 !important;
    margin-bottom: 24px !important;
    padding-top: 8px !important;
  }

  body.about-us .the-way-we-work ul li {
    padding: 32px 16px 40px !important;
    margin: 8px 0 28px !important;
  }

  /* Hairline sits under the extra bottom band */
  body.about-us .the-way-we-work ul li::before {
    bottom: -14px !important;
  }

  /* Clear top/bottom air around each process icon */
  body.about-us .the-way-we-work .ask-icon {
    margin-top: 16px !important;
    margin-bottom: 28px !important;
    display: block !important;
  }

  body.about-us .the-way-we-work ul li span {
    font-size: 20px !important;
    line-height: 28px !important;
    margin-top: 0 !important;
    margin-bottom: 16px !important;
    display: block !important;
  }

  body.about-us .the-way-we-work ul li i {
    font-size: 36px !important;
  }

  body.about-us .the-way-we-work .hover-to-show {
    height: auto !important;
    max-height: 0 !important;
    overflow: hidden !important;
    opacity: 0;
    -webkit-transition: max-height 0.45s ease, opacity 0.45s ease !important;
    transition: max-height 0.45s ease, opacity 0.45s ease !important;
    -webkit-animation: none !important;
    animation: none !important;
  }

  body.about-us .the-way-we-work .hover-to-show p {
    margin: 0 !important;
    font-size: 14px !important;
    line-height: 22px !important;
    letter-spacing: 0.4px !important;
  }

  body.about-us .the-way-we-work .hover-to-show-link.is-in-view .hover-to-show {
    max-height: 120px !important;
    opacity: 1;
  }

  body.about-us .the-way-we-work .hover-to-show-link.is-in-view .hover-to-show p {
    margin: 12px 0 0 !important;
  }

  /* ------------------------------------------------------------------ */
  /* Careers page (body.careers-page) — mobile only                     */
  /* ------------------------------------------------------------------ */

  /* Hero photo — keep image (same scale as services/csr) */
  body.careers-page .img_banner {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    height: auto !important;
    min-height: 0 !important;
  }

  body.careers-page .img_banner > img {
    display: block !important;
    width: 100% !important;
    height: min(52vw, 280px) !important;
    min-height: 220px !important;
    object-fit: cover !important;
    object-position: center !important;
  }

  body.careers-page .img_banner .text_box {
    /* Keep mobile dark overlay so white caption stays readable */
    background: rgba(0, 0, 0, 0.55) !important;
  }

  body.careers-page .img_banner .text_box p {
    font-size: 22px !important;
    line-height: 32px !important;
    color: #ffffff !important;
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  /* Section rhythm + side gutters */
  body.careers-page .our-purpose-section.carrers_text_section,
  body.careers-page .our_values.careers_value,
  body.careers-page .black-theme-section.career-process,
  body.careers-page .banner_wrapper.career_gallery,
  body.careers-page .our_values.perks_section {
    padding-top: 48px !important;
    padding-bottom: 48px !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  body.careers-page .carrers_text_section .content-width,
  body.careers-page .careers_value .content-width,
  body.careers-page .career-process .content-width,
  body.careers-page .perks_section .content-width {
    width: 100% !important;
    max-width: 100% !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
    box-sizing: border-box !important;
  }

  /* Intro — centered copy + CTA (undo About Us top:-44px) */
  body.careers-page .carrers_text_section,
  body.careers-page .carrers_text_section .text-left {
    text-align: center !important;
  }

  body.careers-page .carrers_text_section .text-left h2 {
    font-size: 16px !important;
    line-height: 26px !important;
  }

  body.careers-page .carrers_text_section .text-left p {
    font-size: 15px !important;
    line-height: 24px !important;
    margin: 0 auto !important;
    padding: 0 0 16px !important;
  }

  body.careers-page .carrers_text_section .text-left .default-button {
    top: auto !important;
    position: relative !important;
    margin: 8px auto 0 !important;
    display: inline-flex !important;
  }

  /* Job openings — stack title + cards */
  body.careers-page .careers_value .pined-content-culture {
    display: block !important;
    width: 100% !important;
  }

  body.careers-page .careers_value .circle-container,
  body.careers-page .perks_section .circle-container1 {
    display: none !important;
  }

  body.careers-page .careers_value .sticky_title,
  body.careers-page .perks_section .sticky_title1 {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
    padding-bottom: 20px !important;
    text-align: center !important;
  }

  body.careers-page .careers_value .sticky_title h2,
  body.careers-page .perks_section .sticky_title1 h2 {
    font-size: 22px !important;
    line-height: 30px !important;
    padding-bottom: 0 !important;
  }

  body.careers-page .careers_value .sticky_title h2 span,
  body.careers-page .perks_section .sticky_title1 h2 span {
    display: block !important;
    font-size: 12px !important;
    letter-spacing: 2px !important;
    padding-bottom: 10px !important;
  }

  body.careers-page .careers_value .floatR:not(.mobile_view) {
    display: none !important;
  }

  body.careers-page .careers_value .mobile_view.floatR {
    display: block !important;
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body.careers-page .careers_value .mobile_view.floatR ul {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
    border-top: 1px solid rgba(20, 20, 20, 0.15) !important;
  }

  /*
   * Desktop uses border-top + border-bottom with margin:-1px to collapse
   * adjacent lines. On mobile that becomes a double divider + empty gap.
   * One bottom border + even padding only.
   */
  body.careers-page .careers_value .mobile_view.floatR ul li,
  body.about-us.careers-page .our_values.careers_value .mobile_view.floatR ul li {
    position: relative !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 48px 0 !important;
    border-top: none !important;
    border-bottom: 1px solid rgba(20, 20, 20, 0.15) !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    box-sizing: border-box !important;
  }

  body.careers-page .careers_value .mobile_view.floatR ul li:first-child {
    padding-top: 40px !important;
  }

  body.careers-page .careers_value .mobile_view.floatR ul li:last-child {
    border-bottom: none !important;
    padding-bottom: 48px !important;
  }

  body.careers-page .careers_value .mobile_view.floatR ul li .front,
  body.careers-page .careers_value .mobile_view.floatR ul li .back {
    position: relative !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    opacity: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    display: block !important;
  }

  body.careers-page .careers_value .mobile_view.floatR ul li .front a.link {
    display: none !important;
  }

  /* Title */
  body.careers-page .careers_value .mobile_view.floatR ul li p.text_box {
    font-size: 16px !important;
    letter-spacing: 2px !important;
    text-transform: uppercase !important;
    margin: 0 0 10px !important;
    padding: 0 !important;
    font-weight: 600 !important;
    width: 100% !important;
    text-align: center !important;
  }

  /* Experience / type */
  body.careers-page .careers_value .mobile_view.floatR ul li .back h3 {
    font-size: 14px !important;
    font-weight: 300 !important;
    line-height: 22px !important;
    margin: 0 0 18px !important;
    padding: 0 !important;
    white-space: nowrap !important;
    width: 100% !important;
    text-align: center !important;
  }

  /* Description */
  body.careers-page .careers_value .mobile_view.floatR ul li .front {
    margin: 0 0 22px !important;
  }

  body.careers-page .careers_value .mobile_view.floatR ul li .front p {
    font-size: 16px !important;
    line-height: 26px !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
  }

  /* Apply CTA — after description (DOM order) */
  body.careers-page .careers_value .mobile_view.floatR ul li > a.default-button {
    position: relative !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    display: inline-flex !important;
    margin: 0 auto !important;
  }

  /* Hiring process — tighten header → first step gap */
  body.careers-page .career-process .the-way-we-work .header-text {
    text-align: center !important;
    padding-bottom: 4px !important;
    margin-bottom: 0 !important;
  }

  body.careers-page .career-process .the-way-we-work .header-text h6 {
    font-size: 14px !important;
    letter-spacing: 2px !important;
    margin-top: 0 !important;
    margin-bottom: 12px !important;
    padding-top: 0 !important;
  }

  body.careers-page .career-process .the-way-we-work ul li {
    min-height: 0 !important;
    height: auto !important;
    align-items: flex-start !important;
    justify-content: flex-start !important;
    padding: 16px 12px 24px !important;
    margin: 0 0 12px !important;
  }

  body.careers-page .career-process .the-way-we-work ul li:first-child {
    padding-top: 4px !important;
  }

  body.careers-page .career-process .the-way-we-work .ask-icon {
    margin-top: 0 !important;
    margin-bottom: 12px !important;
  }

  /* People gallery — wider slides so photos aren't tiny thumbnails */
  body.careers-page .banner_wrapper.career_gallery {
    padding-left: 0 !important;
    padding-right: 0 !important;
    box-sizing: border-box !important;
  }

  body.careers-page .banner_wrapper.career_gallery h2 {
    font-size: 24px !important;
    line-height: 32px !important;
    padding: 0 16px 24px !important;
  }

  body.careers-page .banner_wrapper.career_gallery h2 span {
    font-size: 12px !important;
    letter-spacing: 2px !important;
    padding-bottom: 12px !important;
  }

  body.careers-page .banner_wrapper.career_gallery .swiper {
    overflow: hidden !important;
    padding: 0 16px 8px !important;
    height: auto !important;
    max-height: none !important;
  }

  body.careers-page .banner_wrapper.career_gallery .swiper-wrapper {
    gap: 0 !important;
    align-items: stretch !important;
  }

  body.careers-page .banner_wrapper.career_gallery .swiper-slide {
    width: min(78vw, 340px) !important;
    max-width: min(78vw, 340px) !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: hidden !important;
    align-items: stretch !important;
    flex-shrink: 0 !important;
    box-sizing: border-box !important;
  }

  body.careers-page .banner_wrapper.career_gallery .swiper-slide img {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: min(62vw, 420px) !important;
    min-height: 260px !important;
    max-height: 460px !important;
    object-fit: cover !important;
    object-position: center center !important;
    margin: 0 auto !important;
  }

  body.careers-page .banner_wrapper.career_gallery .text_btn {
    text-align: center !important;
    margin-top: 28px !important;
  }

  body.careers-page .banner_wrapper.career_gallery .text_btn .default-button {
    top: auto !important;
    position: relative !important;
    display: inline-flex !important;
    margin: 0 auto !important;
  }

  /* Perks — single column, centered, clear space per item */
  body.careers-page .perks_section,
  body.careers-page .perks_section .floatR {
    text-align: center !important;
  }

  body.careers-page .perks_section .sticky_title1 {
    padding-bottom: 36px !important;
  }

  body.careers-page .perks_section .floatR {
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body.careers-page .perks_section .floatR ul {
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
  }

  body.careers-page .perks_section .floatR ul li,
  body.about-us.careers-page .our_values.perks_section .floatR ul li {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    margin: 0 !important;
    padding: 36px 0 !important;
    border-bottom: 1px solid rgba(20, 20, 20, 0.12) !important;
    box-sizing: border-box !important;
  }

  body.careers-page .perks_section .floatR ul li:first-child {
    padding-top: 8px !important;
    border-top: none !important;
  }

  body.careers-page .perks_section .floatR ul li:last-child {
    margin-bottom: 0 !important;
    padding-bottom: 8px !important;
    border-bottom: none !important;
  }

  body.careers-page .perks_section .floatR ul li h3 {
    font-size: 15px !important;
    letter-spacing: 2px !important;
    margin: 0 0 14px !important;
    padding: 0 !important;
  }

  body.careers-page .perks_section .floatR ul li p {
    font-size: 15px !important;
    line-height: 24px !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* ------------------------------------------------------------------ */
  /* Contact Us (body.contact-page) — mobile only                       */
  /* Order: vertical tabs → title → form → photo / testimonial          */
  /* ------------------------------------------------------------------ */

  body.contact-page,
  body.contact-page .wrapper,
  body.contact-page .section1,
  body.contact-page .contact-form-tabbing {
    overflow-x: hidden !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  body.contact-page .contact-form-tabbing {
    padding: 42px 0 40px !important;
    width: 100% !important;
    margin: 0 !important;
  }

  body.contact-page .contact-form-tabbing .content-width {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
    box-sizing: border-box !important;
    float: none !important;
  }

  body.contact-page .contact-form-tabbing .contact-row {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
  }

  /* Flatten wrappers so title / tabs / form / testi are siblings for order */
  body.contact-page .contact-form-tabbing .contact-row .contact-sticky,
  body.contact-page .contact-form-tabbing .contact-row .contact-form-right,
  body.contact-page .contact-form-tabbing .contact-form-right > .nav-tab,
  body.contact-page .contact-form-tabbing .contact-form-right .content-wrapper,
  body.contact-page .contact-form-tabbing .contact-form-right .tab-content.active {
    display: contents !important;
    max-width: none !important;
    flex: none !important;
    width: auto !important;
    float: none !important;
    position: static !important;
    transform: none !important;
  }

  body.contact-page .contact-form-tabbing .contact-form-right .tab-content:not(.active) {
    display: none !important;
  }

  /* Kill leftover GSAP pin spacers if any */
  body.contact-page .pin-spacer {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    left: auto !important;
  }

  /* 1) Tabs first — vertical, label + icon in a row, center-aligned */
  body.contact-page .contact-form-tabbing .contact-sticky > .nav-tab {
    order: 1 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 0 28px !important;
    padding: 4px 0 0 !important;
    float: none !important;
    box-sizing: border-box !important;
  }

  body.contact-page .contact-form-tabbing .tab-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.contact-page .contact-form-tabbing .tab-wrapper .tabs,
  body.contact-page .contact-us-form .tabs {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    align-items: center !important;
    gap: 18px !important;
    margin: 0 auto !important;
    padding: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body.contact-page .contact-form-tabbing .tab-wrapper .tabs li.tab-link,
  body.contact-page .contact-form-tabbing .tab-wrapper .tabs li {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: auto !important;
    max-width: 100% !important;
    flex: 0 0 auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
    box-sizing: border-box !important;
    border-bottom: none !important;
    opacity: 0.45 !important;
    float: none !important;
    cursor: pointer !important;
  }

  body.contact-page .contact-form-tabbing .tab-wrapper .tabs li.tab-link.active {
    opacity: 1 !important;
  }

  body.contact-page .contact-form-tabbing .contact-large-text-title {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    padding: 0 !important;
    margin: 0 !important;
    width: auto !important;
  }

  body.contact-page .contact-form-tabbing .contact-large-text-title h1 {
    font-size: 18px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em !important;
    text-transform: uppercase !important;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
    border-bottom: none !important;
    width: auto !important;
    white-space: nowrap !important;
  }

  body.contact-page .contact-form-tabbing .contact-large-text-title i {
    font-size: 22px !important;
    line-height: 1 !important;
    padding: 0 !important;
    margin: 0 !important;
    color: inherit !important;
  }

  body.contact-page .contact-form-tabbing .tab-link.active .contact-large-text-title h1,
  body.contact-page .contact-form-tabbing .tab-link.active .contact-large-text-title i {
    color: #f06472 !important;
  }

  body.contact-page .contact-us-form .input-group-col {
    justify-content: flex-start !important;
    margin: 0 !important;
  }

  /* 2) Active tab title under the tabs */
  body.contact-page .contact-form-tabbing .tab-content.active > h2 {
    order: 2 !important;
    font-size: 24px !important;
    line-height: 1.2 !important;
    margin: 0 !important;
    padding: 20px 0 0 !important;
    text-align: center !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  body.contact-page .contact-form-tabbing .tab-content.active > h2 br {
    display: none !important;
  }

  /* 3) Form fields — tighter + slightly smaller on mobile */
  body.contact-page .contact-form-tabbing .tab-content.active > .contact-tab-sub {
    order: 3 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding: 38px 0 0 !important;
    box-sizing: border-box !important;
  }

  body.contact-page .contact-us-form .contact-page {
    padding-top: 0 !important;
    max-width: 340px !important;
    width: 100% !important;
    margin: 0 auto !important;
  }

  body.contact-page .contact-us-form .contact-page h3 {
    font-size: 14px !important;
    line-height: 1.35 !important;
    text-align: left !important;
    padding: 0 0 10px !important;
    margin: 0 !important;
    font-weight: 500 !important;
  }

  body.contact-page .contact-us-form .contact-page .input-col h3 {
    padding: 0 0 8px !important;
  }

  /* Clear gap between form sections (label + fields) */
  body.contact-page .contact-us-form .contact-page > h3 {
    padding-top: 6px !important;
    padding-bottom: 10px !important;
    margin: 0 !important;
  }

  body.contact-page .contact-us-form .contact-page > h3:first-child {
    padding-top: 0 !important;
  }

  body.contact-page .contact-us-form .input-group,
  body.contact-page .contact-us-form .input-row,
  body.contact-page .contact-us-form .input-group-col {
    margin-left: 0 !important;
    margin-right: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    justify-content: flex-start !important;
    gap: 0 !important;
    box-sizing: border-box !important;
  }

  body.contact-page .contact-us-form .contact-page > .input-group,
  body.contact-page .contact-us-form .contact-page > .current-status {
    margin-bottom: 22px !important;
  }

  /* Captcha leaves empty layout space when scaled — collapse it */
  body.contact-page .contact-us-form .contact-page > .g-recaptcha {
    margin-bottom: 0 !important;
  }

  body.contact-page .contact-us-form .contact-page > .current-status > h3 {
    padding-top: 0 !important;
    padding-bottom: 10px !important;
  }

  body.contact-page .contact-us-form .input-row .input-col,
  body.contact-page .contact-us-form .input-group-col,
  body.contact-page .contact-us-form .text-area .input-col,
  body.contact-page .contact-us-form .attach-document .input-col,
  body.contact-page .contact-us-form .input-col {
    max-width: 100% !important;
    flex: 1 1 100% !important;
    width: 100% !important;
    float: none !important;
    padding: 5px 0 !important;
    margin: 0 !important;
    box-sizing: border-box !important;
  }

  body.contact-page .contact-us-form .input-row .input-col input,
  body.contact-page .contact-us-form .input-col textarea,
  body.contact-page .contact-us-form .attach-document .input-col input,
  body.contact-page .form-controls {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    float: none !important;
    font-size: 14px !important;
    line-height: 1.35 !important;
    font-weight: 600 !important;
    min-height: 40px !important;
    padding: 10px 12px !important;
    border-radius: 6px !important;
  }

  body.contact-page .contact-us-form .input-col textarea {
    min-height: 72px !important;
    padding: 10px 12px !important;
  }

  body.contact-page .contact-us-form input[type="file"],
  body.contact-page .contact-us-form .attach-document .input-col input[type="file"] {
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
    color: #333 !important;
    max-width: 100% !important;
    width: 100% !important;
    min-height: 44px !important;
    height: auto !important;
    padding: 8px 10px !important;
    overflow: visible !important;
    white-space: normal !important;
    background: transparent !important;
    border: 1px solid #e8e8e8 !important;
    border-radius: 6px !important;
    box-sizing: border-box !important;
  }

  /* Leave room beside the fake button so the chosen filename can show */
  body.contact-page .contact-us-form input[type="file"]::before {
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    width: auto !important;
    max-width: none !important;
    display: inline-block !important;
    margin: 0 10px 0 0 !important;
    padding: 8px 10px !important;
    vertical-align: middle !important;
    box-sizing: border-box !important;
  }

  body.contact-page .contact-us-form input[type="file"]::-webkit-file-upload-button {
    visibility: hidden !important;
    width: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  /* Custom dropdowns (Join / Say Hi) — match tightened form scale */
  body.contact-page .contact-us-form .custom-select {
    margin: 0 0 4px !important;
    width: 100% !important;
  }

  body.contact-page .contact-us-form .selected-item {
    font-size: 14px !important;
    line-height: 1.35 !important;
    font-weight: 600 !important;
    letter-spacing: 0 !important;
    min-height: 40px !important;
    padding: 10px 36px 10px 12px !important;
    box-sizing: border-box !important;
  }

  body.contact-page .contact-us-form .selected-item:after {
    font-size: 16px !important;
    right: 12px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
  }

  body.contact-page .contact-us-form .arrowanim.selected-item:after {
    transform: translateY(-50%) rotate(180deg) !important;
  }

  body.contact-page .contact-us-form .custom-select .item {
    font-size: 13px !important;
    padding: 8px 12px !important;
  }

  body.contact-page .contact-us-form .select .selectBtn,
  body.contact-page .contact-us-form .select .selectDropdown {
    font-size: 14px !important;
    min-height: 40px !important;
    padding: 10px 12px !important;
  }

  body.contact-page .contact-us-form .input-col.experience-col,
  body.contact-page .contact-us-form .current-status {
    margin-top: 12px !important;
  }

  body.contact-page .contact-us-form .current-status h3 {
    padding-top: 0 !important;
  }

  body.contact-page .contact-us-form .custom-radio {
    display: flex !important;
    flex-direction: column !important;
    gap: 6px !important;
    width: 100% !important;
  }

  body.contact-page .contact-us-form .custom-radio .input-col {
    padding: 0 !important;
  }

  body.contact-page .contact-us-form .custom-radio .label-icon {
    font-size: 13px !important;
    line-height: 1.3 !important;
    padding: 10px 12px !important;
    text-align: left !important;
    justify-content: flex-start !important;
  }

  body.contact-page .contact-us-form .custom-radio .radio-item {
    border-radius: 6px !important;
  }

  body.contact-page .contact-us-form .g-recaptcha {
    transform: scale(0.82) !important;
    transform-origin: left top !important;
    margin: 4px 0 0 !important;
    height: 64px !important;
    max-height: 64px !important;
    overflow: hidden !important;
  }

  body.contact-page .contact-us-form .arow-submit-button {
    text-align: center !important;
    margin-top: 12px !important;
    margin-bottom: 8px !important;
    padding-top: 0 !important;
    width: 100% !important;
  }

  body.contact-page .contact-us-form .arow-submit-button .default-button {
    transform: scale(0.9) !important;
    transform-origin: center center !important;
  }

  body.contact-page .contact-us-form .info {
    font-size: 11px !important;
    margin-top: 2px !important;
  }

  /* 4) Photo + testimonial — after the form, centered */
  body.contact-page .contact-form-tabbing .contact_testi {
    order: 4 !important;
    float: none !important;
    clear: both !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 40px 0 0 !important;
    margin: 0 !important;
    text-align: center !important;
    box-sizing: border-box !important;
  }

  body.contact-page .contact-form-tabbing .contact_testi > div:first-child {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
    float: none !important;
  }

  body.contact-page .contact-form-tabbing .contact_testi img {
    float: none !important;
    display: block !important;
    width: 140px !important;
    height: 140px !important;
    max-width: 140px !important;
    object-fit: cover !important;
    border-radius: 50% !important;
    margin: 0 auto 20px !important;
  }

  body.contact-page .contact-form-tabbing .contact_testi .Contact_quote {
    float: none !important;
    width: 100% !important;
    font-size: 18px !important;
    line-height: 28px !important;
    text-align: center !important;
    padding: 0 8px 12px !important;
    margin: 0 !important;
  }

  body.contact-page .contact-form-tabbing .contact_testi .Contact_author {
    float: none !important;
    width: 100% !important;
    font-size: 14px !important;
    line-height: 22px !important;
    text-align: center !important;
    margin: 0 !important;
  }

  /* 5) World map — mobile uses Updated Map asset; desktop image unchanged */
  body.contact-page .black-theme-section.contact-map-section,
  body.contact-page .black-theme-section {
    padding: 0 !important;
    margin: 0 !important;
    overflow: hidden !important;
    height: auto !important;
    max-height: none !important;
    background: #0a0a0a !important;
  }

  body.contact-page .black-theme-section picture {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    line-height: 0 !important;
  }

  body.contact-page .black-theme-section img {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
    object-fit: contain !important;
    object-position: center !important;
  }

  /* ------------------------------------------------------------------ */
  /* Services / Capabilities page (body.services-page) — mobile only    */
  /* ------------------------------------------------------------------ */

  /* 1) Hero banner — shorter height (matches sitewide mobile banner) */
  body.services-page .img_banner {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  body.services-page .img_banner > img {
    width: 100% !important;
    height: min(52vw, 280px) !important;
    min-height: 220px;
    object-fit: cover;
    object-position: center;
    display: block;
  }

  body.services-page .img_banner .text_box p {
    font-size: 24px !important;
    line-height: 34px !important;
  }

  /* 2) Intro copy + Let's Co-Create — centered with balanced side gutters */
  body.services-page .services-roadmap {
    padding-left: 28px !important;
    padding-right: 28px !important;
  }

  body.services-page .services-roadmap .content-width {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center !important;
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box;
    margin: 0 auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  body.services-page .services-roadmap .content-width > h2 {
    text-align: center !important;
    margin: 0 auto !important;
    max-width: 100% !important;
    width: 100% !important;
  }

  body.services-page .services-roadmap .content-width > .default-button {
    display: inline-flex !important;
    align-self: center;
    margin-top: 32px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 6px !important;
  }

  /* 3) Slide content centered + proper CTAs (match services-roadmap)
     sidebar-scroller forces position:relative on ALL descendants,
     which breaks default-button absolute circle / plus layout. */
  body.services-page #sv .lgt,
  body.services-page #sv .lgt > div,
  body.services-page #sv .lgt h2,
  body.services-page #sv .lgt .tx,
  body.services-page #sv .lgt .tx p,
  body.services-page .app-c.sidebar-scroller p,
  body.services-page .market-research-section .sidebar-scroller h2 {
    text-align: center !important;
  }

  body.services-page #sv .lgt h2 {
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body.services-page #sv .lgt .tx {
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
  }

  body.services-page #sv .lgt .tx p {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
  }

  body.services-page #sv .lgt .bcc {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-top: 12px !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    text-align: center !important;
  }

  /* Full CTA rebuild inside scroller — match site mobile default-button */
  body.services-page .sidebar-scroller .default-button {
    position: relative !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    align-self: center !important;
    height: 40px !important;
    max-width: 100% !important;
    padding: 0 6px 0 18px !important;
    box-sizing: border-box !important;
    border-radius: 20px !important;
    overflow: hidden !important;
    background-color: transparent !important;
    letter-spacing: 1.5px !important;
    transform: none !important;
    -webkit-transform: none !important;
    margin-top: 0 !important;
    margin-left: auto !important;
    margin-right: auto !important;
    float: none !important;
  }

  body.services-page .sidebar-scroller .default-button .button-background {
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none;
  }

  body.services-page .sidebar-scroller .default-button .button-background .left,
  body.services-page .sidebar-scroller .default-button .button-background .right {
    position: absolute !important;
    left: auto !important;
    right: 6px !important;
    top: 50% !important;
    width: 28px !important;
    height: 28px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transform: translateY(-50%) !important;
    -webkit-transform: translateY(-50%) !important;
    z-index: 1 !important;
  }

  body.services-page .sidebar-scroller .default-button .button-background .center {
    position: absolute !important;
    left: 0 !important;
    top: 0 !important;
    width: 0 !important;
    height: 100% !important;
  }

  body.services-page .sidebar-scroller .default-button .button-background .left:before,
  body.services-page .sidebar-scroller .default-button .button-background .right:before {
    content: "" !important;
    position: static !important;
    display: block !important;
    width: 28px !important;
    height: 28px !important;
    border-radius: 50% !important;
    background-color: #e0effd !important;
    transform: scale(1) !important;
    -webkit-transform: scale(1) !important;
  }

  body.services-page .sidebar-scroller .default-button .text {
    position: relative !important;
    z-index: 3 !important;
    padding: 0 !important;
    font-size: 11px !important;
    line-height: 1 !important;
    letter-spacing: 1.5px !important;
    white-space: nowrap !important;
    opacity: 1 !important;
    transform: none !important;
    -webkit-transform: none !important;
  }

  /* Keep plus in flex flow (relative) — absolute would collapse the layout */
  body.services-page .sidebar-scroller .default-button .plus-icon {
    position: relative !important;
    flex: none !important;
    display: inline-block !important;
    width: 28px !important;
    height: 28px !important;
    margin: 0 0 0 10px !important;
    opacity: 1 !important;
    z-index: 2 !important;
  }

  body.services-page .sidebar-scroller .default-button .plus-icon:before,
  body.services-page .sidebar-scroller .default-button .plus-icon:after {
    content: "" !important;
    position: absolute !important;
    top: 50% !important;
    left: 50% !important;
    width: 9px !important;
    height: 1px !important;
    margin: -0.5px 0 0 -4.5px !important;
    background-color: #141414 !important;
  }

  body.services-page .sidebar-scroller .default-button .plus-icon:after {
    transform: rotate(90deg) !important;
    -webkit-transform: rotate(90deg) !important;
  }

  /* 4) Kill late scrubbed fade + auto-height slides up to 1200px */
  body.services-page #sv .lgt > div {
    opacity: 1 !important;
  }

  body.services-page #sv .lgt {
    height: auto !important;
    min-height: 0 !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 32px 28px !important;
    box-sizing: border-box !important;
    text-align: center !important;
  }

  body.services-page .market-research-section {
    padding: 40px 0 24px !important;
  }

  /* Why SandCup — shrink + center (mobile only) */
  body.services-page .black-theme-section {
    padding: 80px 0 56px !important;
  }

  body.services-page .black-theme-section .content-width {
    padding-left: 28px !important;
    padding-right: 28px !important;
    box-sizing: border-box !important;
  }

  body.services-page .black-theme-section .it-solution-block .service-title {
    font-size: 12px !important;
    line-height: 1.4 !important;
    letter-spacing: 2px !important;
    padding-bottom: 20px !important;
    text-align: center !important;
  }

  body.services-page .black-theme-section .it-solution-block ul {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    gap: 0 !important;
  }

  body.services-page .black-theme-section .it-solution-block ul li,
  body.services-page .black-theme-section .it-solution-block ul li span,
  body.services-page .black-theme-section .it-solution-block ul li p,
  body.services-page .black-theme-section .service-scroller-content {
    text-align: center !important;
  }

  body.services-page .black-theme-section .it-solution-block ul li {
    padding: 0 !important;
    margin: 0 0 88px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }

  body.services-page .black-theme-section .it-solution-block ul li:last-child {
    margin-bottom: 24px !important;
  }

  body.services-page .black-theme-section .service-scroller-content {
    width: 100% !important;
    max-width: 320px !important;
    margin: 0 auto !important;
    padding-bottom: 0 !important;
  }

  body.services-page .black-theme-section .service-scroller-img {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    min-height: 0 !important;
    margin: 0 auto 8px !important;
  }

  body.services-page .black-theme-section .it-solution-block ul li img {
    display: block !important;
    width: 56px !important;
    max-width: 56px !important;
    max-height: 56px !important;
    height: auto !important;
    margin: 0 auto !important;
    object-fit: contain !important;
    object-position: center center !important;
  }

  body.services-page .black-theme-section .it-solution-block ul li span {
    font-size: 14px !important;
    line-height: 22px !important;
    letter-spacing: 1.5px !important;
    margin-top: 12px !important;
    margin-bottom: 10px !important;
  }

  body.services-page .black-theme-section .it-solution-block ul li p {
    font-size: 14px !important;
    line-height: 22px !important;
    letter-spacing: 0.4px !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    padding-bottom: 0 !important;
  }

  /* Technologies heading — constrain overflow from marquee + side gutters */
  body.services-page .technology-we-use {
    overflow-x: hidden !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  body.services-page .technology-we-use .meet-our-valuable-partner,
  body.services-page .technology-we-use .content-width {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  body.services-page .look-what-industry .header-text,
  body.services-page .technology-we-use .header-text {
    padding-left: 28px !important;
    padding-right: 28px !important;
    box-sizing: border-box !important;
    text-align: center !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  body.services-page .look-what-industry .header-text h6,
  body.services-page .technology-we-use .header-text h6 {
    text-align: center !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    white-space: normal !important;
    overflow-wrap: break-word !important;
    word-break: normal !important;
    line-height: 1.35 !important;
  }

  body.services-page .technology-we-use .technology_scrollig_icon {
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
    min-height: 180px !important;
  }

  /* Industries heading — two lines on mobile (all service pages) */
  body.services-page .look-what-industry .header-text h6 br.svc-h6-br {
    display: inline;
  }

  body.services-page .look-what-industry .header-text h6 {
    line-height: 1.35 !important;
  }

  /* Dark overlay covers the image only — no bleed above from padding */
  .img_banner {
    position: relative !important;
    overflow: hidden;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    line-height: 0;
  }

  .img_banner > img {
    position: relative;
    z-index: 1;
    display: block;
    width: 100% !important;
    height: min(52vw, 280px) !important;
    min-height: 220px;
    object-fit: cover;
    object-position: center;
  }

  .img_banner > #expand1 {
    display: none !important;
  }

  .img_banner > .content-width {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: auto !important;
    /* Match overlay height to the image, not any padding/extra chrome */
    height: 100% !important;
    max-height: 100%;
    z-index: 3;
    max-width: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    pointer-events: none;
  }

  .img_banner .text_box {
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    /* Keep overlay copy inside the image edges */
    padding: 24px 28px !important;
    background: rgba(0, 0, 0, 0.55) !important;
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    box-sizing: border-box !important;
    line-height: normal;
    pointer-events: auto;
  }

  .img_banner .text_box p {
    text-align: center;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* Portfolio cards: clear type hierarchy on mobile
     title > description > service tags */
  .portfolio-list .our-thoughts-perspective .cards h3,
  .portfolio-list .porfolio_lising .cards h3 {
    font-size: 22px !important;
    line-height: 1.45 !important;
    font-weight: 600 !important;
    padding: 40px 8px 8px !important;
    margin: 0 !important;
    text-align: left !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    left: 0 !important;
    right: 0 !important;
    position: relative !important;
    transform: none !important;
    color: #141414 !important;
    -webkit-text-fill-color: #141414 !important;
    background: none !important;
  }

  .portfolio-list .our-thoughts-perspective .cards .card-body {
    padding: 0 8px !important;
    box-sizing: border-box;
  }

  .portfolio-list .our-thoughts-perspective .cards .card-body p {
    font-size: 15px !important;
    line-height: 1.65 !important;
    font-weight: 300 !important;
    letter-spacing: normal !important;
    color: #141414 !important;
    text-transform: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .portfolio-list .our-thoughts-perspective .cards .card-body h6,
  .portfolio-list .our-thoughts-perspective h6 {
    font-size: 11px !important;
    line-height: 1.75 !important;
    font-weight: 400 !important;
    letter-spacing: 0.4px !important;
    padding: 10px 0 0 !important;
    margin: 0 !important;
    text-align: left !important;
    opacity: 0.85;
  }

  .portfolio-list .our-thoughts-perspective .blog-img {
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
  }

  /* Constant gap after each case study — mobile only (kill desktop stagger) */
  .portfolio-list .porfolio_lising .custom-row .column-50,
  .portfolio-list .porfolio_lising .custom-row .column-50.pImage,
  .portfolio-list .porfolio_lising .custom-row .column-50.pContent {
    margin-top: 0 !important;
    margin-bottom: 64px !important;
  }

  .portfolio-list .porfolio_lising .custom-row .column-50:nth-child(2n+2) {
    margin-top: 0 !important;
  }

  .portfolio-list .porfolio_lising .custom-row .column-50:last-child {
    margin-bottom: 48px !important;
  }



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

  /* 0b. Site-wide mobile navbar (match homepage) + scroll hide/show     */

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

  .mobile-header {
    display: block !important;
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100000 !important;
    padding: 10px 16px !important;
    box-sizing: border-box;
    width: 100%;
    background-color: rgba(255, 255, 255, 0.96) !important;
    transform: translateY(0);
    transition: transform 0.28s ease;
    will-change: transform;
  }

  .mobile-header.is-hidden {
    transform: translateY(-100%);
    pointer-events: none;
  }

  .section1 .mobile-header .header-row,
  .mobile-header .header-row {
    padding-top: 10px;
    display: flex !important;
    flex-direction: row !important;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
  }

  .section1 .mobile-header .header-row .column-header,
  .mobile-header .header-row .column-header {
    max-width: none !important;
    flex: 1 1 auto !important;
    min-width: 0;
    width: auto !important;
  }

  .section1 .mobile-header .header-row .column-header .logo,
  .mobile-header .logo {
    width: auto !important;
    max-width: 120px !important;
    margin: 0 auto !important;
    transform: translateY(-2px);
  }

  .section1 .mobile-header .header-row .column-header .logo img,
  .mobile-header .logo img {
    width: auto !important;
    height: 30px !important;
    max-width: 100% !important;
    padding: 0 !important;
    display: block !important;
    margin: 0 auto !important;
  }

  .mobile-header #Layer_1,
  .mobile-header .fishleft svg {
    width: 22px !important;
    height: 22px !important;
  }

  .mobile-header .left_icon .menu-toggle i {
    font-size: 22px !important;
    line-height: 1;
  }

  .section1 .mobile-header .header-row .column-header:last-child {
    display: flex !important;
    justify-content: flex-end;
  }

  /* Offset page content for fixed mobile header */
  .section1.inner_page_section {
    padding-top: 52px !important;
  }

  body.home-page .section1 {
    padding-top: 52px;
  }



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

  /* 1. Hide Great Place to Work + social block in the mobile menu      */

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

  #overlay .menu-social-box {

    display: none !important;

  }



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

  /* Overlay layout                                                     */

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

  /*
   * Desktop animates overlay height 0%→100%. During that grow, the menu
   * (overflow:auto) is taller than the panel, so a scrollbar flashes briefly.
   * Mobile: snap height, fade only; hide menu scrollbars.
   */
  #overlay.overlay {
    transition: opacity 0.35s, visibility 0.35s !important;
    overflow: hidden !important;
  }

  #overlay.overlay.open {
    height: 100% !important;
  }

  /* Lock page scroll while menu is open (class set by mobile-nav.js) */
  body.mobile-menu-open {
    overflow: hidden !important;
  }

  #overlay.overlay.open,

  #overlay.overlay {

    display: flex;

    flex-direction: column;

  }



  #overlay .overlay-menu {

    position: relative !important;

    top: auto !important;

    left: auto !important;

    transform: none !important;

    flex: 1 1 auto;

    display: flex !important;

    flex-direction: column;

    justify-content: flex-start;

    width: 100%;

    max-width: 100%;

    height: 100%;

    padding: 72px 24px 48px;

    box-sizing: border-box;

    overflow-x: hidden;

    overflow-y: auto;

    -webkit-overflow-scrolling: touch;

    scrollbar-width: none;

    -ms-overflow-style: none;

  }

  #overlay .overlay-menu::-webkit-scrollbar {
    width: 0;
    height: 0;
    display: none;
  }



  #overlay .overlay-menu .menu-text-rotate {

    display: none;

  }



  #overlay .overlay-menu > ul.menu-root {

    max-width: 100% !important;

    width: 100%;

    margin: 0;

    padding: 0;

    flex: 0 0 auto;

  }



  #overlay .overlay-menu > ul.menu-root > li {

    max-width: 100% !important;

    flex: 100% !important;

    padding: 14px 0 !important;

  }



  #overlay .overlay-menu a {

    font-size: 25px !important;

    line-height: 1 !important;

  }



  #overlay .toggle-close {

    top: 20px !important;

    right: 16px !important;

    z-index: 5;

  }



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

  /* Hide Tawk chatbot while mobile menu overlay is open                */

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

  body.mobile-menu-open iframe[src*="tawk.to"],

  body.mobile-menu-open iframe[title*="chat"],

  body.mobile-menu-open div[id^="tawkchat"],

  body.mobile-menu-open div[class*="tawk-"],

  body.mobile-menu-open #tawkchat-container {

    display: none !important;

    visibility: hidden !important;

    opacity: 0 !important;

    pointer-events: none !important;

  }



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

  /* Two-layer Services menu                                            */

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



  /* Default: hide flyout submenu on mobile (no side panel) */

  #mainnav ul.submenu {

    position: static !important;

    left: auto !important;

    top: auto !important;

    max-width: 100% !important;

    opacity: 0;

    visibility: hidden;

    height: 0;

    overflow: hidden;

    margin: 0;

    padding: 0;

    pointer-events: none;

    /* Kill style.css submenu fade/slide (transition: all 0.3s) */
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -ms-transition: none !important;
    -o-transition: none !important;
    transition: none !important;
    -webkit-animation: none !important;
    animation: none !important;

  }

  /* Submenu links also carry transition: all 0.3s — snap on appear */
  #mainnav ul.submenu > li,
  #mainnav ul.submenu > li > a,
  #mainnav ul.submenu > li > a:after {
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -ms-transition: none !important;
    -o-transition: none !important;
    transition: none !important;
    -webkit-animation: none !important;
    animation: none !important;
  }



  /* Layer 2 open: replace root items with submenu list */

  #mainnav.services-layer-open > ul.menu-root > li {

    display: none !important;

  }



  #mainnav.services-layer-open > ul.menu-root > li.has-submenu {

    display: block !important;

    max-width: 100% !important;

    flex: 100% !important;

    padding: 0 !important;
    -webkit-transition: none !important;
    transition: none !important;

  }



  #mainnav.services-layer-open .has-submenu > .menu-link-services {

    display: none !important;

  }



  /* Subtle dissolve when Services sub-menu opens (mobile only) */
  @-webkit-keyframes mobile-services-dissolve {
    from { opacity: 0; }
    to { opacity: 1; }
  }

  @keyframes mobile-services-dissolve {
    from { opacity: 0; }
    to { opacity: 1; }
  }

  #mainnav.services-layer-open ul.submenu {

    opacity: 1 !important;

    visibility: visible !important;

    height: auto !important;

    overflow: visible !important;

    pointer-events: auto !important;

    display: block !important;

    -webkit-transition: none !important;
    transition: none !important;
    -webkit-animation: none !important;
    animation: none !important;

  }



  /*

   * Services title row: ← + Services (same size as main menu links)

   * Back text removed — arrow only, sits beside the title.

   */

  #mainnav.services-layer-open .submenu-services-heading {

    display: flex !important;

    align-items: center;

    gap: 10px;

    border-bottom: 1px solid rgba(255, 255, 255, 0.28);

    padding: 10px 0 14px !important;

    margin-bottom: 6px;

    max-width: 100% !important;

    flex: 100% !important;

  }



  #mainnav.services-layer-open .submenu-services-heading a {

    font-size: 22px !important;

    line-height: 1.25 !important;

    font-weight: inherit;

    text-transform: uppercase !important;

    letter-spacing: inherit;

  }



  #mainnav.services-layer-open .submenu-services-heading a.submenu-back {

    flex: 0 0 auto;

    color: #fff !important;

    opacity: 0.85;

    text-decoration: none;

  }



  #mainnav.services-layer-open .submenu-services-heading a.submenu-services-link {

    color: #fff !important;

    opacity: 1;

    flex: 0 1 auto;

  }



  #mainnav.services-layer-open ul.submenu > li {

    max-width: 100% !important;

    flex: 100% !important;

    padding: 13px 0;

    -webkit-animation: mobile-services-dissolve 0.4s ease both !important;
    animation: mobile-services-dissolve 0.4s ease both !important;

  }

  #mainnav.services-layer-open ul.submenu > li:nth-child(1) {
    -webkit-animation-delay: 0.02s !important;
    animation-delay: 0.02s !important;
  }

  #mainnav.services-layer-open ul.submenu > li:nth-child(2) {
    -webkit-animation-delay: 0.07s !important;
    animation-delay: 0.07s !important;
  }

  #mainnav.services-layer-open ul.submenu > li:nth-child(3) {
    -webkit-animation-delay: 0.12s !important;
    animation-delay: 0.12s !important;
  }

  #mainnav.services-layer-open ul.submenu > li:nth-child(4) {
    -webkit-animation-delay: 0.17s !important;
    animation-delay: 0.17s !important;
  }

  #mainnav.services-layer-open ul.submenu > li:nth-child(5) {
    -webkit-animation-delay: 0.22s !important;
    animation-delay: 0.22s !important;
  }



  #mainnav.services-layer-open ul.submenu > li:not(.submenu-services-heading) > a {

    font-size: 19px !important;

    line-height: 1.25 !important;

  }

  /* ------------------------------------------------------------------ */
  /* Site-wide mobile footer — match homepage black footer layout       */
  /* Desktop (≥1201px) unchanged. Colors still come from footer-css /   */
  /* section--bg theme rules.                                           */
  /* ------------------------------------------------------------------ */

  /* Logo + GPTW at the top of the footer only (not mixed with CTA) */
  body.footer-css .footer-mobile-brand {
    display: flex !important;
    width: 100%;
    box-sizing: border-box;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 28px 20px 12px;
    margin: 0;
  }

  body.footer-css .footer-mobile-brand > a {
    display: block;
    flex: 0 1 auto;
    margin-top: 14px;
  }

  body.footer-css .footer-mobile-brand > a img {
    max-width: 140px;
    height: auto;
    display: block;
  }

  /* Pull the badge up past the row's top padding so it meets the footer edge */
  body.footer-css .footer-mobile-gptw {
    flex: 0 0 auto;
    margin-top: -28px;
    align-self: flex-start;
  }

  body.footer-css .footer-mobile-gptw img {
    width: auto;
    max-width: 72px;
    height: auto;
    display: block;
  }

  /* Remarkable CTA — own section above footer (mobile only sizing) */
  .lets-make-thing {
    min-height: 0 !important;
    padding: 40px 20px 48px !important;
    margin: 0 !important;
    z-index: 1 !important;
    position: relative !important;
    display: block !important;
    align-items: stretch !important;
    overflow: visible !important;
  }

  .lets-make-thing .content-width {
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  .lets-make-thing h2 {
    font-size: clamp(22px, 6vw, 28px) !important;
    line-height: 1.25 !important;
    margin: 0 0 18px !important;
    padding: 0 8px;
    font-weight: 700;
  }

  .lets-make-thing a {
    font-size: 16px !important;
    line-height: 1.4 !important;
    display: inline-block !important;
    margin: 0 !important;
    padding-bottom: 2px;
  }

  /* Hide duplicate logo / GPTW from desktop markup on white footer pages */
  body.footer-css .site-footer:has(.footer-mobile-brand) > .greatplace-footer {
    display: none !important;
  }

  body.footer-css .site-footer:has(.footer-mobile-brand) .footer-desktop-logo {
    display: none !important;
  }

  body.footer-css .site-footer {
    padding: 0 0 12px !important;
    overflow: visible !important;
    position: relative !important;
    /* Above #particles-js (z-index 11) so India/Nigeria tabs receive taps */
    z-index: 22 !important;
  }

  body.footer-css .site-footer .content-width {
    padding-left: 20px !important;
    padding-right: 20px !important;
    box-sizing: border-box;
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 auto !important;
  }


  body.footer-css .site-footer .footer-menu {
    width: 100% !important;
  }

  body.footer-css .site-footer .footer-menu a img {
    max-width: 140px !important;
    height: auto !important;
    display: block !important;
  }

  body.footer-css .site-footer .custom-row.f-row,
  body.footer-css .site-footer .custom-row.gap_row {
    display: flex !important;
    flex-direction: column !important;
    flex-wrap: nowrap !important;
    gap: 12px !important;
    justify-content: flex-start !important;
  }

  body.footer-css .site-footer .custom-row .column-50,
  body.footer-css .site-footer .col_gap {
    max-width: 100% !important;
    flex: 0 0 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  /* Brand line under logo — do not use the old 70px GPTW clearance */
  body.footer-css .site-footer .footer-menu .column-50 > h3 {
    margin-top: 20px !important;
    margin-bottom: 0 !important;
    font-size: 20px !important;
    line-height: 1.35 !important;
  }

  /* Space between Remarkable CTA and footer tagline */
  body.footer-css .site-footer:has(.footer-mobile-brand) .footer-menu .column-50 > h3 {
    margin-top: 28px !important;
  }

  body.footer-css .site-footer .texttypo {
    margin: 10px 0 8px !important;
  }

  body.footer-css .site-footer .texttypo p {
    font-size: 20px !important;
    line-height: 1.3 !important;
  }

  /* Social icons: 2 rows × 4 */
  body.footer-css .site-footer .social-menu,
  body.footer-css .site-footer .social-menu.social_footer {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    justify-content: start !important;
    gap: 14px 18px !important;
    margin: 20px 0 0 !important;
    padding: 0 !important;
    max-width: 260px !important;
    flex-wrap: unset !important;
  }

  body.footer-css .site-footer .social-menu li {
    margin: 0 !important;
    padding: 0 !important;
  }

  body.footer-css .site-footer .social-menu li a {
    height: 24px !important;
    width: auto !important;
    font-size: 22px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
  }

  body.footer-css ul.social-menu.social_footer li a .twitter-x,
  body.footer-css ul.social-menu.social_footer li a .thread-ic {
    height: 16px !important;
    width: 14px !important;
  }

  /* White footer: X + Threads match other social icon weight on mobile */
  body.footer-css .site-footer ul.social-menu.social_footer li a .twitter-x,
  body.footer-css .site-footer ul.social-menu.social_footer li a .thread-ic {
    height: 20px !important;
    width: 18px !important;
  }

  /* Download deck — under socials (footer.php nav-tab + homepage <a>) */
  body.footer-css .site-footer .footer-menu > a,
  body.footer-css .site-footer .footer-deck-download,
  body.footer-css .site-footer .column-50 > .nav-tab {
    position: relative !important;
    display: block !important;
    margin-top: 20px !important;
    margin-bottom: 8px !important;
    top: auto !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    clear: both !important;
  }

  body.footer-css .site-footer .footer-menu > a {
    font-size: 16px !important;
    line-height: 1.4 !important;
    font-weight: 600 !important;
    text-decoration: none !important;
  }

  body.footer-css .site-footer .get-in-touch {
    margin: 0 0 6px !important;
    padding: 0 !important;
  }

  body.footer-css .site-footer .footer-menu .column-50 .get-in-touch h3,
  body.footer-css .site-footer .footer-menu .column-50 .location h3 {
    margin-top: 40px !important;
    margin-bottom: 2px !important;
    padding: 0 !important;
    font-size: 13px !important;
    line-height: 1.25 !important;
    letter-spacing: 2px !important;
    text-transform: uppercase;
  }

  body.footer-css .site-footer .get-in-touch a {
    display: block !important;
    font-size: 16px !important;
    line-height: 1.3 !important;
    margin: 0 0 2px !important;
    padding: 0 !important;
    word-break: break-word;
  }

  body.footer-css .site-footer .location .nav-tab {
    padding: 2px 0 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    position: relative !important;
    overflow: visible !important;
  }

  body.footer-css .site-footer .location .tabs li {
    margin: 0 12px 4px 0 !important;
    padding: 0 !important;
  }

  body.footer-css .site-footer .location .tabcontent {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    white-space: normal !important;
    position: relative !important;
  }

  /*
   * White footer location tabs: desktop #tabs is height:40px with an
   * absolutely positioned ul, so the address never expands the layout and
   * sits under/behind following content on mobile. Put everything in flow
   * and show only the active address.
   */
  body.footer-css .site-footer .location #tabs {
    position: relative !important;
    height: auto !important;
    min-height: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
  }

  body.footer-css .site-footer .location #tabs ul,
  body.footer-css .site-footer .location .tabs {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    bottom: auto !important;
    right: auto !important;
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-start !important;
    gap: 0 16px !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  body.footer-css .site-footer .location .tabs > li {
    display: contents;
  }

  body.footer-css .site-footer .location .tabs .tab {
    order: 1;
    cursor: pointer;
    position: relative;
    z-index: 2;
    -webkit-tap-highlight-color: transparent;
    padding: 4px 0;
    line-height: 1.4 !important;
  }

  body.footer-css .site-footer .location #tabs .tabcontent,
  body.footer-css .site-footer .location #tabs li .tabcontent,
  body.footer-css .site-footer .location #tabs li:hover .tabcontent,
  body.footer-css .site-footer .location #tabs li:focus .tabcontent,
  body.footer-css .site-footer .location #tabs li:active .tabcontent {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    position: static !important;
    height: 0 !important;
    width: 0 !important;
    max-width: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    left: auto !important;
    top: auto !important;
    z-index: auto !important;
  }

  body.footer-css .site-footer .location #tabs li.active .tabcontent,
  body.footer-css .site-footer .location #tabs li.active:hover .tabcontent,
  body.footer-css .site-footer .location #tabs li.active:focus .tabcontent,
  body.footer-css .site-footer .location #tabs li.active:active .tabcontent {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    position: static !important;
    height: auto !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    overflow-wrap: anywhere !important;
    word-wrap: break-word !important;
    word-break: break-word !important;
    white-space: normal !important;
    flex: 0 0 100% !important;
    order: 2;
    margin: 12px 0 0 !important;
    padding: 0 !important;
    left: auto !important;
    top: auto !important;
    z-index: 1 !important;
    color: #141414 !important;
  }

  body.footer-css .site-footer .location #tabs,
  body.footer-css .site-footer .location .tabs,
  body.footer-css .site-footer .location .nav-tab {
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }

  body.footer-css .site-footer .location #tabs .tabcontent p {
    margin: 0 !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    word-wrap: break-word !important;
    word-break: break-word !important;
    color: #141414 !important;
    opacity: 1 !important;
  }

  /* Room under the address before copyright */
  body.footer-css .site-footer .location .nav-tab {
    padding-bottom: 4px !important;
    min-height: 0 !important;
    height: auto !important;
  }

  body.footer-css .site-footer .copyright {
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 16px !important;
    margin-top: 12px !important;
    padding-top: 28px !important;
    padding-bottom: 0 !important;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
    position: relative !important;
  }

  /* Extra space above Terms & Conditions on white footer mobile */
  body.footer-css .site-footer .copyright {
    margin-top: 12px !important;
    padding-top: 28px !important;
  }

  body.footer-css .site-footer .copyright-text1,
  body.footer-css .site-footer .copyright-text {
    float: none !important;
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 12px !important;
    line-height: 20px !important;
    letter-spacing: 1px !important;
  }

  body.footer-css .site-footer .copyright-text1 {
    order: 1 !important;
    font-size: 0 !important; /* hide leftover "|" text nodes */
  }

  /* Keep padding after the reset above so Terms isn’t flush to the address */
  body.footer-css .site-footer .copyright-text1 {
    padding-top: 12px !important;
  }

  /* Desktop separator — never show between stacked Terms / Privacy on mobile */
  body.footer-css .site-footer .footer-legal-sep,
  body.home-page .site-footer .footer-legal-sep,
  .site-footer .footer-legal-sep {
    display: none !important;
  }

  body.footer-css .site-footer .copyright-text1 a {
    display: block !important;
    font-size: 12px !important;
    line-height: 1.3 !important;
    margin: 0 0 10px !important;
    padding: 0 !important;
    color: #000 !important;
  }

  body.footer-css .site-footer .copyright-text1 a:last-child {
    margin-bottom: 0 !important;
  }

  /* White footer: clear gap between Terms and Privacy on mobile */
  body.footer-css .site-footer .copyright-text1 a {
    margin: 0 0 14px !important;
    padding: 0 !important;
  }

  body.footer-css .site-footer .copyright-text1 a + a {
    margin-top: 4px !important;
  }

  body.footer-css .site-footer .copyright-text1 a:last-child {
    margin-bottom: 24px !important;
  }

  body.footer-css .site-footer .copyright-text {
    order: 2 !important;
  }

  body.footer-css .site-footer .sandcup-side-logo {
    order: 3 !important;
    position: static !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    top: auto !important;
    transform: none !important;
    margin: 8px 0 0 !important;
    padding: 0 !important;
    font-size: 12px !important;
    letter-spacing: 2px !important;
    line-height: 1.4 !important;
    width: 100% !important;
  }

  /* Homepage: Download link between socials and contact column */
  @media screen and (max-width: 767px) {
    body.home-page .site-footer .footer-menu {
      display: flex !important;
      flex-direction: column !important;
    }

    body.home-page .site-footer .footer-menu > .custom-row.f-row,
    body.home-page .site-footer .footer-menu > .custom-row.gap_row {
      display: contents !important;
    }

    body.home-page .site-footer .footer-menu > .custom-row > .column-50:first-child {
      order: 1;
    }

    body.home-page .site-footer .footer-menu > a {
      order: 2;
      margin-top: 36px !important;
      margin-bottom: 0 !important;
      text-align: left !important;
    }

    body.home-page .site-footer .footer-menu > .custom-row > .column-50.col_gap {
      order: 3;
    }

    body.home-page .site-footer .footer-menu > .media-custom {
      order: 4;
    }

    body.home-page .site-footer .footer-menu > .copyright {
      order: 5;
    }
  }

  @media screen and (min-width: 481px) {
    body.footer-css .site-footer .content-width {
      padding-left: 24px !important;
      padding-right: 24px !important;
    }

    body.footer-css .footer-mobile-brand {
      padding-left: 24px;
      padding-right: 24px;
    }
  }

  /* Tablet band inside mobile shell: 2-col like homepage */
  @media screen and (min-width: 768px) {
    body.footer-css .site-footer .content-width {
      padding-left: 32px !important;
      padding-right: 32px !important;
    }

    body.footer-css .footer-mobile-brand {
      padding-left: 32px;
      padding-right: 32px;
    }

    body.footer-css .site-footer .custom-row.f-row,
    body.footer-css .site-footer .custom-row.gap_row {
      flex-direction: row !important;
      flex-wrap: wrap !important;
    }

    body.footer-css .site-footer .custom-row .column-50 {
      flex: 0 0 48% !important;
      max-width: 48% !important;
    }
  }

  /* ------------------------------------------------------------------ */
  /* Blog listing cards — title over image (match homepage mobile)      */
  /* ------------------------------------------------------------------ */

  body.blog-listing .our-thoughts-perspective {
    padding-top: 40px !important;
    padding-bottom: 60px !important;
  }

  body.blog-listing .our-thoughts-perspective .content-width {
    padding-left: 20px !important;
    padding-right: 20px !important;
    box-sizing: border-box;
  }

  body.blog-listing .our-thoughts-perspective .custom-row {
    display: flex !important;
    flex-direction: column !important;
    gap: 48px !important;
    padding: 0 !important;
  }

  body.blog-listing .our-thoughts-perspective .custom-row .column-50,
  body.blog-listing .our-thoughts-perspective .custom-row .column-50.pContent,
  body.blog-listing .our-thoughts-perspective .custom-row .column-50.pImage {
    max-width: 100% !important;
    flex: 0 0 100% !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    transform: none !important;
  }

  body.blog-listing .our-thoughts-perspective .custom-row .column-50:nth-child(2n+2) {
    margin-top: 0 !important;
  }

  /* Significant space after each blog card on mobile */
  body.blog-listing .our-thoughts-perspective .column-50 > a {
    display: block !important;
    margin: 0 0 72px !important;
  }

  body.blog-listing .our-thoughts-perspective .column-50 > a:last-child {
    margin-bottom: 48px !important;
  }

  body.blog-listing .our-thoughts-perspective .cards {
    display: grid !important;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative !important;
    text-align: center;
  }

  /* Image + title share row 1 so the title sits inside the image bounds */
  body.blog-listing .our-thoughts-perspective .cards .blog-img {
    grid-column: 1;
    grid-row: 1;
    margin-top: 0 !important;
    min-height: 0 !important;
    padding-bottom: 0 !important;
    overflow: hidden;
    position: relative !important;
  }

  body.blog-listing .our-thoughts-perspective .cards .blog-img img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
  }

  body.blog-listing .our-thoughts-perspective .cards .blog-img::after {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.4);
    opacity: 1 !important;
    pointer-events: none;
    z-index: 1;
  }

  /*
   * The title is markup-wise a child of .blog-img, so it can't be a grid item
   * of .cards. Overlay it on the image instead, or it drops below the photo
   * with the dark ::after overlay behind it.
   */
  body.blog-listing .our-thoughts-perspective .cards .blog-img h3,
  body.blog-listing .our-thoughts-perspective .cards h3 {
    z-index: 2;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    transform: none !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    margin: 0 !important;
    padding: 40px 24px !important;
    box-sizing: border-box;
    width: auto !important;
    max-width: none !important;
    font-size: 19px !important;
    line-height: 28px !important;
    text-align: center !important;
    color: #fff !important;
    -webkit-text-fill-color: #fff !important;
    background: none !important;
    -webkit-background-clip: border-box !important;
    background-clip: border-box !important;
    overflow-wrap: anywhere;
    word-wrap: break-word;
    white-space: normal !important;
  }

  body.blog-listing .our-thoughts-perspective .cards h3 br {
    display: none;
  }

  /* Meta under image — centered on mobile blog listing only */
  body.blog-listing .our-thoughts-perspective .cards .card-body {
    grid-column: 1;
    grid-row: 2;
    padding: 12px 0 0 !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }

  body.blog-listing .our-thoughts-perspective .cards .card-body p,
  body.blog-listing .our-thoughts-perspective .cards .card-body p span,
  body.blog-listing .our-thoughts-perspective .cards .card-body h5 {
    text-align: center !important;
    margin-left: auto !important;
    margin-right: auto !important;
    width: 100%;
  }

  body.blog-listing .our-thoughts-perspective .cards .card-body p {
    padding-bottom: 0 !important;
    line-height: 1.4 !important;
  }

  body.blog-listing .our-thoughts-perspective .cards .card-body h5 {
    margin-top: 4px !important;
    line-height: 1.4 !important;
  }

}