/* Cookie consent banner. Self-contained (loaded on every page, including 404 which has no site stylesheet),
   so every colour has a fallback. Accept and Decline are deliberately identical in size, weight and colour. */
.consent{position:fixed;z-index:190;left:clamp(12px,2vw,24px);bottom:clamp(12px,2vw,24px);
  width:min(400px,calc(100vw - 24px));box-sizing:border-box;padding:1.1rem 1.15rem 1rem;
  background:var(--paper,#fbf8f2);color:var(--ink,#17120d);border:2px solid var(--ink,#17120d);
  border-radius:var(--radius,14px);box-shadow:0 10px 30px rgba(23,18,13,.22);
  font-family:'Inter',system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;font-size:.86rem;line-height:1.5}
.consent[hidden]{display:none}
.consent:focus{outline:none}
.consent:focus-visible{outline:3px solid var(--ink,#17120d);outline-offset:3px}
.consent__title{margin:0 0 .35rem;font-family:'Archivo','Helvetica Neue',Arial,sans-serif;font-weight:900;
  text-transform:uppercase;letter-spacing:-.02em;font-size:1.05rem;line-height:1}
.consent__text{margin:0 0 .9rem;color:inherit}
.consent__text a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.consent__actions{display:flex;gap:.6rem}
.consent__btn{flex:1 1 0;min-height:44px;padding:.6rem 1rem;cursor:pointer;
  font:inherit;font-weight:700;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;
  background:var(--ink,#17120d);color:var(--cream,#f5efe4);border:2px solid var(--ink,#17120d);border-radius:50px}
.consent__btn:hover{background:var(--red-dark,#b8331f);border-color:var(--red-dark,#b8331f);color:#fff}
.consent__btn:focus-visible{outline:3px solid var(--red,#d8402a);outline-offset:2px}

@media (max-width:520px){
  .consent{left:8px;right:8px;bottom:8px;width:auto;padding:.9rem .95rem .85rem;font-size:.82rem}
  .consent__text{margin-bottom:.75rem}
}
/* While the banner is open (consent.js sets --consent-h to its height): the sticky Add to Cart bar rides above it,
   and on a phone the page gets bottom room so the checkout Pay button can be scrolled clear of it. */
html.has-consent .pbar{bottom:var(--consent-h,0)}
@media (max-width:520px){
  html.has-consent body{padding-bottom:var(--consent-h,0)}
}
@media (prefers-reduced-motion:no-preference){
  .consent:not([hidden]){animation:consent-in .35s cubic-bezier(.2,.8,.2,1) both}
  @keyframes consent-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
}
