/* Weedhub — home sections (weedhub/hero, shop-index, the Geary band with
   order-ways, deal-cards empty line, brand-index, facts-strip, the visit split, the guides) and the
   content-page body (template page-weedhub: core blocks inside .page-body). Loaded on front-page,
   page-weedhub, page-visit and the blog index. Tokens: site.css. Home page (client, 2026-10-20):
   hero · today's deal flyer · category boxes · one brand line (amber) · on sale today · the
   building + visit · guides, all on the black leaf ground (the hero is the photo or video and the
   headline only since 2026-10-21); the Geary band and the store mosaic now
   live on the Richmond District page. */

/* ---- hero: the store photo fills the first screen; giant display headline over a top shade.
   The photo sits in .hero__frame, a box with the crop's own aspect ratio that covers the stage from
   the bottom edge, so the glow (percentages of the crop) always sits on the real sign. ------------ */
.hero{--hh:clamp(480px,calc(100svh - 270px),700px);--ar:.8381;background:var(--obsidian);color:var(--ivory)}
.hero__stage{position:relative;overflow:hidden;isolation:isolate}
.hero__top{min-height:var(--hh)}
.hero__stage::before{content:"";position:absolute;inset:0 0 auto;height:var(--hh);z-index:-1;background:linear-gradient(180deg,rgb(21 21 21/.92) 0%,rgb(21 21 21/.62) 30%,rgb(21 21 21/.08) 58%,rgb(21 21 21/0) 72%,rgb(21 21 21/.45) 100%)}
.hero__frame{position:absolute;left:50%;bottom:calc(100% - var(--hh));z-index:-2;width:max(100%,calc(var(--hh)*var(--ar)));aspect-ratio:var(--ar);transform:translateX(-50%)}
.hero__photo,.hero__photo img{display:block;width:100%;height:100%}
.hero__photo img{object-fit:cover}
.hero__glow{position:absolute;left:22.7%;width:54%;top:82.4%;height:8.6%;pointer-events:none;border-radius:50%;background:radial-gradient(closest-side,rgb(226 71 38/.75),rgb(226 71 38/.3) 55%,transparent);mix-blend-mode:screen;filter:blur(16px);opacity:.75}
.hero__top{position:relative;padding-top:var(--sp-6)}
.hero__kicker{display:flex;flex-wrap:wrap;align-items:center;gap:6px 0;margin-bottom:var(--sp-4);color:var(--fog);font:700 var(--t-xs)/1.3 var(--f);letter-spacing:.16em;text-transform:uppercase}
.hero__kicker a{color:var(--ivory);text-decoration:none}
.hero__kicker a::before{content:"";display:inline-block;width:8px;height:8px;margin-right:10px;border-radius:50%;background:var(--sun);box-shadow:0 0 0 4px rgb(251 176 64/.25)}
.hero__kicker span::before{content:"";display:inline-block;width:24px;height:1px;margin:0 12px;vertical-align:middle;background:var(--fog)}
.hero__h{margin:0;font:inherit;letter-spacing:0}
.hero__display{display:block;font:800 clamp(3.25rem,1rem + 11.6vw,9.25rem)/.88 var(--serif);letter-spacing:0;text-wrap:balance;max-width:13ch}
.hero__hl{color:var(--sun)}
.hero__sub{display:block;max-width:40ch;margin-top:var(--sp-4);color:var(--ivory);text-shadow:0 1px 12px rgb(0 0 0/.8);font:700 var(--t-xs)/1.5 var(--f);letter-spacing:.16em;text-transform:uppercase}
/* Shop Delivery + Shop Pickup under the H1 (Henry, 2026-10-25); the outline one gets a dark backing over the photo */
.hero__cta{display:flex;flex-wrap:wrap;gap:12px;margin:var(--sp-5) 0 0}
.hero__cta .btn--ghost-light{--bg:rgb(21 21 21/.72)}
@media (max-width:599px){
.hero__kicker{display:grid;gap:6px}
.hero__kicker span::before{display:none}
.hero__cta{display:grid;grid-template-columns:1fr 1fr}
.hero__cta .btn{padding:0 10px;gap:8px}}
@media (min-width:768px){
.hero{--hh:clamp(620px,calc(100svh - 112px),920px);--ar:2.3256}
.hero__stage{height:var(--hh)}
.hero__glow{left:38%;width:23.75%;top:78.5%;height:10.5%}
.hero__top{padding-top:var(--sp-8)}
.hero__display{max-width:none}}
@media (min-width:1100px){.hero{--hh:clamp(640px,calc(100svh - 112px),920px)}}
/* entrance: the photo comes up out of the dark, the words rise, the sign flickers on */
@media (prefers-reduced-motion:no-preference){
.hero__photo img{animation:heroin 2.2s cubic-bezier(.16,.84,.2,1) both}
.hero__display .w{display:inline-block;animation:wup 1s cubic-bezier(.2,.9,.1,1) backwards;animation-delay:calc(var(--i)*75ms + 150ms)}
.hero__kicker,.hero__sub,.hero__cta{animation:fadeup .9s var(--ease) .1s backwards}
.hero__sub{animation-delay:.8s}
.hero__cta{animation-delay:1s}
.hero__glow{animation:neonon 1.6s steps(1) 1.1s backwards,breathe 5s ease-in-out 2.7s infinite}}
@keyframes heroin{from{transform:scale(1.14);filter:brightness(.35) saturate(.6)}}
@keyframes wup{from{opacity:0;transform:translateY(.55em) skewY(4deg)}}
@keyframes fadeup{from{opacity:0;transform:translateY(14px)}}
@keyframes neonon{0%{opacity:0}12%{opacity:.9}18%{opacity:.1}30%{opacity:1}36%{opacity:.3}48%{opacity:.75}}
@keyframes breathe{0%,100%{opacity:.6}50%{opacity:1}}

