/* Family page: content rules from ecosystem.html; shared shell comes from base/nav/footer. */
.tc-family { position: relative; z-index: 1; }
/* Unclassed card headings inherit the prototype body face. */
.tc-family h3 { font-family: var(--tc-font-body) !important; letter-spacing: normal; }
.tc-h1, .tc-h2 {
      font-family: var(--tc-font-display);
      font-weight: 500;
      letter-spacing: -0.03em;
      line-height: 1;
      color: var(--tc-ink);
      margin: 0;
    }

.tc-h1 { font-size: clamp(48px, 6.5vw, 96px);  font-weight: 600; letter-spacing: -0.035em; line-height: 0.98; }

.tc-h2 { font-size: clamp(36px, 5vw, 72px);    font-weight: 600; letter-spacing: -0.03em;  line-height: 1.02; }

.tc-serif { font-family: var(--tc-font-serif); font-style: italic; font-weight: 400; letter-spacing: -0.005em; }

.tc-lede {
      font-size: clamp(17px, 1.4vw, 21px);
      color: var(--tc-ink-2); line-height: 1.55;
      max-width: 52ch; margin: 0;
    }

.tc-kicker {
      font-family: var(--tc-font-mono);
      font-size: 11px;
      text-transform: uppercase;
      letter-spacing: 0.2em;
      color: var(--tc-ink-3);
      font-weight: 400;
      display: inline-block;
    }

.tc-wrap-narrow { max-width: 940px;  margin: 0 auto; padding: 0 32px; }

.tc-rule { border: 0; border-top: 1px solid var(--tc-line); margin: 0; }

.tc-btn .tc-arrow { transition: transform 240ms cubic-bezier(0.2,0.7,0.3,1); }

.tc-btn:hover .tc-arrow { transform: translateX(4px); }

.tc-hero {
      position: relative;
      padding: clamp(90px, 9vw, 130px) 0 clamp(96px, 12vw, 140px);
      overflow: clip;
    }

.tc-hero .tc-kicker { margin-bottom: 28px; }

.tc-hero h1 { margin-bottom: 32px; max-width: 12ch; }

.tc-hero .tc-lede { margin-bottom: 40px; }

@media (max-width: 560px) {
  .tc-wrap-narrow { padding: 0 22px; }
}

.tc-serif { font-style: normal !important; }
/* Static labels use the prototype's fully visible reduced-motion state. */
.tc-section-label {
  display: inline-block;
  position: relative;
  text-align: center;
  font-family: var(--tc-font-mono);
  font-size: 12px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  color: var(--tc-accent);
  margin: 0 auto 24px;
  padding-bottom: 10px;
}
.tc-section-label::before, .tc-section-label::after {
  content: "";
  position: absolute;
  bottom: 0;
  height: 1px;
  width: 120px;
  background: linear-gradient(90deg, transparent 0%, var(--tc-accent) 50%, transparent 100%);
  opacity: 0.6;
}
.tc-section-label::before { left: 50%; }
.tc-section-label::after { right: 50%; }
@media (max-width: 640px) {
  .tc-wrap-narrow { padding-left: 16px; padding-right: 16px; }
  .tc-family .tc-section { padding-top: 48px; padding-bottom: 48px; }
  /* The prototype's inline fixed tracks overflow phones. */
  .tc-family-layer { grid-template-columns: 1fr !important; gap: 12px !important; }
  .tc-family-grid { grid-template-columns: 1fr !important; }
}
