/* The cookie banner. Deliberately plain: it should read as the site's own voice, not as a
   third-party overlay, and it must not cover the page it is asking about. */
.cc {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 800;
  padding: 14px; font-family: 'Poppins', -apple-system, system-ui, sans-serif;
}
.cc-box {
  max-width: 940px; margin: 0 auto; display: flex; flex-wrap: wrap; align-items: center; gap: 14px 20px;
  padding: 16px 20px; border-radius: 14px;
  background: #fff; color: #0a0a0b; border: 1px solid #e4e4e8;
  box-shadow: 0 14px 44px rgba(10,10,11,.22);
}
.cc-text { flex: 1 1 320px; min-width: 0; }
.cc-text strong { display: block; font-size: 0.95rem; margin-bottom: 3px; }
.cc-text p { margin: 0; font-size: 0.82rem; line-height: 1.5; color: #55555f; }
.cc-text a { color: inherit; text-decoration: underline; }

.cc-choices { display: flex; flex-direction: column; gap: 6px; flex: 0 1 auto; }
.cc-choices label { display: flex; align-items: center; gap: 8px; font-size: 0.8rem; color: #0a0a0b; cursor: pointer; }
.cc-choices input { width: 16px; height: 16px; accent-color: #1a3a22; }

/* Reject and Accept are the same size and sit together. A refusal that takes more clicks than an
   acceptance is not a choice, and regulators read it exactly that way. */
.cc-buttons { display: flex; gap: 8px; flex: 0 0 auto; }
.cc-buttons button {
  padding: 10px 16px; border-radius: 9px; border: 1.5px solid #0a0a0b;
  font: 600 0.82rem 'Poppins', -apple-system, sans-serif; cursor: pointer; white-space: nowrap;
  background: #fff; color: #0a0a0b;
}
.cc-buttons .cc-accept { background: #0a0a0b; color: #fff; }
.cc-buttons button:hover { opacity: .85; }
.cc-buttons button:focus-visible { outline: 2px solid #4c9b58; outline-offset: 2px; }

@media (max-width: 720px) {
  .cc-box { flex-direction: column; align-items: stretch; }
  .cc-buttons { flex-wrap: wrap; }
  .cc-buttons button { flex: 1 1 auto; }
}
@media (prefers-reduced-motion: no-preference) {
  .cc-box { animation: cc-in .28s cubic-bezier(.22,1,.36,1); }
  @keyframes cc-in { from { transform: translateY(12px); opacity: 0; } }
}
.cc-choices .cc-off { color: #8a8a93; cursor: default; }
.cc-choices .cc-off span { font-size: 0.74rem; }

/* ---- the folded-away detail ----
   "Choose what to allow" looks like a link, not a third button competing with Accept and Reject.
   The tick boxes and their Save sit on their own row once opened, so the first layer stays two
   buttons and one sentence. */
.cc-more {
  margin-top: 8px; padding: 0; background: none; border: 0; font: inherit; font-size: 0.8rem;
  color: #55555f; text-decoration: underline; cursor: pointer;
}
.cc-more:hover { color: #0a0a0b; }
.cc-choices[hidden] { display: none; }
.cc-choices { flex-basis: 100%; padding-top: 4px; }
.cc-choices .cc-save {
  align-self: flex-start; margin-top: 4px; padding: 7px 14px; font-size: 0.8rem;
  border: 1.5px solid #0a0a0b; border-radius: 999px; background: #fff; color: #0a0a0b; cursor: pointer; font-weight: 600;
}
.cc-choices .cc-save:hover { background: #0a0a0b; color: #fff; }