/* ---- shop by category: an editorial contents page --------------------------------------------- */
.shop{display:grid;gap:var(--sp-6)}
.shop__note{max-width:22rem;margin-top:var(--sp-4);color:var(--tx2)}
.shop__head .is-style-link-arrow{margin-top:var(--sp-4)}
.shopx__list{display:grid;list-style:none;margin:0;padding:0;border-top:1px solid var(--ink)}
.shopx{position:relative}
.shopx__a{display:grid;grid-template-columns:56px 2rem minmax(0,1fr) auto;align-items:baseline;gap:var(--sp-3);padding:var(--sp-4) 0;border-bottom:1px solid var(--rule-2);text-decoration:none}
.shopx__no{color:var(--ink-2);font:600 var(--t-xs)/1 var(--f);letter-spacing:.1em}
.shopx__name{font:800 clamp(2rem,1.2rem + 3.4vw,4.75rem)/.95 var(--serif);letter-spacing:0;transition:transform var(--d-2) var(--ease),color var(--d-1)}
.shopx__count{color:var(--ink-2);font-size:var(--t-xs);font-weight:600;letter-spacing:.04em;white-space:nowrap}
.shopx__go{display:none}
.shopx__a{transition:background-color .35s var(--ease),box-shadow .35s var(--ease)}
.shopx__a:hover{background:var(--sun);box-shadow:-16px 0 0 var(--sun),16px 0 0 var(--sun)}
.shopx__a:hover .shopx__name{transform:translateX(10px)}
.shopx__a:hover .shopx__no{color:var(--obsidian)}
.shopx__a:hover .shopx__count{color:var(--ink)}

/* ---- products on the menu: a paper band, the rail scrolls in its own box ------------------------ */
.sec--rail{margin-top:var(--section);padding-block:var(--section);background:transparent;border-block:1px solid var(--hair)}
.home-content .sec--rail,.sec--rail.section--flush{padding-top:var(--section)}
.sec--rail .sec-head{margin-top:0}
.sec--rail>.wrap:first-child{padding-top:0}
.sec--rail .wrap--bleed-sm{max-width:none;padding-inline:0}
.sec--rail .scroller{scroll-padding-inline:max(var(--gutter),calc((100vw - var(--max))/2))}

/* ---- the Geary band: the street number set large, where we are, the street grid, three ways ---- */
.geary{margin-top:0;padding-bottom:var(--section);background:var(--obsidian);color:var(--ivory)}
.band-green{background:var(--obsidian)}
.band-green .way{border-top-color:rgb(245 241 232/.22)}
.band-green .way__row{border-bottom-color:rgb(245 241 232/.12)}
.band-green .way__row dt,.band-green .geary__text{color:var(--fog)}
.band-green .pending{border-color:rgb(245 241 232/.4);color:var(--fog)}
.band-green .geary__grid path{opacity:.3}
.sec--rail+.geary,.geary{padding-top:var(--section)}
.geary__in{display:grid;gap:var(--sp-6)}
.geary__big{margin:0;color:var(--sun);font:800 clamp(6.5rem,1rem + 23vw,22rem)/.8 var(--serif);letter-spacing:0;font-variant-numeric:lining-nums}
.geary__copy{display:grid;gap:var(--sp-4);align-content:start}
.geary__copy .label{margin:0}
.geary__h{font:800 var(--t-4)/1 var(--serif);letter-spacing:0}
.geary__h em{color:var(--sun)}
.geary__text{max-width:32rem;color:var(--fog);font-size:var(--t-1);line-height:1.6}
.geary__fig{margin:0}
.geary__map{width:100%;height:auto;min-height:160px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.geary .is-style-link-arrow a{color:var(--ivory)}
.geary__grid path{stroke:var(--sage);stroke-width:1;opacity:.32}
.geary__blvd{stroke:var(--ivory);stroke-width:3}
.geary__street{fill:var(--ivory);font:600 11px/1 var(--f);letter-spacing:.2em}
.geary__ring{stroke:var(--sun);stroke-width:1.25}
.geary__dot{fill:var(--sun)}
.geary__no{fill:var(--sun);font:800 30px/1 var(--serif);letter-spacing:0}
.geary__ways{margin-top:var(--sp-9)}
.geary__ways-h{margin-bottom:var(--sp-6);color:var(--ivory);font:800 var(--t-3)/1 var(--serif);letter-spacing:0}
/* order-ways on dark: three numbered columns, hairlines, no boxes */
.ways{display:grid;gap:var(--sp-7);counter-reset:way}
.way{display:grid;align-content:start;gap:0;padding-top:var(--sp-5);border-top:1px solid var(--obs-3);counter-increment:way}
.way__h{display:flex;align-items:baseline;gap:var(--sp-3);margin-bottom:var(--sp-4);font:800 2.25rem/1 var(--serif);letter-spacing:0}
.way__h::before{content:counter(way,decimal-leading-zero);color:var(--sage);font:600 var(--t-xs)/1 var(--f);letter-spacing:.1em}
.way__facts{display:grid;margin:0}
.way__row{display:grid;grid-template-columns:5.5rem minmax(0,1fr);gap:var(--sp-3);padding:var(--sp-3) 0;border-bottom:1px solid var(--obs-2)}
.way__row dt{color:var(--fog);font:600 .6875rem/1.9 var(--f);letter-spacing:.14em;text-transform:uppercase}
.way__row dd{font-size:var(--t-sm);line-height:1.55}
.way__row dd a{color:var(--ivory)}
.way__row dd .pending{white-space:normal}
.way__na{color:var(--fog)}
.way__cta{margin-top:var(--sp-5);justify-self:start}
.on-dark .btn:not(.btn--outline){--bg:var(--sun);--fg:var(--obsidian);--bd:var(--sun);--fill:var(--ivory);--fill-fg:var(--obsidian)}

/* ---- today's deals: a quiet line while none are published -------------------------------------- */
.sec--deals .sec-head{margin-bottom:var(--sp-4)}
.sec--deals .sec-head .h2{font-size:var(--t-3)}
.sec--deals .deals-empty,.deals-empty{border:0;border-radius:0;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--sp-2) var(--sp-6);padding:var(--sp-4) 0;border-block:1px solid var(--rule-2);color:var(--tx2)}
.deals-empty p{max-width:44rem}

