/*
 * Shared Pillar V2 presentation.
 *
 * This layer translates the New Pillars prototype into the ACF-driven
 * Digital / Intelligent / Resilient section system. Everything is scoped to
 * the pillar body class so the existing components remain unchanged elsewhere.
 */

body.zaintech-pillar-v2 {
  --ztp-ink: #201547;
  --ztp-sapphire: #281f51;
  --ztp-blue: #344c98;
  --ztp-sky: #6fc7ea;
  --ztp-lime: #c3d534;
  --ztp-night: #06102f;
  --ztp-mist: #e9eefe;
  --ztp-line: rgba(32, 21, 71, 0.12);
  background: #fff;
  color: var(--ztp-ink);
}


/* The site-wide heading animation wraps every letter in a span. Give those
 * spans an explicit fill so they stay visible inside gradient headings. */
body.zaintech-pillar-v2 .section-title .sh-char {
  color: var(--ztp-blue);
  -webkit-text-fill-color: var(--ztp-blue);
}

body.zaintech-pillar-v2 .section-title.white .sh-char {
  color: var(--ztp-sky);
  -webkit-text-fill-color: var(--ztp-sky);
}

body.zaintech-pillar-v2 .ztp-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  border-radius: 4px;
  background: var(--ztp-lime);
  color: #151128;
  font-size: 0.8rem;
  line-height: 1;
}

/* Hero */
body.zaintech-pillar-v2 .ztp-hero {
  position: relative;
  display: flex;
  min-height: min(860px, 88vh);
  align-items: center;
  overflow: hidden;
  isolation: isolate;
  background: #05050f;
}

body.zaintech-pillar-v2 .ztp-hero__media {
  position: absolute;
  inset: 0;
  z-index: -1;
}

body.zaintech-pillar-v2 .ztp-hero__background {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  animation: ztpHeroReveal 1.1s ease-out both;
}

body.zaintech-pillar-v2 .ztp-hero__overlay {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 80% 32%, rgba(195, 213, 52, 0.15), transparent 32%),
    linear-gradient(90deg, rgba(5, 5, 15, 0.94) 0%, rgba(5, 5, 15, 0.68) 45%, rgba(5, 5, 15, 0.18) 78%),
    linear-gradient(0deg, rgba(5, 5, 15, 0.65) 0%, transparent 48%);
}

body.zaintech-pillar-v2 .ztp-hero__content {
  padding-top: clamp(120px, 14vw, 180px);
  padding-bottom: clamp(110px, 13vw, 170px);
}

body.zaintech-pillar-v2 .ztp-hero__title {
  max-width: 740px;
  margin: 0 0 20px;
  color: #fff;
  font-size: clamp(3.1rem, 7vw, 6.7rem);
  font-weight: 300;
  letter-spacing: -0.045em;
  line-height: 0.92;
  text-wrap: balance;
  animation: ztpHeroCopy 0.7s 0.16s ease-out both;
}

body.zaintech-pillar-v2 .ztp-hero__description {
  width: 100%;
  max-width: 590px;
  margin: 0 0 34px;
  color: rgba(255, 255, 255, 0.82);
  font-size: clamp(1rem, 1.45vw, 1.18rem);
  line-height: 1.65;
  animation: ztpHeroCopy 0.7s 0.24s ease-out both;
}

body.zaintech-pillar-v2 .ztp-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  animation: ztpHeroCopy 0.7s 0.32s ease-out both;
}

