/* ==========================================================================
   Tridhya Tech — Service detail pages (static build)
   Inner-page template starting with Custom Software Development.
   Loads after homepage.css and reuses its scoped design system
   (.th-container, .th-section-head, .th-btn, .th-work slider, stats).
   All rules are scoped under .tridhya-homepage; new sections use
   the svc- prefix. Enqueue on service detail templates only.
   ========================================================================== */

/* ---------- Anchored sections clear the fixed header ---------- */
.tridhya-homepage .svc-subs,
.tridhya-homepage .svc-process,
.tridhya-homepage .svc-industries,
.tridhya-homepage .svc-stack,
.tridhya-homepage #svc-work,
.tridhya-homepage .svc-blog,
.tridhya-homepage .svc-about {
  scroll-margin-top: 90px;
}

/* ============================================================
   Hero — the dark-band family (petrol gradient, masked grid,
   aqua glow) in a compact inner-page proportion.
   ============================================================ */
.tridhya-homepage .svc-hero {
  position: relative;
  overflow: hidden;
  background: linear-gradient(158deg, #04283f 0%, #043453 55%, #054061 100%);
  color: #f4f5f7;
}
.tridhya-homepage .svc-hero__bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.tridhya-homepage .svc-hero__grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(to right, rgba(255, 255, 255, 0.05) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255, 255, 255, 0.05) 1px, transparent 1px);
  background-size: 28px 28px;
  -webkit-mask-image: radial-gradient(860px 480px at 86% 4%, #000 0%, transparent 72%);
          mask-image: radial-gradient(860px 480px at 86% 4%, #000 0%, transparent 72%);
}
.tridhya-homepage .svc-hero__glow {
  position: absolute;
  right: -160px;
  top: -200px;
  width: 560px;
  height: 380px;
  border-radius: 999px;
  background: rgba(6, 182, 232, 0.16);
  filter: blur(120px);
}
.tridhya-homepage .svc-hero__content {
  position: relative;
  padding-top: 96px;
  padding-bottom: 72px;
}
.tridhya-homepage .svc-breadcrumb {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  font-size: 0.8125rem;
  color: rgba(244, 245, 247, 0.55);
  margin-bottom: 30px;
}
.tridhya-homepage .svc-breadcrumb a {
  color: rgba(244, 245, 247, 0.72);
  transition: color 0.2s ease;
}
.tridhya-homepage .svc-breadcrumb a:hover {
  color: #fff;
}
.tridhya-homepage .svc-breadcrumb__sep {
  margin: 0 10px;
  opacity: 0.4;
}
.tridhya-homepage .svc-hero__title {
  font-family: var(--th-font-display);
  font-weight: 700;
  font-size: clamp(2.4rem, 4.8vw, 4.15rem);
  line-height: 1.04;
  letter-spacing: -0.03em;
  max-width: 28ch;
}
.tridhya-homepage .svc-hero__title-line {
  display: block;
}
.tridhya-homepage .svc-hero__title .th-accent {
  background: linear-gradient(92deg, var(--th-aqua) 0%, #7ad7f4 55%, #c9ecfa 100%);
  -webkit-background-clip: text;
          background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}
.tridhya-homepage .svc-hero__sub {
  max-width: 660px;
  font-size: 1.0625rem;
  line-height: 1.7;
  color: rgba(244, 245, 247, 0.72);
}
.tridhya-homepage .svc-hero__ctas {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 36px;
}
.tridhya-homepage .svc-hero__badges {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 18px 30px;
  margin-top: 48px;
  padding-top: 28px;
  border-top: 1px solid rgba(255, 255, 255, 0.14);
}
/* Badge sizes match the homepage hero (its v3.9 legibility pass):
   square seals read larger than wordmarks at the same clarity. */
.tridhya-homepage .svc-hero__badges img {
  width: auto;
  opacity: 1;
}
.tridhya-homepage .svc-hero__badges img[src*="nse-logo"] {
  height: 38px;
}
/* NSE mark + its "Listed" caption travel as one unit */
.tridhya-homepage .svc-hero__badge-nse {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: 0.8125rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: rgba(244, 245, 247, 0.75);
}
.tridhya-homepage .svc-hero__badges img[src*="iso-logo"],
.tridhya-homepage .svc-hero__badges img[src*="iso-iec-logo"] {
  height: 58px;
}
.tridhya-homepage .svc-hero__badges img[src*="adobe"] {
  height: 38px;
}
.tridhya-homepage .svc-hero__badges img[src*="liferay"] {
  height: 36px;
}
@media (min-width: 1024px) {
  .tridhya-homepage .svc-hero__content {
    padding-top: 124px;
    padding-bottom: 96px;
  }
}

/* ============================================================
   Sub services — hairline grid of white cells, icon rows.
   Hover joins the industries invert (petrol, white type).
   ============================================================ */
.tridhya-homepage .svc-subs {
  padding-block: 66px 48px;
  background: var(--th-white);
}
@media (min-width: 1024px) {
  .tridhya-homepage .svc-subs {
    padding-block: 96px 60px;
  }
}
.tridhya-homepage .svc-subs__grid {
  display: grid;
  gap: 1px;
  margin-top: 56px;
  background: var(--th-hairline);
  border: 1px solid var(--th-hairline);
  grid-template-columns: 1fr;
}
@media (min-width: 768px) {
  .tridhya-homepage .svc-subs__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
.tridhya-homepage .svc-subs__cell {
  display: flex;
  align-items: flex-start;
  gap: 20px;
  padding: 34px 32px;
  background: #fff;
  transition: background-color 0.35s ease, transform 0.35s ease;
}
.tridhya-homepage .svc-subs__icon {
  flex: none;
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  font-size: 22px;
  color: var(--th-petro);
  background: var(--th-petro-tint);
  transition: background-color 0.35s ease, color 0.35s ease;
}
.tridhya-homepage .svc-subs__body h3 {
  font-family: var(--th-font-display);
  font-size: 1.1875rem;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.01em;
  color: var(--th-ink);
  transition: color 0.35s ease;
}
.tridhya-homepage .svc-subs__body p {
  margin-top: 8px;
  font-size: 0.9375rem;
  line-height: 1.65;
  color: var(--th-ink-soft);
  transition: color 0.35s ease;
}
.tridhya-homepage .svc-subs__cell:hover {
  background: #043453;
  transform: translateY(-4px);
}
.tridhya-homepage .svc-subs__cell:hover .svc-subs__icon {
  color: var(--th-aqua);
  background: rgba(6, 182, 232, 0.14);
}
.tridhya-homepage .svc-subs__cell:hover .svc-subs__body h3 {
  color: #fff;
}
.tridhya-homepage .svc-subs__cell:hover .svc-subs__body p {
  color: rgba(244, 245, 247, 0.75);
}

/* ============================================================
   Client strip (compact) — one label, the same hairline logo
   grid as the homepage band, 8-up on wide screens.
   ============================================================ */
.tridhya-homepage .svc-clients {
  padding-block: 48px 80px;
  background: var(--th-white);
}
@media (min-width: 1024px) {
  .tridhya-homepage .svc-clients {
    padding-block: 64px 80px;
  }
}
.tridhya-homepage .svc-clients__label {
  text-align: center;
  font-size: 0.8125rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: rgba(13, 58, 84, 0.5);
}
.tridhya-homepage .svc-clients__grid {
  margin-top: 56px;
}
@media (min-width: 640px) {
  .tridhya-homepage .svc-clients__grid {
    grid-template-columns: repeat(4, 1fr);
  }
}
@media (min-width: 1024px) {
  .tridhya-homepage .svc-clients__grid {
    grid-template-columns: repeat(8, 1fr);
  }
}

/* ============================================================
   How we deliver — borderless white cards on the wash, each
   led by a petrol icon tile and an outlined ghost numeral.
   Hover sweeps a petrol-to-aqua line across the card top.
   ============================================================ */
.tridhya-homepage .svc-process {
  padding-block: 64px;
  background: linear-gradient(180deg, #f3fbff 0%, #e9f5fc 55%, #e2f1fa 100%);
}
@media (min-width: 1024px) {
  .tridhya-homepage .svc-process {
    padding-block: 96px;
  }
}
.tridhya-homepage .svc-process__grid {
  display: grid;
  margin-top: 56px;
  grid-template-columns: 1fr;
  gap: 20px;
}
@media (min-width: 640px) {
  .tridhya-homepage .svc-process__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (min-width: 1024px) {
  .tridhya-homepage .svc-process__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
.tridhya-homepage .svc-process__step {
  position: relative;
  overflow: hidden;
  padding: 30px 30px 34px;
  background: #fff;
}
.tridhya-homepage .svc-process__step::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 3px;
  background: linear-gradient(90deg, var(--th-petro), var(--th-aqua));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.45s var(--th-ease);
}
.tridhya-homepage .svc-process__step:hover::after {
  transform: scaleX(1);
}
.tridhya-homepage .svc-process__num {
  position: absolute;
  top: 10px;
  right: 20px;
  font-family: var(--th-font-display);
  font-size: 3.5rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.04em;
  color: transparent;
  -webkit-text-stroke: 1.5px rgba(0, 81, 124, 0.2);
  transition: -webkit-text-stroke-color 0.35s ease;
}
.tridhya-homepage .svc-process__step:hover .svc-process__num {
  -webkit-text-stroke-color: rgba(6, 182, 232, 0.6);
}
.tridhya-homepage .svc-process__icon {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  font-size: 23px;
  color: #fff;
  background: var(--th-petro);
  transition: background-color 0.35s ease;
}
.tridhya-homepage .svc-process__step:hover .svc-process__icon {
  background: var(--th-aqua);
}
.tridhya-homepage .svc-process__phase {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-top: 26px;
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.14em;
  color: var(--th-petro);
}
.tridhya-homepage .svc-process__phase::before {
  content: '';
  width: 16px;
  height: 2px;
  background: var(--th-aqua);
}
.tridhya-homepage .svc-process__step h3 {
  margin-top: 14px;
  font-family: var(--th-font-display);
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.01em;
  color: var(--th-ink);
}
.tridhya-homepage .svc-process__step p {
  margin-top: 10px;
  font-size: 0.9375rem;
  line-height: 1.65;
  color: var(--th-ink-soft);
}

/* ============================================================
   Industries & use cases — divided editorial list on the left,
   dark branded "common engagements" panel on the right.
   ============================================================ */
.tridhya-homepage .svc-industries {
  padding-block: 64px;
  background: var(--th-white);
}
@media (min-width: 1024px) {
  .tridhya-homepage .svc-industries {
    padding-block: 96px;
  }
}
.tridhya-homepage .svc-industries__grid {
  display: grid;
  margin-top: 56px;
  gap: 48px;
  align-items: start;
}
@media (min-width: 1024px) {
  .tridhya-homepage .svc-industries__grid {
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    gap: 72px;
  }
}
.tridhya-homepage .svc-industries__row {
  display: grid;
  grid-template-columns: 44px 1fr;
  gap: 18px;
  padding: 22px 0;
  border-bottom: 1px solid var(--th-hairline);
}
.tridhya-homepage .svc-industries__row:last-child {
  border-bottom: 0;
}
.tridhya-homepage .svc-industries__row:first-child {
  padding-top: 0;
}
.tridhya-homepage .svc-industries__icon {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  font-size: 21px;
  color: var(--th-petro);
  background: var(--th-petro-tint);
}
.tridhya-homepage .svc-industries__row h3 {
  font-family: var(--th-font-display);
  font-size: 1.1875rem;
  font-weight: 700;
  line-height: 1.25;
  letter-spacing: -0.01em;
  color: var(--th-ink);
}
.tridhya-homepage .svc-industries__row p {
  margin-top: 5px;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--th-ink-soft);
}
.tridhya-homepage .svc-industries__chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}
.tridhya-homepage .svc-industries__chips .th-chip {
  padding: 5px 12px;
}

.tridhya-homepage .svc-usecases {
  position: relative;
  overflow: hidden;
  padding: 44px 40px;
  background: linear-gradient(158deg, #04283f 0%, #043453 55%, #054061 100%);
  color: #f4f5f7;
}
@media (min-width: 1024px) {
  .tridhya-homepage .svc-usecases {
    position: sticky;
    top: 112px;
    padding: 52px 48px;
  }
}
.tridhya-homepage .svc-usecases__grid-bg {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(to right, rgba(255, 255, 255, 0.05) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255, 255, 255, 0.05) 1px, transparent 1px);
  background-size: 28px 28px;
  -webkit-mask-image: radial-gradient(560px 340px at 90% 0%, #000 0%, transparent 74%);
          mask-image: radial-gradient(560px 340px at 90% 0%, #000 0%, transparent 74%);
}
.tridhya-homepage .svc-usecases__glow {
  position: absolute;
  right: -120px;
  top: -160px;
  width: 420px;
  height: 300px;
  border-radius: 999px;
  background: rgba(6, 182, 232, 0.16);
  filter: blur(110px);
}
.tridhya-homepage .svc-usecases__inner {
  position: relative;
}
.tridhya-homepage .svc-usecases .th-eyebrow--light {
  margin-bottom: 14px;
}
.tridhya-homepage .svc-usecases__inner h3 {
  margin: 0 0 18px;
  font-family: var(--th-font-display);
  font-size: clamp(1.5rem, 2.2vw, 1.875rem);
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -0.02em;
  color: #f4f5f7;
}
.tridhya-homepage .svc-usecases__list li {
  padding: 14px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}
.tridhya-homepage .svc-usecases__list li:last-child {
  border-bottom: 0;
}
.tridhya-homepage .svc-usecases__row {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 0.9375rem;
  font-weight: 600;
  color: rgba(244, 245, 247, 0.92);
}
.tridhya-homepage .svc-usecases__row .th-icon {
  flex: none;
  font-size: 16px;
  color: var(--th-aqua);
}
.tridhya-homepage .svc-usecases__list li p {
  margin-top: 6px;
  padding-left: 28px;
  font-size: 0.8125rem;
  line-height: 1.6;
  color: rgba(154, 217, 244, 0.66);
}
.tridhya-homepage .svc-usecases__link {
  margin-top: 26px;
  color: var(--th-aqua);
}
.tridhya-homepage .svc-usecases__link:hover {
  color: #7ad7f4;
}

/* ============================================================
   Tech stack — the full technology inventory from tridhyatech.com
   presented as tabs: one category bar (hairline underline tabs),
   one panel open at a time with category blurb left and hairline
   logo chips wrapping right. Chips gain an aqua edge on hover.
   ============================================================ */
.tridhya-homepage .svc-stack {
  padding-block: 64px;
  background: var(--th-paper);
}
@media (min-width: 1024px) {
  .tridhya-homepage .svc-stack {
    padding-block: 96px;
  }
}
.tridhya-homepage .svc-stack__tabs {
  margin-top: 48px;
  background: #fff;
  border: 1px solid var(--th-hairline);
}
.tridhya-homepage .svc-stack__bar {
  display: flex;
  flex-wrap: wrap;
  border-bottom: 1px solid var(--th-hairline);
  background: #fff;
}
@media (max-width: 767px) {
  .tridhya-homepage .svc-stack__tabs {
    position: relative;
  }
  .tridhya-homepage .svc-stack__tabs::after {
    content: '';
    position: absolute;
    top: 1px;
    right: 1px;
    width: 36px;
    height: 46px;
    background: linear-gradient(to left, #fff 30%, rgba(255, 255, 255, 0));
    pointer-events: none;
    z-index: 1;
    opacity: 1;
    transition: opacity 0.25s ease;
  }
  .tridhya-homepage .svc-stack__tabs.is-at-end::after {
    opacity: 0;
  }
  .tridhya-homepage .svc-stack__bar {
    flex-wrap: nowrap;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
    scroll-snap-type: x proximity;
  }
  .tridhya-homepage .svc-stack__bar::-webkit-scrollbar {
    display: none;
  }
  .tridhya-homepage .svc-stack__tab {
    scroll-snap-align: start;
  }
}
.tridhya-homepage .svc-stack__tab {
  appearance: none;
  margin: 0;
  border: 0;
  background: none;
  cursor: pointer;
  position: relative;
  padding: 18px 22px;
  font-family: var(--th-font-body);
  font-size: 0.8125rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  white-space: nowrap;
  color: rgba(13, 58, 84, 0.55);
  transition: color 0.25s ease;
}
@media (max-width: 767px) {
  .tridhya-homepage .svc-stack__tab {
    flex: none;
    padding: 14px 16px;
  }
}
.tridhya-homepage .svc-stack__tab::after {
  content: '';
  position: absolute;
  left: 22px;
  right: 22px;
  bottom: -1px;
  height: 2px;
  background: var(--th-aqua);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.35s var(--th-ease);
}
@media (max-width: 767px) {
  .tridhya-homepage .svc-stack__tab::after {
    left: 16px;
    right: 16px;
  }
}
.tridhya-homepage .svc-stack__tab:hover {
  color: var(--th-petro);
}
.tridhya-homepage .svc-stack__tab.is-active {
  color: var(--th-petro);
}
.tridhya-homepage .svc-stack__tab.is-active::after {
  transform: scaleX(1);
}
.tridhya-homepage .svc-stack__tab:focus-visible {
  outline: 2px solid var(--th-aqua);
  outline-offset: -2px;
}
.tridhya-homepage .svc-stack__panel {
  padding: 32px 28px 36px;
}
@media (min-width: 1024px) {
  .tridhya-homepage .svc-stack__panel {
    display: grid;
    grid-template-columns: 300px minmax(0, 1fr);
    gap: 48px;
    align-items: start;
    padding: 38px 40px 42px;
  }
}
.tridhya-homepage .svc-stack__panel[hidden] {
  display: none;
}
@media (prefers-reduced-motion: no-preference) {
  .tridhya-homepage .svc-stack__panel.is-active {
    animation: svcPanelIn 0.45s var(--th-ease);
  }
  @keyframes svcPanelIn {
    from {
      opacity: 0;
      transform: translateY(8px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
}
.tridhya-homepage .svc-stack__cat h3 {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--th-font-body);
  font-size: 0.8125rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: var(--th-petro);
}
.tridhya-homepage .svc-stack__cat h3::before {
  content: '';
  width: 14px;
  height: 2px;
  background: var(--th-aqua);
}
.tridhya-homepage .svc-stack__cat p {
  margin-top: 10px;
  max-width: 32ch;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--th-ink-soft);
}
.tridhya-homepage .svc-stack__logos {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.tridhya-homepage .svc-stack__logo {
  display: grid;
  place-items: center;
  height: 62px;
  padding: 0 22px;
  background: #fff;
  border: 1px solid var(--th-hairline);
  transition: border-color 0.25s ease;
}
.tridhya-homepage .svc-stack__logo:hover {
  border-color: var(--th-aqua);
}
.tridhya-homepage .svc-stack__logo img {
  height: 30px;
  max-width: 112px;
  width: auto;
  object-fit: contain;
}

/* Case studies reuse the homepage .th-work slider on its dark bed */

/* ============================================================
   Blog — three white cards in a hairline grid on the paper bed.
   Structure mirrors tridhyatech.com/blog: image, category, title,
   excerpt, date. Brand polish: petrol category tag with an aqua
   dash, petrol wash fading over the image on hover, aqua title
   hover, hairline-ruled date row pinned to the card foot.
   ============================================================ */
.tridhya-homepage .svc-blog {
  padding-block: 64px;
  background: var(--th-paper);
}
@media (min-width: 1024px) {
  .tridhya-homepage .svc-blog {
    padding-block: 96px;
  }
}
.tridhya-homepage .svc-blog__grid {
  display: grid;
  gap: 1px;
  margin-top: 56px;
  background: var(--th-hairline);
  border: 1px solid var(--th-hairline);
  grid-template-columns: 1fr;
}
@media (min-width: 768px) {
  .tridhya-homepage .svc-blog__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
.tridhya-homepage .svc-blog__card {
  display: flex;
  flex-direction: column;
  background: #fff;
}
.tridhya-homepage .svc-blog__media {
  position: relative;
  display: block;
  overflow: hidden;
}
.tridhya-homepage .svc-blog__media::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0, 81, 124, 0) 45%, rgba(0, 81, 124, 0.42) 100%);
  opacity: 0;
  transition: opacity 0.45s ease;
}
.tridhya-homepage .svc-blog__card:hover .svc-blog__media::after {
  opacity: 1;
}
.tridhya-homepage .svc-blog__media img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  transition: transform 0.6s var(--th-ease);
}
.tridhya-homepage .svc-blog__card:hover .svc-blog__media img {
  transform: scale(1.05);
}
.tridhya-homepage .svc-blog__body {
  display: flex;
  flex-direction: column;
  flex: 1;
  padding: 26px 28px 26px;
}
.tridhya-homepage .svc-blog__cat {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  color: var(--th-petro);
}
.tridhya-homepage .svc-blog__cat::before {
  content: '';
  width: 14px;
  height: 2px;
  background: var(--th-aqua);
}
.tridhya-homepage .svc-blog__body h3 {
  margin-top: 14px;
  font-family: var(--th-font-display);
  font-size: 1.1875rem;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -0.01em;
}
.tridhya-homepage .svc-blog__body h3 a {
  color: inherit;
  transition: color 0.2s ease;
}
.tridhya-homepage .svc-blog__body h3 a:hover {
  color: var(--th-petro);
}
.tridhya-homepage .svc-blog__desc {
  margin-top: 10px;
  margin-bottom: 22px;
  font-size: 0.9375rem;
  line-height: 1.65;
  color: var(--th-ink-soft);
}
.tridhya-homepage .svc-blog__date {
  margin-top: auto;
  padding-top: 16px;
  border-top: 1px solid var(--th-hairline);
  font-size: 0.8125rem;
  letter-spacing: 0.02em;
  color: rgba(13, 58, 84, 0.52);
  font-variant-numeric: tabular-nums;
}

/* ============================================================
   About Tridhya Tech — dark band from the hero family (petrol
   gradient, masked grid, aqua glow): content left, sticky photo
   panel right, white metric numerals with aqua suffixes.
   ============================================================ */
.tridhya-homepage .svc-about {
  position: relative;
  overflow: hidden;
  padding-block: 64px;
  background: linear-gradient(158deg, #04283f 0%, #043453 55%, #054061 100%);
  color: #f4f5f7;
}
@media (min-width: 1024px) {
  .tridhya-homepage .svc-about {
    padding-block: 96px;
  }
}
.tridhya-homepage .svc-about__bg {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.tridhya-homepage .svc-about__grid-bg {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(to right, rgba(255, 255, 255, 0.05) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255, 255, 255, 0.05) 1px, transparent 1px);
  background-size: 28px 28px;
  -webkit-mask-image: radial-gradient(760px 440px at 88% 10%, #000 0%, transparent 74%);
          mask-image: radial-gradient(760px 440px at 88% 10%, #000 0%, transparent 74%);
}
.tridhya-homepage .svc-about__glow {
  position: absolute;
  left: -170px;
  bottom: -220px;
  width: 520px;
  height: 360px;
  border-radius: 999px;
  background: rgba(6, 182, 232, 0.14);
  filter: blur(120px);
}
.tridhya-homepage .svc-about__grid {
  position: relative;
  display: grid;
  gap: 56px;
}
@media (min-width: 1024px) {
  .tridhya-homepage .svc-about__grid {
    grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
    gap: 80px;
    align-items: start;
  }
}
.tridhya-homepage .svc-about__body h2 {
  margin: 16px 0 28px;
  max-width: 22ch;
  font-family: var(--th-font-display);
  font-size: clamp(2rem, 3.6vw, 3.1rem);
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: -0.03em;
  color: #f4f5f7;
}
.tridhya-homepage .svc-about__copy {
  max-width: 580px;
  font-size: 1rem;
  line-height: 1.7;
  color: rgba(244, 245, 247, 0.72);
}
.tridhya-homepage .svc-about__copy + .svc-about__copy {
  margin-top: 16px;
}
.tridhya-homepage .svc-about__stats {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 28px 20px;
  margin: 44px 0 0;
  padding-block: 0;
  border-block: none;
}
@media (min-width: 640px) {
  .tridhya-homepage .svc-about__stats {
    grid-template-columns: repeat(4, 1fr);
  }
}
.tridhya-homepage .svc-about__stats .th-stat {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 6px;
  border-left: 0;
  padding-left: 0;
}
.tridhya-homepage .svc-about__stats .th-stat strong {
  font-size: 2rem;
  line-height: 1;
  letter-spacing: -0.02em;
  color: #fff;
  font-variant-numeric: tabular-nums;
}
.tridhya-homepage .svc-about__stats .th-stat strong em {
  color: var(--th-aqua);
}
.tridhya-homepage .svc-about__stats .th-stat .th-count {
  font-style: normal;
}
.tridhya-homepage .svc-about__stats .th-stat span {
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  color: rgba(154, 217, 244, 0.66);
}
.tridhya-homepage .svc-about__actions {
  margin-top: 44px;
}
.tridhya-homepage .svc-about__art {
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: rgba(255, 255, 255, 0.03);
  padding: 0;
}
@media (min-width: 1024px) {
  .tridhya-homepage .svc-about__art {
    position: sticky;
    top: 112px;
  }
}
.tridhya-homepage .svc-about__art img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}


/* ============================================================
   v15 — the clients section goes dark (user feedback)
   "Trusted by global enterprises" now sits on the same dark
   petrol gradient family as the work section. Client logos are
   opaque white tiles, so they read as white cards floating on
   the dark band; stats switch to white numerals with aqua
   suffixes and hairlines go white-alpha.
   ============================================================ */
.tridhya-homepage .svc-clients {
  padding-block: 64px 88px;
  background:
    radial-gradient(1000px 640px at 14% 0%, rgba(6, 146, 204, 0.18) 0%, transparent 60%),
    radial-gradient(800px 520px at 92% 100%, rgba(0, 81, 124, 0.35) 0%, transparent 62%),
    linear-gradient(170deg, #04283f 0%, #032e49 100%);
  color: #eef7fc;
}
.tridhya-homepage .svc-clients .th-section-head {
  border-top-color: rgba(255, 255, 255, 0.16);
}
.tridhya-homepage .svc-clients .th-eyebrow {
  color: var(--th-aqua);
}
.tridhya-homepage .svc-clients .th-section-head h2 {
  color: #f4f5f7;
}
.tridhya-homepage .svc-clients .th-h-muted {
  color: var(--th-aqua);
}
.tridhya-homepage .svc-clients .th-marquee__head .th-stat strong {
  color: #ffffff;
}
.tridhya-homepage .svc-clients .th-marquee__head .th-stat strong em {
  color: var(--th-aqua);
}
.tridhya-homepage .svc-clients .th-marquee__head .th-stat span {
  color: rgba(238, 247, 252, 0.66);
}
.tridhya-homepage .svc-clients .th-marquee__grid {
  margin-top: 32px;
  gap: 14px;
  background: transparent;
  border: 0;
}