/* ---- brands: a wall of names ------------------------------------------------------------------ */
.brandx__list{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 .9em;list-style:none;margin:0;padding:0}
.brandx__list li{display:inline-flex;align-items:baseline}
.brandx__list a{display:inline-flex;align-items:baseline;gap:4px;padding:2px 0;color:var(--ink);font:800 clamp(1.5rem,1rem + 1.6vw,2.5rem)/1.3 var(--serif);letter-spacing:0;text-decoration:none;transition:color var(--d-1)}
.brandx__list a:hover{color:var(--green)}
.brandx__n{align-self:flex-start;margin-top:.5em;color:var(--ink-2);font:600 .6875rem/1 var(--f);letter-spacing:.04em}
.brandx__more{margin-top:var(--sp-6)}

/* ---- the facts: the green band ------------------------------------------------------------------ */
section.facts{margin-top:var(--section);padding-block:var(--sp-9);background:var(--sun);color:var(--obsidian)}
.facts__in{display:grid;gap:var(--sp-7)}
.facts__head .label{color:var(--obsidian)}
.facts__head .label::before{background:var(--obsidian)}
.facts__h{max-width:11ch;font:800 var(--t-4)/1 var(--serif);letter-spacing:0}
.facts__reviews{margin-top:var(--sp-4)}
.facts__reviews .link-arrow{color:var(--obsidian)}
.facts__list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 var(--sp-5);margin:0;border-top:1px solid var(--obsidian)}
.facts__cell{min-width:0;padding:var(--sp-4) 0 var(--sp-5);border-bottom:1px solid rgb(21 21 21/.25)}
.facts__cell dt{margin-bottom:var(--sp-2);color:var(--obsidian);opacity:.8;font:600 .6875rem/1.3 var(--f);letter-spacing:.14em;text-transform:uppercase}
.facts__cell dd{font-size:var(--t-sm);font-weight:500;line-height:1.55;overflow-wrap:anywhere}
.facts__cell dd a{color:var(--obsidian);text-decoration:underline;text-decoration-color:rgb(21 21 21/.4);text-underline-offset:4px}
.facts__cell dd a:hover{text-decoration-color:currentColor}
.facts__cell dd span.num{font-size:1.0625rem;font-weight:600;letter-spacing:.02em}
.facts__cell .pending{border-color:rgb(21 21 21/.45);color:var(--obsidian);white-space:normal}
.facts__cell dd .pending__call{color:var(--obsidian);text-decoration:underline}

/* ---- visit: the sign photograph beside the visit block ------------------------------------------ */
.visitx{display:grid;padding-top:0;background:var(--card)}
.visitx__media{margin:0;background:var(--obsidian)}
.visitx__media .photo,.visitx__media img{display:block;width:100%;height:100%}
.visitx__media img{aspect-ratio:4/3;object-fit:cover;object-position:50% 60%}
.visitx__body{padding:var(--sp-8) var(--gutter)}
.visitx .visit__grid{display:block}
.visitx .label{margin-bottom:var(--sp-4)}
.visit__info>.h2,.wp-block-weedhub-visit .h2{font:800 var(--t-4)/1 var(--serif);letter-spacing:0}
.sec--visit .btn-row{margin-top:var(--sp-5)}
.sec--visit .btn-row .btn .i{width:18px;height:18px}

/* ---- learn: four guides ----------------------------------------------------------------------- */
.learn{display:grid;gap:var(--sp-7)}
.learn__head .is-style-link-arrow{margin-top:var(--sp-4)}
.learn__list{display:grid;list-style:none;margin:0;padding:0;counter-reset:guide;border-top:1px solid var(--ink)}
.learn__list>li{margin:0;counter-increment:guide}
.guide{display:grid;grid-template-columns:2.25rem minmax(0,1fr);gap:var(--sp-2) var(--sp-3);padding:var(--sp-5) 0;border-bottom:1px solid var(--rule-2)}
.guide::before{content:counter(guide,decimal-leading-zero);grid-row:span 3;padding-top:.6em;color:var(--ink-2);font:600 var(--t-xs)/1 var(--f);letter-spacing:.1em}
.guide__h{font:800 clamp(1.625rem,1.2rem + 1.4vw,2.25rem)/1.05 var(--serif);letter-spacing:0}
.guide__h a{text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size var(--d-2) var(--ease)}
.guide__h a:hover{background-size:100% 1px}
.guide__ex,.guide__ex p{margin:0;color:var(--tx2);font-size:var(--t-sm);line-height:1.6}
.guide__ex .wp-block-post-excerpt__more-text{display:none}
.guide .reading-time,.guide>p:last-child{color:var(--ink-2);font:600 .6875rem/1.4 var(--f);letter-spacing:.12em;text-transform:uppercase}

/* ---- the home page's trailing fine print (vape disposal) --------------------------------------- */
.home-content>p.is-style-fine,.home-content>.is-style-fine{max-width:calc(var(--max) + 2*var(--gutter));margin:var(--sp-8) auto 0;padding-inline:var(--gutter);padding-top:var(--sp-5);border-top:1px solid var(--rule-2)}
.site-main--home{padding-bottom:var(--sp-8)}

