/**
 * Section: Next steps and related links
 *
 * ALMOST NOTHING IS IN HERE, AND THAT IS THE POINT. The centred label-over-chips
 * row is `.pasia-crosslinks` in components.css, because `archive-vacancy.php`
 * (`.vc-links`) and `single-vacancy.php` (`.vd-links`) paint the same band and
 * render no section stack at all, so a section stylesheet would never be
 * enqueued for either and both would ship bare. Inventory §0 and §F8.
 *
 * So components.css already owns, and this file must not re-declare:
 *
 *   .pasia-crosslinks           the centring.
 *   .pasia-crosslinks .chipset  the centred chip row and its `--s-3` top margin,
 *                               which is the label-to-links gap in the canonical
 *                               book-consultation.html `.bc-links`.
 *   .chip                       the chip itself, on its --paper fill.
 *   .ph-badge                   including the `:where(.section.tint-2)` rule
 *                               that pins its base to --paper on this exact
 *                               band, which is the one light ground the badge
 *                               failed on.
 *   .eyebrow                    the small gold label, from tokens.css.
 *
 * What is left is the optional button row above the links, which no other
 * consumer of `.pasia-crosslinks` has: both vacancy templates close on links
 * alone. One consumer, so it lives here. Ported from industries.html `.in-cta`
 * and its `.in-links` top margin, which pricing.html and aftersales.html repeat
 * to the character.
 *
 * ---------------------------------------------------------------------------
 * CONTRAST, MEASURED, NOT ESTIMATED
 *
 * The band is --surface-2 #efeadd, the warm one, which is the lowest-contrast
 * ground a section can land on and therefore the one worth measuring:
 *
 *   --gold-deep  #7e622e   the label                              4.76:1
 *   --ink-soft   #45524d   the chip text, on the chip's own
 *                          --paper fill                            8.18:1
 *   .btn-gold    --deep-forest on --gold                           5.65:1
 *   .btn-ghost   --forest on --surface-2, label and border         9.66:1
 *
 * All clear WCAG AA for normal text, which is the bar --text-xs has to meet.
 *
 * THE FOCUS RING, MEASURED AGAINST WHAT IS ACTUALLY BEHIND IT. tokens.css draws
 * `outline: 3px solid var(--gold-deep)` at `outline-offset: 2px` plus a 6px
 * --gold-tint-20 halo from the border box outward. The halo FILLS the 2px gap,
 * so the ring is never seen against the bare warm band and quoting that band's
 * 4.76:1 overstates it. Measured against the composited halo: 4.08:1, the
 * lowest figure of the three grounds this family lands on, and still clear of
 * SC 1.4.11's 3:1. Said out loud rather than left to be rederived: THE HALO
 * CANNOT COUNT TOWARD THE INDICATOR, because it measures 1.17:1 against
 * --surface-2, the weakest of any ground in the theme. The 3px outline carries
 * the criterion alone.
 *
 * The chip's own hairline, --line on --surface-2, measures 1.10:1, and it is
 * named here rather than left for somebody to find. It is not the thing that
 * identifies the control: each chip is a link with an 8.18:1 label on a --paper
 * fill, and the fill, the label and the hover state all carry the affordance.
 * The border is an edge, not the boundary SC 1.4.11 is about. It is also
 * components.css's rule and shared with five other consumers, so it would not
 * be this file's to change in any case.
 *
 * Nothing in this section sits on a dark ground, so hard rule 7 has no surface
 * here.
 * ------------------------------------------------------------------------- */

/* The optional button row. `.row` is the mock-ups' own class name inside a
   closing region and is scoped to this section, which is what keeps it from
   meeting `.pasia-cta-band .row` in components.css. */
.next-steps .row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--s-2);
}

/* Both gaps are derived from what the client actually filled in, never from a
   field, which is the same mechanism as `.pasia-cta-band h2 + .row`. With a
   label above them the buttons take the label's own gap; with buttons above
   them the links take the wider one the three mock-ups write on `.in-links`,
   `.pr-links` and `.as-links`, rather than the `--s-3` that belongs to a label
   sitting directly on its chips. */
.next-steps .eyebrow + .row {
  margin-top: var(--s-3);
}

.next-steps .row + .next-steps-links {
  margin-top: var(--s-5);
}

/* And nothing above them at all, which is reachable: `label` and `buttons` are
   both optional and only `links` is required. `.pasia-crosslinks .chipset` in
   components.css hands every chip row a --s-3 top margin, which is the
   label-to-links gap and is wrong when there is no label to sit under. Scoped
   to this section rather than fixed in the shared rule, because the other two
   consumers of `.pasia-crosslinks`, archive-vacancy.php and single-vacancy.php,
   both carry an eyebrow in the signed-off design and neither can reach this
   state. */
.next-steps .next-steps-links:first-child {
  margin-top: 0;
}
