/* ============ HERO ============ */
.t-hero { position: relative; padding-block: var(--t-space-6) var(--t-space-7); overflow: hidden; }
.t-hero__network { position: absolute; inset: 0; z-index: 0; opacity: 0.9; pointer-events: none; }
.t-hero__content { position: relative; z-index: 1; }
.t-hero__headline {
  font-size: clamp(2.4rem, 7vw, var(--t-size-4xl));
  line-height: var(--t-lh-tight);
  letter-spacing: var(--t-tracking-tight);
  font-weight: 600;
  max-width: 16ch;
}
.t-hero__sub { margin-top: var(--t-space-4); max-width: 40ch; }
.t-hero__actions { margin-top: var(--t-space-4); display: flex; gap: 1.5rem; align-items: center; flex-wrap: wrap; }

/* ============ PHILOSOPHY ============ */
.t-philosophy { text-align: left; }
.t-philosophy__quote {
  font-size: clamp(1.8rem, 4.2vw, var(--t-size-2xl));
  line-height: var(--t-lh-snug);
  letter-spacing: var(--t-tracking-tight);
  font-weight: 500;
  max-width: 22ch;
}
.t-philosophy__attribution { margin-top: var(--t-space-3); }

/* ============ TRANSFORMATION FEATURE ============ */
.t-feature { display: grid; gap: var(--t-space-4); }
.t-feature__headline { max-width: 14ch; margin-bottom: var(--t-space-5); }
.t-feature__media { position: relative; aspect-ratio: 16/10; overflow: hidden; background: var(--t-gray-100); }
.t-feature__media img { width: 100%; height: 100%; object-fit: cover; }
.t-feature__stages { display: grid; gap: var(--t-space-3); margin-top: var(--t-space-4); }
@media (min-width: 900px) { .t-feature__stages { grid-template-columns: repeat(3, 1fr); } }
.t-feature__stage { border-top: 1px solid var(--t-border); padding-top: var(--t-space-2); }
.t-feature__stage .t-eyebrow { color: var(--t-accent); }
.t-feature__stage p { margin-top: 0.6em; }
.t-feature__cta { margin-top: var(--t-space-4); }

/* ============ INTERACTIVE NETWORK (What We Do) ============ */
.t-network-section__headline { max-width: 18ch; margin-bottom: var(--t-space-3); }
.t-network-wrap { position: relative; margin-top: var(--t-space-5); }
.t-network-svg { width: 100%; height: auto; display: block; }
.t-network-node { cursor: pointer; }
.t-network-node circle { fill: var(--t-node-fill); transition: fill var(--t-duration-fast) var(--t-ease), r var(--t-duration-fast) var(--t-ease); }
.t-network-node.is-center circle { fill: var(--t-black); }
.t-network-node:hover circle, .t-network-node:focus-visible circle, .t-network-node.is-active circle { fill: var(--t-node-fill-active); }
.t-network-node text { fill: var(--t-black); font-size: 13px; font-weight: 600; letter-spacing: 0.02em; }
.t-network-node:hover text, .t-network-node.is-active text { fill: var(--t-blue); }
.t-network-line { stroke: var(--t-line-color); stroke-width: 1.2; transition: stroke var(--t-duration-fast) var(--t-ease), stroke-width var(--t-duration-fast) var(--t-ease); }
.t-network-line.is-active { stroke: var(--t-line-color-active); stroke-width: 1.8; }
.t-network-node:focus { outline: none; }
.t-network-node:focus circle { stroke: var(--t-accent); stroke-width: 2; }

.t-network-panel {
  margin-top: var(--t-space-3);
  border-top: 1px solid var(--t-border);
  padding-top: var(--t-space-3);
  min-height: 7rem;
}
.t-network-panel__title { font-size: var(--t-size-lg); font-weight: 600; margin-bottom: 0.4em; }
.t-network-panel__desc { color: var(--t-fg-muted); max-width: 48ch; }
.t-network-panel__link { margin-top: var(--t-space-2); display: inline-flex; }

/* Mobile network: stacked list instead of svg graph */
.t-network-mobile-list { display: grid; gap: 1px; background: var(--t-border); border: 1px solid var(--t-border); }
.t-network-mobile-item { background: var(--t-white); padding: var(--t-space-3); }
.t-network-mobile-item__title { font-weight: 600; font-size: var(--t-size-md); }
.t-network-mobile-item__desc { color: var(--t-fg-muted); margin-top: 0.5em; }
.t-network-mobile-item__link { margin-top: 0.8em; display: inline-flex; font-size: var(--t-size-xs); }

@media (max-width: 767px) {
  .t-network-wrap { display: none; }
}
@media (min-width: 768px) {
  .t-network-mobile-list { display: none; }
}

/* ============ TECH + PEOPLE ============ */
.t-tech-people { display: grid; gap: var(--t-space-4); align-items: center; }
@media (min-width: 900px) { .t-tech-people { grid-template-columns: 1fr 1fr; gap: var(--t-space-6); } }
.t-tech-people__media { aspect-ratio: 4/5; overflow: hidden; background: var(--t-gray-100); }
.t-tech-people__media img { width: 100%; height: 100%; object-fit: cover; }
.t-tech-people__equation { display: flex; align-items: center; gap: 1rem; margin: var(--t-space-3) 0; flex-wrap: wrap; }
.t-tech-people__equation span { font-size: var(--t-size-lg); font-weight: 600; }
.t-tech-people__equation .plus { color: var(--t-accent); font-size: var(--t-size-xl); }

