/* ============================================================================
   gt_v2.css  —  Grand Tour "system / quick" moves  (PREPARE ONLY, not deployed)
   costandprofitability.com  ·  Instrument design language
   Loads AFTER cnp-instrument-apply.css + cnp-method-instrument.css.
   Reuses the live --cnp-* vars (verified against the FTP copy of
   cnp-method-instrument.css, md5 134f90ba…, :root block lines 47-62):
     --cnp-cream #F5EEE1 · --cnp-card #FBF6EB · --cnp-ink #2A211B
     --cnp-soft #7d7062 · --cnp-hair #DED3BF · --cnp-orange #C75B22
     --cnp-orange-text #A8481A · --cnp-mono (IBM Plex Mono)
   Every selector below was verified against a live rendered page — see
   gt_v2_plan.md. Narrow by design. Nothing touches nav / buttons / cards /
   hero. All motion is gated behind prefers-reduced-motion: no-preference.
   ============================================================================ */

/* Local, non-destructive fallbacks so the file is safe even if load order
   ever changes. If the instrument sheet is present these are simply ignored. */
:root{
  --gt-line:  var(--cnp-orange, #C75B22);
  --gt-hair:  var(--cnp-hair,   #DED3BF);
  --gt-ink:   var(--cnp-ink,    #2A211B);
  --gt-text:  var(--cnp-orange-text, #A8481A);
}

/* ---------------------------------------------------------------------------
   #34  ROUTE-LINE LINK UNDERLINES
   In-content prose links only. Verified: on pillar pages every prose <a>
   inside .pf-sec .pf-narrow is an UNCLASSED anchor (e.g. method: /tdabc-vs-abc/,
   pe/br: /br/metodo-tdabc/). Buttons (.btn/.btn-ghost-dark), neighbour cards
   (.neigh-*), reference chrome — all carry a class, so :not([class]) excludes
   them cleanly. Blog body prose lives in .article-content (unclassed <a>).
   Resting state: subtle hairline underline. Hover: burnt-orange line wipes
   left -> right, then a 3px round terminus dot lands at the end.
   --------------------------------------------------------------------------- */
.pf-sec .pf-narrow a:not([class]),
.article-content p a:not([class]),
.article-content li a:not([class]){
  color: inherit;
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-decoration-color: var(--gt-hair);   /* subtle resting underline */
  text-underline-offset: 3px;
}
/* Base hover (also the reduced-motion hover): instant, no animation. */
.pf-sec .pf-narrow a:not([class]):hover,
.pf-sec .pf-narrow a:not([class]):focus-visible,
.article-content p a:not([class]):hover,
.article-content p a:not([class]):focus-visible,
.article-content li a:not([class]):hover,
.article-content li a:not([class]):focus-visible{
  color: var(--gt-text);
  text-decoration-color: var(--gt-line);
}

/* Enhancement: the route-line wipe + terminus dot, motion only. */
@media (prefers-reduced-motion: no-preference){
  .pf-sec .pf-narrow a:not([class]),
  .article-content p a:not([class]),
  .article-content li a:not([class]){
    /* layer 1 = terminus dot (right end, hidden at rest)
       layer 2 = the route line (bottom, zero-width at rest) */
    background-image:
      radial-gradient(circle at center, var(--gt-line) 0 3px, transparent 3px),
      linear-gradient(var(--gt-line), var(--gt-line));
    background-repeat: no-repeat, no-repeat;
    background-position: right 0 bottom -1px, left bottom 1px;
    background-size: 0 0, 0% 2px;
    padding-bottom: 2px;
    transition: background-size .18s ease;   /* mouse-out retract */
  }
  .pf-sec .pf-narrow a:not([class]):hover,
  .pf-sec .pf-narrow a:not([class]):focus-visible,
  .article-content p a:not([class]):hover,
  .article-content p a:not([class]):focus-visible,
  .article-content li a:not([class]):hover,
  .article-content li a:not([class]):focus-visible{
    /* hide the static hairline so only the animated line shows */
    text-decoration-color: transparent;
    /* line wipes left->right; the terminus dot blooms at the right end as the
       line arrives (both share one timing — the dot sits flush at the end). */
    background-size: 6px 6px, 100% 2px;
    transition: background-size .42s cubic-bezier(.62,.02,.20,1);
  }
}

/* ---------------------------------------------------------------------------
   #47  SECTION DWELL  ("station dwell" between major pillar sections)
   Verified recurring wrapper: consecutive <section class="pf-sec"> on the
   pillar/method template (method = 7 pf-sec, /br/private-equity/ = 9 pf-sec,
   incl. .pf-sec.alt). Adds a centered hairline tick + extra breathing room at
   the seam. Subtle. Left whale (.sec) / cost-to-serve (.section) alone — their
   templates own a different rhythm (see plan).
   --------------------------------------------------------------------------- */
.pf-sec + .pf-sec{
  position: relative;
  margin-top: 8px;          /* a touch more dwell between stations */
}
.pf-sec + .pf-sec::before{
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 28px;
  height: 1px;
  transform: translateX(-50%);
  background: var(--gt-hair);
  opacity: .9;
  pointer-events: none;
}

/* ---------------------------------------------------------------------------
   #41  TIMETABLE FIGURES  —  tabular, slashed zero on mono / data figures.
   Verified classes present site-wide: .mono (35× across the 5 pages),
   .mono-num (apply sheet), plus the instrument stat/figure numerals
   .cnp-inst-stat__fig and .cnp-inst-figure. font-variant-numeric only affects
   digit glyph rendering — a no-op on non-numeric mono labels, zero layout risk.
   lining-nums kept so .mono-num's existing figure style is preserved.
   --------------------------------------------------------------------------- */
.mono,
.mono-num,
.cnp-inst-stat__fig,
.cnp-inst-figure{
  font-variant-numeric: lining-nums tabular-nums slashed-zero;
}

/* ---------------------------------------------------------------------------
   #97  HAIRLINE DISCIPLINE  (narrow, additive — NOT a blanket border override)
   The apply sheet already normalises .rule to --cnp-hair, but only under
   .cc-pf / .sec / .sec-sm. cost-to-serve renders its sections as .section
   (no .cc-pf main), so .section .rule falls through. This one selector closes
   that gap using the same single hairline, and nothing else.
   --------------------------------------------------------------------------- */
.section .rule,
.section-tight .rule,
.section-paper-2 .rule{
  border-color: var(--gt-hair);
}

/* ---------------------------------------------------------------------------
   #93  Selection  — already shipped in the live instrument sheet. Not touched.
   #54  KPI milestone posts — SKIPPED (see plan): the only site-wide stat class
        is .cnp-inst-stat, which is bound to the hero .mh-ticket; off-limits.
   #98  Loading state — SKIPPED (see plan): no spinner/loader class exists.
   --------------------------------------------------------------------------- */