/* Product-only rules: the approved global design system and sections stay frozen. */
.products { background: var(--background); color: var(--foreground); padding-top: clamp(4.5rem, 8vw, 8rem); }
.products__intro { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 1.75rem 1.5rem; padding-bottom: clamp(4rem, 6vw, 6rem); }
.products__intro > .eyebrow { grid-column: 1 / 4; align-self: start; margin-top: .5rem; }
.products__intro h2 { grid-column: 4 / -1; max-width: none; font-size: clamp(2.5rem, 5.1vw, 4.75rem); line-height: 1.06; text-wrap: initial; }
.products__lead { grid-column: 4 / 10; max-width: 38rem; font-size: 1.125rem; line-height: 1.65; color: var(--muted-foreground); }
.product-showcase { border-top: 1px solid var(--border); padding-top: 2rem; }
.product-showcase__identity { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 1.5rem; align-items: center; }
.product-showcase__identity .eyebrow { grid-column: 1 / 7; color: var(--muted-foreground); }
.product-showcase__identity h3 { grid-column: 9 / -1; margin: 0; justify-self: end; font-size: clamp(1.75rem, 2.5vw, 2.25rem); letter-spacing: -.045em; }
.product-showcase__story { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 1.5rem; align-items: end; margin-block: clamp(3rem, 5vw, 5rem) clamp(3.5rem, 5vw, 5rem); }
.product-showcase__story h4 { grid-column: 1 / 8; margin: 0; font-size: clamp(3rem, 6.2vw, 5.75rem); line-height: 1.02; font-weight: 500; letter-spacing: -.055em; }
.product-showcase__copy { grid-column: 9 / -1; }
.product-showcase__copy p { color: var(--muted-foreground); font-size: 1.125rem; line-height: 1.65; }
.product-showcase__copy .button { margin-top: 1.75rem; }

/* TrainChamps demo palette follows the reference UI, scoped to this product.
   These are interface colors, not additions to GroundSoft's brand primitives. */
