/* Pivot & Plane — shared elevation layer (design tokens + small utilities)
   Additive only. Loaded alongside styles.v7.css / styles.v6.css; never edits them.
   Reuses the locked brand palette and font stack already declared in styles.v7.css —
   redeclared here only as a safe fallback for pages that don't already define it. */

:root {
  --gold: #C9955C;
  --black: #0E0A0B;
  --charcoal: #1A1213;
  --ivory: #F5EFE6;
  --ivory-60: rgba(245, 239, 230, 0.6);
  --ivory-35: rgba(245, 239, 230, 0.5);
  --line: rgba(245, 239, 230, 0.12);
  --font-display: "Cinzel", "Trajan Pro", "Cormorant Garamond", Georgia, "Times New Roman", serif;
  --font-editorial: "Cormorant Garamond", "Cormorant", Garamond, "Palatino Linotype", Palatino, Georgia, serif;
  --font-body: "Raleway", "Avenir Next", "Segoe UI", system-ui, -apple-system, sans-serif;

  /* spacing scale — additive; used by the components below, not retrofitted
     onto existing hand-tuned layout in styles.v7.css */
  --sp-1: 8px;
  --sp-2: 12px;
  --sp-3: 16px;
  --sp-4: 24px;
  --sp-5: 32px;
  --sp-6: 48px;
}

/* ---------- orchestrated stagger for the existing .reveal system ----------
   styles.v7.css already reads --reveal-delay on .reveal (transition-delay).
   This wrapper assigns it automatically by position, so card/tile grids get
   the same lightly-staggered cascade already hand-built into the class-card
   and principle components, without touching styles.v7.css. Reduced-motion
   is already handled upstream by .reveal's own rule. */
.pp-stagger > .reveal:nth-child(1) { --reveal-delay: 0ms; }
.pp-stagger > .reveal:nth-child(2) { --reveal-delay: 90ms; }
.pp-stagger > .reveal:nth-child(3) { --reveal-delay: 180ms; }
.pp-stagger > .reveal:nth-child(4) { --reveal-delay: 270ms; }
.pp-stagger > .reveal:nth-child(5) { --reveal-delay: 360ms; }
.pp-stagger > .reveal:nth-child(6) { --reveal-delay: 450ms; }
.pp-stagger > .reveal:nth-child(n+7) { --reveal-delay: 520ms; }

/* ---------- refined editorial hierarchy for fine print / consent lines ----------
   Purely additive: adds a hairline rule and breathing room above existing
   fine-print paragraphs. Any font/size/colour already set inline on the
   element takes precedence, so no existing fine-print styling is overridden. */
.pp-fine {
  border-top: 1px solid var(--line);
  padding-top: var(--sp-3);
  margin-top: var(--sp-4);
}
.pp-fine a { color: var(--gold); }

/* ---------- four-stage progress rail (Founding Fifty capture pattern) ---------- */
.pp-rail {
  display: none;
  align-items: center;
  justify-content: center;
  gap: var(--sp-2);
  margin: 0 auto var(--sp-5);
  max-width: 320px;
}
.pp-rail.is-active { display: flex; }
.pp-rail__dot {
  flex: 1;
  height: 3px;
  background: var(--line);
  transition: background 0.4s ease, box-shadow 0.4s ease;
}
.pp-rail__dot.is-done,
.pp-rail__dot.is-active { background: var(--gold); }
.pp-rail__dot.is-active { box-shadow: 0 0 10px rgba(201, 149, 92, 0.55); }
@media (prefers-reduced-motion: reduce) {
  .pp-rail__dot { transition: none; }
}