body.zaintech-pillar-v2 .ztp-hero__button {
  display: inline-flex;
  min-height: 52px;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 13px 16px 13px 22px;
  border: 1px solid transparent;
  border-radius: 5px;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  line-height: 1;
  text-decoration: none;
  text-transform: uppercase;
  max-width: 100%;
  transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

body.zaintech-pillar-v2 .ztp-hero__button:hover {
  transform: translateY(-2px);
}

body.zaintech-pillar-v2 .ztp-hero__button--solid {
  background: #fff;
  color: #151128;
}

body.zaintech-pillar-v2 .ztp-hero__button--solid:hover {
  background: var(--ztp-lime);
}

body.zaintech-pillar-v2 .ztp-hero__button--outline {
  border-color: rgba(255, 255, 255, 0.45);
  color: #fff;
}

body.zaintech-pillar-v2 .ztp-hero__button--outline:hover {
  border-color: #fff;
  background: rgba(255, 255, 255, 0.1);
}

body.zaintech-pillar-v2 .ztp-hero__button--outline .ztp-arrow {
  border: 1px solid rgba(255, 255, 255, 0.6);
  background: transparent;
  color: #fff;
}

body.zaintech-pillar-v2 .ztp-hero__scroll {
  position: absolute;
  bottom: clamp(22px, 4vh, 44px);
  left: 50%;
  display: flex;
  align-items: center;
  flex-direction: column;
  gap: 8px;
  transform: translateX(-50%);
  color: rgba(255, 255, 255, 0.65);
  font-size: 0.66rem;
  font-weight: 400;
  letter-spacing: 0.24em;
  text-decoration: none;
  text-transform: uppercase;
}

body.zaintech-pillar-v2 .ztp-hero__scroll svg {
  animation: ztpHeroBob 1.8s ease-in-out infinite;
}

@keyframes ztpHeroReveal {
  from { opacity: 0; transform: scale(1.035); }
  to { opacity: 1; transform: scale(1); }
}

@keyframes ztpHeroCopy {
  from { opacity: 0; transform: translateY(18px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes ztpHeroBob {
  0%, 100% { opacity: 0.55; transform: translateY(0); }
  50% { opacity: 1; transform: translateY(6px); }
}

/* Intro and challenges */
body.zaintech-pillar-v2 .ztp-intro {
  position: relative;
  z-index: 2;
  margin-top: -30px;
  border-radius: var(--border-section) var(--border-section) 0 0;
  background: #fff;
}

body.zaintech-pillar-v2 .ztp-section-heading--center {
  display: flex;
  max-width: 920px;
  align-items: center;
  flex-direction: column;
  margin: 0 auto 54px;
  text-align: center;
}

body.zaintech-pillar-v2 .ztp-section-heading--center .section-title {
  margin-inline: auto;
}

body.zaintech-pillar-v2 .bc-body {
  width: 100%;
  max-width: 830px;
  margin: 22px auto 0;
  color: rgba(32, 21, 71, 0.7);
  font-size: clamp(1rem, 1.4vw, 1.12rem);
  line-height: 1.75;
  overflow-wrap: break-word;
}

body.zaintech-pillar-v2 .ztp-challenge-card {
  overflow: hidden;
  border: 1px solid rgba(52, 76, 152, 0.14);
  border-radius: 18px;
  background:
    radial-gradient(circle at 94% 20%, rgba(111, 199, 234, 0.23), transparent 26%),
    linear-gradient(135deg, #f6f8ff, #e9eefe);
  box-shadow: 0 24px 70px rgba(40, 31, 81, 0.08);
}

body.zaintech-pillar-v2 .ztp-challenge-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 26px 30px;
  border-bottom: 1px solid rgba(52, 76, 152, 0.13);
}

body.zaintech-pillar-v2 .ztp-challenge-card__head h3 {
  margin: 0;
  color: var(--ztp-ink);
  font-size: 1.45rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  text-transform: uppercase;
}

body.zaintech-pillar-v2 .ztp-challenge-card__head span {
  color: rgba(32, 21, 71, 0.55);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

body.zaintech-pillar-v2 .chg-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0;
  padding: 12px 30px 26px;
}

body.zaintech-pillar-v2 .chg-card {
  display: flex;
  min-height: 76px;
  align-items: center;
  gap: 15px;
  padding: 18px 16px;
  border-bottom: 1px solid rgba(52, 76, 152, 0.12);
  background: transparent;
}

body.zaintech-pillar-v2 .chg-card:nth-last-child(-n + 2) {
  border-bottom: 0;
}

body.zaintech-pillar-v2 .chg-icon {
  display: inline-flex;
  flex: 0 0 34px;
  width: 34px;
  height: 34px;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--ztp-lime);
  color: var(--ztp-ink);
}

body.zaintech-pillar-v2 .chg-icon img {
  width: 18px;
  height: 18px;
  object-fit: contain;
}

body.zaintech-pillar-v2 .chg-label {
  color: var(--ztp-ink);
  font-size: 18px;
  font-weight: 600;
  line-height: 1.4;
}

/* Streamline */
body.zaintech-pillar-v2 .ztp-streamline {
  background: #fff;
}

body.zaintech-pillar-v2 .ztp-streamline .s5-layout {
  display: grid;
  grid-template-columns: minmax(260px, 0.8fr) minmax(0, 1.2fr);
  gap: clamp(44px, 7vw, 100px);
  align-items: start;
}

body.zaintech-pillar-v2 .ztp-streamline .s5-body {
  margin: 0;
  color: rgba(32, 21, 71, 0.68);
  font-size: 18px;
  line-height: 1.7;
}

body.zaintech-pillar-v2 .ztp-streamline .s5-boxes {
  display: flex;
  flex-direction: column;
  gap: 0;
  border-top: 1px solid var(--ztp-line);
}

body.zaintech-pillar-v2 .ztp-streamline .s5-box {
  display: grid;
  grid-template-columns: 54px 1fr;
  gap: 20px;
  align-items: center;
  padding: 25px 8px;
  border: 0;
  border-bottom: 1px solid var(--ztp-line);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.zaintech-pillar-v2 .ztp-streamline .s5-box:hover {
  transform: none;
}

body.zaintech-pillar-v2 .ztp-streamline .s5-box__icon {
  width: 42px;
  height: 42px;
  object-fit: contain;
}

body.zaintech-pillar-v2 .ztp-streamline .s5-box__text {
  margin: 0;
  color: var(--ztp-ink);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.45;
}

/* Capabilities */
body.zaintech-pillar-v2 .ztp-capabilities {
  overflow: hidden;
  background:
    radial-gradient(circle at 88% 12%, rgba(52, 76, 152, 0.58), transparent 42%),
    linear-gradient(150deg, #070716 0%, #0d1442 48%, #14245e 100%);
}

body.zaintech-pillar-v2 .ztp-capabilities .cdp-header {
  margin-bottom: 30px;
}

body.zaintech-pillar-v2 .ztp-capabilities .cdp-tabs {
  display: flex;
  gap: 28px;
  overflow-x: auto;
  margin: 0 0 34px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.13);
  scrollbar-width: none;
}

body.zaintech-pillar-v2 .ztp-capabilities .cdp-tabs::-webkit-scrollbar {
  display: none;
}

body.zaintech-pillar-v2 .ztp-capabilities .cdp-tab {
  flex: 0 0 auto;
  padding: 10px 0 15px;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: rgba(255, 255, 255, 0.48);
  font-size: 0.8rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

body.zaintech-pillar-v2 .ztp-capabilities .cdp-tab:hover {
  color: rgba(255, 255, 255, 0.85);
}

body.zaintech-pillar-v2 .ztp-capabilities .cdp-tab--active {
  border-color: var(--ztp-lime);
  color: #fff;
}

body.zaintech-pillar-v2 .ztp-capabilities .cdp-panel {
  display: none;
}

body.zaintech-pillar-v2 .ztp-capabilities .cdp-panel--active {
  display: block;
}

body.zaintech-pillar-v2 .cdp-panel__layout {
  display: grid;
  grid-template-columns: minmax(300px, 0.9fr) minmax(400px, 1.1fr);
  gap: clamp(30px, 5vw, 68px);
}

body.zaintech-pillar-v2 .cdp-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-content: start;
}

body.zaintech-pillar-v2 .cdp-list__item {
  display: flex;
  min-height: 72px;
  align-items: baseline;
  gap: 13px;
  padding: 18px 8px 18px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}

body.zaintech-pillar-v2 .cdp-list__number {
  flex: 0 0 auto;
  color: var(--ztp-lime);
  font-size: 0.72rem;
  font-weight: 800;
}

body.zaintech-pillar-v2 .cdp-list__label {
  margin: 0;
  color: rgba(255, 255, 255, 0.86);
  font-size: 18px;
  font-weight: 400;
  line-height: 1.4;
}

body.zaintech-pillar-v2 .cdp-media {
  position: relative;
  min-height: 390px;
  overflow: hidden;
  border-radius: 14px;
  background: var(--ztp-sapphire);
}

body.zaintech-pillar-v2 .cdp-media > img {
  width: 100%;
  height: 100%;
  min-height: 390px;
  object-fit: cover;
}

body.zaintech-pillar-v2 .cdp-media::after {
  position: absolute;
  inset: 0;
  background: linear-gradient(0deg, rgba(5, 5, 15, 0.74), transparent 65%);
  content: "";
}

body.zaintech-pillar-v2 .cdp-media__card {
  position: absolute;
  right: 20px;
  bottom: 20px;
  left: 20px;
  z-index: 1;
  max-width: 560px;
  padding: 22px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 11px;
  background: rgba(8, 8, 22, 0.62);
  backdrop-filter: blur(12px);
}

body.zaintech-pillar-v2 .cdp-acc__desc {
  margin: 0 0 16px;
  color: rgba(255, 255, 255, 0.82);
  font-size: 0.93rem;
  line-height: 1.6;
}

body.zaintech-pillar-v2 .cdp-panel-btn {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #fff;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-decoration: none;
  text-transform: uppercase;
}

/* Impact */
body.zaintech-pillar-v2 .ztp-impact {
  background: var(--ztp-sapphire);
}

body.zaintech-pillar-v2 .ztp-impact .oi-header {
  margin-bottom: 42px;
}

body.zaintech-pillar-v2 .ztp-impact .oi-layout {
  display: grid;
  grid-template-columns: minmax(340px, 0.8fr) minmax(440px, 1.2fr);
  gap: clamp(38px, 6vw, 86px);
  align-items: center;
}

body.zaintech-pillar-v2 .ztp-impact .oi-chart-col {
  padding: 20px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 18px;
  background: rgba(6, 16, 47, 0.52);
}

body.zaintech-pillar-v2 .ztp-impact .oi-radar {
  width: 100%;
  max-width: 520px;
}

body.zaintech-pillar-v2 .ztp-impact .oi-tabs {
  display: flex;
  gap: 20px;
  overflow-x: auto;
  margin-bottom: 12px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.13);
}

body.zaintech-pillar-v2 .ztp-impact .oi-tab {
  flex: 0 0 auto;
  padding: 12px 0 14px;
  border: 0;
  border-bottom: 2px solid transparent;
  background: none;
  color: rgba(255, 255, 255, 0.5);
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

body.zaintech-pillar-v2 .ztp-impact .oi-tab--active {
  border-color: var(--ztp-lime);
  color: #fff;
}

body.zaintech-pillar-v2 .ztp-impact .oi-row {
  border-bottom: 1px solid rgba(255, 255, 255, 0.13);
}

body.zaintech-pillar-v2 .ztp-impact .oi-row__hd {
  padding: 22px 0;
  color: #fff;
}

body.zaintech-pillar-v2 .ztp-impact .oi-row__problem {
  font-size: 18px;
  font-weight: 600;
}

body.zaintech-pillar-v2 .ztp-impact .oi-row__icon {
  border-color: rgba(255, 255, 255, 0.3);
}

body.zaintech-pillar-v2 .ztp-impact .oi-card {
  border-radius: 10px;
  background: rgba(6, 16, 47, 0.8);
}

/* Outcomes slider */
body.zaintech-pillar-v2 .ztp-outcomes {
  overflow: hidden;
  background: var(--ztp-sapphire);
}

body.zaintech-pillar-v2 .ztp-outcomes .dgo-header {
  margin-bottom: 40px;
}

body.zaintech-pillar-v2 .ztp-outcomes .dgo-slider {
  overflow: visible;
  padding-inline: max(20px, calc((100vw - 1280px) / 2));
}

body.zaintech-pillar-v2 .ztp-outcomes .dgo-slider .swiper-wrapper {
  align-items: stretch;
}

body.zaintech-pillar-v2 .ztp-outcomes .dgo-card {
  display: flex;
  min-height: 345px;
  height: auto;
  flex-direction: column;
  gap: 28px;
  padding: 26px;
  border: 1px solid rgba(255, 255, 255, 0.09);
  border-radius: 11px;
  background: var(--ztp-night);
}

body.zaintech-pillar-v2 .ztp-outcomes .dgo-card:hover {
  transform: translateY(-5px);
  border-color: rgba(195, 213, 52, 0.35);
}

body.zaintech-pillar-v2 .ztp-outcomes .dgo-card__icon {
  display: flex;
  width: 82px;
  height: 82px;
  align-items: center;
  justify-content: center;
  margin: 8px auto;
  border-radius: 50%;
  background: rgba(195, 213, 52, 0.08);
}

body.zaintech-pillar-v2 .ztp-outcomes .dgo-card__icon img,
body.zaintech-pillar-v2 .ztp-outcomes .dgo-card__icon svg {
  width: 58px;
  height: 58px;
  object-fit: contain;
}

body.zaintech-pillar-v2 .ztp-outcomes .dgo-card__title {
  margin: 0;
  padding-bottom: 17px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.14);
  color: #fff;
  font-size: 18px;
  font-weight: 800;
  line-height: 1.25;
  text-transform: uppercase;
}

body.zaintech-pillar-v2 .ztp-outcomes .dgo-card__body {
  margin: auto 0 0;
  color: rgba(255, 255, 255, 0.66);
  font-size: 18px;
  line-height: 1.55;
}

body.zaintech-pillar-v2 .dgo-nav {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 34px;
  padding-top: 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.13);
}

body.zaintech-pillar-v2 .dgo-nav__button {
  display: inline-flex;
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 6px;
  background: transparent;
  color: #fff;
  cursor: pointer;
}

body.zaintech-pillar-v2 .dgo-nav__button:hover {
  border-color: var(--ztp-lime);
  background: var(--ztp-lime);
  color: var(--ztp-ink);
}

body.zaintech-pillar-v2 .dgo-nav__button.swiper-button-disabled {
  opacity: 0.35;
}

body.zaintech-pillar-v2 .dgo-pagination {
  position: relative;
  flex: 1 1 auto;
  width: auto;
  max-width: 260px;
  height: 2px;
  margin: 0 0 0 8px;
  overflow: hidden;
  border-radius: 2px;
  background: rgba(255, 255, 255, 0.17);
}

body.zaintech-pillar-v2 .dgo-pagination .swiper-pagination-progressbar-fill {
  background: var(--ztp-lime);
}

/* Industry use cases */
body.zaintech-pillar-v2 .ztp-use-cases {
  position: relative;
  z-index: 1;
  margin-top: -28px;
  border-radius: var(--border-section) var(--border-section) 0 0;
  background: var(--ztp-mist);
  padding-bottom: calc( var(--padding-section) + 25px);
}

body.zaintech-pillar-v2 .ztp-use-cases .iuc-header {
  margin-bottom: 50px;
}

body.zaintech-pillar-v2 .ztp-use-cases .iuc-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
}

body.zaintech-pillar-v2 .ztp-use-cases .iuc-card {
  position: relative;
  min-height: 520px;
  overflow: hidden;
  border-radius: 0;
  isolation: isolate;
}

body.zaintech-pillar-v2 .ztp-use-cases .iuc-card__bg {
  position: absolute;
  inset: 0;
  background-position: center;
  background-size: cover;
  transition: transform 0.55s ease;
}

body.zaintech-pillar-v2 .ztp-use-cases .iuc-card__blue {
  position: absolute;
  inset: 0;
  background: var(--ztp-blue);
  opacity: 0;
  transition: opacity 0.45s ease;
}

body.zaintech-pillar-v2 .ztp-use-cases .iuc-card__content {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: flex;
  height: auto;
  justify-content: space-between;
  flex-direction: column;
  padding: 30px 28px;
  background: transparent;
}

body.zaintech-pillar-v2 .ztp-use-cases .iuc-card__title {
  margin: 0;
  color: #fff;
  font-size: clamp(1.25rem, 2vw, 1.65rem);
  font-weight: 900;
  line-height: 1.18;
  text-transform: uppercase;
}

body.zaintech-pillar-v2 .ztp-use-cases .iuc-card__title.primary-color-darker {
  color: #201547;
}

body.zaintech-pillar-v2 .ztp-use-cases .iuc-card__desc {
  max-height: 0;
  margin: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 8px;
  background: rgba(5, 5, 15, 0.42);
  color: rgba(255, 255, 255, 0.84);
  opacity: 0;
  font-size: 18px;
  line-height: 1.6;
  transform: translateY(14px);
  transition: max-height 0.45s ease, margin 0.35s ease, padding 0.35s ease, opacity 0.35s ease, transform 0.35s ease;
}

body.zaintech-pillar-v2 .ztp-use-cases .iuc-card:hover .iuc-card__bg {
  transform: scale(1.05);
}

body.zaintech-pillar-v2 .ztp-use-cases .iuc-card:hover .iuc-card__blue {
  opacity: 0;
}

body.zaintech-pillar-v2 .ztp-use-cases .iuc-card:hover .iuc-card__desc {
  max-height: 320px;
  margin-top: 18px;
  padding: 18px;
  opacity: 1;
  transform: translateY(0);
}

/* Detailed use cases */
body.zaintech-pillar-v2 .ztp-use-case-details {
  background: #fff;
}

body.zaintech-pillar-v2 .ztp-use-case-details .ucd-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 0.7fr);
  gap: 42px;
  align-items: end;
  margin-bottom: 48px;
}

