/* ══════════════════════════════════════════════════════════════════════════
   shipping-claim.css — the footnote that RESOLVES the asterisk in
   "Free shipping* over $300".

   OWNER, 2026-08-26: "for the free shipping claims - state free shipping*
   over 300$ dont just say free over 300."

   The asterisk is his, so it has to land somewhere. This sheet styles the two
   footnote surfaces that did not already have a dim sub-line to hang it on:
   the home trust band and the cart drawer's progress block. Everywhere else
   the footnote reuses type that already ships (.pdp-trust-s on the product
   page, .prose on the shipping policy, .faq-a on the home FAQ), because a new
   class for text that already has one is a second answer to a solved question.

   COLOUR IS SOLVED AGAINST THE GROUND IT SITS ON, NOT PICKED.
   THE TRUST BAND IS NOT THE PAGE GROUND, so the page's own dim ink is not
   automatically safe on it. Measured on the LIVE site at 390w, 2026-08-26:
   sf-refresh.css paints the band
   linear-gradient(102deg, rgb(12,36,64) 0%, rgb(16,41,74) 55%, rgb(23,64,107) 100%)
   and lays a cyan radial (rgb(22 191 209 / 0.20) at 82% 0%) over it. Against
   the worst case that combination can produce — the lightest stop #17406B with
   the full cyan wash composited on top — the site's --sf-muted (#A6BACB live)
   is 3.79:1, i.e. UNDER the line. It is 5.30:1 on the bare stop, which is why
   the existing .assure-v sub-lines read fine everywhere the wash does not
   reach; a footnote spanning the full width has no such luck.

   So this ink is solved for that worst case instead:
   color-mix(in srgb, --sf-text 88%, --cc-navy-800) → ~#D5DDE4 on today's
   tokens, measuring 5.52:1 with the wash and 7.72:1 without. Written as a
   color-mix of two LIVE TOKENS rather than a hex, so it moves with the palette
   instead of going stale the next time the brand ink changes (--sf-text is
   #F0F6FA on the live site and #E9F3F8 in the raw theme.css — a typed hex here
   would already have been wrong once).

   IT IS MIXED TOWARD AN OPAQUE NAVY, NEVER TOWARD `transparent`. Doctrine, and
   the reason is mechanical: an ink faded to transparent composites whatever is
   behind it — here a gradient plus a static radial overlay (sf-refresh.css:317;
   neither of them animates) — so its real contrast is unmeasurable and no gate
   can hold it. A solved second colour is a number a probe can read.
   ═════════════════════════════════════════════════════════════════════════ */

/* The home trust band's footnote. .assure-wrap is a grid — measured live: one
   column at 390w, two from 34rem — so the note claims the WHOLE row rather
   than becoming a fifth cell. flex-basis is the belt to that braces: nothing
   guarantees the master keeps the grid.
   letter-spacing/text-transform are pinned to their defaults on purpose: this
   is a footnote and must never become an uppercase letter-spaced line, which
   is the eyebrow idiom verifySectionKickers() fails a build on.
   MEASURED at 390w with the full sentence: 97.8px inside a 464.5px wrap. */
body .cc-shipnote {
  grid-column: 1 / -1;
  flex-basis: 100%;
  max-width: 68ch;
  margin: 1.15rem 0 0;
  font-size: 0.74rem;
  line-height: 1.55;
  letter-spacing: 0;
  text-transform: none;
  color: color-mix(in srgb, var(--sf-text, #F0F6FA) 88%, var(--cc-navy-800, #0C2440));
}

/* The cart drawer's copy, under the free-shipping progress bar. Here --sf-muted
   IS the right answer and needs no solving: measured live, #cart-panel paints a
   flat rgb(20,34,53) with no gradient and no overlay, and --sf-muted (#A6BACB)
   on it is 8.02:1. It is also exactly what the progress line above (13.1px) and
   the "Free Shipping · $300" badge (11.8px) already use on this same surface,
   so the footnote joins a register that ships rather than inventing one.
   THE COPY IS SHORT BY DESIGN, and the reason is geometry, not taste: this
   block sits at the very TOP of the drawer, above the item list. MEASURED at
   390w — the block is 92px with no note, 170.1px carrying the full sentence
   (a phone customer loses 78px of their own cart), and 116.8px carrying the
   one-line restatement the lane now writes. */
body .cc-shipnote-cart {
  margin: 7px 0 0;
  font-size: 0.72rem;
  line-height: 1.45;
  text-align: center;
  color: var(--sf-muted);
}

/* The link out to shipping-policy.html, where the full sentence ships verbatim.
   It appears in the two TIGHT surfaces — the cart note above and the PDP trust
   sub-line, which is 21-pdp.mjs's element, so this rule reaches it through the
   anchor's OWN class rather than by restyling anything that lane owns.
   `color: inherit` is deliberate: the two grounds are different (a flat navy
   panel and the PDP's page ground) and each sub-line's ink is already solved
   against its own. Inheriting keeps ONE solved colour per surface instead of
   introducing a second one here that no probe measured. The underline is what
   marks it as a link, so removing the colour difference costs nothing.
   MEASURED on the patched build at 390w: the link renders rgb(166,186,203) on
   both surfaces — 8.02:1 on the cart panel's rgb(20,34,53), and identical to
   the ink of the sub-line it sits in on the PDP. The hover accent (#3FB6C9)
   is 6.68:1 on the same panel, so the one colour this rule DOES introduce
   clears the line too; it is a desktop affordance only and nothing depends
   on it. */
body .cc-shipnote-link,
body .cc-shipnote-link:visited {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
  text-decoration-thickness: from-font;
}
body .cc-shipnote-link:hover,
body .cc-shipnote-link:focus-visible {
  color: var(--sf-accent);
}