:root{
  --paper:#E8E8E2;--ink:#16140F;--red:#CE1126;--green:#00703A;--rule:rgba(22,20,15,.28);
  --s-1:.85rem;--s0:1.0625rem;--s1:1.35rem;--s2:1.9rem;--s4:3.4rem;--s5:4.6rem;
  --edge:clamp(1.1rem,5vw,4rem);
}
*{box-sizing:border-box}
body{margin:0;background:var(--paper) radial-gradient(var(--rule) .5px,transparent .5px);background-size:7px 7px;
  color:var(--ink);font-family:Archivo,system-ui,sans-serif;font-size:var(--s0);line-height:1.5}
img{display:block;max-width:100%}
:focus-visible{outline:3px solid var(--red);outline-offset:3px}
.wrap{max-width:1100px;margin:0 auto;padding-inline:var(--edge)}

.masthead{display:flex;align-items:center;justify-content:space-between;padding:1rem 0;border-bottom:1.5px solid var(--ink)}
.brand{font-family:Anton,Impact,sans-serif;font-size:var(--s1);line-height:1;text-decoration:none;color:inherit}
.brand .dot{color:var(--red)}
.cartbtn{font-family:Archivo;font-weight:700;font-size:var(--s-1);background:none;color:var(--ink);
  border:1.5px solid var(--ink);cursor:pointer;padding:.6em 1.1em;border-radius:999px}

/* ---- the whole store is the hero ---- */
.hero{display:grid;gap:clamp(1.5rem,4vw,3rem);padding:clamp(1.5rem,4vw,3rem) 0 1.6rem;align-items:center;grid-auto-rows:max-content}
@media(min-width:820px){.hero{grid-template-columns:minmax(0,.9fr) minmax(0,1fr)}}
.art{position:relative;max-width:520px;margin:0 auto}
@media(max-width:819px){.art{max-width:200px;margin:0}.hero{padding-top:1rem;gap:.8rem}h1{margin-bottom:.4rem}.lede{margin-bottom:.9rem}.spec{margin-bottom:1rem}}
.art img{filter:drop-shadow(0 6px 10px rgba(22,20,15,.28));transform:rotate(-3deg)}
h1{font-family:Anton,Impact,sans-serif;font-weight:400;font-size:clamp(2.5rem,7vw,var(--s5));line-height:.92;margin:0 0 .6rem}
.slip{position:relative;display:inline-block}
.slip::before{content:attr(data-slip);position:absolute;left:-4px;top:4px;color:var(--red);z-index:-1}
.lede{font-size:var(--s1);line-height:1.3;max-width:30ch;margin:0 0 1.4rem}
.spec{font-size:var(--s-1);opacity:.78;max-width:40ch;margin:0 0 1.6rem}

.tiers{display:grid;gap:.7rem;grid-template-columns:1fr}
@media(max-width:459px){.tier{padding:1rem .9rem .9rem}.tier .n{font-size:var(--s2)}}
@media(min-width:560px){.tiers{grid-template-columns:repeat(2,1fr)}}
@media(min-width:880px){.tiers{grid-template-columns:repeat(3,1fr)}}
.tier{border:1.5px solid var(--ink);border-radius:14px;padding:1.1rem 1rem 1rem;background:rgba(255,255,255,.35);display:flex;flex-direction:column;gap:.55rem}
.tier{position:relative}
.tier.hot{border-width:2.5px;background:rgba(255,255,255,.7)}
.tag{display:inline-block;align-self:flex-start;background:var(--green);color:#fff;font-size:.72rem;font-weight:700;padding:.25em .7em;border-radius:999px;white-space:nowrap;margin:-.2rem 0 .1rem}
.why{margin:0;font-size:var(--s-1);line-height:1.4;opacity:.85}
.p .each{font-weight:600;opacity:.6;font-size:var(--s-1);margin-left:.3em}
.run{margin-top:.9rem;background:var(--ink);color:var(--paper);border-radius:14px;padding:1rem 1.1rem;display:grid;gap:.8rem;align-items:center}
@media(min-width:700px){.run{grid-template-columns:1fr auto}.run .buy{min-width:220px}}
.run .n{font-family:Anton;font-size:var(--s2);line-height:1}
.run .n .each{font-family:Archivo;font-weight:600;font-size:var(--s-1);opacity:.7;margin-left:.4em}
.run .why{opacity:.8}
.tier .n{font-family:Anton;font-size:var(--s2);line-height:1}
.tier .n small{font-family:Archivo;font-weight:600;font-size:var(--s-1);opacity:.75;margin-left:.3em}
.tier .p{font-weight:700;font-size:var(--s0)}
.tier .each{font-size:var(--s-1);opacity:.7;margin-top:-.4rem}
.tier .buy{margin-top:auto;min-height:44px}
.buy.pending{font-size:var(--s-1);opacity:.55;padding:.5em 0}

/* Shopify SDK buttons, styled to the page */
.buy .shopify-buy__btn{font-family:Archivo,sans-serif!important;font-weight:700!important;font-size:var(--s0)!important;line-height:1!important;white-space:nowrap;
  padding:.8em .9em!important;border-radius:999px!important;cursor:pointer;width:100%;border:1.5px solid var(--ink)!important;
  background:var(--ink)!important;color:var(--paper)!important;transition:background .15s}
.buy .shopify-buy__btn:hover{background:#332e25!important}
.buy .shopify-buy__btn:disabled{opacity:.55;cursor:wait}
.tier.hot .buy .shopify-buy__btn,.run .buy .shopify-buy__btn{background:var(--green)!important;border-color:var(--green)!important;color:#fff!important}
.tier.hot .buy .shopify-buy__btn:hover,.run .buy .shopify-buy__btn:hover{background:#005a2e!important}
.buy .shopify-buy__btn-wrapper,.buy .shopify-buy__product{margin:0!important}
.shopify-buy__cart-toggle{display:none!important}

section{padding:clamp(2rem,5vw,3.5rem) 0;border-top:1.5px solid var(--ink)}
h2{font-family:Anton;font-weight:400;font-size:clamp(1.8rem,4vw,var(--s4));line-height:1;margin:0 0 1.2rem}
.specs{display:grid;gap:1.2rem;grid-template-columns:1fr}
@media(min-width:700px){.specs{grid-template-columns:repeat(3,1fr)}}
.specs dt{font-weight:700;margin:0 0 .25rem}
.specs dd{margin:0;font-size:var(--s-1);opacity:.8;max-width:34ch}
.faq details{border-bottom:1px solid var(--rule);padding:1rem 0}
.faq summary{cursor:pointer;font-weight:700;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";float:right;font-size:1.4rem;line-height:1;opacity:.55}
.faq details[open] summary::after{content:"\2013"}
.faq p{margin:.6rem 0 0;max-width:62ch;font-size:var(--s-1);opacity:.85}
footer{border-top:1.5px solid var(--ink);padding:1.8rem 0 3rem;font-size:var(--s-1)}
footer p{margin:.3rem 0;opacity:.75}
#setup-banner{position:fixed;left:0;right:0;bottom:0;z-index:60;background:var(--red);color:#fff;padding:.8rem var(--edge);font-size:var(--s-1);font-weight:600}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}