/* Case Studies stack animation (Brand Identity parity) */
.case-study__desc,
.case-study__services {
  margin: 0;
}

html.bs-no-smooth-scroll,
body.bs-no-smooth-scroll {
  scroll-behavior: auto;
}

/* overflow-x: hidden computes overflow-y: auto and breaks position:sticky */
@media (min-width: 769px) {
  html.bs-no-smooth-scroll,
  html.bs-no-smooth-scroll body {
    overflow-x: clip;
    overflow-y: visible;
  }
  html.bs-no-smooth-scroll #page-shell,
  html.bs-no-smooth-scroll .page-shell {
    overflow-x: clip;
    overflow-y: visible;
  }
}

.case-studies-stack-active {
  --case-studies-full-height: 1191px;
  --case-studies-stack-runway: 0px;
  --case-studies-stack-gap: 146px;
}

.case-studies-stack-active .case-studies--stack {
  height: var(--case-studies-full-height);
  min-height: calc(3 * 397px);
  padding-bottom: 0;
  overflow: visible;
  overflow-anchor: none;
  transform: none;
  filter: none;
}

.case-studies-stack-active .case-studies--stack.case-studies--handoff {
  height: var(--case-studies-full-height);
  overflow: visible;
}

.case-studies-stack-active .case-studies--stack.case-studies--handoff .case-study-pin:nth-child(n + 2) {
  visibility: visible;
  pointer-events: auto;
}

.case-studies-stack-active .case-study-pin {
  position: sticky;
  top: 0;
  left: auto;
  width: 100%;
  height: 397px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  pointer-events: none;
}

.case-studies-stack-active .case-study-pin:nth-child(1) {
  z-index: 1;
}

.case-studies-stack-active .case-study-pin:nth-child(2) {
  z-index: 2;
}

.case-studies-stack-active .case-study-pin:nth-child(3) {
  z-index: 3;
}

.case-studies-stack-active .case-study-stack {
  position: relative;
  width: 100%;
  height: 397px;
  transform: translate3d(0, 0, 0);
  transform-origin: top center;
  will-change: transform;
  pointer-events: auto;
  backface-visibility: hidden;
}

.case-studies-stack-active .case-studies--stack .case-study {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 397px;
  overflow: hidden;
}

.case-studies-stack-active .case-studies--stack .case-study--tanishq,
.case-studies-stack-active .case-studies--stack .case-study--tata {
  top: 0;
}

.case-studies-stack-active .case-study__media-zoom {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  transform-origin: center center;
  will-change: transform;
}

.case-studies-stack-active .case-studies--stack .case-study__media {
  overflow: hidden;
}