body.zaintech-pillar-v2 .ztp-use-case-details .ucd-intro {
  margin: 0;
  color: rgba(32, 21, 71, 0.68);
  line-height: 1.7;
}

body.zaintech-pillar-v2 .ztp-use-case-details .ucd-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
}

body.zaintech-pillar-v2 .ztp-use-case-details .ucd-card {
  padding: 28px;
  border: 1px solid var(--ztp-line);
  border-radius: 14px;
  background: #f7f8fd;
  box-shadow: none;
}

body.zaintech-pillar-v2 .ztp-use-case-details .ucd-card__title {
  color: var(--ztp-ink);
}

body.zaintech-pillar-v2 .ztp-use-case-details .ucd-tab--active {
  border-color: var(--ztp-blue);
  color: var(--ztp-blue);
}

/* Why ZainTECH */
body.zaintech-pillar-v2 .ztp-why {
  background: #fff;
}

body.zaintech-pillar-v2 .ztp-why > .container {
  display: grid;
  grid-template-columns: minmax(280px, 0.8fr) minmax(440px, 1.2fr);
  gap: clamp(46px, 7vw, 100px);
}

body.zaintech-pillar-v2 .ztp-why .wzd-header {
  position: sticky;
  top: 120px;
  align-self: start;
}

body.zaintech-pillar-v2 .ztp-why .wzd-desc {
  max-width: 580px;
  margin: 24px 0 0;
  color: rgba(32, 21, 71, 0.67);
  font-size: 18px;
  line-height: 1.65;
}

body.zaintech-pillar-v2 .ztp-why .wzd-layout {
  display: flex;
  flex-direction: column;
  gap: 0;
  border-top: 1px solid var(--ztp-line);
}

