/* ===========================================================================
   COOKIE CONSENT (9/22) - the card assets/js/consent.js draws, plus the footer's
   "Your privacy choices" button. Tokens only; no gradients; nothing forced with the bang keyword (verify.js greps for it, comments included).
   Bottom-left card on white, the site's card radius and shadow; two equal
   buttons (accept and reject look the same on purpose - neither is the "easy"
   one); the policy link as plain text. Full width on phones, 16px gutters.
   =========================================================================== */
.consent { position: fixed; left: 16px; bottom: 16px; z-index: 1200; width: min(440px, calc(100vw - 32px)); }
.consent[hidden] { display: none; }
.consent__card {
  padding: 22px 24px 24px;
  border-radius: 24px;
  background-color: var(--white);
  color: var(--ink);
  box-shadow: 0 0 0 1px rgb(47 47 53 / 0.1), 0 28px 60px -28px rgb(20 20 30 / 0.5);
  font-family: var(--font-body);
}
.consent__text { margin: 0 0 16px; font-size: 0.9375rem; line-height: 1.5; }
.consent__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.consent__btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 44px; padding: 0 20px;
  border: 0; border-radius: var(--r-pill);
  background-color: var(--ink); color: var(--white);
  font: inherit; font-size: 0.9375rem; font-weight: 700; line-height: 1;
  cursor: pointer;
}
.consent__btn:hover { background-color: var(--indigo); }
.consent__btn:focus-visible { outline: 3px solid var(--ink); outline-offset: 3px; }
.consent__link { margin-left: auto; color: var(--ink); font-size: 0.9375rem; text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 479px) {
  .consent { left: 16px; right: 16px; width: auto; }
  .consent__btn { flex: 1 1 auto; }
  .consent__link { margin-left: 0; width: 100%; }
}
/* the footer's re-open control, drawn exactly like the Resources links beside it (direction-d-v3.css
   .footer__col a, and its 44px touch row under 900px) */
.footer__legal-choice { all: unset; cursor: pointer; text-align: left; font-family: var(--font-body); font-size: var(--fs-small); color: var(--oat-75); }
.footer__legal-choice:hover { color: var(--oat); text-decoration: underline; }
.footer__legal-choice:focus-visible { outline: 2px solid var(--oat); outline-offset: 3px; }
@media (max-width: 899px) { .footer__col .footer__legal-choice { display: block; padding-block: 10px; } }