/* ---- content pages (page-weedhub): core blocks in a reading column, wide blocks full width ---- */
.page-body{padding-top:var(--sp-7)}
.design-content{display:flow-root}
.design-content>*{margin-block:0}
.design-content>*+*{margin-top:1.1em}
.design-content>:is(h2,h3,h4,.wp-block-details,.wp-block-buttons,.wp-block-quote,.wp-block-image:not(.alignwide):not(.alignfull)){max-width:44rem}
.design-content>:is(p,ul,ol,blockquote){max-width:38em;color:var(--tx2);font-size:1.0625rem;line-height:1.7}
.design-content>:is(p,ul,ol) strong{color:var(--tx)}
.design-content>h2,.design-content>.wp-block-heading:where(h2){margin-top:2em;padding-top:var(--sp-5);border-top:1px solid var(--ln2);font:800 var(--t-3)/1.02 var(--serif);letter-spacing:0}
.design-content>h3,.design-content>.wp-block-heading:where(h3){margin-top:1.8em;font-size:var(--t-1);font-weight:700}
.design-content>:is(h2,h3):first-child{margin-top:0}
.design-content>:is(ul,ol):not([class*=is-style-]){padding-left:1.2em}
/* FAQ (weedhub/faq, variant qgroup): each topic folds shut; tap it for its questions, tap a question
   for its answer (Will, 2026-10-21: "minimize the FAQ"). */
.design-content>.qgroup{max-width:44rem;border-bottom:1px solid var(--hair)}
.design-content>.qgroup:not(.qgroup+.qgroup){border-top:1px solid var(--hair)}
.design-content>.qgroup+.qgroup{margin-top:0}
.qgroup summary{list-style:none;cursor:pointer}
.qgroup summary::-webkit-details-marker{display:none}
.qgroup__d>summary{display:flex;align-items:center;gap:var(--sp-3);min-height:56px;padding:8px 0}
.qgroup__d>summary h3{flex:1;margin:0;color:var(--ivory);font:700 1.0625rem/1.25 var(--f);letter-spacing:0}
.qgroup__c{color:var(--fog);font-size:var(--t-xs);font-variant-numeric:tabular-nums}
.qgroup__d>summary::after{content:"";flex:none;width:9px;height:9px;margin:0 4px 4px 2px;border-right:2px solid var(--sun);border-bottom:2px solid var(--sun);transform:rotate(45deg);transition:transform var(--d-1)}
.qgroup__d[open]>summary::after{margin-bottom:-4px;transform:rotate(-135deg)}
.qgroup__d>summary:hover h3{color:var(--sun)}
.qgroup details.q{border-top:1px solid var(--hair)}
.qgroup details.q>summary{display:flex;align-items:baseline;justify-content:space-between;gap:var(--sp-3);padding:11px 0 11px var(--sp-3);color:var(--tx);font-size:.9375rem;font-weight:600;line-height:1.4}
.qgroup details.q>summary::after{content:"+";flex:none;color:var(--sun);font-size:1.125rem;line-height:1;transition:transform var(--d-1)}
.qgroup details.q[open]>summary::after{transform:rotate(45deg)}
.qgroup details.q>summary:hover{color:var(--sun)}
.qgroup .a{padding:0 0 var(--sp-4) var(--sp-3);color:var(--tx2);font-size:.9375rem;line-height:1.6}
.qgroup .a>*{margin:0}
.qgroup .a>*+*{margin-top:.6em}
.design-content>:is(ul,ol):not([class*=is-style-])>li+li{margin-top:.4em}
.design-content>ul:not([class*=is-style-])>li::marker{color:var(--green)}
.design-content>.wp-block-columns{display:grid;gap:var(--sp-5);margin-top:var(--sp-6)}
.design-content .wp-block-column>*+*{margin-top:.8em}
.design-content .wp-block-column{min-width:0;padding:var(--sp-5);border:1px solid var(--ln);border-radius:var(--r);background:var(--sf1)}
.design-content .wp-block-column>h3{font-size:var(--t-1)}
.design-content .wp-block-column p{color:var(--tx2)}
.design-content>.wp-block-buttons{margin-top:var(--sp-5)}
.design-content>.wp-block-group:not([class*=is-style-]):not(.section){margin-top:var(--sp-7)}
.design-content>.wp-block-separator{max-width:none}

/* core/table: a timetable — mono numbers, hairlines, scrolls in its own box at 320 px */
.wp-block-table{margin:var(--sp-5) 0;overflow-x:auto}
.wp-block-table table{width:100%;min-width:28rem;border-collapse:collapse;font-size:var(--t-sm)}
.wp-block-table th,.wp-block-table td{padding:10px 12px 10px 0;border-bottom:1px solid var(--ln);text-align:left;vertical-align:top}
.wp-block-table thead th{color:var(--mu);font-weight:600;border-bottom-color:var(--ln2)}
.wp-block-table td{font-family:var(--mono);font-weight:500;color:var(--tx)}
.wp-block-table td:first-child,.wp-block-table tbody th{font-family:var(--f);font-weight:600}
.wp-block-table figcaption{color:var(--mu);font-size:var(--t-xs)}
.is-style-board ul,ul.is-style-board{list-style:none;margin:var(--sp-4) 0;padding:0;border-top:1px solid var(--ln2)}
ul.is-style-board>li{display:flex;flex-wrap:wrap;justify-content:space-between;gap:4px var(--sp-4);padding:12px 0;border-bottom:1px solid var(--ln);color:var(--tx2)}
ul.is-style-board>li>strong:first-child{color:var(--tx)}

