/* ============================================================
   MINDSET values rows — Carriage device, values register
   ============================================================
   #values (about.html) reuses the RESPECT "Carriage" scroll device.
   The device chrome itself (.rlx, .rlx--carriage, .rlx__word/__letter/
   __rail/__carriage/__caption, .rlx-scope, sticky/compact states) is
   frozen in respect-letters.css and untouched here — about.html loads
   that sheet directly.

   This sheet is purely additive: it supplies the row-level treatment
   for the new `--values` modifier on the shared .mindset DOM-CONTRACT
   (components.css:458-501), mirroring what overrides.css + proposal-a.css
   + respect-letters.css already do for `--respect`, minus the parts that
   don't apply to the values register (no <h2>/<h4> mismatch to fix, no
   "In action" fourth line, own counter name). Nothing in
   components.css/overrides.css/proposal-a.css/respect-letters.css is
   redefined — those stay exactly as they are for the RESPECT rows.
   ============================================================ */

/* ---------- Row geometry (mirrors overrides.css:611-653) ----------
   Base .mindset__row centers a single-line letter against a 2-line
   body — wrong once the body carries title + blurb, so the letter is
   pinned to the top of the row, at eye level with the title. */
.mindset__row--values {
  grid-template-columns: 96px 1fr;
  align-items: start;
  padding: var(--space-lg) var(--space-lg) var(--space-xl);
}
.mindset__row--values .mindset__letter {
  padding-top: 0.15em;
}

/* Row title is an <h4> here (about.html's own section title already
   owns the <h2>) restyled to the same result the RESPECT <h2> rows
   get — the semantic level differs, the look does not. */
.mindset__row--values .mindset__body h4 {
  font-family: var(--font-sans);
  font-size: var(--step-1);
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: normal;
  color: var(--text-100);
  margin: 0 0 0.4em;
}

/* Blurb capped to a comfortable reading measure so a full-width row
   doesn't run wall to wall. No hyphenation. */
.mindset__row--values .mindset__blurb {
  color: var(--text-300);
  max-width: 68ch;
  overflow-wrap: break-word;
  hyphens: none;
}

/* No fourth "In action" line for values — .mindset__inaction* is a
   RESPECT-only concept and is deliberately not ported. */

/* ---------- Numbered ledger (mirrors proposal-a.css:163-198) ----------
   Own counter (values-idx, not respect-idx) so both registers can
   coexist on the same page without colliding. */
.mindset--values {
  counter-reset: values-idx;
  gap: 0;
}
.mindset__row--values {
  counter-increment: values-idx;
  border: 0;
  border-top: 1px solid var(--border-soft);
  border-radius: 0;
  background: none;
  padding-inline: 0;
  transition: background var(--dur-mid) var(--ease-out);
}
.mindset--values .mindset__row--values:last-child {
  border-bottom: 1px solid var(--border-soft);
}
.mindset__row--values:hover {
  border-color: var(--border-soft);
  background: rgba(95, 201, 172, 0.035);
}
.mindset__row--values .mindset__letter::before {
  content: counter(values-idx, decimal-leading-zero);
  display: block;
  font-family: var(--font-mono);
  font-style: normal;
  font-size: 0.62rem;
  letter-spacing: 0.05em;
  color: var(--text-500);
  margin-bottom: 0.35em;
}
/* Kill the base letter hover flourish (scale + glow) on these rows —
   a numbered ledger entry doesn't get a decorative letter lift. */
.mindset__row--values .mindset__letter { transform: none !important; }
.mindset__row--values .mindset__letter::after { display: none; }

/* ---------- Held-bar clearance + current-row echo (mirrors
   respect-letters.css:204-216) ----------
   The Carriage's sticky bar must not cover the row an anchor/scroll
   lands on; the row being read is echoed on the row itself so the
   highlight in the bar and on the page never disagree. */
.mindset__row--values {
  scroll-margin-top: calc(var(--rlx-top, 68px) + var(--rlx-bar, 8rem) + 1.25rem);
}
.mindset__row--values.is-current {
  background: rgba(95, 201, 172, 0.05);
}
.mindset__row--values.is-current .mindset__letter {
  color: var(--jade-300);
}

/* ============================================================
   Responsive — same collapse pattern as the RESPECT rows
   (overrides.css:693-712), proven at 375px.
   ============================================================ */
@media (max-width: 720px) {
  .mindset__row--values {
    grid-template-columns: 56px 1fr;
    gap: var(--space-md);
    /* Block padding only. The ledger's `padding-inline: 0` above sits
       earlier in this same sheet, so a shorthand here would win and give
       the collapsed rows side gutters the RESPECT register does not have
       at this width. */
    padding: var(--space-md) 0;
  }
}
@media (max-width: 420px) {
  .mindset__row--values {
    grid-template-columns: 1fr;
  }
  .mindset__row--values .mindset__letter {
    text-align: left;
    font-size: var(--step-2);
    padding-top: 0;
  }
}

/* ============================================================
   Reduced motion — this file's own transitions only; base.css
   already forces [data-reveal] static and neutralizes the letter
   hover globally.
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
  .mindset__row--values {
    transition: none !important;
  }
}