/* ==========================================================================
   Cookie choices: the banner, and the footer's "Cookie settings" button.
   Copied to the production site only, with consent.js, by
   scripts/website-analytics.mjs. Built from styles.css's tokens, so it reads
   as the footer's own ink rather than a third-party widget.
   ========================================================================== */

.cookie-banner {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 90;
  padding: 20px 0 calc(20px + env(safe-area-inset-bottom));
  background: var(--ink); color: var(--text-on-dark);
  border-top: 1px solid var(--rule-on-dark);
  box-shadow: 0 -8px 32px rgba(0, 0, 0, 0.18);
}
.cookie-banner[hidden] { display: none; }
.cookie-banner__inner { display: flex; align-items: center; justify-content: space-between; gap: 16px 40px; }
.cookie-banner__copy { max-width: 760px; }
.cookie-banner__title { font-size: 1.125rem; letter-spacing: -0.01em; color: var(--white); }
.cookie-banner__text { margin-top: 6px; font-size: var(--step-small); line-height: 1.6; color: var(--muted-on-dark); }
.cookie-banner__text a { color: var(--white); text-decoration: underline; text-underline-offset: 3px; }
.cookie-banner__text a:hover { color: var(--pale-yellow); }
.cookie-banner__status { margin-top: 6px; font-size: var(--step-small); color: var(--pale-yellow); }
.cookie-banner__status[hidden] { display: none; }
/* Two buttons, one style: rejecting must be exactly as easy to see and to
   reach as accepting. */
.cookie-banner__actions { display: flex; gap: 12px; flex: none; }
.cookie-banner__actions .pill { min-width: 132px; }
.cookie-banner :focus-visible { outline-color: var(--pale-yellow); }

/* While the banner is open the page gains its height at the bottom, so the
   end of the page can still be scrolled into view above it. */
html.cookie-banner-open body { padding-bottom: var(--cookie-banner-space, 0px); }

/* A button, not a link: it opens the banner rather than going anywhere. */
.footer__cookie-settings {
  display: flex; align-items: center; min-height: 31px;
  padding: 0; border: 0; background: none;
  font-size: 0.9375rem; line-height: inherit; text-align: left; color: inherit;
}
.footer__cookie-settings:hover { color: var(--white); }

@media (max-width: 1240px) {
  .footer__cookie-settings { min-height: 44px; }
}

@media (max-width: 760px) {
  .cookie-banner { padding-top: 18px; }
  .cookie-banner__inner { flex-direction: column; align-items: stretch; }
  .cookie-banner__actions .pill { flex: 1; min-width: 0; }
}

@media print {
  .cookie-banner { display: none; }
}