/* core/details as FAQ rows (also weedhub/faq) */
.design-content>.wp-block-details{max-width:44rem;margin:0;border-bottom:1px solid var(--ln)}
.design-content>:not(.wp-block-details)+.wp-block-details{margin-top:var(--sp-4);border-top:1px solid var(--ln)}
.design-content>.wp-block-details>summary{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-4);min-height:56px;padding:12px 0;font-weight:700;cursor:pointer;list-style:none}
.design-content>.wp-block-details>summary::-webkit-details-marker{display:none}
.design-content>.wp-block-details>summary::after{content:"";flex:none;width:20px;height:20px;background:var(--ink);-webkit-mask:var(--plus) center/20px no-repeat;mask:var(--plus) center/20px no-repeat;transition:transform var(--d-2) var(--ease)}
.design-content>.wp-block-details[open]>summary::after{transform:rotate(45deg)}
.design-content>.wp-block-details>:not(summary){padding-bottom:var(--sp-4);color:var(--tx2)}


/* ---- breakpoints ------------------------------------------------------------------------------- */

@media (min-width:768px){
.facts__list{grid-template-columns:repeat(3,minmax(0,1fr))}
.ways{grid-template-columns:repeat(var(--ways,3),minmax(0,1fr));gap:0 var(--sp-6)}
.design-content>.wp-block-columns{grid-template-columns:repeat(auto-fit,minmax(15rem,1fr))}}
@media (min-width:900px){
/* one subgrid: heading, each fact row and the button line up across the three ways */
.ways--rows-3{grid-template-rows:repeat(5,auto)}
.ways--rows-4{grid-template-rows:repeat(6,auto)}
.ways--rows-3 .way{grid-row:span 5;grid-template-rows:subgrid}
.ways--rows-4 .way{grid-row:span 6;grid-template-rows:subgrid}
.ways .way__facts{display:contents}
.ways .way__row{grid-template-columns:minmax(0,1fr);gap:2px}
.ways .way__cta{align-self:end}}
@media (min-width:1024px){
.shop{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--sp-5)}
.shop__head{grid-column:1/5;position:sticky;top:calc(var(--hbar) + var(--sp-6));align-self:start}
.shopx{grid-column:5/13}
.sec--shop{padding-top:calc(var(--section) + var(--sp-8))}
.geary__in{grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:auto auto;column-gap:var(--sp-5);row-gap:var(--sp-7)}
.geary__big{grid-column:1/8;grid-row:1;align-self:end}
.geary__copy{grid-column:8/13;grid-row:1;align-self:end}
.geary__fig{grid-column:1/13;grid-row:2}
.facts__in{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--sp-5)}
.facts__head{grid-column:1/5}
.facts__list{grid-column:5/13}
.visitx{grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:640px}
.visitx__media{position:relative;min-height:640px}
.visitx__media .photo{position:absolute;inset:0}
.visitx__media img{position:absolute;inset:0;aspect-ratio:auto;height:100%}
.visitx__body{display:flex;align-items:center;padding:var(--sp-9) var(--sp-9) var(--sp-9) var(--sp-9)}
.visitx__body>*{width:100%;max-width:34rem}
.learn{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--sp-5)}
.learn__head{grid-column:1/5}
.learn__query{grid-column:5/13}
.learn__list{grid-template-columns:1fr 1fr;column-gap:var(--sp-6)}}
@media (min-width:1440px){
}

/* ======== effects + visuals (owner round 2) ======== */


/* category index: graphic thumbnails (phones), a cursor-follow preview (desktop pointer) */
.shopx__thumb{width:56px;aspect-ratio:1;align-self:center;transition:transform .5s var(--ease)}
.shopx__a:hover .shopx__thumb{transform:rotate(-3deg) scale(1.06)}
.shopx__float{display:none}

/* brands: one slow serif line on the amber band (client, 2026-10-20); Pause stops it. A slim strip
   since 2026-10-21 (Will: "that box is too big") */