body.zaintech-pillar-v2 .ztp-why .wzd-card {
  display: grid;
  grid-template-columns: minmax(180px, 0.62fr) minmax(240px, 1fr);
  gap: 28px;
  align-items: start;
  padding: 25px 0;
  border: 0;
  border-bottom: 1px solid var(--ztp-line);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

body.zaintech-pillar-v2 .ztp-why .wzd-card__heading {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

body.zaintech-pillar-v2 .ztp-why .wzd-card__icon {
  flex: 0 0 30px;
  width: 30px;
  height: 30px;
  margin: 0;
  border: 0;
  background: transparent;
}

body.zaintech-pillar-v2 .ztp-why .wzd-card__icon img {
  width: 28px;
  height: 28px;
  object-fit: contain;
}

body.zaintech-pillar-v2 .ztp-why .wzd-card__title {
  margin: 2px 0 0;
  color: var(--ztp-ink);
  font-size: 18px;
  font-weight: 800;
  line-height: 1.35;
  text-transform: uppercase;
}

body.zaintech-pillar-v2 .ztp-why .wzd-card__body {
  margin: 0;
  color: rgba(32, 21, 71, 0.67);
  font-size: 18px;
  line-height: 1.6;
}

/* Related solutions */
body.zaintech-pillar-v2 .ztp-related {
  overflow: hidden;
  background: var(--ztp-mist);
}

body.zaintech-pillar-v2 .ztp-related .rs-top {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 28px;
  margin-bottom: 38px;
}

body.zaintech-pillar-v2 .ztp-related .rs-top > .btn {
  flex: 0 0 auto;
  background: var(--ztp-sapphire);
}

body.zaintech-pillar-v2 .ztp-related .rs-slider {
  overflow: visible;
}

body.zaintech-pillar-v2 .ztp-related .rs-slider .swiper-wrapper {
  align-items: stretch;
}

body.zaintech-pillar-v2 .ztp-related .rs-v2-card {
  position: relative;
  display: flex;
  min-height: 460px;
  height: auto;
  overflow: hidden;
  flex-direction: column;
  padding: 20px;
  border: 0;
  border-radius: 9px;
  background: var(--ztp-night);
  isolation: isolate;
}

body.zaintech-pillar-v2 .ztp-related .rs-card__tag {
  position: relative;
  z-index: 3;
  align-self: flex-start;
  padding: 5px 10px;
  border: 1px solid rgba(255, 255, 255, 0.32);
  border-radius: 4px;
  background: rgba(15, 11, 34, 0.45);
  color: #fff;
  font-size: 0.65rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

body.zaintech-pillar-v2 .ztp-related .hp-ind-icard__visual {
  position: absolute;
  inset: 0;
  height: auto;
  margin: 0;
  border-radius: 0;
}

body.zaintech-pillar-v2 .ztp-related .hp-ind-icard__visual::after {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(180deg, rgba(5, 5, 15, 0.72), transparent 48%),
    linear-gradient(0deg, rgba(5, 5, 15, 0.97), rgba(5, 5, 15, 0.06) 72%);
  content: "";
}

body.zaintech-pillar-v2 .ztp-related .hp-ind-icard__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}

body.zaintech-pillar-v2 .ztp-related .hp-ind-icard__body {
  position: relative;
  z-index: 2;
  display: flex;
  height: 100%;
  flex-direction: column;
  margin-top: auto;
  padding: 0;
  background: transparent;
}

body.zaintech-pillar-v2 .ztp-related .hp-ind-icard__title {
  margin: auto 0 0;
  color: #fff;
  font-size: 1.45rem;
  font-weight: 900;
  line-height: 1.2;
  text-transform: uppercase;
}

body.zaintech-pillar-v2 .ztp-related .hp-ind-icard__text {
  max-height: 0;
  margin: 0;
  overflow: hidden;
  color: rgba(255, 255, 255, 0.78);
  opacity: 0;
  line-height: 1.55;
  transform: translateY(12px);
  transition: max-height 0.4s ease, margin 0.3s ease, opacity 0.3s ease, transform 0.3s ease;
}

body.zaintech-pillar-v2 .ztp-related .rs-card__link {
  display: inline-flex;
  max-height: 0;
  align-items: center;
  gap: 10px;
  margin-top: 0;
  overflow: hidden;
  color: #fff;
  opacity: 0;
  font-size: 0.74rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-decoration: none;
  text-transform: uppercase;
  transition: max-height 0.3s ease, margin 0.3s ease, opacity 0.3s ease;
}

body.zaintech-pillar-v2 .ztp-related .rs-v2-card:hover .hp-ind-icard__img {
  transform: scale(1.06);
}

body.zaintech-pillar-v2 .ztp-related .rs-v2-card:hover .hp-ind-icard__text {
  max-height: 180px;
  margin-top: 16px;
  opacity: 1;
  transform: translateY(0);
}

body.zaintech-pillar-v2 .ztp-related .rs-v2-card:hover .rs-card__link {
  max-height: 40px;
  margin-top: 15px;
  opacity: 1;
}

body.zaintech-pillar-v2 .ztp-related .rs-pagination {
  margin-top: 30px;
}

body.zaintech-pillar-v2 .ztp-related .rs-pagination .swiper-pagination-bullet-active {
  background: var(--ztp-blue);
}

/* The prototype folds the generic pillar CTA into the FAQ header. */
body.zaintech-pillar-v2 .cta-section {
  display: none;
}

/* FAQ and integrated CTA */
body.zaintech-pillar-v2 .ztp-faq {
  position: relative;
  z-index: 2;
  margin-top: -30px;
  border-radius: var(--border-section) var(--border-section) 0 0;
  background: var(--ztp-blue);
}

body.zaintech-pillar-v2 .ztp-faq .dfaq-top {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(300px, 0.75fr);
  gap: clamp(36px, 6vw, 88px);
  align-items: start;
  padding-bottom: 46px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.18);
}

body.zaintech-pillar-v2 .ztp-faq .dfaq-top__title {
  max-width: 720px;
  margin: 0;
  color: #fff;
  font-size: clamp(2rem, 4vw, 3.35rem);
  font-weight: 400;
  letter-spacing: -0.025em;
  line-height: 1.08;
}

body.zaintech-pillar-v2 .ztp-faq .dfaq-top__content {
  display: flex;
  flex-direction: column;
  gap: 22px;
}

body.zaintech-pillar-v2 .ztp-faq .dfaq-top__content p {
  margin: 0;
  color: rgba(255, 255, 255, 0.84);
  font-size: 18px;
  line-height: 1.65;
}

body.zaintech-pillar-v2 .ztp-faq .dfaq-top__button {
  display: inline-flex;
  width: fit-content;
  min-height: 50px;
  align-items: center;
  gap: 18px;
  padding: 12px 14px 12px 20px;
  border-radius: 5px;
  background: #fff;
  color: #151128;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-decoration: none;
  text-transform: uppercase;
}

body.zaintech-pillar-v2 .ztp-faq .dfaq-top__button:hover {
  background: var(--ztp-lime);
}

body.zaintech-pillar-v2 .ztp-faq .dfaq-header {
  margin: 42px 0 12px;
}

body.zaintech-pillar-v2 .ztp-faq .dfaq-list {
  max-width: none;
}

body.zaintech-pillar-v2 .ztp-faq .dfaq-item {
  border-bottom: 1px solid rgba(255, 255, 255, 0.18);
  transition: 0.3s ease;
}
body.zaintech-pillar-v2 .ztp-faq .dfaq-item.is-open {
  border-bottom: 1px solid rgba(255, 255, 255);
}

body.zaintech-pillar-v2 .ztp-faq .dfaq-q {
  width: 100%;
  padding: 24px 0;
  border: 0;
  background: transparent;
  color: #fff;
  font-size: 20px;
  text-align: start;
}

body.zaintech-pillar-v2 .ztp-faq .dfaq-icon {
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  padding: 5px;
  border: 1px solid rgba(255, 255, 255, 0.34);
  border-radius: 50%;
}

body.zaintech-pillar-v2 .ztp-faq .dfaq-item.is-open .dfaq-icon {
  border-color: var(--ztp-lime);
  background: var(--ztp-lime);
  color: var(--ztp-ink);
}

body.zaintech-pillar-v2 .ztp-faq .dfaq-a {
  max-width: 780px;
  padding: 0 42px 24px 0;
  color: rgba(255, 255, 255, 0.76);
  font-size: 18px;
  line-height: 1.65;
}

body.zaintech-pillar-v2 .ztp-faq .dfaq-divider {
  display: none;
}

@media (max-width: 1100px) {
  body.zaintech-pillar-v2 .cdp-panel__layout,
  body.zaintech-pillar-v2 .ztp-impact .oi-layout {
    grid-template-columns: 1fr;
  }

  body.zaintech-pillar-v2 .ztp-impact .oi-chart-col {
    max-width: 620px;
    margin-inline: auto;
  }
}

@media (max-width: 992px) {
  body.zaintech-pillar-v2 .ztp-faq .dfaq-a {
    max-width: 780px;
    padding: 0 0  24px 0;
  }
  body.zaintech-pillar-v2 .ztp-use-cases .iuc-grid {
                   gap: 24px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-wrap: wrap;
  }
  body.zaintech-pillar-v2 .ztp-use-cases .iuc-card {
        min-height: 450px;
    width: calc(50% - 12px);
    border-radius: 5px;
  }
  body.zaintech-pillar-v2 .ztp-use-cases .iuc-card .iuc-card__bg {
    transform: scale(1.05);
}
body.zaintech-pillar-v2 .ztp-use-cases .iuc-card .iuc-card__blue {
    opacity: 0.28;
}
body.zaintech-pillar-v2 .ztp-use-cases .iuc-card .iuc-card__desc {
    max-height: 320px;
    margin-top: 18px;
    padding: 18px;
    opacity: 1;
    transform: translateY(0);
}
  body.zaintech-pillar-v2 .ztp-streamline .s5-layout,
  body.zaintech-pillar-v2 .ztp-why > .container,
  body.zaintech-pillar-v2 .ztp-faq .dfaq-top,
  body.zaintech-pillar-v2 .ztp-use-case-details .ucd-header {
    grid-template-columns: 1fr;
  }

  body.zaintech-pillar-v2 .ztp-why .wzd-header {
    position: static;
  }

  body.zaintech-pillar-v2 .ztp-use-case-details .ucd-list {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 680px) {

  body.zaintech-pillar-v2 .ztp-hero {
    min-height: 760px;
  }

  body.zaintech-pillar-v2 .ztp-hero__content {
    padding-top: 126px;
    padding-bottom: 120px;
  }

  body.zaintech-pillar-v2 .ztp-hero__title {
    font-size: clamp(2.8rem, 15vw, 4.6rem);
  }

  body.zaintech-pillar-v2 .ztp-hero__actions {
    align-items: stretch;
    flex-direction: column;
  }

  body.zaintech-pillar-v2 .ztp-hero__button {
    width: 100%;
  }

  body.zaintech-pillar-v2 .ztp-hero__scroll {
    bottom: 18px;
  }

  body.zaintech-pillar-v2 .ztp-intro,
  body.zaintech-pillar-v2 .ztp-use-cases,
  body.zaintech-pillar-v2 .ztp-faq {
    margin-top: -20px;
    border-radius: 20px 20px 0 0;
  }

  body.zaintech-pillar-v2 .ztp-section-heading--center {
    margin-bottom: 36px;
  }

  body.zaintech-pillar-v2 .ztp-challenge-card__head {
    align-items: flex-start;
    flex-direction: column;
    padding: 22px;
  }

  body.zaintech-pillar-v2 .chg-grid,
  body.zaintech-pillar-v2 .cdp-list {
    grid-template-columns: 1fr;
  }

  body.zaintech-pillar-v2 .chg-grid {
    padding: 8px 20px 22px;
  }

  body.zaintech-pillar-v2 .chg-card:nth-last-child(-n + 2) {
    border-bottom: 1px solid rgba(52, 76, 152, 0.12);
  }

  body.zaintech-pillar-v2 .chg-card:last-child {
    border-bottom: 0;
  }

  body.zaintech-pillar-v2 .cdp-panel__layout {
    gap: 28px;
  }

  body.zaintech-pillar-v2 .cdp-media,
  body.zaintech-pillar-v2 .cdp-media > img {
    min-height: 430px;
  }

  body.zaintech-pillar-v2 .cdp-media__card {
    right: 12px;
    bottom: 12px;
    left: 12px;
    padding: 18px;
  }

  body.zaintech-pillar-v2 .ztp-use-cases .iuc-grid {
    grid-template-columns: 1fr;
  }

  body.zaintech-pillar-v2 .ztp-use-cases .iuc-card {
    min-height: 430px;
  }

  body.zaintech-pillar-v2 .ztp-use-cases .iuc-card__desc,
  body.zaintech-pillar-v2 .ztp-use-cases .iuc-card:hover .iuc-card__desc {
    max-height: 280px;
    margin-top: 16px;
    padding: 16px;
    opacity: 1;
    transform: none;
  }

  body.zaintech-pillar-v2 .ztp-why .wzd-card {
    grid-template-columns: 1fr;
    gap: 14px;
  }

  body.zaintech-pillar-v2 .ztp-related .rs-top {
    align-items: flex-start;
    flex-direction: column;
  }

  body.zaintech-pillar-v2 .ztp-related .rs-v2-card {
    min-height: 420px;
  }

  body.zaintech-pillar-v2 .ztp-related .hp-ind-icard__text {
    max-height: 180px;
    margin-top: 14px;
    opacity: 1;
    transform: none;
  }

  body.zaintech-pillar-v2 .ztp-related .rs-card__link {
    max-height: 40px;
    margin-top: 14px;
    opacity: 1;
  }

  body.zaintech-pillar-v2 .ztp-faq .dfaq-top {
    gap: 26px;
  }
}

@media (max-width: 768px) {
  body.zaintech-pillar-v2 .ztp-use-cases .iuc-card {
        min-height: 400px;
        width: 100%;
    }

}

@media (prefers-reduced-motion: reduce) {
  body.zaintech-pillar-v2 .ztp-hero__background,
  body.zaintech-pillar-v2 .ztp-hero__title,
  body.zaintech-pillar-v2 .ztp-hero__description,
  body.zaintech-pillar-v2 .ztp-hero__actions,
  body.zaintech-pillar-v2 .ztp-hero__scroll svg {
    animation: none;
  }
}

/* ═══════════════════════════════════════════════════════════════
   New pillar design (from new-pillars.php mock) — sections rendered by
   template-parts/sections/digital/*.php. Appended last so its rules win
   over the legacy pillar styles above where class names overlap (iuc-*).
   ═══════════════════════════════════════════════════════════════ */

    /* ── Core digital capabilities ── */
    .dc-section {
        padding: var(--padding-section) 0;
        background: radial-gradient(circle at 85% 15%, rgba(52, 76, 152, 0.55) 0%, rgba(5, 5, 15, 0) 45%), linear-gradient(150deg, #070716 0%, #0d1442 45%, #14245e 100%);
        border-radius: var(--border-section) var(--border-section) 0 0;
        z-index: 1;
        overflow: hidden;
        position: relative;
        margin-top: -25px;
    }

    .dc-card {
        position: relative;
        overflow: hidden;
        padding: clamp(32px, 6vw, 64px) 0;
    }

    .dc-header {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 24px;
        margin-bottom: 32px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.12);
    }

    .dc-header .section-title-secound {
      flex:1;
    }

    .dc-title {
        margin: 0;
        
        font-size: clamp(1.4rem, 2.4vw, 1.9rem);
        font-weight: 400;
        color: var(--color-light-blue, #6FC7EA);
    }

    .dc-title span {
        font-weight: 800;
        color: var(--color-lime, #C3D534);
    }

    .dc-tabs {
        display: flex;
        gap: 28px;
        flex: 1;
    }

    .dc-tabs::-webkit-scrollbar {
        display: none;
    }

    .dc-tab {
        padding: 6px 0 12px;
        background: none;
        border: none;
        border-bottom: 2px solid transparent;
        
        font-size: 15px;
        font-weight: 700;
        letter-spacing: 0.04em;
        text-transform: uppercase;
        text-align: left;
        line-height: 1.4;
        color: rgba(255, 255, 255, 0.5);
        cursor: pointer;
        transition: color 0.2s ease, border-color 0.2s ease;
    }

    .dc-tab:hover {
        color: rgba(255, 255, 255, 0.85);
    }

    .dc-tab.is-active {
        color: #fff;
        border-color: var(--color-lime, #C3D534);
    }

    .dc-panel {
        display: none;
        gap: clamp(24px, 4vw, 56px);
    }

    .dc-panel.is-active {
        display: flex;
    }

    .dc-list {
        display: grid;
        grid-template-columns: 1fr 1fr;
        column-gap: 32px;
        align-content: start;
        flex: 0 0 46%;
    }

    .dc-list__divider {
        grid-column: 1 / -1;
        border-top: 1px solid rgba(255, 255, 255, 0.12);
        margin: 4px 0;
    }

    .dc-list__item {
        display: flex;
        align-items: baseline;
        gap: 10px;
        padding: 14px 0;
    }

    .dc-list__num {
        flex-shrink: 0;
        
        font-size: 11px;
        font-weight: 700;
        color: var(--color-lime, #C3D534);
    }

    .dc-list__label {
        
        font-size: 18px;
        font-weight: 200;
        line-height: 1.4;
        color: rgba(255, 255, 255, 0.85);
    }

    .dc-media {
        position: relative;
        flex: 1;
        min-height: 260px;
        max-height: 350px;
        border-radius: 12px;
        overflow: hidden;
    }

    .dc-media img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }

    .dc-media__card {
        position: absolute;
        left: auto;
        right: 20px;
        bottom: 20px;
        padding: 20px;
        background: rgba(170, 170, 170, 0.3);
        border: 1px solid rgba(255, 255, 255, 0.12);
        border-radius: 10px;
        -webkit-backdrop-filter: blur(12px);
        backdrop-filter: blur(12px);
        max-width: 75%;
    }

    .dc-media__text {
        margin: 0 0 14px;
        
        font-size: 18px;
        line-height: 1.6;
        color: rgba(255, 255, 255, 0.85);
    }

    .dc-media__link {
        display: inline-flex;
        align-items: center;
        gap: 10px;
        
        font-size: 0.75rem;
        font-weight: 700;
        letter-spacing: 0.06em;
        text-transform: uppercase;
        color: #fff;
        text-decoration: none;
    }

    .dc-media__link-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 18px;
        height: 18px;
        border-radius: 4px;
        background: var(--color-lime, #C3D534);
        color: #151128;
        font-size: 0.7rem;
    }
    
    @media (max-width: 1200px) {
      .dc-header {
          flex-wrap: wrap;
        }
        .dc-tab {
          white-space: nowrap;
        }
        .dc-header .section-title-secound {
            flex: unset;
        }

        .dc-tabs {
            flex: unset;
            overflow-x: scroll;
            scrollbar-width: none;
            position: relative;
        }
    }
    @media (max-width: 992px) {
        .dc-panel {
            flex-direction: column;
        }

        .dc-list {
            flex: 1 1 auto;
        }

        .dc-media {
            min-height: 220px;
        }
        
    }

    @media (max-width: 768px) {
        .dc-list {
            grid-template-columns: 1fr;
        }
        .dc-media__card {
            left: 50% !important;
            right: auto !important;
            bottom: 20px;
            padding: 15px;
            max-width: calc(100% - 20px);
            transform: translateX(-50%);
            width: 100%;
        }
        .dc-media__card .dc-media__text {
          display: -webkit-box;
          -webkit-box-orient: vertical;
          -webkit-line-clamp: 3;
          overflow: hidden;
        }
        .dc-media img {
          min-height: 300px;
        }
        .dc-tabs {
          padding: 0 10px;
        }
         .scroll-style {
          overflow: auto;
        }
        .scroll-style::before, .scroll-style::after {
            content: '';
            position: absolute;
            top: 0;
            bottom: 0;
            width: clamp(20px, 10vw, 70px);
            z-index: 2;
            pointer-events: none;
        }

        .scroll-style::before {
            left: 0;
            background: linear-gradient(90deg, #c3d5343b 0%, #c3d53400 100%)
        }
        .scroll-style::after {
            right: 0;
            background: linear-gradient(270deg, #c3d5343b 0%, #c3d53400 100%)
        }
    }

    .challenge-solves_ZT .container {
      display: flex;
      align-items: stretch;
    }

    .card-business {
      display: flex;
      height: auto;
    }

    .header-card-circle {
        font-weight: 700;
        font-style: Bold;
        font-size: 24px;
        leading-trim: NONE;
        line-height: 104%;
        letter-spacing: -1px;
        text-align: center;
        text-transform: uppercase;
        color: rgba(32, 21, 71, 1);
    }

    .section-center-circle {
        height: fit-content;
        margin: auto 0;
    }

    .bg-matrix {
        width: 362px;
        aspect-ratio: 1/1;
    }

    .card-circle-bg {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 16px;
        overflow: hidden;
        height: 100%;
      padding: 32px;
    }

    .card-circle-bg .bg-card {
        position: absolute;
        inset: 0;
        z-index: 0;
        min-width: 100%;
        min-height: 100%;
    }

    .card-business:first-child  .card-circle-bg {
      background: linear-gradient(134deg, #344C98, #201547);
    }
    .card-business:last-child  .card-circle-bg {
      background: linear-gradient(134deg, #C3D534, #6FC7EA);
    }

    .container-card-circle {
        position: relative;
        z-index: 1;
        padding: 24px 20px;
        background: rgba(255, 255, 255, 0.92);
        border-radius: 10px;
        width: 100%;
        min-width: 275px;
        gap: 10px;
        height: 100%;
    }

    .tags-circle-card:last-child {
        padding-bottom: 0;
        border-bottom: none;
    }

    .container-card-circle img {
        width: 20px;
        height: 20px;
        flex-shrink: 0;
        margin: 12px;
    }

    .desc-card {
        font-weight: 400;
        font-size: 15px;
        line-height: 120%;
        letter-spacing: 0%;
        color: rgba(32, 21, 71, 1);
        max-width: 209px;
        text-align: left;
    }

     .desc-card:lang(ar) {
        text-align: right;
    }

    .zt-circle {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 180px;
        height: 180px;
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: 20px;
    }

    .zt-logo {
        position: relative;

        z-index: 3;
        width: 170px;
        height: 80px;
        border-radius: 100px;
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /* Ring 1 */
    .zt-circle::before,
    .zt-circle::after,
    .zt-logo::before {
        content: "";
        position: absolute;
        inset: 50%;
        transform: translate(-50%, -50%) scale(.8);
        border-radius: 100px;
        animation: pulse 3s ease-out infinite;
    }

    /* Inner glow */
    .zt-circle::before {
        width: 172px;
        height: 80px;
        background: rgba(31, 112, 193, .15);
        animation-delay: 0s;
    }

    /* Middle glow */
    .zt-circle::after {
        width: 180px;
        height: 110px;
        background: rgba(195, 213, 52, 0.65);
        animation-delay: 1s;
    }

    /* Outer glow */
    .zt-logo::before {
        width: 175px;
        height: 82px;
        background: rgba(31, 112, 193, 0.08);
        animation-delay: 2s;
        z-index: -1;
    }

    @keyframes pulse {
        0% {
            transform: translate(-50%, -50%) scale(.8);
            opacity: .7;
        }

        50% {
            opacity: .35;
        }

        100% {
            transform: translate(-50%, -50%) scale(1.15);
            opacity: 0;
        }
    }

        @media(max-width:1100px) {
          .container-card-circle {
            width: auto;
          }
          .bg-matrix {
            width: 280px;
          }
        }
        @media(max-width:992px) {
          .card-circle-bg {
            width: 100%;
          }
    
          .container-card-circle {
            flex-direction: row;
            flex-wrap: wrap;
            width: 100%;
          }
    
          .tags-circle-card {
            width: calc(50% - 12px);
          }
    
          .bg-matrix {
            aspect-ratio: 1 / 1;
            transform: rotate(90deg);
          }
    
          .section-center-circle {
            margin: 0 auto;
          }
    
          .zt-circle {
            margin-top: 0;
            left: 47%;
          }
    
          .zt-logo {
            width: 150px;
            height: auto;
          }
    
    
        }
    
        @media (max-width: 560px) {
          .container-card-circle {
            flex-direction: column;
            gap: 7px;
          }
    
          .tags-circle-card {
            width: 100%;
          }
        }


    /* ── Intro section ── */
    .pillar-intro {
        position: relative;
        z-index: 1;
        margin-top: -30px;
        background: #fff;
        border-radius: var(--border-section) var(--border-section) 0 0;
        padding: var(--padding-section) 0 calc( var(--padding-section) + 25px);
        /* `start` follows the document direction: left in LTR, right in RTL */
        text-align: start;
    }

    /* The intro block is a centering flex column in markup — align it to the
       inline start instead, so heading, breadcrumb and body share one edge. */
    .pillar-intro > .container > .d-flex > .items-center {
        align-items: flex-start;
    }

    .pillar-intro--has-breadcrumb {
        padding-top: clamp(28px, 4vw, 48px);
    }

    .section-title {
        font-size: clamp(2rem, 3.5vw, 3rem);
        font-weight: 300;
        letter-spacing: 0.02em;
        line-height: 1.1;
        margin: 0 0 16px;
        background: -webkit-linear-gradient(275deg, #6FC7EA, #344C98);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        width: fit-content;
    }

    .section-title span {
        font-weight: 800;
    }

    .pillar-intro__text {
        margin-block: 0;
        margin-inline: 0 auto;
        font-size: 18px;
        line-height: 1.7;
        color: rgba(26, 26, 46, 0.7);
        text-align: start;
    }


    .section-title-secound {
        font-size: clamp(2rem, 3.5vw, 3rem);
        font-weight: 300;
        letter-spacing: 0.02em;
        line-height: 1.1;
        margin: 0 0 16px;
        background: -webkit-linear-gradient(90deg, #6FC7EA, #C3D534);
        background: linear-gradient(90deg, #6FC7EA, #C3D534);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
        width: fit-content;
    }

    .section-title-secound span {
        font-weight: 800;
    }

    .sp-section {
      position: relative;
      margin-top: -28px;
        border-radius: var(--border-section) var(--border-section) 0 0;
        z-index: 1;
        background-color: white;
        overflow: hidden;
        padding-bottom: calc( var(--padding-section) + 25px);
    }

    .sp-header {
        display: flex;
      justify-content: space-between;
      margin-bottom: 32px;
    }

    .sp-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 16px;
    }

    .sp-grid:has(> :nth-child(3):last-child) {
        grid-template-columns: repeat(3, 1fr);
    }

    .sp-card {
        position: relative;
        display: flex;
        flex-direction: column;
        aspect-ratio: 3 / 4;
        padding: 18px;
        border-radius: 8px;
        overflow: hidden;
        text-decoration: none;
        isolation: isolate;
    }

    .sp-card__img {
        position: absolute;
        inset: 0;
        z-index: -3;
        width: 100%;
        height: 100%;
        object-fit: cover;
        transition: transform 0.5s ease;
    }

    .sp-card__shade {
        position: absolute;
        inset: 0;
        z-index: -2;
        background: linear-gradient(180deg, rgba(10, 8, 24, 0.75) 0%, rgba(10, 8, 24, 0) 45%);
    }

    .sp-card__overlay {
        position: absolute;
        inset: 0;
        z-index: -1;
        background: linear-gradient(0deg, rgba(10, 8, 24, 0.94) 0%, rgba(10, 8, 24, 0) 60%);
        opacity: 0;
        transition: opacity 0.35s ease;
    }

    .sp-card:hover .sp-card__img {
        transform: scale(1.06);
    }

    .sp-card:hover .sp-card__overlay {
        opacity: 1;
    }

    .sp-card__title {
        margin: 0;
        
        font-size: 24px;
        font-weight: 800;
        line-height: 1.3;
        text-transform: uppercase;
        color: #fff;
    }

    .sp-card__reveal {
        display: flex;
        flex-direction: column;
        gap: 14px;
        margin-top: auto;
        max-height: 0;
        opacity: 0;
        transform: translateY(16px);
        overflow: hidden;
        transition: max-height 0.4s ease, opacity 0.35s ease, transform 0.35s ease;
    }

    .sp-card:hover .sp-card__reveal {
        max-height: 220px;
        opacity: 1;
        transform: translateY(0);
    }

    .sp-card__desc {
        margin: 0;
        
        font-size: 18px;
        line-height: 1.55;
        color: rgba(255, 255, 255, 0.8);
    }

    .sp-card__link {
        display: inline-flex;
        align-items: center;
        gap: 8px;
        width: fit-content;
        
        font-size: 11px;
        font-weight: 700;
        letter-spacing: 0.05em;
        text-transform: uppercase;
        color: #fff;
    }

    .sp-card__link-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 18px;
        height: 18px;
        background: var(--color-lime, #C3D534);
        color: #151128;
        border-radius: 4px;
        font-size: 0.7rem;
        transition: transform 0.2s ease;
    }

    .sp-card:hover .sp-card__link-icon {
        transform: translateX(3px);
    }

    @media (max-width: 992px) {
        .sp-grid, .sp-grid:has(> :nth-child(3):last-child) {
            grid-template-columns: repeat(2, 1fr);
        }
        .sp-card {
            height: 400px;
            aspect-ratio: unset;
        }
        .sp-card .sp-card__overlay {
            opacity: 1;
        }
        .sp-card .sp-card__reveal {
            max-height: 220px;
            opacity: 1;
            transform: translateY(0);
        }
    }

    @media (max-width: 560px) {
        .sp-grid, .sp-grid:has(> :nth-child(3):last-child) {
            grid-template-columns: 1fr;
        }
        

        .sp-card {
            aspect-ratio: unset;
            min-height: 300px;
            height: auto;
            opacity: 0.9;
        }

        .sp-card__reveal,
        .sp-card:hover .sp-card__reveal {
            max-height: 220px;
            opacity: 1;
            transform: translateY(0);
        }

        .sp-card__overlay {
            opacity: 1;
        }
    }
    .iuc-section {
        background-color: #E9EEFE;
        border-radius: var(--border-section) var(--border-section) 0 0;
        margin-top: -25px;
    }

    .impact-section {
      padding-bottom: calc( var(--padding-section) + 25px);
        background: linear-gradient(143deg, #161139 0%, #1B1A54 50%, #161139 100%);
    }

    .impact-swiper {
        overflow: visible;
    }

    .impact-swiper .swiper-slide {
        height: stretch;
    }

    .impact-card {
        display: flex;
        flex-direction: column;
        justify-content: space-around;
        gap: 48px;
        height: 100%;
        min-height: 450px;
        padding: 24px;
        background: rgba(6, 16, 47, 1);
        border: 1px solid rgba(255, 255, 255, 0.08);
        border-radius: 10px;
    }

    .impact-card .card-title {
        margin: 0;
        padding-bottom: 16px;
        border-bottom: 1px solid rgba(255, 255, 255, 0.15);
        font-weight: 700;
        font-style: normal;
        font-size: 18px;
        line-height: 110%;
        letter-spacing: 0;
        text-transform: uppercase;
        color: #fff;
    }

    .impact-card__icon {
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .impact-card__icon svg {
        width: 100%;
        height: auto;
        max-width: 86px;
        max-height: 86px;
        color: var(--color-lime, #C3D534);
    }

    .impact-card .desc {
        font-weight: 300;
        font-style: normal;
        font-size: 18px;
        line-height: 21px;
        letter-spacing: 0;
        color: rgba(255, 255, 255, 0.65);
    }

    .impact-nav {
        margin: 32px 0 16px;
    }

    .impact-nav__btn {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        width: 40px;
        height: 40px;
        background: transparent;
        border: 1px solid rgba(255, 255, 255, 0.25);
        border-radius: 6px;
        color: #fff;
        cursor: pointer;
        transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
    }

    .impact-nav__btn:hover {
        background: var(--color-lime, #C3D534);
        border-color: var(--color-lime, #C3D534);
        color: #151128;
    }

    .impact-nav__btn.swiper-button-disabled {
        opacity: 0.35;
        pointer-events: none;
    }

    .impact-pagination {
        position: relative;
        flex: 1;
        height: 2px !important;
        background: rgba(255, 255, 255, 0.15);
        border-radius: 2px;
        overflow: hidden;
    }

    .impact-pagination .swiper-pagination-progressbar-fill {
        background: var(--color-lime, #C3D534);
    }

    @media (max-width: 600px) {
        .impact-nav {
            flex-wrap: wrap;
        }

        .impact-pagination {
            order: 3;
            max-width: 100%;
        }
    }

    .iuc-header {
        margin-bottom: 60px;
    }

    .iuc-eyebrow {
        font-size: var(--text-sm);
        font-weight: 700;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        color: var(--color-blue);
        margin: 0 0 16px;
    }

    .iuc-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        row-gap: 24px;
        column-gap: 0;
    }

    .iuc-card {
        position: relative;
        border-radius: 4px;
        overflow: hidden;
        aspect-ratio: unset;
    }

    .iuc-card__bg {
        position: absolute;
        inset: 0;
        background-size: cover;
        background-position: center;
        transition: opacity 0.55s ease;
    }

    .iuc-card__blue {
        position: absolute;
        inset: 0;
        background: var(--color-blue);
        opacity: 0;
        transition: opacity 0.55s ease;
    }

    .iuc-card:hover .iuc-card__bg {
        opacity: 1;
    }

    .iuc-card:hover .iuc-card__blue {
        opacity: 0.3;
    }

    .iuc-card__content {
        position: absolute;
        inset: 0;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        padding: 32px 28px;
        background: linear-gradient(to top, rgba(0, 0, 0, 0.55) 40%, transparent 100%);
        transition: background 0.55s ease;
        z-index: 1;
        height: stretch;
    }

    .iuc-card:hover .iuc-card__content {
        background: transparent;
    }

    .iuc-card__title {
        font-size: 24px;
        font-weight: 900;
        text-transform: uppercase;
        letter-spacing: 0.04em;
        color: #fff;
        line-height: 1.25;
        margin: 0;
        order: 1;
    }

    .iuc-card__desc {
        font-size: 0.9rem;
        color: rgba(255, 255, 255, 0.88);
        line-height: 1.65;
        margin: 12px 0 0;
        order: 2;
        max-height: 0;
        overflow: hidden;
        opacity: 0;
        transition: max-height 0.55s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.55s ease 0.08s;
        background-color: #00000030;
        backdrop-filter: blur(40px);
        border-radius: 5px;
        border: 1px solid #ffffff15;
        padding: 33px;
    }

    .iuc-card:hover .iuc-card__desc {
        max-height: 100%;
        opacity: 1;
        display: -webkit-box;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }

    @media (max-width: 1200px) {
        .iuc-grid {
            grid-template-columns: repeat(2, 1fr);
        }

        .iuc-card {
            min-height: 400px;
            aspect-ratio: unset;
        }
    }

    @media (max-width: 992px) {
        .iuc-grid {
            grid-template-columns: 1fr;
        }
    }
    .why-zaintech-section {
        position: relative;
        background: #fff;
        margin-top: -28px;
        border-radius: var(--border-section) var(--border-section) 0 0;
        z-index: 1;
        padding-bottom: calc( var(--padding-section) + 25px);
    }

    .why-zaintech-section--raised {
         background: #E9EEFE;
    }

    .why-zaintech-section .section-title {
      z-index: 1;
    }

    .why-zaintech__intro {
        position: relative;
        z-index: 1;
        flex: 0 0 443px;
    }


    .why-zaintech__desc {
        margin: 0;
        
        font-size: 18px;
        line-height: 1.6;
        color: #4A4A5A;
    }

    .why-zaintech__list {
        flex: 1;
        max-width: 640px;
        z-index: 1;
    }

    .why-zaintech__row {
        align-items: flex-start;
        padding: 20px 0;
        border-bottom: 1px solid rgba(26, 26, 46, 0.1);
    }

    .why-zaintech__label {
        flex: 0 0 170px;
        
        font-size: 18px;
        font-weight: 800;
        letter-spacing: 0.02em;
        line-height: 1.4;
        text-transform: uppercase;
        color: #201547;
    }

    .why-zaintech__row-desc {
        flex: 1;
        margin: 0;
        
        font-size: 18px;
        line-height: 1.6;
        color: #4A4A5A;
    }

    .why-zaintech__row-desc > :first-child {
        margin-top: 0;
    }

    .why-zaintech__row-desc > :last-child {
        margin-bottom: 0;
    }

    @media (max-width: 992px) {
        .why-zaintech__row {
            flex-direction: column;
            gap: 8px;
        }

        .why-zaintech__label {
            flex: none;
        }

        .why-zaintech__list {
            flex: 1;
            max-width: none;
        }

        .why-zaintech__intro {
            position: relative;
            z-index: 1;
            flex: 1;
        }
    }

/* Outcome-card icons come from ACF as images, not inline SVGs. */
.impact-card__icon img {
    width: 100%;
    height: auto;
    max-width: 86px;
    max-height: 86px;
}


/* ═══════════════════════════════════════════════════════════════
   New industry design (from new-industry.php mock) — sections rendered
   by template-parts/sections/industry/*.php. Rules identical to the
   "New pillar design" block above were deduplicated; the handful of
   impact-slider rules that differ per family are scoped below under
   body.zaintech-new-industry.
   ═══════════════════════════════════════════════════════════════ */

.why-zaintech-section .container.border-top {
        padding-top: var(--padding-section);
        border-top: 1px solid #00000010;
    }

.label-why-zaintech__list {
        font-size: 24px;
        font-weight: bold;
        color: #201547;
        padding-bottom: 34px;
        border-bottom: 1px solid rgba(26, 26, 46, 0.1);
    }

.cr-hero__collage {
        position: relative;
        width: 425px;
        height: 535px;
    }

.cr-hero__left .cr-col-img--1 {
        width: 58%;
        aspect-ratio: 1;
        top: 0;
        left: 0;
        z-index: 1;
        border-radius: 5px;
        max-width: 245px;
        height: 384px;
    }

.cr-hero__left .cr-col-img--2 {
        width: 55%;
        aspect-ratio: 1;
        top: auto;
        bottom: 0;
        right: 10%;
        left: auto;
        z-index: 3;
        border: 5px solid white;
        border-radius: 5px;
        max-width: 245px;
        height: 330px;
    }
.cr-hero__right .cr-col-img--1 {
        

        width: 58%;
        aspect-ratio: 1;
        top: 0;
        right: 0;
        left: auto;
        z-index: 1;
        border-radius: 5px;
        max-width: 245px;
        height: 384px;
    }

.cr-hero__right .cr-col-img--2 {
        width: 55%;
        aspect-ratio: 1;
        top: auto;
        bottom: 0;
        left: 10%;
        right: auto;
        z-index: 3;
        border: 5px solid white;
        border-radius: 5px;
        max-width: 245px;
        height: 330px;
    }

    .why-zaintech-section.dark-bg .cr-hero__left .cr-col-img--2,
    .why-zaintech-section.dark-bg .cr-hero__right .cr-col-img--2{
      border: none;
    }

.hzt-section {
        background: radial-gradient(circle at 15% 20%, rgba(52, 76, 152, 0.5) 0%, rgba(5, 5, 15, 0) 45%), linear-gradient(150deg, #0d0d2a 0%, #151245 50%, #1c1c52 100%);
        padding-bottom: calc( var(--padding-section) + 25px);
        border-radius: var(--border-section) var(--border-section) 0 0;
        overflow: hidden;
        z-index: 1;
    }

.hzt-card {
        position: relative;
        overflow: hidden;
        border-radius: 24px;
    }

.hzt-header {
        margin-bottom: 32px;
    }

.hzt-grid {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

@media (max-width: 991px) {
    .hzt-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 16px;
    }
}

@media (max-width: 767px) {
    .hzt-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
}

.impact-nav.white-pag .impact-nav__btn {
        border-color: rgb(40 31 81);
        color: #1a194e;
    }

.impact-nav.white-pag .impact-nav__btn:hover {
        background-color: #1a194e;
        color: white;
    }

.uc-section {
        background: #E9EEFE;
        padding-bottom: calc( var(--padding-section) + 25px);
        position: relative;
        margin-top: -25px;
        border-radius: var(--border-section) var(--border-section) 0 0;
        z-index: 1;
    }

.industry-section-header {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 32px;
    }

.industry-section-header__primary {
        display: flex;
        flex: 1;
        min-width: 0;
        flex-direction: column;
        align-items: flex-start;
        gap: 24px;
    }

.industry-section-header__cta {
        display: flex;
    }

.industry-section-header__cta .zt__btn {
        color: #fff;
        background: #201547;
    }

.industry-section-header__cta .zt__btn-icon {
        color: #201547;
        background: #C3D534;
    }

.industry-section-header__cta .zt__btn:hover {
        color: #201547;
        background: #C3D534;
    }

.industry-section-header__cta .zt__btn:hover .zt__btn-icon {
        background: #fff;
    }

.industry-section-header__desc {
        flex-shrink: 0;
        max-width: 340px;
        margin: 8px 0 0;
        font-size: 18px;
        line-height: 1.6;
    }

.impact-header__desc {
        color: rgba(255, 255, 255, 0.75);
    }

.uc-header {
        gap: 32px;
        margin-bottom: 32px;
    }

.uc-header__desc {
        flex-shrink: 0;
        max-width: 340px;
        margin: 8px 0 0;
        
        font-size: 18px;
        line-height: 1.6;
        color: rgba(26, 26, 46, 0.6);
    }

.uc-card {
        position: relative;
        overflow: hidden;
        box-shadow: 0 20px 50px rgba(32, 21, 71, 0.08);
    }

.uc-rows {
        max-height: 760px;
        overflow-y: auto;
        padding-right: 20px;
    }

.uc-rows::-webkit-scrollbar {
        width: 4px;
    }

.uc-rows::-webkit-scrollbar-track {
        background: rgba(26, 26, 46, 0.08);
    }

.uc-rows::-webkit-scrollbar-thumb {
        background: var(--color-blue, #344C98);
        border-radius: 4px;
    }

.uc-row {
        display: flex;
        align-items: stretch;
        border-bottom: 1px solid rgba(26, 26, 46, 0.08);
        position: sticky;
        top: 0;
        background: white;
        padding: 10px;
        border-radius: 5px;
    }

.uc-row:last-child {
        border-bottom: none;
        min-height: calc(760px - (var(--n) * 4rem));
    }

.uc-row__left {
        flex: 1;
        min-width: 0;
        padding: 28px 40px 28px 32px;
    }

.uc-row__media {
        position: relative;
        flex: 0 0 32%;
        overflow: hidden;
        border-radius: 5px;
    }

.uc-row__media img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
    }

.uc-row__head {
        display: flex;
        align-items: baseline;
        gap: 20px;
        width: 100%;
        padding: 0;
        background: none;
        border: none;
        text-align: left;
        cursor: pointer;
    }

.uc-row__num {
        flex-shrink: 0;
        width: 20px;
        
        font-size: 0.85rem;
        font-weight: 700;
        color: rgba(26, 26, 46, 0.4);
    }

.uc-row__title {
        margin: 0;
        
        font-size: 1.15rem;
        font-weight: 800;
        letter-spacing: 0.01em;
        text-transform: uppercase;
        color: #201547;
    }

.uc-row__reveal {
        display: grid;
        grid-template-rows: 0fr;
        transition: grid-template-rows 0.4s ease;
    }

.uc-row.is-open .uc-row__reveal {
        grid-template-rows: 1fr;
    }

.uc-row__reveal-inner {
        overflow: hidden;
        padding-left: 40px;
    }

.uc-steps {
        display: flex;
        flex-direction: column;
        margin-top: 24px;
    }

.uc-step {
        position: relative;
        display: flex;
        gap: 20px;
        padding-bottom: 20px;
    }

.uc-step:not(:last-child)::after {
        content: '';
        position: absolute;
        left: 19px;
        top: 40px;
        bottom: 0;
        border-left: 1px dashed rgba(26, 26, 46, 0.25);
    }

.uc-step__icon {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        width: 40px;
        height: 40px;
        border-radius: 50%;
        border: 1px solid rgba(26, 26, 46, 0.2);
        color: #201547;
    }

.uc-step__icon--zt {
        background: var(--color-blue, #344C98);
        border-color: var(--color-blue, #344C98);
        color: #fff;
        
        font-weight: 800;
        font-size: 0.8rem;
    }

.uc-step__body {
        flex: 1;
        min-width: 0;
        padding-bottom: 20px;
        border-bottom: 1px solid rgba(26, 26, 46, 0.08);
    }

.uc-step__label {
        display: block;
        margin-bottom: 6px;
        
        font-size: 0.78rem;
        font-weight: 800;
        letter-spacing: 0.03em;
        text-transform: uppercase;
        color: #201547;
    }

.uc-step__desc {
        margin: 0;
        max-width: 620px;
        
        font-size: 0.9rem;
        line-height: 1.6;
        color: rgba(26, 26, 46, 0.65);
    }

.uc-tags {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 10px;
        margin-top: 4px;
        padding-top: 20px;
        border-top: 1px solid rgba(26, 26, 46, 0.08);
    }

.uc-tags__label {
        margin-right: 4px;
        
        font-size: 0.85rem;
        font-weight: 700;
        color: #201547;
    }

.uc-tag {
        padding: 6px;
        background: #E0E0E0;
        border-radius: 4px;
        font-size: 0.72rem;
        font-weight: 700;
        letter-spacing: 0.03em;
        text-transform: uppercase;
        color: #201547;
    }

@media (max-width: 900px) {
    .industry-section-header {
            flex-direction: column;
        }
    .industry-section-header__desc {
            max-width: none;
        }
    .uc-row {
            flex-direction: column;
        }
    .uc-row__media {
            flex: 0 0 200px;
        }
    .uc-row__left {
            padding: 24px;
        }
    .uc-row__reveal-inner {
            padding-left: 0;
        }
}

.impact-slider-wrap .swiper-slide {
        height: stretch;
    }

.validation-section {
        margin-top: -55px;
        border-radius: var(--border-section) var(--border-section) 0 0;
        overflow: hidden;
        z-index: 1;
        padding-bottom: calc(var(--padding-section) + 25px);
    }

.validation-banner {
        display: flex;
        align-items: flex-end;
        min-height: clamp(400px, 60vh, 600px);
        overflow: hidden;
    }

.validation-banner__bg {
        position: absolute;
        inset: 0;
        z-index: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

.validation-banner__overlay {
        position: absolute;
        inset: 0;
        z-index: 1;
        background: linear-gradient(90deg, rgba(10, 15, 40, 0.85) 0%, rgba(10, 15, 40, 0.5) 40%, rgba(10, 15, 40, 0) 65%),
            linear-gradient(0deg, rgba(10, 15, 40, 0.45) 0%, rgba(10, 15, 40, 0) 55%);
    }

.validation-banner__content {
        position: absolute;
        bottom: 25px;
        z-index: 2;
        max-width: 540px;
        margin: 40px;
        padding: 32px;
        background: rgba(10, 12, 35, 0.55);
        border: 1px solid rgba(255, 255, 255, 0.1);
        border-radius: 5px;
        -webkit-backdrop-filter: blur(6px);
        backdrop-filter: blur(6px);
    }

.validation-banner__subtitle {
        margin: 0 0 12px;
        
        font-weight: 700;
        font-size: 24px;
        line-height: 1.3;
        color: #fff;
    }

.validation-banner__desc {
        margin: 0;
        
        font-weight: 400;
        font-size: 18px;
        line-height: 1.6;
        color: rgba(255, 255, 255, 0.8);
    }

.validation-banner__cta {
        margin-top: 24px;
    }

.section-footer-cta {
        display: flex;
        margin-top: 32px;
    }

    .IDC-logo {
      z-index: 1;
      margin-inline-start: auto;
    }
    

@media (max-width: 992px) {
    .validation-banner {
            min-height: 420px;
            flex-direction: column;
            justify-content: flex-end;
        }
    .validation-banner__content {
            margin: 24px;
            padding: 24px;
            position: relative;
        }
}

.faq-section {
        position: relative;
        z-index: 2;
        margin-top: -30px;
        background: #344C98;
        border-radius: var(--border-section) var(--border-section) 0 0;
        padding: clamp(48px, 8vw, 96px) 0;
    }

.faq-top {
        align-items: flex-start;
        padding-bottom: 40px;
    }

.faq-top__title {
        max-width: 640px;
    }

.faq-top__cta {
        flex: 1;
        max-width: 420px;
    }

.faq-top__desc {
        margin: 0;
        
        font-size: 18px;
        line-height: 1.6;
        color: rgba(255, 255, 255, 0.85);
    }

.faq-btn {
        display: inline-flex;
        align-items: center;
        gap: 14px;
        width: fit-content;
        padding: 14px 22px;
        background: #fff;
        color: #151128;
        
        font-size: 0.8rem;
        font-weight: 700;
        letter-spacing: 0.05em;
        text-transform: uppercase;
        text-decoration: none;
        border-radius: 4px;
        transition: background 0.2s ease;
    }

.faq-btn:hover {
        background: var(--color-lime, #C3D534);
    }

.faq-btn-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 22px;
        height: 22px;
        background: var(--color-lime, #C3D534);
        color: #151128;
        border-radius: 4px;
        font-size: 0.8rem;
    }

.faq-divider {
        border-top: 1px solid rgba(255, 255, 255, 0.18);
    }

.faq-heading {
        margin: 40px 0 8px !important;
    }

.faq-list {
        margin-top: 24px;
    }

.faq-item {
        border-bottom: 1px solid rgba(255, 255, 255, 0.18);
        transition: 0.3s ease;
    }

    .faq-item.is-open {
        border-bottom: 1px solid rgba(255, 255, 255);
    }

.faq-item__q {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 24px;
        width: 100%;
        padding: 24px 0;
        background: none;
        border: none;
        text-align: start;
        cursor: pointer;
    }

.faq-item__q span:first-child {
        font-size: 18px;
        font-weight: 400;
        line-height: 1.4;
        color: #fff;
    }

.faq-item__toggle {
        position: relative;
        flex-shrink: 0;
        width: 28px;
        height: 28px;
        border-radius: 50%;
        border: 1px solid rgba(255, 255, 255, 0.35);
        transition: background 0.25s ease, border-color 0.25s ease;
    }

.faq-item__toggle::before,
    .faq-item__toggle::after {
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        background: #fff;
        transition: opacity 0.25s ease, transform 0.25s ease, background 0.25s ease;
    }

.faq-item__toggle::before {
        width: 10px;
        height: 1.5px;
        transform: translate(-50%, -50%);
    }

.faq-item__toggle::after {
        width: 1.5px;
        height: 10px;
        transform: translate(-50%, -50%);
    }

.faq-item.is-open .faq-item__toggle {
        background: var(--color-lime, #C3D534);
        border-color: var(--color-lime, #C3D534);
    }

.faq-item.is-open .faq-item__toggle::before,
    .faq-item.is-open .faq-item__toggle::after {
        background: #151128;
    }

.faq-item.is-open .faq-item__toggle::after {
        opacity: 0;
        transform: translate(-50%, -50%) scaleY(0);
    }

.faq-item__a {
        max-height: 0;
        overflow: hidden;
        transition: max-height 0.35s ease, padding-bottom 0.35s ease;
    }

.faq-item__a p {
        margin: 0;
        max-width: 720px;
        padding: 0 40px 24px 0;
        
        font-size: 0.9rem;
        line-height: 1.6;
        color: rgba(255, 255, 255, 0.75);
    }

.faq-item.is-open .faq-item__a {
        max-height: 320px;
    }

@media (max-width: 900px) {
    .faq-top {
            flex-direction: column;
        }
    .faq-top__title {
            flex: 1;
            max-width: none;
        }
    .faq-top__cta {
            max-width: none;
        }
        .faq-item__a p {
          padding: 0 0px 24px 0;
        }
}

/* Industry-specific impact-slider variant (differs from the pillar design) */
body.zaintech-new-industry .impact-section {
    border-radius: 30px;
    margin-top: -25px;
    overflow: hidden;
        z-index: 1;
    position: relative;
}

body.zaintech-new-industry .impact-card {
    border-radius: 5px;
}

body.zaintech-new-industry .impact-nav {
    border-top: 0;
}

body.zaintech-new-industry .impact-pagination {
    max-width: none;
}

[lang="ar"] .zt-circle::before,
[lang="ar"] .zt-circle::after,
[lang="ar"] .zt-logo::before {
  animation: pulse-routate 3s ease-out infinite;
}


@keyframes pulse-routate {
  0% {
    transform: translate(50%, -50%) scale(.8);
    opacity: .7;
  }

  50% {
    opacity: .35;
  }

  100% {
    transform: translate(50%, -50%) scale(1.15);
    opacity: 0;
  }
}

[lang="ar"] .dc-media__card {
  right: auto;
  left: 20px;
}


[lang="ar"] .impact-nav__btn {
  transform: rotate(180deg);
}

[lang="ar"] .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  transform-origin: right top;
}


[lang="ar"] .cr-hero__left .cr-col-img--1 {
  right: 0;
  left: auto;
}
[lang="ar"] .cr-hero__left .cr-col-img--2 {
    left: 10%;
    right: auto;
}

[lang="ar"] .cr-hero__right .cr-col-img--1 {
     left: 0;
    right: auto;
}
[lang="ar"] .cr-hero__right .cr-col-img--2 {
        right: 10%;
    left: auto;
}
[lang="ar"] .uc-step:not(:last-child)::after {
    left: auto;
    right: 19px;
}

/* ═══════════════════════════════════════════════════════════════
   Core Capabilities — Design 2 (image + Why ZainTECH capability rows).
   Selected per section via the "Design" field; the rows themselves reuse
   the .why-zaintech__* rules above.
   ═══════════════════════════════════════════════════════════════ */

.dc-section--rows .dc-rows__media {
    position: relative;
    z-index: 1;
    height: stretch;
    border-radius: 12px;
}

.dc-section--rows .dc-rows__media div {
    max-height: 500px; position:sticky; top:120px;
}

.dc-section--rows .dc-rows__media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dc-section--rows .why-zaintech__list {
    max-width: none;
}

.dc-section--rows .why-zaintech__row:last-child {
    border-bottom: 1px solid rgba(26, 26, 46, 0.1);
}

.dc-section--rows .dc-rows__cta {
    margin-top: 32px;
}

@media (max-width: 992px) {
    .dc-section--rows .dc-rows__media {
        max-width: none;
    }
}


/* ═══════════════════════════════════════════════════════════════
   Our Approach — pillar sections (digital/approach.php). Same design as
   the industry approach section (why-zaintech-*), on a dark background,
   with alternating groups (collage left / rows right, then mirrored).
   ═══════════════════════════════════════════════════════════════ */

.why-zaintech-section.dark-bg {
   background: radial-gradient(circle at 15% 20%, rgba(52, 76, 152, 0.5) 0%, rgba(5, 5, 15, 0) 45%), linear-gradient(150deg, #0d0d2a 0%, #151245 50%, #1c1c52 100%);
    border-radius: var(--border-section) var(--border-section) 0 0;
    margin-top: -25px;
    z-index: 1;
}

.why-zaintech-section.dark-bg .container.border-top {
    border-top-color: rgba(255, 255, 255, 0.14);
}

.why-zaintech-section.dark-bg .section-title {
    color: #fff;
}

.why-zaintech-section.dark-bg .label-why-zaintech__list,
.why-zaintech-section.dark-bg .why-zaintech__label {
    color: #fff;
}

.why-zaintech-section.dark-bg .why-zaintech__row-desc,
.why-zaintech-section.dark-bg .why-zaintech__desc {
    color: rgba(255, 255, 255, 0.78);
}

.why-zaintech-section.dark-bg .label-why-zaintech__list,
.why-zaintech-section.dark-bg .why-zaintech__row {
    border-bottom-color: rgba(255, 255, 255, 0.14);
}

/* Groups after the first sit under a divider instead of hugging the one above. */
.why-zaintech-section.dark-bg .d-flex.gap-64 + .d-flex.gap-64 {
    padding-top: clamp(32px, 5vw, 64px);
    border-top: 1px solid rgba(255, 255, 255, 0.12);
}

/* Mirrored groups: push the collage to the outer edge. */
.why-zaintech-section.dark-bg .flex-row-reverse .cr-hero__collage {
    margin-left: auto;
}

[lang="ar"] .why-zaintech-section.dark-bg .flex-row-reverse .cr-hero__collage {
    margin-left: 0;
    margin-right: auto;
}
[lang="ar"] .sp-card .sp-card__link-icon {
    transform: rotate(180deg) ;
}

[lang="ar"] .sp-card:hover .sp-card__link-icon {
    transform: rotate(180deg) translateX(3px);
}

@media (max-width: 992px) {
    .why-zaintech-section.dark-bg .cr-hero__collage {
        margin: 0 auto;
    }
}

/* Reusable partner logos — available on Solution and Industry pages. */
.zt-partner-logos {
    background: #fff;
}

.zt-partner-logos__header {
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-width: 760px;
    margin-bottom: clamp(32px, 5vw, 56px);
}

.zt-partner-logos__description {
    max-width: 680px;
    margin: 0;
    color: #4a4a5a;
    font-size: 18px;
    font-weight: 300;
    line-height: 1.55;
}

.zt-partner-logos__grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 14px;
}

.zt-partner-logos__card {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 120px;
    padding: 28px 24px;
    overflow: hidden;
    border: 1px solid rgba(26, 26, 46, 0.1);
    border-radius: 12px;
	background: #fff;
	text-decoration: none;
}

.zt-partner-logos__image {
    width: auto;
    max-width: 140px;
    height: auto;
    max-height: 56px;
    object-fit: contain;
}

@media (max-width: 1200px) {
    .zt-partner-logos__grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 992px) {
    .zt-partner-logos__grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 640px) {
    .zt-partner-logos__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
    }

    .zt-partner-logos__card {
        min-height: 96px;
        padding: 20px 16px;
    }

    .zt-partner-logos__image {
        max-width: 112px;
        max-height: 46px;
    }
}