/* CookieYes banner (loaded by Google Tag Manager) in the BOS style: a small dark card with a green "Accept" button.
   CookieYes writes its colours as inline styles, so these rules need !important. */
.cky-consent-container { width: 360px !important; left: 20px !important; bottom: 20px !important; font-family: var(--font) !important; }
.cky-consent-container .cky-consent-bar {
  background: rgba(20, 20, 21, .94) !important; border: 1px solid rgba(255, 255, 255, .1) !important; border-radius: 16px !important;
  padding: 18px 18px 16px !important; box-shadow: 0 12px 40px rgba(0, 0, 0, .28) !important;
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
}
.cky-consent-container .cky-title { color: #fff !important; font-size: 15px !important; font-weight: 600 !important; margin: 0 0 6px !important; line-height: 1.3 !important; }
.cky-consent-container .cky-notice-des, .cky-consent-container .cky-notice-des p { color: rgba(255, 255, 255, .72) !important; font-size: 12.5px !important; line-height: 1.5 !important; }
.cky-consent-container .cky-notice-des a { color: var(--brand-hi, #d3dc2e) !important; }
.cky-consent-container .cky-notice-btn-wrapper { margin-top: 12px !important; gap: 8px !important; flex-wrap: wrap !important; }
.cky-consent-container .cky-btn {
  font-family: var(--font) !important; font-size: 13px !important; font-weight: 600 !important; line-height: 1 !important;
  padding: 10px 14px !important; border-radius: 999px !important; margin: 0 !important; flex: 1 1 0 !important; min-width: 0 !important; width: auto !important;
}
.cky-consent-container .cky-btn-reject { order: 1; }
.cky-consent-container .cky-btn-accept { order: 2; background: var(--brand, #b6be1a) !important; border: 1px solid var(--brand, #b6be1a) !important; color: var(--brand-ink, #141600) !important; }
.cky-consent-container .cky-btn-accept:hover { background: var(--brand-hi, #d3dc2e) !important; border-color: var(--brand-hi, #d3dc2e) !important; }
.cky-consent-container .cky-btn-reject { background: transparent !important; border: 1px solid rgba(255, 255, 255, .35) !important; color: #fff !important; }
.cky-consent-container .cky-btn-reject:hover { border-color: #fff !important; }
.cky-consent-container .cky-btn-customize {
  order: 3; flex: 0 0 100% !important; background: none !important; border: 0 !important; color: rgba(255, 255, 255, .6) !important;
  padding: 4px 0 0 !important; font-weight: 500 !important; font-size: 12px !important; text-decoration: underline !important; text-underline-offset: 3px;
}
.cky-consent-container .cky-btn-customize:hover { color: #fff !important; }
.cky-consent-container .cky-btn:focus-visible { outline: 2px solid var(--brand-hi, #d3dc2e) !important; outline-offset: 2px; }

/* preferences window */
.cky-modal { font-family: var(--font) !important; border-radius: 16px !important; }
.cky-modal .cky-btn { border-radius: 999px !important; font-family: var(--font) !important; font-weight: 600 !important; }
.cky-modal .cky-btn-accept, .cky-modal .cky-btn-preferences { background: var(--brand, #b6be1a) !important; border-color: var(--brand, #b6be1a) !important; color: var(--brand-ink, #141600) !important; }
.cky-modal .cky-btn-reject { background: transparent !important; border: 1px solid #141414 !important; color: #141414 !important; }
.cky-modal .cky-switch input[type=checkbox]:checked { background: var(--brand, #b6be1a) !important; }
.cky-modal a { color: var(--brand-text, #6b7000) !important; }

/* the small button to change the choice later */
.cky-btn-revisit-wrapper { background: var(--brand, #b6be1a) !important; width: 38px !important; height: 38px !important; left: 16px !important; bottom: 16px !important; }
.cky-btn-revisit-wrapper img { filter: brightness(0) !important; width: 22px !important; height: 22px !important; }

@media (max-width: 560px) {
  .cky-consent-container { width: auto !important; left: 10px !important; right: 10px !important; bottom: 10px !important; }
  .cky-consent-container .cky-consent-bar { padding: 14px 16px !important; max-height: none !important; }
  .cky-consent-container .cky-notice, .cky-consent-container .cky-notice-group, .cky-consent-container .cky-notice-des { padding: 0 !important; margin: 0 !important; overflow: visible !important; max-height: none !important; }
  .cky-consent-container .cky-notice-btn-wrapper { flex-direction: row !important; flex-wrap: wrap !important; padding: 0 !important; margin-top: 10px !important; }
  .cky-consent-container .cky-btn { height: auto !important; margin: 0 !important; }
  .cky-consent-container .cky-title { padding: 0 !important; }
  .cky-consent-container .cky-btn-customize { flex: 0 0 100% !important; }
  .cky-consent-container .cky-notice-des, .cky-consent-container .cky-notice-des p { font-size: 12px !important; }
}

/* media page hero (news banner with the H4 and MG18): picture element fills the hero like the plain img does */
.hero-bg picture { display: block; width: 100%; height: 100%; }
.hero-cover.hero-news .hero-bg img { object-position: 50% 40%; }