.band-amber{background:var(--sun);color:var(--obsidian)}
.sec--brands.band-amber{position:relative;margin-top:var(--section);padding:var(--sp-4) 0 var(--sp-3);overflow:hidden}
.brands__head .label{margin-bottom:var(--sp-2);color:var(--obsidian)}
.brands__head .label::before{background:var(--obsidian)}
.brandx--marquee{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--sp-1)}
.brandx__track{display:flex;width:max-content}
.brandx__run{display:flex;align-items:baseline;flex:none;gap:0;list-style:none;margin:0;padding:0}
.brandx__run li{display:inline-flex;align-items:baseline}
.brandx__run li::after{content:"";display:inline-block;width:.32em;height:.32em;margin:0 .55em;border-radius:50%;background:var(--obsidian);vertical-align:.25em;font-size:clamp(1.125rem,.9rem + 1vw,1.75rem)}
.brandx__run a{display:inline-flex;align-items:baseline;color:var(--obsidian);font:800 clamp(1.125rem,.9rem + 1vw,1.75rem)/1.15 var(--serif);letter-spacing:0;text-decoration:none;white-space:nowrap;transition:color .25s}
.brandx__run a:hover{text-decoration:underline;text-decoration-thickness:.08em;text-underline-offset:.12em}
.brandx__run .brandx__n{align-self:flex-start;margin:.4em 0 0 .25em;color:var(--obsidian);font:700 .625rem/1 var(--f);letter-spacing:.04em}
.brandx__foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--sp-3);width:100%;max-width:calc(var(--max) + 2*var(--gutter));margin:var(--sp-3) auto 0;padding-inline:var(--gutter)}
.brandx__foot .link-arrow{color:var(--obsidian)}
.brandx__pause{min-height:32px;padding:0 14px;border:1px solid var(--obsidian);border-radius:99px;background:transparent;color:var(--obsidian);font:600 .75rem/1 var(--f);letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
.brandx__pause:hover{background:var(--obsidian);color:var(--sun)}
@media (prefers-reduced-motion:no-preference){
.brandx__track{animation:mq 170s linear infinite}
.brandx--marquee:hover .brandx__track,.brandx--marquee:focus-within .brandx__track,.brandx--marquee.is-paused .brandx__track{animation-play-state:paused}}
/* No motion (the phone's setting or the site's "Stop motion"): the line stands still and scrolls
   sideways by hand, inside its own box. The band is position:relative so the names' screen-reader
   text (absolutely placed) stays clipped: without the moving track's transform it escaped and made
   the whole phone page 5,600 px wide, pushing the age gate's button off screen (fixed 2026-10-23). */
@media (prefers-reduced-motion:reduce){
.brandx--marquee{position:relative;overflow-x:auto;scrollbar-width:thin}.brandx__track{padding-inline:var(--gutter)}.brandx__run[aria-hidden]{display:none}.brandx__pause{display:none}}
html.a11y-still .brandx--marquee{position:relative;overflow-x:auto;scrollbar-width:thin}
html.a11y-still .brandx__run[aria-hidden],html.a11y-still .brandx__pause{display:none}
@keyframes mq{to{transform:translateX(-50%)}}

/* the product spotlight: one featured product, large, on its colour field */
.spot{display:grid;gap:var(--sp-6);padding-bottom:var(--sp-9)}
.spot__media{position:relative;align-self:start;aspect-ratio:1;overflow:hidden}
.spot__panel{position:absolute;inset:0}
.spot__img{position:absolute;left:50%;top:50%;width:min(64%,440px);height:auto;aspect-ratio:1;padding:5%;object-fit:contain;background:var(--white);box-shadow:var(--lift);transform:translate(-50%,-50%) rotate(-2deg);transition:transform 1s var(--ease)}
.spot__img.is-missing{display:none}
.spot:hover .spot__img{transform:translate(-50%,-52%) rotate(0deg) scale(1.03)}
.spot__tag{position:absolute;top:var(--sp-4);right:var(--sp-4);padding:7px 12px;border-radius:99px;background:var(--obsidian);color:var(--sun);font:700 .6875rem/1 var(--f);letter-spacing:.14em;text-transform:uppercase}
.spot__body{display:grid;align-content:center;gap:var(--sp-3)}
.spot__body .label{margin-bottom:var(--sp-2)}
.spot__brand{color:var(--ink-2);font:600 var(--t-xs)/1.3 var(--f);letter-spacing:.14em;text-transform:uppercase}
.spot__name{font:800 clamp(2.25rem,1.4rem + 3vw,4.25rem)/1 var(--serif);letter-spacing:0}
.spot__name a{text-decoration:none;background:linear-gradient(var(--sun),var(--sun)) 0 92%/0 .14em no-repeat;transition:background-size .5s var(--ease)}
.spot__name a:hover{background-size:100% .14em}
.spot__meta{color:var(--tx2);font-size:var(--t-sm);font-weight:600}
.spot__price{display:flex;align-items:baseline;gap:12px;margin-top:var(--sp-3);font-variant-numeric:tabular-nums lining-nums}
.spot__price b{font:800 clamp(2rem,1.5rem + 1.6vw,3rem)/1 var(--f);letter-spacing:-.02em}
.spot__price s{color:var(--ink-2);font-size:var(--t-1)}
.spot__cta{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp-3) var(--sp-5);margin-top:var(--sp-4)}

/* product cards: image-led — a taller well, the photo grows on hover; failed photos become panels */
.sec--rail .grid-products--rail{grid-auto-columns:clamp(240px,70vw,340px)}
.card__media .gpanel{position:absolute;inset:0}
.card__media.is-missing{padding:0;box-shadow:none;background:none}

/* inside the store: an editorial mosaic of the store photograph */
.inside{padding-bottom:var(--section);background:var(--obsidian)}
.inside__head{display:grid;gap:var(--sp-4);margin-bottom:var(--sp-7)}
.inside__head .h2 em{color:var(--sun)}
.inside__text{max-width:30rem;color:var(--fog);font-size:var(--t-1)}
.mosaic{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-2);list-style:none;margin:0;padding:0}
.mosaic__item{position:relative;margin:0;overflow:hidden;background:var(--obs-2)}
.mosaic__item figure{margin:0;height:100%}
.mosaic__item .photo,.mosaic__item img{display:block;width:100%;height:100%}
.mosaic__item img{aspect-ratio:1;object-fit:cover;transition:transform 1.1s var(--ease),filter .6s}
.mosaic__item:hover img{transform:scale(1.05)}
.mosaic__item--a{grid-column:1/-1}
.mosaic__item--a img{aspect-ratio:4/3;object-position:50% 88%}
.mosaic__item--e img{aspect-ratio:1;object-position:30% 50%}
.mosaic figcaption{position:absolute;left:0;right:0;bottom:0;padding:var(--sp-6) var(--sp-4) var(--sp-3);background:linear-gradient(transparent,rgb(21 21 21/.75));color:var(--ivory);font:600 .6875rem/1 var(--f);letter-spacing:.14em;text-transform:uppercase}
.mosaic figcaption::before{content:"";display:inline-block;width:8px;height:8px;margin-right:8px;background:var(--sun)}
@media (prefers-reduced-motion:no-preference){
.motion [data-reveal] .mosaic__item img{clip-path:inset(100% 0 0 0);transform:scale(1.12);transition:clip-path 1.1s var(--ease),transform 1.4s var(--ease);transition-delay:var(--d,0ms)}
.motion [data-reveal].is-in .mosaic__item img{clip-path:inset(0);transform:none}
.motion [data-reveal].is-in .mosaic__item:hover img{transform:scale(1.05)}}