.tc { --tc-panel: #0b1423; --tc-raised: #101d30; --tc-rule: #2a3a50; --tc-text: #edf1f8; --tc-muted: #aebbd0; --tc-violet: #b39af9; --tc-cyan: #55d6df; --tc-amber: #f3bc62; --tc-positive: #7bdfb0; --tc-negative: #ffa5a5; --tc-pitch: #17683d; --tc-pitch-line: #a4ceb4; }
.tc *, .tc *::before, .tc *::after { min-width: 0; }
.tc-label { font: .75rem/1.6 var(--font-mono); letter-spacing: .035em; }
.tc-demo { color: var(--tc-muted); font-size: .8125rem; line-height: 1.5; }
.tc-muted { color: var(--tc-muted); }
.tc-sr { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.tc-map { padding-block: 1.5rem; border-block: 1px solid var(--border); }
.tc-map__heading { display: flex; justify-content: space-between; flex-wrap: wrap; gap: .75rem; margin-bottom: 2rem; }
.tc-map__roles { display: grid; grid-template-columns: 3fr 5fr 3fr; gap: 2.5rem; position: relative; }
.tc-map__role { --role-accent: var(--tc-violet); position: relative; padding: 0 0 1rem 1rem; border-left: 2px solid var(--role-accent); }
.tc-map__role--coach { --role-accent: var(--tc-cyan); }
.tc-map__role--admin { --role-accent: var(--tc-amber); }
.tc-map__role + .tc-map__role::before { content: '→' / ''; position: absolute; left: -2rem; top: 2.2rem; color: var(--tc-muted); }
.tc-map__role a { display: grid; grid-template-columns: 1fr auto; gap: .35rem; min-height: 64px; }
.tc-map__role a .tc-label { grid-column: 1 / -1; color: var(--role-accent); }
.tc-map__role a strong { font-weight: 500; font-size: clamp(1.6rem, 2.5vw, 2.25rem); letter-spacing: -.035em; }
.tc-map__role a > span:last-child { color: var(--role-accent); align-self: center; }
.tc-map__role p { font-size: .875rem; line-height: 1.65; color: var(--tc-muted); margin-top: .65rem; }
.tc-map__shared { padding-top: 1.25rem; border-top: 1px solid var(--border); color: var(--tc-muted); font-size: .875rem; line-height: 1.6; }
.tc-map__shared > span { color: var(--accent); padding-right: .5rem; }
.tc-journey { position: relative; }
.tc-stage { display: grid; grid-template-columns: repeat(12,minmax(0,1fr)); gap: 1.5rem; padding-block: clamp(3rem,5vw,5rem); border-bottom: 1px solid var(--border); }
.tc-stage__intro { grid-column: 1 / 4; padding-right: 1rem; }
.tc-stage__intro > .tc-label { color: var(--accent); position: relative; padding-left: 1rem; border-left: 2px solid var(--accent); }
.tc-stage__intro h4 { margin: 1.5rem 0 1rem; font-size: clamp(1.4rem,2vw,1.875rem); font-weight: 500; line-height: 1.15; letter-spacing: -.035em; }
.tc-stage__intro > p:last-child { color: var(--muted-foreground); font-size: 1rem; line-height: 1.6; max-width: 27ch; }
.tc-stage__body { grid-column: 4 / -1; }
.tc-surface { background: var(--tc-panel); color: var(--tc-text); border: 1px solid var(--tc-rule); border-radius: 8px; overflow: hidden; }
.tc-surface__bar { padding: 1rem 1.5rem; background: var(--tc-raised); border-bottom: 1px solid var(--tc-rule); display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: .75rem; font-size: .875rem; }
.tc-role { color: var(--tc-cyan); font: .6875rem/1.5 var(--font-mono); letter-spacing: .035em; }
.tc-role--player { color: var(--tc-violet); }
.tc h5 { margin: 0; font-size: 1.125rem; font-weight: 500; }
.tc-profile__identity { display: flex; align-items: center; gap: 1rem; padding: 1.5rem; }
.tc-avatar { display: grid; place-items: center; width: 48px; height: 48px; flex-shrink: 0; border-radius: 50%; background: color-mix(in srgb,var(--tc-violet) 18%,var(--tc-panel)); color: var(--tc-violet); font-size: .875rem; }
.tc-profile__identity h5 { font-size: 1.5rem; letter-spacing: -.025em; }
.tc-profile__identity p { color: var(--tc-muted); font-size: .875rem; margin-top: .35rem; }
.tc-overall { margin-left: auto; display: flex; flex-direction: column; gap: .3rem; text-align: right; }
.tc-overall strong { font-size: 1.875rem; font-weight: 500; }
.tc-overall strong span { font-size: .8125rem; color: var(--tc-muted); }
.tc-overall > span { color: var(--tc-muted); font-size: .75rem; }
.tc-profile__nav { margin: 0 1.5rem; padding: 0; list-style: none; display: flex; gap: 1.75rem; border-bottom: 1px solid var(--tc-rule); font-size: .8125rem; color: var(--tc-muted); }
.tc-profile__nav li { padding-block: .5rem .85rem; }
.tc-profile__nav .is-current { border-bottom: 2px solid var(--tc-violet); color: var(--tc-text); }
.tc-profile__attributes { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 1.75rem; padding: 1.5rem; }
.tc-ui-heading { font-size: .875rem; font-weight: 500; }
.tc-radar { display: block; width: 100%; max-width: 340px; height: auto; margin-inline: auto; }
.tc-radar__grid { fill: none; stroke: var(--tc-rule); stroke-width: 1; }
.tc-radar__data { fill: color-mix(in srgb,var(--tc-violet) 18%,transparent); stroke: var(--tc-violet); stroke-width: 2; }
.tc-radar__comparison { fill: color-mix(in srgb,var(--tc-cyan) 9%,transparent); stroke: var(--tc-cyan); stroke-width: 2; stroke-dasharray: 5 4; }
.tc-radar__labels { fill: var(--tc-muted); font: 13px var(--font-sans); }
.tc-bars { margin: 1rem 0 0; display: grid; gap: 1rem; font-size: .875rem; font-variant-numeric: tabular-nums; }
.tc-bars > div { display: grid; grid-template-columns: 1fr auto; gap: .5rem; }
.tc-bars dt { color: var(--tc-muted); }
.tc-bars dd { margin: 0; }
.tc-bar { grid-column: 1 / -1; height: 4px; background: var(--tc-rule); }
.tc-bar i { display: block; height: 100%; width: var(--value); background: var(--tc-violet); transition: width var(--duration-medium) var(--ease); }
.tc-schedule { border-top: 1px solid var(--tc-rule); padding: 1rem 1.5rem; display: flex; align-items: center; gap: 1rem; font-size: .875rem; }
.tc-date { color: var(--tc-cyan); font: .6875rem var(--font-mono); display: flex; flex-direction: column; gap: .2rem; text-align: center; border-right: 1px solid var(--tc-rule); padding-right: 1rem; }
.tc-date strong { font: 1.5rem var(--font-sans); }
.tc-schedule .tc-label { color: var(--tc-muted); font-size: .6875rem; }
.tc-schedule p { margin-top: .3rem; }
.tc-schedule > span:last-child { margin-left: auto; color: var(--tc-muted); }
.tc-training { display: grid; grid-template-columns: minmax(0,1.35fr) 2rem minmax(0,1fr); align-items: start; position: relative; }
.tc-session__meta { margin: 0; padding: 1.5rem; display: flex; flex-wrap: wrap; gap: 1rem 1.5rem; font-size: .8125rem; line-height: 1.5; }
.tc-session__meta dt { color: var(--tc-muted); margin-bottom: .3rem; }
.tc-session__meta dd { margin: 0; }
.tc-session > .tc-ui-heading { padding-inline: 1.5rem; }
.tc-roster { list-style: none; margin: .75rem 0 0; padding: 0; }
.tc-roster li { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: .75rem; padding: 1rem 1.5rem; border-top: 1px solid var(--tc-rule); border-left: 2px solid transparent; }
.tc-roster li.is-selected { border-left-color: var(--tc-cyan); background: color-mix(in srgb,var(--tc-cyan) 6%,var(--tc-panel)); }
.tc-roster__person { display: flex; flex-direction: column; gap: .25rem; }
.tc-roster__person strong { font-size: .875rem; font-weight: 500; }
.tc-roster__person small { font-size: .75rem; color: var(--tc-muted); }
.tc-status { color: var(--tc-positive); font-size: .8125rem; }
.tc-status--absent { color: var(--tc-negative); }
.tc-metrics-action { grid-column: 1 / -1; justify-self: start; border: 1px solid var(--tc-rule); border-radius: 4px; background: transparent; color: var(--tc-text); min-height: 44px; padding: .6rem .85rem; font-size: .8125rem; display: flex; gap: 1rem; align-items: center; }
.tc-metrics-action[aria-pressed="true"] { border-color: var(--tc-cyan); color: var(--tc-cyan); }
.tc-metrics-action:hover { background: var(--tc-raised); }
.tc-no-metrics { grid-column: 1 / -1; font-size: .75rem; color: var(--tc-muted); }
.tc-session__note { padding: 1rem 1.5rem; border-top: 1px solid var(--tc-rule); color: var(--tc-muted); font-size: .8125rem; line-height: 1.5; }
.tc-training__connection { align-self: center; border-top: 1px solid var(--tc-cyan); color: var(--tc-cyan); text-align: right; }
.tc-training__connection span { position: relative; top: -.7rem; background: var(--background); }
.tc-metrics { margin-top: 3.5rem; }
.tc-metrics__name { padding: 1.25rem 1.25rem 0; font-size: 1.125rem; }
.tc-metrics .tc-bars { padding: 0 1.25rem; }
.tc-session-rating { display: flex; justify-content: space-between; flex-wrap: wrap; gap: .5rem; margin: 1.5rem 1.25rem 0; padding-top: 1rem; border-top: 1px solid var(--tc-rule); font-size: .875rem; }
.tc-session-rating strong { color: var(--tc-cyan); font-weight: 500; }
.tc-metrics__hint { padding: 1rem 1.25rem; font-size: .75rem; line-height: 1.5; color: var(--tc-muted); }
.tc-review { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 2rem; }
.tc-data-loop { list-style: none; padding: 0; margin: 0; font-size: 1rem; }
.tc-data-loop li { border-left: 1px solid var(--tc-rule); padding: 0 0 1.75rem 1.5rem; position: relative; }
.tc-data-loop li::before { content: ''; position: absolute; left: -3px; top: .4rem; width: 5px; height: 5px; background: var(--tc-violet); }
.tc-data-loop li:last-child { color: var(--tc-cyan); padding-bottom: 0; }
.tc-comparison { margin: 0; }
.tc-comparison figcaption { display: flex; flex-direction: column; gap: .35rem; font-size: .875rem; }
.tc-comparison figcaption strong { font-weight: 500; }
.tc-comparison .tc-muted { font-size: .75rem; }
.tc-legend { display: flex; flex-wrap: wrap; gap: 1rem; font-size: .8125rem; }
.tc-legend span { display: flex; align-items: center; gap: .5rem; }
.tc-legend i { width: 1rem; border-top: 2px solid var(--tc-violet); }
.tc-legend span:last-child i { border-top: 2px dashed var(--tc-cyan); }
.tc-operations { display: grid; grid-template-columns: minmax(0,1.4fr) minmax(0,1fr); gap: 2rem; align-items: start; }
.tc-team__heading { padding: 1.25rem; display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.tc-team__heading > span { font-size: .75rem; color: var(--tc-muted); }
.tc-pitch { display: block; width: calc(100% - 2.5rem); height: auto; margin-inline: auto; background: var(--tc-pitch); }
.tc-pitch__lines { stroke: var(--tc-pitch-line); stroke-opacity: .65; fill: none; }
.tc-pitch__players circle { fill: var(--tc-panel); stroke: var(--tc-text); }
.tc-pitch__players text { fill: var(--tc-text); font: 22px var(--font-mono); }
.tc-team__roster { padding: 1rem 1.25rem; display: flex; flex-wrap: wrap; gap: .75rem; color: var(--tc-muted); font-size: .75rem; line-height: 1.5; }
.tc-drill { border-top: 1px solid var(--tc-rule); padding: 1.25rem; display: flex; flex-direction: column; gap: .75rem; }
.tc-drill .tc-label { color: var(--tc-cyan); font-size: .6875rem; }
.tc-drill strong { font-size: 1rem; font-weight: 500; }
.tc-drill p, .tc-drill > span:last-child { font-size: .8125rem; color: var(--tc-muted); line-height: 1.6; }
.tc-drill b { padding-inline: .4rem; color: var(--tc-rule); }
.tc-admin > .tc-label { color: var(--tc-amber); padding-bottom: 1.5rem; }
.tc-admin section { padding-block: 1.25rem; border-top: 1px solid var(--tc-rule); }
.tc-admin h5 { font-size: 1rem; margin-bottom: .75rem; }
.tc-admin p.tc-muted { font-size: .8125rem; line-height: 1.5; }
.tc-admin__rows { margin: 1rem 0; font-size: .8125rem; display: grid; gap: .85rem; }
.tc-admin__rows > div { display: flex; justify-content: space-between; gap: .75rem; }
.tc-admin__rows dd { margin: 0; color: var(--tc-muted); }
.tc-admin__rows dd span { color: var(--tc-cyan); margin-left: .6rem; }
.tc-finance { margin: 0; display: flex; flex-wrap: wrap; gap: 1rem 1.5rem; font-size: .8125rem; }
.tc-finance dt { color: var(--tc-muted); }
.tc-finance dd { margin: .5rem 0 0; }
.tc-finance > div:last-child dd { color: var(--tc-cyan); }
.tc-end { padding-top: 1.5rem; }
.tc-end ol { list-style: none; display: flex; flex-wrap: wrap; gap: 1rem; margin: 0 0 1.5rem; padding: 0; font: .75rem/1.6 var(--font-mono); text-transform: uppercase; }
.tc-end li:not(:last-child)::after { content: '→' / ''; padding-left: 1rem; color: var(--accent); }
@media (max-width: 1100px) {
  .products__intro > .eyebrow { grid-column: 1 / -1; margin: 0; }
  .products__intro h2 { grid-column: 1 / -1; }
  .products__lead { grid-column: 1 / 9; }
  .product-showcase__story h4 { grid-column: 1 / 8; }
  .product-showcase__copy { grid-column: 8 / -1; }
  .tc-stage__intro { grid-column: 1 / 4; }
  .tc-training { grid-template-columns: 1fr; }
  .tc-training__connection { height: 2rem; border-top: 0; border-left: 1px solid var(--tc-cyan); margin-left: 2rem; text-align: left; }
  .tc-training__connection span { top: .5rem; left: -.5rem; display: inline-block; transform: rotate(90deg); }
  .tc-metrics { margin-top: 0; }
  .tc-metrics .tc-bars { grid-template-columns: 1fr 1fr; gap: 1rem 1.5rem; }
  .tc-roster li { grid-template-columns: 1fr auto auto; }
  .tc-metrics-action, .tc-no-metrics { grid-column: auto; }
  .tc-operations { grid-template-columns: 1fr; }
  .tc-admin { display: grid; grid-template-columns: 1fr 1fr; column-gap: 1.5rem; }
  .tc-admin > .tc-label { grid-column: 1 / -1; padding-bottom: 1rem; }
}
@media (max-width: 900px) {
  .product-showcase__story h4 { grid-column: 1 / 7; font-size: clamp(2.75rem,5.7vw,3.5rem); }
  .product-showcase__copy { grid-column: 7 / -1; }
  .tc-stage { grid-template-columns: 1fr; gap: 1.5rem; }
  .tc-stage__intro, .tc-stage__body { grid-column: 1; }
  .tc-stage__intro h4 { font-size: 1.75rem; }
  .tc-stage__intro h4 br { display: none; }
  .tc-stage__intro > p:last-child { max-width: 44rem; }
  .tc-map__roles { gap: 1.5rem; grid-template-columns: 1fr 1.35fr 1fr; }
  .tc-map__role + .tc-map__role::before { left: -1.3rem; }
  .tc-operations { grid-template-columns: 1.2fr 1fr; gap: 1.5rem; }
  .tc-admin { display: block; }
}
@media (max-width: 700px) {
  .products { padding-top: 4rem; }
  .products__intro { display: block; padding-bottom: 3.5rem; }
  .products__intro h2 { margin-block: 1.75rem 1.5rem; font-size: clamp(2.125rem,8.25vw,3.5rem); line-height: 1.08; }
  .products__lead { font-size: 1.0625rem; line-height: 1.6; }
  .product-showcase { padding-top: 1.75rem; }
  .product-showcase__identity { display: flex; flex-direction: column; align-items: flex-start; gap: 1rem; }
  .product-showcase__identity .eyebrow { font-size: .6875rem; }
  .product-showcase__identity h3 { font-size: 1.75rem; }
  .product-showcase__story { display: block; margin-block: 2rem 2.5rem; }
  .product-showcase__story h4 { font-size: clamp(2rem,9.5vw,3.75rem); margin-bottom: 1.5rem; }
  .product-showcase__copy p { font-size: 1.0625rem; line-height: 1.6; max-width: 36rem; }
  .product-showcase__copy .button { margin-top: 1.5rem; }
  .tc-map__roles { grid-template-columns: 1fr; gap: 1.75rem; }
  .tc-map__role { padding-bottom: .25rem; }
  .tc-map__role + .tc-map__role::before { content: '↓' / ''; top: -1.65rem; left: .75rem; }
  .tc-map__role a { min-height: 56px; }
  .tc-map__role a strong { font-size: 1.6rem; }
  .tc-map__role p { margin-top: .35rem; }
  .tc-map__shared { margin-top: 1.25rem; }
  .tc-stage { padding-block: 2.5rem; }
  .tc-stage__intro h4 { margin-top: 1rem; }
  .tc-surface__bar { padding: 1rem; }
  .tc-profile__identity { gap: .75rem; padding: 1.25rem 1rem; flex-wrap: wrap; }
  .tc-profile__identity h5 { font-size: 1.125rem; }
  .tc-avatar { width: 38px; height: 38px; }
  .tc-overall strong { font-size: 1.5rem; }
  .tc-overall > span { font-size: .6875rem; }
  .tc-profile__nav { margin-inline: 1rem; gap: 1rem; font-size: .75rem; }
  .tc-profile__attributes { grid-template-columns: 1fr; gap: .5rem; padding: 1.25rem 1rem; }
  .tc-profile__attributes .tc-radar { max-width: 320px; }
  .tc-profile__attributes .tc-bars { grid-template-columns: 1fr 1fr; gap: 1.25rem 1rem; }
  .tc-bars { font-size: .8125rem; }
  .tc-schedule { padding: 1rem; gap: .75rem; flex-wrap: wrap; }
  .tc-schedule > span:last-child { margin-left: 3rem; }
  .tc-session__meta { padding: 1rem; gap: 1rem 1.5rem; }
  .tc-session > .tc-ui-heading { padding-inline: 1rem; }
  .tc-roster li { grid-template-columns: 1fr auto; padding: 1rem; }
  .tc-metrics-action, .tc-no-metrics { grid-column: 1 / -1; }
  .tc-session__note { padding: 1rem; }
  .tc-metrics .tc-bars { grid-template-columns: 1fr; }
  .tc-review { grid-template-columns: 1fr; gap: 2rem; }
  .tc-data-loop li { padding-bottom: 1.25rem; font-size: .875rem; }
  .tc-comparison .tc-radar { max-width: 320px; }
  .tc-operations { grid-template-columns: 1fr; }
  .tc-team__heading { padding: 1rem; flex-wrap: wrap; gap: .5rem; }
  .tc-pitch { width: calc(100% - 2rem); }
  .tc-pitch__players text { font-size: 22px; }
  .tc-team__roster, .tc-drill { padding: 1rem; }
  .tc-admin { margin-top: .5rem; }
  .tc-admin__rows { font-size: .875rem; }
  .tc-end ol { gap: .75rem; }
  .tc-end li:not(:last-child)::after { padding-left: .75rem; }
}
@media (prefers-reduced-motion: reduce) { .tc-bar i { transition: none; } }

