/** Services hub page styles. Loaded only by page-services.php. */
.tk-services-hub {
  background:
    radial-gradient(circle at 14% 5%, rgba(159, 201, 223, 0.28), transparent 26rem),
    radial-gradient(circle at 88% 20%, rgba(217, 139, 58, 0.16), transparent 28rem),
    linear-gradient(180deg, #fbf7ef 0%, var(--tk-color-background) 42%, #f4efe5 100%);
}

.tk-services-hero {
  padding-block: clamp(var(--tk-space-64), 9vw, var(--tk-space-128));
}

.tk-services-hero__inner,
.tk-connected-system__layout,
.tk-services-next-steps__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(19rem, 0.64fr);
  gap: clamp(var(--tk-space-32), 6vw, var(--tk-space-96));
  align-items: start;
}

.tk-services-hero h1 {
  max-width: 13ch;
}

.tk-services-hero__lede {
  max-width: 46rem;
  color: var(--tk-color-text-secondary);
  font-size: var(--tk-font-size-body-large);
}

.tk-services-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--tk-space-16);
  margin-block-start: var(--tk-space-32);
}

.tk-services-hero__router,
.tk-diagnosis-card,
.tk-service-route-card,
.tk-services-proof__panel,
.tk-services-proof__grid article,
.tk-decision-row {
  border: 1px solid var(--tk-color-border);
  border-radius: var(--tk-radius-large);
  background: color-mix(in srgb, var(--tk-color-surface-raised) 90%, transparent);
  box-shadow: var(--tk-shadow-soft);
}

.tk-services-hero__router {
  padding: clamp(var(--tk-space-24), 4vw, var(--tk-space-32));
}

.tk-services-hero__router-title,
.tk-service-route-card__distinction,
.tk-decision-row__start {
  color: var(--tk-color-text-primary);
  font-weight: 900;
}

.tk-services-hero__router ul {
  display: grid;
  gap: var(--tk-space-12);
  margin: var(--tk-space-24) 0 0;
  padding: 0;
  list-style: none;
}

.tk-services-hero__router a {
  display: block;
  padding: var(--tk-space-12) var(--tk-space-16);
  border: 1px solid var(--tk-color-border);
  border-radius: var(--tk-radius-medium);
  background: rgba(255, 255, 255, 0.48);
  font-weight: 800;
  text-decoration: none;
}

.tk-diagnosis-grid,
.tk-service-card-grid,
.tk-services-proof__grid {
  display: grid;
  gap: var(--tk-space-24);
}

.tk-diagnosis-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.tk-diagnosis-card,
.tk-service-route-card,
.tk-services-proof__grid article {
  padding: clamp(var(--tk-space-24), 4vw, var(--tk-space-32));
}

.tk-diagnosis-card p,
.tk-service-route-card p,
.tk-services-proof__grid p,
.tk-decision-row p,
.tk-connected-system__list p,
.tk-services-next-steps__list p {
  color: var(--tk-color-text-secondary);
}

.tk-diagnosis-card__route {
  font-weight: 800;
}

.tk-service-group:nth-of-type(even),
.tk-connected-system,
.tk-services-proof {
  background: rgba(255, 255, 255, 0.34);
}

.tk-service-group__header {
  max-width: var(--tk-container-narrow);
  margin-block-end: var(--tk-space-48);
}

.tk-service-group__header > p:last-child {
  color: var(--tk-color-text-secondary);
  font-size: var(--tk-font-size-body-large);
}

.tk-service-card-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.tk-service-card-grid--two {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

/* Single remaining offer in a group: keep one card readable instead of
   stretching it across a column track sized for two or three. */
.tk-service-card-grid--single {
  grid-template-columns: minmax(0, 1fr);
  max-width: var(--tk-container-narrow);
}

.tk-service-route-card {
  display: flex;
  min-height: 100%;
  flex-direction: column;
}

.tk-service-route-card .tk-text-link {
  margin-block-start: auto;
}

.tk-connected-system__list {
  display: grid;
  gap: var(--tk-space-16);
  margin: 0;
  padding: 0;
  list-style: none;
}

.tk-connected-system__list li {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--tk-space-16);
  align-items: start;
  padding: var(--tk-space-24);
  border-block-start: 1px solid var(--tk-color-border);
}

.tk-connected-system__number {
  display: inline-grid;
  width: 3rem;
  height: 3rem;
  place-items: center;
  border-radius: var(--tk-radius-pill);
  background: var(--tk-color-brand-primary);
  color: var(--tk-color-text-inverse);
  font-weight: 900;
}

.tk-decision-list {
  display: grid;
  gap: var(--tk-space-16);
}

.tk-decision-row {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 0.7fr) minmax(0, 1.2fr) minmax(0, 1fr);
  gap: var(--tk-space-16);
  padding: var(--tk-space-24);
}

.tk-decision-row h3 {
  margin-block-end: 0;
  font-size: clamp(1.12rem, 2vw, 1.35rem);
  letter-spacing: -0.02em;
}

.tk-decision-row__label {
  display: block;
  margin-block-end: var(--tk-space-8);
  color: var(--tk-color-brand-secondary);
  font-size: var(--tk-font-size-label);
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.tk-services-proof__panel {
  padding: clamp(var(--tk-space-32), 5vw, var(--tk-space-64));
}

.tk-services-proof__grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.tk-services-final-cta {
  padding-block-start: var(--tk-space-64);
}

@media (max-width: 72rem) {
  .tk-diagnosis-grid,
  .tk-service-card-grid,
  .tk-services-proof__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tk-service-card-grid--single {
    grid-template-columns: minmax(0, 1fr);
  }

  .tk-decision-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 64rem) {
  .tk-services-hero__inner,
  .tk-connected-system__layout,
  .tk-services-next-steps__layout {
    grid-template-columns: 1fr;
  }

  .tk-services-hero h1 {
    max-width: 15ch;
  }
}

@media (max-width: 48rem) {
  .tk-diagnosis-grid,
  .tk-service-card-grid,
  .tk-service-card-grid--two,
  .tk-services-proof__grid,
  .tk-decision-row {
    grid-template-columns: 1fr;
  }

  .tk-connected-system__list li {
    grid-template-columns: 1fr;
  }
}