/* Color Up Pro Dispensary storefront. Colors come from each partner's brand via brand-theme.js. */
*{box-sizing:border-box}
html,body{margin:0}
body{background:#fff;color:#211F20}
[hidden]{display:none!important}
:root{--s-sans:'Instrument Sans',system-ui,-apple-system,'Segoe UI',sans-serif;--s-serif:'Newsreader',Georgia,'Times New Roman',serif}
.store{
  --brand:#211F20;--on-brand:#fff;--brand-ink:#56664D;--brand-tint:#FBF8F3;--brand-tint-2:#F1EBE2;--accent:#211F20;--on-accent:#fff;
  --s-bg:#FFFFFF;--s-ink:#211F20;--s-muted:#625E5B;--s-line:#E7E2DC;--s-soft:#F7F4EF;
  --art-b:#E4DED6;--art-c:#3A3638;--art-l:#FFFFFF;
  background:var(--s-bg);color:var(--s-ink);font-family:var(--s-sans);font-size:15px;line-height:1.55;color-scheme:light;
}
.store *{box-sizing:border-box}
.store a{color:var(--brand-ink)}
.store :focus-visible{outline:2px solid var(--s-ink);outline-offset:2px}
.announce{background:var(--brand);color:var(--on-brand);font-size:12.5px;padding:7px 16px;text-align:center}
.shdr{display:flex;flex-wrap:wrap;align-items:center;gap:10px 26px;padding:12px 28px;border-bottom:1px solid var(--s-line);background:#fff}
@media (max-width:700px){.shdr{padding:12px 16px}}
.lockup{border:0;background:none;padding:0;display:flex;align-items:center;gap:12px;color:var(--s-ink)}
.lockup .pl img{height:40px;max-width:170px;object-fit:contain;display:block}
.lockup .pl .wm{font-family:var(--s-serif);font-size:21px;line-height:1.1;display:block;max-width:220px;text-align:left}
.lockup .x{color:var(--s-muted);font-size:13px}
.cu{display:inline-flex;align-items:center}
.cu img{height:26px;width:auto;max-width:120px;object-fit:contain;display:block}
.cu .cut{font-family:var(--s-sans);font-weight:600;letter-spacing:.16em;font-size:10.5px;line-height:1.15;color:var(--s-ink);text-align:left}
.cu .cut small{display:block;font-weight:500;letter-spacing:.1em;font-size:8.5px;color:var(--s-muted)}
.snav{display:flex;flex-wrap:wrap;gap:2px 20px;margin-left:auto}
.snav button{border:0;background:none;padding:6px 0;color:var(--s-ink);font-size:14.5px;border-bottom:2px solid transparent}
.snav button:hover{border-bottom-color:var(--s-line)}
.snav button[aria-current="page"]{border-bottom-color:var(--brand);font-weight:600}
.bagbtn{display:flex;gap:7px;align-items:center;border:1px solid var(--s-ink);background:#fff;color:var(--s-ink);padding:6px 11px;border-radius:3px;font-size:14px}
.bagbtn b{background:var(--brand);color:var(--on-brand);min-width:20px;height:20px;border-radius:10px;font-size:12px;display:grid;place-items:center;padding:0 5px;font-weight:600}
@media (max-width:760px){.snav{order:3;margin-left:0;width:100%;gap:2px 16px}}
.hero{background:var(--brand-tint);border-bottom:1px solid var(--s-line);display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:28px 48px;padding:52px 48px;align-items:center}
@media (max-width:820px){.hero{grid-template-columns:minmax(0,1fr);padding:32px 16px}}
.eyebrow{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--brand-ink);font-weight:600;margin:0 0 12px}
.store h1,.store h2.sh{font-family:var(--s-serif);font-weight:400;letter-spacing:-.01em;text-wrap:balance;margin:0;color:var(--s-ink)}
.hero h1{font-size:clamp(36px,5vw,58px);line-height:1.04;max-width:13ch}
.fixed{margin:20px 0 0;max-width:56ch;display:grid;gap:10px;color:#34302F}
.fixed p{margin:0}
.welcome{margin:22px 0 0;padding:14px 0 0;border-top:1px solid var(--s-line);max-width:56ch}
.welcome p{margin:0 0 8px;font-family:var(--s-serif);font-size:20px;line-height:1.4;color:var(--s-ink)}
.welcome .sig{font-size:13.5px;color:var(--s-muted)}
.ctas{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.sbtn{border:1.5px solid var(--brand);background:var(--brand);color:var(--on-brand);padding:11px 20px;border-radius:8px;font-size:14.5px;font-weight:600}
.sbtn:hover{filter:brightness(1.1)}
.sbtn.out{background:#fff;color:var(--s-ink);border-color:var(--s-ink)}
.sbtn.out:hover{background:var(--brand-tint-2);filter:none}
.who{width:100%;max-width:380px;justify-self:end;aspect-ratio:4/5;border-radius:4px;overflow:hidden;background:#fff;border:1px solid var(--s-line);display:grid;place-items:center}
@media (max-width:820px){.who{justify-self:start;max-width:300px}}
.who img.ph{width:100%;height:100%;object-fit:cover;display:block}
.who img.lg{width:72%;height:auto;max-height:62%;object-fit:contain;display:block}
.who.is-logo{aspect-ratio:1/1;max-width:340px}
.aboutgrid .who.is-logo{max-width:340px}
.who .wm{font-family:var(--s-serif);font-size:34px;text-align:center;padding:20px;line-height:1.15}
.sec{padding:40px 48px}
@media (max-width:820px){.sec{padding:28px 16px}}
.sec h2.sh{font-size:clamp(26px,3.2vw,34px);line-height:1.1}
.lead{margin:8px 0 20px;color:var(--s-muted);max-width:60ch}
.sechead{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:6px 16px}
.linkbtn{border:0;background:none;color:var(--s-ink);font-weight:600;padding:2px 0;text-decoration:underline;text-underline-offset:3px;font-size:14px}
.cats{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px}
.cat{border:1px solid var(--s-line);background:#fff;border-radius:4px;padding:0;text-align:left;color:var(--s-ink);display:flex;flex-direction:column;overflow:hidden}
.cat:hover{border-color:var(--s-ink)}
.cat .ct{background:var(--s-soft);aspect-ratio:4/3;display:grid;place-items:center;overflow:hidden}
.cat .ct svg{height:80%;width:auto}
.cat .ct img{height:88%;width:auto;max-width:88%;object-fit:contain}
.cat .cn{padding:10px 12px 12px;display:grid;gap:1px}
.cat .cn b{font-weight:600;font-size:14.5px}
.cat .cn span{font-size:12.5px;color:var(--s-muted)}
.cat.all .ct{background:var(--brand);color:var(--on-brand);font-family:var(--s-serif);font-size:40px}
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:20px}
.pcard{display:flex;flex-direction:column;min-width:0}
.art{background:var(--s-soft);aspect-ratio:1/1;display:grid;place-items:center;position:relative;border-radius:4px;border:0;padding:0;width:100%;cursor:pointer}
.art svg{height:76%;width:auto}
.art img{width:100%;height:100%;object-fit:contain;padding:9%;display:block}
.pick{position:absolute;left:8px;top:8px;max-width:calc(100% - 16px);background:var(--accent);color:var(--on-accent);font-size:11.5px;font-weight:600;padding:3px 8px;border-radius:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pinfo{display:flex;flex-direction:column;gap:3px;padding-top:10px;flex:1}
.pinfo h3{font-size:15px;line-height:1.3;margin:0;font-weight:600}
.pinfo h3 button{border:0;background:none;padding:0;color:inherit;font:inherit;text-align:left}
.pinfo h3 button:hover{text-decoration:underline;text-underline-offset:3px}
.meta{margin:0;color:var(--s-muted);font-size:13.5px}
.price{font-variant-numeric:tabular-nums;color:var(--s-ink);font-weight:500}
.why{margin:6px 0 4px;font-size:13.5px;color:#3A3634;font-style:italic;border-left:2px solid var(--brand);padding-left:9px;overflow-wrap:anywhere}
.addb{margin-top:auto;padding:8px 12px;font-size:13.5px;width:100%;background:#fff;color:var(--s-ink);border:1.5px solid var(--s-ink);border-radius:8px;font-weight:600}
.addb:hover{background:var(--s-ink);color:#fff}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}
.chip{border:1px solid var(--s-line);background:#fff;color:var(--s-ink);padding:6px 13px;border-radius:16px;font-size:13.5px}
.chip:hover{border-color:var(--s-ink)}
.chip[aria-pressed="true"]{background:var(--brand);color:var(--on-brand);border-color:var(--brand)}
.pagehead{padding:36px 48px 6px}
@media (max-width:820px){.pagehead{padding:26px 16px 4px}}
.pagehead h1{font-size:clamp(30px,4vw,44px);line-height:1.08}
.pagehead p{color:var(--s-muted);max-width:62ch;margin:8px 0 0}
.crumb{border:0;background:none;padding:0;color:var(--s-muted);font-size:13.5px;margin-bottom:10px}
.crumb:hover{color:var(--s-ink);text-decoration:underline}
.aboutgrid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:36px;align-items:start}
@media (max-width:820px){.aboutgrid{grid-template-columns:minmax(0,1fr)}}
.aboutgrid .who{justify-self:start;max-width:none}
.prose{max-width:62ch}
.prose p{margin:0 0 14px}
.prose h3{font-family:var(--s-serif);font-weight:400;font-size:24px;margin:26px 0 8px;line-height:1.2}
.prose h3:first-child{margin-top:0}
.prose ul{margin:0 0 14px;padding-left:20px}
.prose li{margin-bottom:4px}
.lcards{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.lcard{border:1px solid var(--s-line);background:#fff;padding:18px;border-radius:4px;display:grid;gap:6px;color:var(--s-ink);text-align:left;align-content:start}
.lcard:hover{border-color:var(--s-ink)}
.lcard b{font-size:16px;font-family:var(--s-serif);font-weight:400;font-size:21px}
.lcard span{color:var(--s-muted);font-size:13.5px}
.coas{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:0 24px;border-top:1px solid var(--s-line)}
.coas a{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid var(--s-line);text-decoration:none;color:var(--s-ink);font-size:14px}
.coas a span{color:var(--s-muted);font-size:12.5px;white-space:nowrap}
.coas a:hover{text-decoration:underline}
.contact{display:grid;gap:10px;max-width:520px}
.crow{display:flex;gap:12px;align-items:center;justify-content:space-between;border:1px solid var(--s-line);padding:10px 12px;border-radius:4px;flex-wrap:wrap}
.crow div{min-width:0}
.crow small{display:block;color:var(--s-muted);font-size:12px}
.crow .val{user-select:all;overflow-wrap:anywhere}
.cbtn{border:1px solid var(--s-ink);background:#fff;color:var(--s-ink);padding:4px 10px;border-radius:4px;font-size:12.5px}
.supnav{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 6px}
.trust{display:flex;flex-wrap:wrap;gap:6px 22px;padding:16px 48px;border-top:1px solid var(--s-line);background:var(--s-soft);font-size:13.5px;align-items:center}
@media (max-width:820px){.trust{padding:16px}}
.trust button{border:0;background:none;padding:0;color:var(--s-ink);text-decoration:underline;text-underline-offset:3px;font-size:13.5px}
.pdp{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:36px;align-items:start}
@media (max-width:820px){.pdp{grid-template-columns:minmax(0,1fr)}}
.pdp .art{cursor:default}
.pdp h1{font-family:var(--s-serif);font-weight:400;font-size:clamp(28px,3.6vw,40px);line-height:1.1;margin:0 0 6px}
.pdp .pr{font-size:20px;font-variant-numeric:tabular-nums;margin:6px 0 16px}
.pronote{background:var(--brand-tint);border:1px solid var(--s-line);padding:14px 16px;border-radius:4px;margin:0 0 16px}
.pronote b{display:block;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--brand-ink);margin-bottom:4px}
.pronote p{margin:0;font-family:var(--s-serif);font-size:18px}
.sfoot{background:var(--accent);color:var(--on-accent);padding:28px 48px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:14px 28px;font-size:13.5px;align-items:center}
@media (max-width:820px){.sfoot{padding:22px 16px}}
.sfoot .fb{font-weight:600;font-size:15px}
.sfoot nav{display:flex;flex-wrap:wrap;gap:4px 18px}
.sfoot nav button{border:0;background:none;padding:0;color:inherit;text-decoration:underline;text-underline-offset:3px;font-size:13.5px}
.sfoot .ful{display:flex;align-items:center;gap:10px;opacity:.92}
.sfoot .ful .cu .cut,.sfoot .ful .cu .cut small{color:inherit}
.sfoot .ful .cu img{height:22px;filter:var(--logo-filter,none)}
.drawer{position:fixed;top:0;right:0;bottom:0;width:min(380px,100%);background:#fff;color:#211F20;border-left:1px solid #D9D6D2;box-shadow:-12px 0 32px rgba(0,0,0,.18);z-index:30;display:flex;flex-direction:column;font-family:var(--s-sans);padding-top:env(safe-area-inset-top,0px)}
.drawer header{display:flex;justify-content:space-between;align-items:center;padding:16px 18px;border-bottom:1px solid #E7E2DC}
.drawer h2{margin:0;font-family:var(--s-serif);font-size:24px;font-weight:400}
.drawer .items{flex:1;overflow:auto;padding:8px 18px}
.drawer .it{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid #EEEAE5;font-size:14.5px}
.drawer .it small{display:block;color:#625E5B}
.drawer .qty{display:flex;gap:6px;align-items:center;margin-top:6px}
.drawer .qty button{width:26px;height:26px;border:1px solid #CFCAC4;background:#fff;border-radius:4px;color:#211F20}
.drawer footer{padding:16px 18px calc(16px + env(safe-area-inset-bottom,0px));border-top:1px solid #E7E2DC;display:grid;gap:10px;font-size:13.5px}
.drawer .tot{display:flex;justify-content:space-between;font-weight:600;font-size:16px;font-variant-numeric:tabular-nums}
.drawer .go{border:0;background:var(--brand);color:var(--on-brand);padding:12px;border-radius:8px;font-weight:600;cursor:pointer;font-size:15px}
.drawer .go[disabled]{opacity:.5;cursor:default}
.drawer .x{border:1px solid #211F20;background:#fff;color:#211F20;padding:5px 12px;border-radius:6px}
.scrim{position:fixed;inset:0;background:rgba(10,10,10,.35);z-index:20}
.cbadge{display:inline-flex;align-items:center;gap:6px;font-family:var(--s-sans);font-size:12.5px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--brand-ink,#2F5D4A);background:#fff;border:1px solid var(--s-line,#DCDFDC);padding:3px 10px;border-radius:999px;vertical-align:middle}
.rbanner{background:var(--brand-tint-2);color:var(--s-ink);font-size:13.5px;padding:10px 16px;display:flex;gap:12px;justify-content:center;align-items:center;flex-wrap:wrap;border-bottom:1px solid var(--s-line);text-align:center}
.rbanner button{border:1px solid var(--s-ink);background:transparent;color:var(--s-ink);border-radius:6px;padding:3px 10px;font-size:12.5px}
.planhead{display:flex;gap:22px;align-items:center;margin-bottom:22px;flex-wrap:wrap}

/* sandbox additions */
.store{min-height:100vh}
.store a{text-decoration-thickness:1px}
.snav a{padding:6px 0;color:var(--s-ink);font-size:14.5px;border-bottom:2px solid transparent;text-decoration:none}
.snav a:hover{border-bottom-color:var(--s-line)}
.snav a[aria-current="page"]{border-bottom-color:var(--brand);font-weight:600}
.lockup{text-decoration:none}
a.sbtn,a.chip,a.lcard,a.cat,a.crumb{text-decoration:none;display:inline-block}
a.cat{display:flex}
a.lcard{display:grid}
.chip{color:var(--s-ink)}
.chip[aria-pressed="true"]{color:var(--on-brand)}
.pinfo h3 a{color:inherit;text-decoration:none}
.pinfo h3 a:hover{text-decoration:underline;text-underline-offset:3px}
.art{display:grid}
.noimg{width:60%;aspect-ratio:1/1;border-radius:6px;background:#ECE7E1}
.pdp .art{aspect-ratio:1/1}
.sfoot nav a{color:inherit;text-underline-offset:3px}
.trust a{color:var(--s-ink);text-underline-offset:3px}
.mockbar{background:#FBEFD5;color:#6B4A00;font:500 12.5px/1.4 var(--s-sans);padding:7px 16px;text-align:center}
.loading{font-family:var(--s-sans);padding:60px 20px;text-align:center;color:#625E5B}
.prose.shopify img{max-width:100%;height:auto}
.prose.shopify table{display:block;overflow-x:auto;max-width:100%}
.desc p{margin:0 0 10px}
.price{font-variant-numeric:tabular-nums}
.drawer .meta{color:#625E5B}

.store a.sbtn{color:var(--on-brand)}
.store a.sbtn.out,.store a.chip,.store a.cat,.store a.lcard,.store a.crumb,.store a.linkbtn{color:var(--s-ink)}
.store a.chip[aria-pressed="true"]{color:var(--on-brand)}

/* product guides */
.desc .lead{font-size:16.5px;line-height:1.55;margin-bottom:16px}
.desc h3{font-family:var(--s-sans);font-size:13px;letter-spacing:.08em;text-transform:uppercase;margin:20px 0 6px}
.desc ul.ingr,.desc ol{margin:0 0 10px;padding-left:20px}
.desc li{margin:3px 0}
.desc details.more{margin-top:22px;border-top:1px solid var(--s-line);padding-top:12px}
.desc details.more summary{cursor:pointer;font-weight:600}
.desc details.more[open] summary{margin-bottom:10px}

/* homecare plan page */
.plbanner{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;background:var(--brand-tint);border-radius:6px;padding:14px 16px;margin-bottom:18px}
.plconcerns{margin:0 0 16px}
.plconcerns div{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.plconcerns span{border:1px solid var(--s-line);border-radius:20px;padding:4px 12px;font-size:13.5px;background:#fff}
.plh{font-family:var(--s-serif);font-weight:400;font-size:28px;margin:24px 0 8px}
.plstep{display:grid;grid-template-columns:150px minmax(0,1fr);gap:20px;padding:20px 0;border-top:1px solid var(--s-line)}
.plimg{background:var(--brand-tint);border-radius:6px;aspect-ratio:1/1;overflow:hidden;display:grid;place-items:center}
.plimg img{width:100%;height:100%;object-fit:contain}
.plbody h2{font-family:var(--s-serif);font-weight:400;font-size:24px;margin:2px 0}
.plbody h2 a{color:inherit;text-decoration:none}
.plbody h3{font-family:var(--s-sans);font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;margin:16px 0 6px}
.plbody ul{margin:0;padding-left:20px}
.plbtns{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin:10px 0}
.inbag{font-weight:600;color:var(--brand-ink,var(--s-ink))}
.pledu{margin-top:18px}
@media (max-width:600px){.plstep{grid-template-columns:90px minmax(0,1fr);gap:12px}}

.desc .inci{font-size:13.5px;line-height:1.6;color:var(--s-ink)}

/* cards in the style of the Pro Dispensary customer pages: white product area, tinted panel, serif title */
.store .cats{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:24px}
.store .cat{border:1px solid var(--s-line);border-radius:16px;background:#fff;overflow:hidden;box-shadow:0 1px 3px rgba(0,0,0,.04);transition:box-shadow .15s,transform .15s}
.store .cat:hover{border-color:var(--s-line);box-shadow:0 6px 18px rgba(0,0,0,.08);transform:translateY(-2px)}
.store .cat .ct{background:#fff;aspect-ratio:5/4}
.store .cat .ct img{height:90%;max-width:90%}
.store .cat .cn{background:var(--brand-tint-2);padding:22px 24px 24px;display:flex;flex-direction:column;gap:10px;flex:1}
.store .eb{font-size:11px;letter-spacing:.2em;text-transform:uppercase;font-weight:600;color:var(--s-ink);margin:0}
.store .cat .cn b{font-family:var(--s-serif);font-weight:400;font-size:27px;line-height:1.1}
.store .cat .cn .cd{font-size:15px;color:var(--s-ink);line-height:1.5}
.store .ex{font-weight:600;font-size:14px;color:var(--s-ink);text-decoration:underline;text-underline-offset:4px;margin-top:auto;display:inline-flex;gap:4px}
.store .pgrid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:24px}
.store .pcard{border:1px solid var(--s-line);border-radius:16px;background:#fff;overflow:hidden;box-shadow:0 1px 3px rgba(0,0,0,.04);transition:box-shadow .15s,transform .15s}
.store .pcard:hover{box-shadow:0 6px 18px rgba(0,0,0,.08);transform:translateY(-2px)}
.store .pcard .art{background:#fff;border-radius:0;aspect-ratio:1/1}
.store .pcard .art img{padding:8%}
.store .pcard .pick{left:12px;top:12px}
.store .pcard .pinfo{background:var(--brand-tint-2);padding:18px 20px 20px;gap:6px}
.store .pcard .pinfo h3{font-family:var(--s-serif);font-weight:400;font-size:22px;line-height:1.15}
.store .pcard .pinfo h3 a{color:inherit;text-decoration:none}
.store .pcard .meta{color:var(--s-ink);opacity:.8}
.store .pact{display:flex;align-items:center;gap:14px;margin-top:auto;padding-top:10px}
.store .pact .addb{width:auto;flex:1;margin:0;background:transparent}
.store .pact .addb:hover{background:var(--s-ink);color:#fff}
