/** Shopify CDN: Minification failed

Line 230:0 Unexpected "}"

**/
/* Big Beetle Books, global theme styles (non-landing pages).
   The landing page uses bbb-landing.css and is fully scoped to #bbb-landing.
   These styles are for header, footer, product, collection, cart, page, 404, etc. */

:root{
  --ink:#182540;
  --ink-deep:#0E1932;
  --cobalt:#2443D8;
  --ultramarine:#1D2FB8;
  --cream:#FBF8F1;
  --paper:#F6F2E8;
  --sand:#EFEADC;
  --sun:#E8C547;
  --moss:#6B8A6E;
  --line:rgba(24,37,64,.16);
  --line-soft:rgba(24,37,64,.08);
  --serif:'Fraunces', Georgia, serif;
  --sans:'Inter Tight', system-ui, sans-serif;
  --mono:'JetBrains Mono', monospace;
}

*, *::before, *::after { box-sizing:border-box; }

html, body{ margin:0; padding:0; }

body{
  font-family:var(--sans);
  background:var(--cream);
  color:var(--ink);
  -webkit-font-smoothing:antialiased;
  line-height:1.55;
}

/* Landing page (home) gets no global padding, it's full-bleed */
body.template-index #MainContent{ padding:0; }

/* Collection page is a full-bleed dark section, no global padding either */
body.template-collection #MainContent{ padding:0; }

#MainContent{ min-height:60vh; }

img{ max-width:100%; display:block; }
a{ color:var(--cobalt); text-decoration:none; }
a:hover{ text-decoration:underline; }

h1, h2, h3, h4{
  font-family:var(--serif);
  font-weight:400;
  letter-spacing:-.03em;
  line-height:1.05;
  margin:0 0 .5em;
}

/* ---------- Header ---------- */
.bbb-header{
  position:sticky; top:0; z-index:40;
  background:rgba(251,248,241,.92);
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line-soft);
  padding:0;
  display:block;
}
.bbb-header-row{
  padding:16px clamp(20px,4vw,48px);
  display:flex; align-items:center; justify-content:space-between;
}
.bbb-header .brand{
  font-family:var(--serif); font-size:24px;
  letter-spacing:-.03em; color:var(--ink);
}
.bbb-header .brand em{ font-style:italic; color:var(--cobalt); font-weight:300; }
.bbb-header .brand .dot{
  width:6px; height:6px; background:var(--sun);
  display:inline-block; margin-left:2px;
}
.bbb-header nav{
  display:flex; gap:28px;
  font-family:var(--mono); font-size:11px;
  text-transform:uppercase; letter-spacing:.18em;
}
.bbb-header nav a{
  color:rgba(24,37,64,.62);
  text-decoration:none;
}
.bbb-header nav a:hover{ color:var(--cobalt); }
.bbb-header nav a.cart{ color:var(--cobalt); }

/* On a phone the nav used to be hidden outright, which left every page except
   the home page with no way out. Stack it under the wordmark instead and let it
   scroll sideways, six links, no need for a menu button. */
@media (max-width:720px){
  .bbb-header-row{ flex-direction:column; align-items:stretch; gap:10px; padding:13px 16px 11px; }
  .bbb-header .brand{ font-size:21px; }
  .bbb-header nav{
    display:flex; gap:13px; font-size:10px; letter-spacing:.08em;
    overflow-x:auto; -webkit-overflow-scrolling:touch;
    scrollbar-width:none; padding-bottom:2px;
  }
  .bbb-header nav::-webkit-scrollbar{ display:none; }
  .bbb-header nav a{ white-space:nowrap; }
}

/* ---------- Footer ---------- */
.bbb-footer{
  background:var(--ink-deep); color:var(--cream);
  padding:60px clamp(20px,4vw,48px) 30px;
  margin-top:80px;
}
.bbb-footer .row{
  max-width:1200px; margin:0 auto;
  display:flex; justify-content:space-between; gap:32px; flex-wrap:wrap;
}
.bbb-footer h4{
  font-family:var(--mono); font-size:11px;
  text-transform:uppercase; letter-spacing:.2em;
  color:rgba(191,210,255,.7); margin:0 0 14px;
}
.bbb-footer ul{ list-style:none; margin:0; padding:0; }
.bbb-footer li{ margin-bottom:8px; font-size:14px; color:rgba(251,248,241,.78); }
.bbb-footer a{ color:inherit; }
.bbb-footer a:hover{ color:var(--sun); }
.bbb-footer .meta{
  max-width:1200px; margin:32px auto 0;
  padding-top:24px; border-top:1px solid rgba(251,248,241,.1);
  font-family:var(--mono); font-size:10px;
  text-transform:uppercase; letter-spacing:.16em;
  color:rgba(251,248,241,.4);
}

/* ---------- Generic page / product / collection / cart wrappers ---------- */
.bbb-page{
  max-width:880px;
  margin:0 auto;
  padding:80px clamp(20px,4vw,48px);
}
@media (max-width:720px){
  .bbb-page{ padding-top:26px; padding-bottom:48px; }
  .bbb-page h1{ margin-bottom:18px; }
}
.bbb-page h1{ font-size:clamp(40px,5vw,64px); margin-bottom:32px; }
.bbb-page h1 em{ font-style:italic; color:var(--cobalt); font-weight:300; }
.bbb-page .rte{ font-size:17px; line-height:1.7; color:rgba(24,37,64,.84); }
.bbb-page .rte p{ margin:0 0 1em; }

