/* ═══════════════════════════════════════════════
   COOKIE CONSENT BAR

   A bar, not a blocking modal: nothing is loaded
   before the answer anyway, so there is no reason to
   hold the page hostage — and a full-screen wall over
   the box-opening intro would waste the best thing on
   the site.

   Accept and Reject are the SAME button. Making the
   refusal quieter than the acceptance is a dark
   pattern, is what regulators fine, and is not a
   design decision to make casually.
   ═══════════════════════════════════════════════ */
.cc{
  position:fixed; left:0; right:0; bottom:0; z-index:9000;
  padding:clamp(12px,2vw,18px);
  transform:translateY(110%);
  transition:transform .5s var(--ease);
  pointer-events:none;
}
.cc.is-on{transform:none; pointer-events:auto}

.cc__inner{
  max-width:920px; margin:0 auto;
  display:flex; align-items:center; gap:clamp(14px,3vw,28px);
  padding:clamp(14px,2vw,18px) clamp(16px,2.4vw,24px);
  background:var(--cream);
  border:1px solid rgba(136,1,42,.16);
  border-radius:14px;
  box-shadow:0 22px 50px -24px rgba(84,20,44,.5);
}

.cc__text{
  margin:0; flex:1 1 auto;
  font:400 13px/1.55 var(--sans); color:var(--ink-soft);
}
.cc__text a{color:var(--wine); font-weight:500; text-underline-offset:2px}

.cc__actions{display:flex; gap:10px; flex:0 0 auto}

/* one class, both answers — the refusal is not a lesser option */
.cc__btn{
  appearance:none; cursor:pointer;
  min-height:42px; padding:0 20px;
  font:600 12.5px/1 var(--sans); letter-spacing:.04em;
  color:var(--wine); background:transparent;
  border:1.5px solid var(--wine); border-radius:99px;
  transition:background .25s var(--ease), color .25s var(--ease);
}
.cc__btn:hover{background:var(--wine); color:var(--cream)}
.cc__btn:focus-visible{outline:2px solid var(--wine); outline-offset:3px}
.cc__btn:active{transform:translateY(.5px)}

/* the footer link that brings it back */
.cc-reopen{
  appearance:none; border:0; background:none; padding:0;
  font:inherit; color:inherit; cursor:pointer;
  text-decoration:underline; text-underline-offset:2px;
}

@media (max-width:640px){
  .cc__inner{flex-direction:column; align-items:stretch; gap:12px}
  .cc__actions{display:grid; grid-template-columns:1fr 1fr}
  .cc__btn{width:100%; padding:0 12px}
}

@media (prefers-reduced-motion:reduce){
  .cc{transition:none}
}