/* ============================================================
   "Are you in California?" gate — shown by every Buy Now button.
   Markup is injected by assets/js/buy-now.js, so no page carries it.
   ============================================================ */
.koa-gate{
  --gate-paper:#f4e7cd;
  --gate-ink:#33291c;
  --gate-green:#015738;
  position:fixed;
  inset:0;
  z-index:9999;                 /* above the fixed header (500) and every panel */
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  background:rgba(8,11,34,.72);
  -webkit-backdrop-filter:blur(4px);
  backdrop-filter:blur(4px);
  opacity:0;
  visibility:hidden;
  transition:opacity .22s ease, visibility .22s;
}
.koa-gate.is-open{opacity:1;visibility:visible}
.koa-gate *{box-sizing:border-box}

.koa-gate-card{
  position:relative;
  width:min(420px,100%);
  background:var(--gate-paper);
  color:var(--gate-ink);
  border-radius:18px;
  padding:38px 30px 30px;
  text-align:center;
  box-shadow:0 26px 60px rgba(0,0,0,.5);
  transform:translateY(14px) scale(.97);
  transition:transform .26s cubic-bezier(.2,.8,.2,1);
}
.koa-gate.is-open .koa-gate-card{transform:none}

.koa-gate-kicker{
  font-family:'Niconne',cursive;font-size:26px;line-height:1;
  color:var(--gate-green);margin:0 0 4px;opacity:.9;
}
.koa-gate-title{
  font-family:'Kelly Slab',Georgia,serif;font-weight:400;
  font-size:clamp(24px,5vw,30px);line-height:1.15;margin:0;
}
.koa-gate-note{
  font-family:'Questrial',sans-serif;font-size:13px;line-height:1.5;
  margin:12px 0 0;opacity:.7;
}

/* the labels are full sentences now, so they always stack rather than sitting
   side by side — Yes is first in the DOM, so plain `column` puts it on top */
.koa-gate-actions{display:flex;flex-direction:column;gap:11px;margin-top:26px}
.koa-gate-btn{
  flex:1;
  font-family:'Questrial',sans-serif;font-size:14px;letter-spacing:.14em;text-transform:uppercase;
  padding:15px 14px;border-radius:40px;border:2px solid var(--gate-green);
  line-height:1.25;
  background:transparent;color:var(--gate-green);
  cursor:pointer;
  transition:background .2s ease,color .2s ease;
}
.koa-gate-btn:hover{background:var(--gate-green);color:var(--gate-paper)}
.koa-gate-btn.is-primary{background:var(--gate-green);color:var(--gate-paper)}
.koa-gate-btn.is-primary:hover{background:#0d3a28;border-color:#0d3a28}
.koa-gate-btn:focus-visible{outline:3px solid rgba(1,87,56,.45);outline-offset:2px}

.koa-gate-close{
  position:absolute;top:10px;right:12px;
  width:38px;height:38px;line-height:1;
  display:flex;align-items:center;justify-content:center;
  border:0;background:transparent;color:var(--gate-ink);
  font-size:24px;cursor:pointer;opacity:.5;border-radius:50%;
}
.koa-gate-close:hover{opacity:1}
.koa-gate-close:focus-visible{outline:3px solid rgba(1,87,56,.45);outline-offset:-2px}

/* the homepage's Buy Now blocks are plain divs; the script makes them buttons,
   so give them a pointer to match */
.koa-cta{cursor:pointer}

@media (max-width:400px){
  .koa-gate-card{padding:32px 20px 24px}
  .koa-gate-btn{font-size:13px;letter-spacing:.1em;padding:14px 10px}
}
@media (prefers-reduced-motion:reduce){
  .koa-gate,.koa-gate-card{transition:none}
}