/* ===================== BADDIE POPS — PRELAUNCH SHARED LAYER =====================
   One file, linked last on every main page, so the announcement bar, the
   prelaunch header treatment and the waitlist-facing bits are identical
   everywhere. Values match the homepage exactly — this file makes the other
   pages agree with it, it does not restyle the homepage.
   TO RESTORE COMMERCE AT LAUNCH: delete the .mhd__spacer rule and un-hide the
   bag/search markup (the underlying commerce code is untouched).           */

/* ---- announcement bar ---- */
.anncbar{
  position:relative; z-index:130;
  background:var(--ink,#2C2C2C); color:#F7EFE9;
  font-family:var(--mono,"Azeret Mono",ui-monospace,Menlo,monospace);
  text-transform:uppercase; letter-spacing:.22em; font-size:10px; font-weight:600;
  text-align:center; padding:9px 12px 8px;
}
/* each phrase is nowrap, so a break can never land mid-phrase */
.anncbar__a,.anncbar__b{white-space:nowrap}
/* one bar per shell — the homepage renders a mobile and a desktop shell */
.anncbar--d{display:none}
.anncbar--m{display:block}
@media (min-width:861px){ .anncbar--d{display:block} .anncbar--m{display:none} }
/* under 560px the two phrases stack as centred lines and the dot is dropped.
   9px x 1.5 line-height x 2 lines + 15px padding = a whole 42px, which keeps
   the homepage hero's measured offset on an integer boundary. */
@media (max-width:559px){
  .anncbar{font-size:9px;letter-spacing:.16em;line-height:1.5;padding:8px 10px 7px}
  .anncbar__sep{display:none}
  .anncbar__a,.anncbar__b{display:block}
}

/* ---- prelaunch header: inert spacer where the mobile bag was ---- */
.mhd__spacer{display:block;width:44px;height:44px;justify-self:end;pointer-events:none}

/* ---- footer waitlist supporting line ---- */
.footer__sub{
  font-family:var(--mono,"Azeret Mono",ui-monospace,Menlo,monospace);
  text-transform:lowercase; letter-spacing:.04em;
  font-size:12px; line-height:1.5; color:rgba(44,44,44,.62);
  margin:-12px 0 18px; max-width:34ch;
}

/* ---- visible keyboard focus on every CTA this pass touches ---- */
.tile__wl:focus-visible,
.trio__cta:focus-visible,
.pdp-wl__btn:focus-visible,
.bb-cta:focus-visible,
.footer__join:focus-visible,
.footer__email:focus-visible,
.footer__link:focus-visible,
.mhd__btn:focus-visible,
.mnav__links a:focus-visible,
.mnav__flavors a:focus-visible{
  outline:2px solid var(--ink,#2C2C2C); outline-offset:3px; border-radius:6px;
}
.wl__btn:focus-visible,.wl__close:focus-visible{
  outline:2px solid var(--ink,#2C2C2C); outline-offset:3px;
}
.wl__input:focus-visible{outline:2px solid var(--ink,#2C2C2C); outline-offset:2px}

/* ---- no horizontal scroll anywhere ---- */
html,body{max-width:100%;overflow-x:hidden}