@media (min-width:1024px){
.shopx__a{grid-template-columns:2.25rem minmax(0,1fr) auto}
.shopx__thumb{display:none}
.has-hover .shopx__float{display:block;position:absolute;left:0;top:0;z-index:3;width:240px;aspect-ratio:4/5;pointer-events:none;opacity:0;transform:translate3d(var(--mx,0),var(--my,0),0) rotate(var(--rot,0deg)) scale(.92);transition:opacity .3s var(--ease),transform .5s cubic-bezier(.2,.8,.2,1);box-shadow:var(--lift)}
.has-hover .shopx.is-pv .shopx__float{opacity:1;transform:translate3d(var(--mx,0),var(--my,0),0) rotate(var(--rot,0deg)) scale(1)}
.shopx__pv{position:absolute;inset:0;opacity:0;transition:opacity .25s}
.shopx__pv.is-on{opacity:1}
.spot{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--sp-5)}
.spot__media{grid-column:1/8;aspect-ratio:5/4}
.spot__body{grid-column:8/13;padding-left:var(--sp-5)}
.mosaic{grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-rows:clamp(200px,20vw,300px);gap:var(--sp-3)}
.mosaic__item img,.mosaic__item--a img,.mosaic__item--e img{aspect-ratio:auto}
.mosaic__item--a{grid-column:1/9;grid-row:1/3}
.mosaic__item--b{grid-column:9/13;grid-row:1}
.mosaic__item--c{grid-column:9/13;grid-row:2}
.mosaic__item--d{grid-column:1/5;grid-row:3}
.mosaic__item--e{grid-column:5/13;grid-row:3}
.inside__head{grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--sp-5);align-items:end}
.inside__head .label,.inside__head .h2{grid-column:1/8}
.inside__text{grid-column:9/13;grid-row:2}}
.card__media .gpanel__label{left:auto;right:7%;text-align:right;font-size:max(15px,12cqw)}
.shopx__thumb .gpanel__label{display:none}
.shopx__thumb .gpanel__no{font-size:60cqw;left:10%}
@media (max-width:1023px){
.shopx__a{grid-template-columns:56px minmax(0,1fr);grid-template-areas:"t name" "t count";column-gap:var(--sp-4);row-gap:2px}
.shopx__thumb{grid-area:t}
.shopx__no{display:none}
.shopx__name{grid-area:name;align-self:end}
.shopx__count{grid-area:count;align-self:start}}
/* phones: the hero's small caption sits over the lit glass case — give it a solid backing */
@media (max-width:767px){.hero__sub{display:inline-block;max-width:none;padding:.45em .7em;background:rgb(21 21 21/.86);text-shadow:none}}

/* ======== client round, 2026-10-20 ======== */

/* today's deal flyer straight under the hero */
.sec--deals-top{padding-top:var(--sp-7)}

/* shop by category: small, almost-square boxes (client, 2026-10-20), the head above them */
.sec--shop{padding-top:var(--section)}
.shop{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--sp-5)}
.shop__head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:var(--sp-2) var(--sp-6);position:static}
.shop__head .label{flex-basis:100%;margin-bottom:0}
.shop__head .h2{font-size:var(--t-3)}
.shop__note{display:none}
.shop__head .is-style-link-arrow{margin-top:0}
.shopx__list{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-2);border-top:0}
.shopx__a{position:relative;display:flex;flex-direction:column;justify-content:space-between;gap:var(--sp-2);aspect-ratio:2/1;padding:var(--sp-3) var(--sp-4);border:1px solid var(--hair-2);background:var(--card);color:var(--ivory)}
.shopx__a:hover{background:var(--sun);box-shadow:none;border-color:var(--sun);color:var(--obsidian)}
.shopx__a:hover .shopx__name{transform:none}
.shopx__a:hover .shopx__count,.shopx__a:hover .shopx__go{color:var(--obsidian)}
.shopx__thumb,.shopx__no,.shopx__float,.has-hover .shopx__float{display:none}
.shopx__name{order:2;padding-right:22px;font:800 clamp(1.0625rem,.95rem + .5vw,1.375rem)/1.1 var(--serif);letter-spacing:0}
.shopx__count{order:1;color:var(--fog)}
.shopx__go{display:block;order:3;position:absolute;right:var(--sp-4);bottom:var(--sp-4);width:20px;height:20px;color:var(--sun)}
.shopx__count{font-size:.6875rem}
@media (min-width:768px){.shopx__list{grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--sp-3)}.shopx__a{aspect-ratio:3/2}}
@media (min-width:1280px){.shopx__list{grid-template-columns:repeat(8,minmax(0,1fr));gap:var(--sp-2)}.shopx__a{aspect-ratio:1}}
@media (min-width:1024px){
.shop{grid-template-columns:minmax(0,1fr)}
.shop__head,.shopx{grid-column:1/-1}
.shopx__a{grid-template-columns:none}}
@media (max-width:1023px){.shopx__a{grid-template-columns:none;grid-template-areas:none}}
.shopx__a .shopx__name,.shopx__a .shopx__count{align-self:flex-start;text-align:left}

/* the building beside the visit block */
.visitx__media img{object-position:50% 40%}

/* hero, video look (?hero=video on staging; block attribute media:"video"): the walk-in clip
   covers the first screen behind the same shade, headline and panel; the Pause button sits top right */