/* ============ TRANSFORMATION STORIES GRID ============ */
.t-stories-grid { display: grid; gap: var(--t-space-4); margin-top: var(--t-space-5); }
@media (min-width: 900px) { .t-stories-grid { grid-template-columns: repeat(2, 1fr); } }
.t-story-card { display: block; border-top: 1px solid var(--t-border); padding-top: var(--t-space-3); }
.t-story-card__media { aspect-ratio: 16/10; overflow: hidden; background: var(--t-gray-100); margin-bottom: var(--t-space-3); }
.t-story-card__media img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--t-duration-normal) var(--t-ease); }
.t-story-card:hover .t-story-card__media img, .t-story-card:focus-visible .t-story-card__media img { transform: scale(1.04); }
.t-story-card__eyebrow { color: var(--t-accent); }
.t-story-card__title { margin-top: 0.5em; font-size: var(--t-size-lg); font-weight: 600; max-width: 26ch; }
.t-story-card__excerpt { margin-top: 0.6em; color: var(--t-fg-muted); max-width: 42ch; }

/* ============ INDUSTRIES ============ */
.t-industries { display: flex; flex-wrap: wrap; gap: 0.5em 0.6em; margin-top: var(--t-space-3); }
.t-industries li { font-size: var(--t-size-md); padding: 0.4em 0; display: flex; align-items: center; gap: 0.6em; }
.t-industries li:not(:last-child)::after { content: ''; width: 4px; height: 4px; border-radius: 50%; background: var(--t-gray-200); display: inline-block; margin-left: 0.4em; }
.t-industries__note { margin-top: var(--t-space-3); color: var(--t-fg-muted); max-width: 50ch; }

/* ============ CLIENT LOGOS ============ */
.t-logos { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; background: var(--t-border); border: 1px solid var(--t-border); margin-top: var(--t-space-5); }
@media (min-width: 700px) { .t-logos { grid-template-columns: repeat(4, 1fr); } }
.t-logos__item { background: var(--t-white); display: flex; align-items: center; justify-content: center; padding: var(--t-space-3); min-height: 96px; }
.t-logos__item img { max-height: 32px; width: auto; filter: grayscale(1); opacity: 0.7; transition: opacity var(--t-duration-fast) var(--t-ease), filter var(--t-duration-fast) var(--t-ease); }
.t-logos__item:hover img { filter: grayscale(0); opacity: 1; }
.t-logos__placeholder { font-size: var(--t-size-2xs); color: var(--t-gray-400); letter-spacing: var(--t-tracking-wide); text-transform: uppercase; text-align: center; }

/* ============ PERSPECTIVES ============ */
.t-perspectives-grid { display: grid; gap: var(--t-space-4); margin-top: var(--t-space-5); }
@media (min-width: 900px) { .t-perspectives-grid { grid-template-columns: repeat(3, 1fr); } }
.t-perspective-card { border-top: 1px solid var(--t-border); padding-top: var(--t-space-3); }
.t-perspective-card__title { font-size: var(--t-size-md); font-weight: 600; max-width: 28ch; }
.t-perspective-card__excerpt { margin-top: 0.6em; color: var(--t-fg-muted); }
.t-perspective-card__meta { margin-top: 0.8em; font-size: var(--t-size-2xs); letter-spacing: var(--t-tracking-wide); text-transform: uppercase; color: var(--t-gray-400); }

/* ============ ABOUT TEASER ============ */
.t-about-teaser__lead { font-size: clamp(1.6rem, 3.6vw, var(--t-size-xl)); font-weight: 500; max-width: 20ch; letter-spacing: var(--t-tracking-tight); }
.t-about-teaser__cols { display: grid; gap: var(--t-space-4); margin-top: var(--t-space-5); }
@media (min-width: 900px) { .t-about-teaser__cols { grid-template-columns: repeat(3, 1fr); } }
.t-about-teaser__col { border-top: 1px solid var(--t-border); padding-top: var(--t-space-2); }

/* ============ CAREERS TEASER ============ */
.t-careers-teaser { background: var(--t-black); color: var(--t-white); border-radius: var(--t-radius); }
.t-careers-teaser__inner { padding: var(--t-space-6) var(--t-gutter); }
.t-careers-teaser__cols { display: grid; gap: var(--t-space-4); margin-top: var(--t-space-4); }
@media (min-width: 900px) { .t-careers-teaser__cols { grid-template-columns: repeat(4, 1fr); } }
.t-careers-teaser__col h3 { font-size: var(--t-size-sm); font-weight: 600; }
.t-careers-teaser__col p { margin-top: 0.5em; color: rgba(255,255,255,0.7); font-size: var(--t-size-xs); }

/* ============ FINAL CTA ============ */
.t-final-cta { text-align: left; }
.t-final-cta__headline { font-size: clamp(2.2rem, 6vw, var(--t-size-3xl)); font-weight: 600; letter-spacing: var(--t-tracking-tight); line-height: var(--t-lh-tight); max-width: 14ch; }
.t-final-cta__actions { margin-top: var(--t-space-4); }

/* Section header pattern reused across the page */
.t-section-head { display: flex; flex-direction: column; gap: 0.8em; margin-bottom: var(--t-space-3); }
.t-section-head--split { flex-direction: row; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 1.5rem; }