/* Data display (2026-10-21): approved design "Trail figures".
   Brass = measured figure, forest = configuration, forest tag = branded component, mist dashed = to be confirmed.
   Figures use Big Shoulders Bold (SIL OFL 1.1, /assets/fonts/BigShoulders-OFL.txt); all other text keeps Noto. */
@font-face { font-family: "Big Shoulders"; src: url("/assets/fonts/BigShoulders-Bold.ttf") format("truetype"); font-weight: 700; font-display: swap; }

:root { --kd-forest: #203a30; --kd-brass: #956126; --kd-moss: #526157; --kd-mist: #9aa39c; --kd-rule: #dde1d7; }

.kd-fig { font-family: "Big Shoulders", "Arial Narrow", sans-serif; font-weight: 700; line-height: .95; font-variant-numeric: tabular-nums; }
.kd-fig .kd-unit { font-family: Noto, sans-serif; font-weight: 400; font-size: max(12px, .36em); margin-left: .18em; color: var(--kd-moss); }
.kd-measure { color: var(--kd-brass); }
.kd-feature { color: var(--kd-forest); }
.kd-tbc { color: var(--kd-mist); text-decoration: underline dashed 1px; text-underline-offset: 4px; }

/* Model page band: replaces the three-figure overview facts. */
.overview-facts > .kd-band { grid-column: 1 / -1; }
.kd-band { display: grid; grid-template-columns: repeat(7, 1fr); margin: 0; border-top: 2px solid var(--kd-forest); text-align: left; }
.kd-band .kd-key { display: block; padding: 18px 14px 0 0; }
.kd-band .kd-key + .kd-key { padding-left: 14px; border-left: 1px solid var(--kd-rule); }
.kd-band dt { font-size: 13px; font-weight: 700; line-height: 1.35; min-height: 2.7em; margin-bottom: 6px; color: var(--kd-forest); }
.kd-band dd { margin: 0; }
.kd-band .kd-fig { display: block; font-size: 52px; }
.overview-facts .kd-band .kd-measure { color: var(--kd-brass); }
.overview-facts .kd-band .kd-feature { color: var(--kd-forest); }
.overview-facts .kd-band .kd-unit { color: var(--kd-moss); }
.kd-band .kd-feature { font-size: 40px; }
.kd-band .kd-detail, .kd-band .kd-use, .kd-band .kd-tbc { display: block; font-size: 13px; line-height: 1.45; margin-top: 10px; color: var(--kd-moss); }
.kd-band .kd-detail { color: var(--kd-forest); }
.kd-band .kd-tbc { color: var(--kd-mist); }

/* Lineup cards (/atv/): label left, figure right, same seven rows for every model.
   Scoped under body[data-page="models"] to override the inline "dt: dd" layout used there. */
body[data-page="models"] .model-directory .kd-list { margin: 25px 0; }
body[data-page="models"] .model-directory .kd-list > div { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 7px 0; border-top: 1px solid #e7eae2; }
body[data-page="models"] .model-directory .kd-list > div:first-child { border-top: 0; }
body[data-page="models"] .model-directory .kd-list dt { display: block; font-size: 13px; color: var(--kd-moss); }
body[data-page="models"] .model-directory .kd-list dt::after { content: none; }
body[data-page="models"] .model-directory .kd-list dd { margin: 0; text-align: right; }
body[data-page="models"] .model-directory .kd-list .kd-fig { font-size: 24px; }
body[data-page="models"] .model-directory .kd-list .kd-feature { font-size: 20px; }
body[data-page="models"] .model-directory .kd-list .kd-tbc { font-size: 13px; }

/* Specification page: measured values as figures, branded components as forest tags. */
.detail-facts .spec-value .kd-fig { font-size: 30px; }
.spec-part { display: inline-flex; align-items: baseline; gap: 6px; background: var(--kd-forest); color: #fff; font-size: 13px; font-weight: 700; padding: 3px 10px 4px; border-radius: 2px; }
.spec-part::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--kd-brass); transform: translateY(-1px); }

@media (max-width: 1100px) {
  .kd-band { grid-template-columns: repeat(4, 1fr); row-gap: 28px; }
  .kd-band .kd-key:nth-child(5) { border-left: 0; padding-left: 0; }
}
@media (max-width: 700px) {
  .kd-band { grid-template-columns: repeat(2, 1fr); }
  .kd-band .kd-key, .kd-band .kd-key + .kd-key { padding: 16px 12px 0 0; border-left: 0; }
  .kd-band .kd-key:nth-child(even) { padding-left: 14px; border-left: 1px solid var(--kd-rule); }
  .kd-band .kd-fig { font-size: 44px; }
  .kd-band .kd-feature { font-size: 32px; }
}