.hero--video .hero__frame--video{left:0;right:0;top:0;bottom:auto;width:100%;height:var(--hh);aspect-ratio:auto;transform:none}
.hero__video{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 50%;background:var(--obsidian)}
.hero__pause{position:absolute;top:var(--sp-4);right:var(--gutter);z-index:2;display:grid;place-items:center;width:44px;height:44px;padding:0;border:1px solid rgb(245 241 232/.4);border-radius:50%;background:rgb(11 11 10/.6);color:var(--ivory);cursor:pointer}
.hero__pause:hover{background:var(--obsidian);border-color:var(--ivory)}
.hero__pause-i{width:12px;height:14px;background:linear-gradient(90deg,currentColor 0 4px,transparent 4px 8px,currentColor 8px 12px)}
.hero__pause.is-paused .hero__pause-i{width:12px;height:14px;background:currentColor;clip-path:polygon(0 0,100% 50%,0 100%)}
@media (min-width:768px){.hero--video .hero__frame--video{height:100%}}

/* Prop 65 warnings (FAQ #prop-65; client, 2026-10-20): the safe-harbor symbol — a black "!" in a
   yellow equilateral triangle with a bold black outline (27 CCR §25603(a)(1)) — before "WARNING:" */
.design-content>.p65{position:relative;overflow-wrap:anywhere;padding:var(--sp-3) var(--sp-4) var(--sp-3) calc(var(--sp-4) + 30px);border:1px solid var(--hair-2);background:var(--card);color:var(--ivory);font-size:.875rem;line-height:1.55}
.design-content>.p65::before{content:"";position:absolute;left:var(--sp-4);top:calc(var(--sp-3) + 1px);width:20px;height:18px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 22'%3E%3Cpath d='M12 1.5 22.8 20.5H1.2Z' fill='%23FFE600' stroke='%23000' stroke-width='2' stroke-linejoin='round'/%3E%3Cpath d='M12 7.5v6.5' stroke='%23000' stroke-width='2.4' stroke-linecap='round'/%3E%3Ccircle cx='12' cy='17' r='1.4'/%3E%3C/svg%3E") center/contain no-repeat}
.design-content>.p65 strong{color:var(--ivory)}
/* the Prop 65 group on the FAQ: compact labels, each warning right under its label */
.design-content>h3:has(+.p65){margin-top:1.2em;font-size:.9375rem}
.design-content>h3+.p65{margin-top:.5em}

/* ---- reviews on the home page (Will, 2026-10-23): the star ratings as each site shows them, then three
   dated Google quotes; cards on the dark ground, amber stars and links ---------------------------- */
.sec--reviews .reviews-band{display:grid;gap:var(--sp-5)}
.reviews-band__head .h2{margin:0}
.sec--reviews .ratings{display:flex;flex-wrap:wrap;gap:var(--sp-3)}
.sec--reviews .rating{display:inline-grid;grid-template-columns:auto auto;justify-content:start;gap:2px 8px;padding:var(--sp-3) var(--sp-5);border:1px solid var(--hair);background:var(--card);color:var(--ivory);transition:border-color var(--d-1)}
.sec--reviews .rating:hover{border-color:var(--sun)}
.sec--reviews .rating__score{font-size:2.5rem}
.sec--reviews .rating__star{width:22px;height:22px;color:var(--sun)}
.sec--reviews .rating__src{color:var(--fog)}
.sec--reviews .rating__src b{color:var(--ivory);font-size:.9375rem}
.sec--reviews .ratings+.fine{margin-top:calc(-1*var(--sp-3));color:var(--fog)}
.sec--reviews .quote{height:100%;margin:0;padding:var(--sp-4) var(--sp-5);border:1px solid var(--hair);background:var(--card)}
.sec--reviews .quote blockquote{margin:0}
.sec--reviews .quote blockquote p{margin:0;color:var(--ivory);font:500 1.375rem/1.2 var(--serif)}
.sec--reviews .quote figcaption{display:grid;gap:2px;color:var(--fog)}
.sec--reviews .quote figcaption b{color:var(--ivory);font-size:.9375rem}
.sec--reviews :is(.quote figcaption,.reviews__more) a{color:var(--sun)}
.sec--reviews .reviews__more{color:var(--fog)}
@media (min-width:768px){
.sec--reviews .quotes--grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.sec--reviews .quote blockquote p{font-size:1.625rem}}

/* ---- Events (weedhub/events, the Events page, 2026-10-27): one flat row per event under hairline
   rules, the day in amber Saira on the left. No cards, no pills. ---- */
.events{max-width:44rem;border-top:1px solid var(--rule-2)}
.event{display:grid;grid-template-columns:4.5rem minmax(0,1fr);gap:var(--sp-5);padding:var(--sp-5) 0;border-bottom:1px solid var(--rule-2)}
.event__date time{display:flex;flex-direction:column;align-items:flex-start}
.event__mon,.event__dow{color:var(--ink-2);font:600 var(--t-xs)/1.3 var(--f);letter-spacing:.14em;text-transform:uppercase}
.event__day{margin:2px 0 4px;color:var(--sun);font:800 2.75rem/.9 var(--serif)}
.event__title{margin:0;font:800 1.75rem/1.1 var(--serif);letter-spacing:0}
.event__title a{color:inherit;text-decoration:none}
.event__title a:hover{color:var(--sun)}
.event__time{margin:var(--sp-1) 0 0;color:var(--ink);font-size:var(--t-sm);font-weight:600}
.event__desc{margin:var(--sp-2) 0 0;color:var(--tx2)}
.events--past .event__day{color:var(--ink-2)}
.events--empty{padding:var(--sp-5) 0;border-bottom:1px solid var(--rule-2)}
.events__empty{margin:0;color:var(--tx2)}
.events__empty a{color:var(--sun)}
@media (max-width:599px){
.event{grid-template-columns:3.5rem minmax(0,1fr);gap:var(--sp-4)}
.event__day{font-size:2.25rem}}