.bbb-stub{
  max-width:680px; margin:0 auto;
  padding:120px clamp(20px,4vw,48px);
  text-align:center;
}
.bbb-stub .kicker{
  font-family:var(--mono); font-size:11px;
  text-transform:uppercase; letter-spacing:.22em;
  color:var(--cobalt); margin-bottom:18px;
}
.bbb-stub h1{ font-size:clamp(36px,5vw,56px); margin-bottom:18px; }
.bbb-stub p{ font-family:var(--serif); font-size:18px; color:rgba(24,37,64,.7); }
.bbb-stub .btn{
  display:inline-flex; align-items:center; gap:10px;
  margin-top:28px;
  padding:14px 22px;
  background:var(--cobalt); color:var(--cream);
  font-family:var(--mono); font-size:11px;
  text-transform:uppercase; letter-spacing:.18em;
  text-decoration:none;
}
.bbb-stub .btn:hover{ background:var(--ultramarine); text-decoration:none; }

/* ---------- PDP: light 3D hover-tilt (pure CSS, scoped to #bbb-pdp) ----------
   The product page already ships scroll-reveal and a 3D page-flipper; this adds
   a subtle depth lift to the discrete cards, matching the home + shop effects.
   No JS, no extra requests. */
#bbb-pdp .bbb-pdp-proof__grid,
#bbb-pdp .bbb-pdp-payoff__scroll,
#bbb-pdp .bbb-pdp-fbt__row{ perspective:1500px; }
#bbb-pdp .bbb-pdp-letter,
#bbb-pdp .bbb-pdp-payoff__tile,
#bbb-pdp .bbb-pdp-fbt__cover{
  transform-style:preserve-3d;
  transition:transform .3s cubic-bezier(.2,.7,.3,1), box-shadow .3s ease;
}
#bbb-pdp .bbb-pdp-letter:hover,
#bbb-pdp .bbb-pdp-payoff__tile:hover,
#bbb-pdp .bbb-pdp-fbt__cover:hover{
  transform:translateY(-6px) rotateX(4deg) rotateY(-3deg);
  box-shadow:0 26px 50px rgba(24,37,64,.20);
}
@media (prefers-reduced-motion: reduce){
  #bbb-pdp .bbb-pdp-letter:hover,
  #bbb-pdp .bbb-pdp-payoff__tile:hover,
  #bbb-pdp .bbb-pdp-fbt__cover:hover{ transform:translateY(-4px); }
}

/* ---------- "And then…" signup (shared) ---------- */
.bbb-su{ max-width:540px; }
.bbb-su-row{ display:flex; gap:10px; flex-wrap:wrap; }
.bbb-su-row input[type=email]{ flex:1; min-width:200px; font-family:var(--sans); font-size:16px; padding:15px 17px; border:1px solid var(--line); background:#fff; color:var(--ink); border-radius:0; }
.bbb-su-row input[type=email]::placeholder{ color:rgba(24,37,64,.45); }
.bbb-su-row button{ background:var(--sun); color:var(--ink); border:none; font-family:var(--mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase; padding:15px 24px; cursor:pointer; transition:transform .2s, background .2s; white-space:nowrap; }
.bbb-su-row button:hover{ transform:translateY(-2px); background:#f0d05a; }
.bbb-su-micro{ font-family:var(--mono); font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:rgba(24,37,64,.5); margin-top:12px; line-height:1.5; }
.bbb-su-ok{ font-family:var(--sans); font-size:15px; font-weight:500; color:var(--ink); margin-top:12px; background:rgba(232,197,71,.25); border:1px solid var(--sun); padding:12px 14px; }
.bbb-su-ok a{ color:var(--cobalt); font-weight:600; }
.bbb-su-err{ font-family:var(--serif); font-style:italic; color:#b23b2e; margin-top:10px; font-size:14px; }
/* dark tone (on cobalt/ink) */
.bbb-su--dark .bbb-su-row input[type=email]{ background:rgba(255,255,255,.1); border-color:rgba(251,248,241,.4); color:var(--cream); }
.bbb-su--dark .bbb-su-row input[type=email]::placeholder{ color:rgba(251,248,241,.55); }
.bbb-su--dark .bbb-su-micro{ color:rgba(251,248,241,.6); }
.bbb-su--dark .bbb-su-ok{ color:var(--cream); background:rgba(232,197,71,.18); }
.bbb-su--dark .bbb-su-ok a{ color:var(--sun); }
.bbb-su--dark .bbb-su-err{ color:#ffd7cf; }

/* ---------- Thin ochre announcement strip ---------- */
.bbb-strip{ background:#D9962E; overflow:hidden; }
.bbb-strip-track{ display:flex; width:max-content; animation:bbb-strip-roll 42s linear infinite; }
.bbb-strip:hover .bbb-strip-track{ animation-play-state:paused; }
.bbb-strip-group{ display:flex; align-items:center; flex:0 0 auto; }
.bbb-strip-group span{ font-family:var(--mono); font-weight:700; font-size:11px; letter-spacing:.16em;
  text-transform:uppercase; color:var(--cobalt); line-height:1; white-space:nowrap;
  padding:9px 20px; border-right:1px solid rgba(36,67,216,.38); }
@keyframes bbb-strip-roll{ from{ transform:translateX(0); } to{ transform:translateX(-25%); } }
@media(prefers-reduced-motion:reduce){ .bbb-strip-track{ animation:none; } }
@media(max-width:720px){
  .bbb-strip-group span{ font-size:9px; letter-spacing:.1em; padding:8px 14px; }
}
}

/* compressed "good to know" bullets in the global footer */
.bbb-footer ul.bbb-good li{ font-size:13px; margin-bottom:7px; padding-left:14px; position:relative; line-height:1.4; }
.bbb-footer ul.bbb-good li::before{ content:"\25AA"; position:absolute; left:0; top:0; font-size:8px; color:var(--sun); }