/* ============================================================
   COMPONENT · ALTITUDE
   The Horizons "altitude check" weight gradient. Expresses the
   descent from 50,000 ft (Purpose) down to Ground (Next Actions)
   with WEIGHT, SCALE, and SPACING only — never a color alarm.

   The top tiers are the grandest and quietest (airy spacing, a
   barely-there rail, hushed wide-tracked plaque); the descent
   grows more concrete (a heavier left rail, a tighter rhythm) so
   the ladder is *felt*, not just labelled. Built minimum here —
   chunk 13 absorbs it into the styleguide.

   Semantic tokens only; calm in both themes; no rgba(0,0,0,*) —
   the rail rides the theme-aware --color-border* tokens, so it
   flips for free with [data-theme]. Weight/spacing degrade
   gracefully on a phone (no fixed multi-column grid).
   ============================================================ */

.c-altitude {
  position: relative;
  padding-left: var(--space-4);
  border-left: var(--altitude-rail, 2px) solid var(--altitude-tone, var(--color-border));
}

/* Inter-tier breathing room: widest at altitude, snug toward the ground. */
.c-altitude + .c-altitude { margin-top: var(--altitude-gap, var(--space-6)); }

/* The plaque heading: grandest/quietest up top (wider hush), plainer below. */
.c-altitude > .c-plaque { letter-spacing: var(--altitude-track, var(--ls-wider)); }

/* ── The descent. l1 = 50,000 ft (Purpose) … l6 = Ground (Next Actions). ──
   Rail thickens, the gap closes, and the tracking tightens as we come down. */
.c-altitude--l1 {
  --altitude-rail: 1px;
  --altitude-tone: var(--color-border);
  --altitude-gap: var(--space-7);
  --altitude-track: var(--ls-widest);
}
.c-altitude--l2 {
  --altitude-rail: 1px;
  --altitude-tone: var(--color-border);
  --altitude-gap: var(--space-7);
  --altitude-track: var(--ls-widest);
}
.c-altitude--l3 {
  --altitude-rail: 2px;
  --altitude-tone: var(--color-border);
  --altitude-gap: var(--space-6);
  --altitude-track: var(--ls-wider);
}
.c-altitude--l4 {
  --altitude-rail: 3px;
  --altitude-tone: var(--color-border);
  --altitude-gap: var(--space-6);
  --altitude-track: var(--ls-wider);
}
.c-altitude--l5 {
  --altitude-rail: 4px;
  --altitude-tone: var(--color-border-strong);
  --altitude-gap: var(--space-5);
  --altitude-track: var(--ls-wide);
}
.c-altitude--l6 {
  --altitude-rail: 5px;
  --altitude-tone: var(--color-border-strong);
  --altitude-gap: var(--space-5);
  --altitude-track: var(--ls-wide);
}