.case-studies-stack-active .case-studies--stack .case-study__media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Mobile: flat stack on non–service-landing pages; service landings keep scroll stack */
@media (max-width: 768px) {
  .case-studies-stack-active:not(
      :is(
        .brand-strategy-page,
        .brand-identity-page,
        .creative-campaigns-page,
        .content-page,
        .design-page,
        .b2b-page,
        .d2c-page,
        .channels-page,
        .performance-marketing-page,
        .influencer-marketing-page,
        .personal-branding-page,
        .outreach-plan-page,
        .website-landing-page,
        .product-application-page
      )
    ) {
    --case-studies-full-height: auto;
    --case-studies-stack-runway: 0px;
  }

  .case-studies-stack-active:not(
      :is(
        .brand-strategy-page,
        .brand-identity-page,
        .creative-campaigns-page,
        .content-page,
        .design-page,
        .b2b-page,
        .d2c-page,
        .channels-page,
        .performance-marketing-page,
        .influencer-marketing-page,
        .personal-branding-page,
        .outreach-plan-page,
        .website-landing-page,
        .product-application-page
      )
    ) .case-studies--stack,
  .case-studies-stack-active:not(
      :is(
        .brand-strategy-page,
        .brand-identity-page,
        .creative-campaigns-page,
        .content-page,
        .design-page,
        .b2b-page,
        .d2c-page,
        .channels-page,
        .performance-marketing-page,
        .influencer-marketing-page,
        .personal-branding-page,
        .outreach-plan-page,
        .website-landing-page,
        .product-application-page
      )
    ) .case-studies--stack.case-studies--handoff {
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  .case-studies-stack-active:not(
      :is(
        .brand-strategy-page,
        .brand-identity-page,
        .creative-campaigns-page,
        .content-page,
        .design-page,
        .b2b-page,
        .d2c-page,
        .channels-page,
        .performance-marketing-page,
        .influencer-marketing-page,
        .personal-branding-page,
        .outreach-plan-page,
        .website-landing-page,
        .product-application-page
      )
    )
    .case-studies--stack.case-studies--handoff
    .case-study-pin:nth-child(n + 2) {
    visibility: visible !important;
    pointer-events: auto !important;
  }

  .case-studies-stack-active:not(
      :is(
        .brand-strategy-page,
        .brand-identity-page,
        .creative-campaigns-page,
        .content-page,
        .design-page,
        .b2b-page,
        .d2c-page,
        .channels-page,
        .performance-marketing-page,
        .influencer-marketing-page,
        .personal-branding-page,
        .outreach-plan-page,
        .website-landing-page,
        .product-application-page
      )
    ) .case-study-pin,
  .case-studies-stack-active:not(
      :is(
        .brand-strategy-page,
        .brand-identity-page,
        .creative-campaigns-page,
        .content-page,
        .design-page,
        .b2b-page,
        .d2c-page,
        .channels-page,
        .performance-marketing-page,
        .influencer-marketing-page,
        .personal-branding-page,
        .outreach-plan-page,
        .website-landing-page,
        .product-application-page
      )
    ) .case-study-pin:nth-child(1),
  .case-studies-stack-active:not(
      :is(
        .brand-strategy-page,
        .brand-identity-page,
        .creative-campaigns-page,
        .content-page,
        .design-page,
        .b2b-page,
        .d2c-page,
        .channels-page,
        .performance-marketing-page,
        .influencer-marketing-page,
        .personal-branding-page,
        .outreach-plan-page,
        .website-landing-page,
        .product-application-page
      )
    ) .case-study-pin:nth-child(2),
  .case-studies-stack-active:not(
      :is(
        .brand-strategy-page,
        .brand-identity-page,
        .creative-campaigns-page,
        .content-page,
        .design-page,
        .b2b-page,
        .d2c-page,
        .channels-page,
        .performance-marketing-page,
        .influencer-marketing-page,
        .personal-branding-page,
        .outreach-plan-page,
        .website-landing-page,
        .product-application-page
      )
    ) .case-study-pin:nth-child(3) {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    width: 100% !important;
    height: auto !important;
    transform: none !important;
    pointer-events: auto !important;
    will-change: auto !important;
  }

  .case-studies-stack-active:not(
      :is(
        .brand-strategy-page,
        .brand-identity-page,
        .creative-campaigns-page,
        .content-page,
        .design-page,
        .b2b-page,
        .d2c-page,
        .channels-page,
        .performance-marketing-page,
        .influencer-marketing-page,
        .personal-branding-page,
        .outreach-plan-page,
        .website-landing-page,
        .product-application-page
      )
    ) .case-study-stack {
    position: relative !important;
    height: auto !important;
    transform: none !important;
    will-change: auto !important;
  }

  .case-studies-stack-active:not(
      :is(
        .brand-strategy-page,
        .brand-identity-page,
        .creative-campaigns-page,
        .content-page,
        .design-page,
        .b2b-page,
        .d2c-page,
        .channels-page,
        .performance-marketing-page,
        .influencer-marketing-page,
        .personal-branding-page,
        .outreach-plan-page,
        .website-landing-page,
        .product-application-page
      )
    ) .case-studies--stack .case-study,
  .case-studies-stack-active:not(
      :is(
        .brand-strategy-page,
        .brand-identity-page,
        .creative-campaigns-page,
        .content-page,
        .design-page,
        .b2b-page,
        .d2c-page,
        .channels-page,
        .performance-marketing-page,
        .influencer-marketing-page,
        .personal-branding-page,
        .outreach-plan-page,
        .website-landing-page,
        .product-application-page
      )
    ) .case-studies--stack .case-study--tanishq,
  .case-studies-stack-active:not(
      :is(
        .brand-strategy-page,
        .brand-identity-page,
        .creative-campaigns-page,
        .content-page,
        .design-page,
        .b2b-page,
        .d2c-page,
        .channels-page,
        .performance-marketing-page,
        .influencer-marketing-page,
        .personal-branding-page,
        .outreach-plan-page,
        .website-landing-page,
        .product-application-page
      )
    ) .case-studies--stack .case-study--tata {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    height: auto !important;
    overflow: visible !important;
  }

  .case-studies-stack-active:not(
      :is(
        .brand-strategy-page,
        .brand-identity-page,
        .creative-campaigns-page,
        .content-page,
        .design-page,
        .b2b-page,
        .d2c-page,
        .channels-page,
        .performance-marketing-page,
        .influencer-marketing-page,
        .personal-branding-page,
        .outreach-plan-page,
        .website-landing-page,
        .product-application-page
      )
    ) .case-study__media-zoom {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    height: auto !important;
    transform: none !important;
    will-change: auto !important;
  }

  .case-studies-stack-active:not(
      :is(
        .brand-strategy-page,
        .brand-identity-page,
        .creative-campaigns-page,
        .content-page,
        .design-page,
        .b2b-page,
        .d2c-page,
        .channels-page,
        .performance-marketing-page,
        .influencer-marketing-page,
        .personal-branding-page,
        .outreach-plan-page,
        .website-landing-page,
        .product-application-page
      )
    ) .case-studies--stack .case-study__media img {
    position: relative !important;
    inset: auto !important;
    left: auto !important;
    top: auto !important;
    width: 100% !important;
    height: auto !important;
    object-fit: cover;
  }

  /* Service landing pages — scroll stack + zoom on mobile */
  :is(
      .brand-strategy-page,
      .brand-identity-page,
      .creative-campaigns-page,
      .content-page,
      .design-page,
      .b2b-page,
      .d2c-page,
      .channels-page,
      .performance-marketing-page,
      .influencer-marketing-page,
      .personal-branding-page,
      .outreach-plan-page,
      .website-landing-page,
      .product-application-page
    ).case-studies-stack-active
    .case-studies--stack {
    position: relative !important;
    top: auto !important;
    height: calc(
      var(--bs-mobile-case-card-height, 400px) + var(--case-studies-stack-runway, 0px)
    ) !important;
    min-height: 0 !important;
    overflow: visible !important;
    padding: 24px var(--tvl-gutter, 20px) 40px !important;
    box-sizing: border-box;
  }

  :is(
      .brand-strategy-page,
      .brand-identity-page,
      .creative-campaigns-page,
      .content-page,
      .design-page,
      .b2b-page,
      .d2c-page,
      .channels-page,
      .performance-marketing-page,
      .influencer-marketing-page,
      .personal-branding-page,
      .outreach-plan-page,
      .website-landing-page,
      .product-application-page
    ).case-studies-stack-active
    .case-study-pin {
    position: absolute !important;
    left: 0 !important;
    width: 100% !important;
    height: var(--bs-mobile-case-card-height, auto) !important;
    pointer-events: none;
    will-change: transform;
  }

  :is(
      .brand-strategy-page,
      .brand-identity-page,
      .creative-campaigns-page,
      .content-page,
      .design-page,
      .b2b-page,
      .d2c-page,
      .channels-page,
      .performance-marketing-page,
      .influencer-marketing-page,
      .personal-branding-page,
      .outreach-plan-page,
      .website-landing-page,
      .product-application-page
    ).case-studies-stack-active
    .case-study-pin:nth-child(1) {
    top: 0;
    z-index: 1;
  }

  :is(
      .brand-strategy-page,
      .brand-identity-page,
      .creative-campaigns-page,
      .content-page,
      .design-page,
      .b2b-page,
      .d2c-page,
      .channels-page,
      .performance-marketing-page,
      .influencer-marketing-page,
      .personal-branding-page,
      .outreach-plan-page,
      .website-landing-page,
      .product-application-page
    ).case-studies-stack-active
    .case-study-pin:nth-child(2) {
    top: var(--bs-mobile-case-card-height, 400px);
    z-index: 2;
  }

  :is(
      .brand-strategy-page,
      .brand-identity-page,
      .creative-campaigns-page,
      .content-page,
      .design-page,
      .b2b-page,
      .d2c-page,
      .channels-page,
      .performance-marketing-page,
      .influencer-marketing-page,
      .personal-branding-page,
      .outreach-plan-page,
      .website-landing-page,
      .product-application-page
    ).case-studies-stack-active
    .case-study-pin:nth-child(3) {
    top: calc(var(--bs-mobile-case-card-height, 400px) * 2);
    z-index: 3;
  }

  :is(
      .brand-strategy-page,
      .brand-identity-page,
      .creative-campaigns-page,
      .content-page,
      .design-page,
      .b2b-page,
      .d2c-page,
      .channels-page,
      .performance-marketing-page,
      .influencer-marketing-page,
      .personal-branding-page,
      .outreach-plan-page,
      .website-landing-page,
      .product-application-page
    ).case-studies-stack-active
    .case-study-stack {
    position: relative !important;
    width: 100%;
    height: 100% !important;
    transform-origin: top center;
    will-change: transform;
    pointer-events: auto;
    backface-visibility: hidden;
  }

  :is(
      .brand-strategy-page,
      .brand-identity-page,
      .creative-campaigns-page,
      .content-page,
      .design-page,
      .b2b-page,
      .d2c-page,
      .channels-page,
      .performance-marketing-page,
      .influencer-marketing-page,
      .personal-branding-page,
      .outreach-plan-page,
      .website-landing-page,
      .product-application-page
    ).case-studies-stack-active
    .case-study__media-zoom {
    will-change: transform;
  }
}