/* ============================================================
   SILK ROAD NYC — SHARED STYLES v3
   Product Cards | Cart Drawer | Modal | Header | Badges |
   Skeletons | Age Gate | Theme Toggle | Dark Mode
   ============================================================ */

/* ---------- CSS VARIABLES (DARK DEFAULT — matches silkroadnyc.com) ---------- */
:root {
  --sr-green: #7ED957;         /* v1 --e-global-color-primary (kit-8) */
  --sr-green-dark: #209F48;    /* v1 --e-global-color-secondary (hover) */
  --sr-green-deep: #166534;    /* legacy deep green — age-gate only */
  --sr-green-gradient: linear-gradient(135deg, #7ED957, #209F48);
  --sr-bg: #1a1a1a;
  --sr-bg-card: #242424;
  --sr-bg-surface: #2a2a2a;
  --sr-text: #f0f0f0;
  --sr-text-secondary: #b0b0b0;
  --sr-text-muted: #777777;
  --sr-border: #333333;
  --sr-shadow-sm: 0 2px 8px rgba(0,0,0,0.3);
  --sr-shadow-md: 0 4px 20px rgba(0,0,0,0.4);
  --sr-shadow-lg: 0 8px 40px rgba(0,0,0,0.5);
  --sr-shadow-green: 0 8px 30px rgba(126,217,87,0.25);
  --sr-radius: 16px;
  --sr-radius-sm: 10px;
  --sr-radius-pill: 50px;
  --sr-ease: cubic-bezier(.4,0,.2,1);
  --sr-header-h: 72px;
  --sr-font: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* Single dark theme — no light mode */

/* ---------- DEEP SPACE BACKGROUND (v2.7.15) ---------- */
/* Dark navy + purple gradient replaces flat black.
   Galaxy canvas (#sr-galaxy) animates stars/nebula above this.
   BTC pattern faded to 0.015 so galaxy can breathe through. */
body {
  /* v2.7.16 — lighter deep-space navy (was #0f1511/#12142a). Slight green + violet warmth.  */
  background:
    radial-gradient(ellipse at 20% 10%, rgba(126,217,87,0.14) 0%, transparent 55%),
    radial-gradient(ellipse at 85% 85%, rgba(130,70,220,0.14) 0%, transparent 55%),
    linear-gradient(180deg, #131833 0%, #181f40 40%, #1d254b 100%);
  background-color: #131833;
  background-attachment: fixed;
}
/* v2.7.21 — body::before BTC overlay REMOVED per Sohan (was too busy) */

/* Galaxy canvas — full viewport, behind content, above body bg */
#sr-galaxy {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  pointer-events: none;
  z-index: 0;
  opacity: 0.85;
}
@media (prefers-reduced-motion: reduce) {
  #sr-galaxy { display: none; }
}

/* Update sr-bg variable to deep space so cards/surfaces still contrast */
:root {
  --sr-bg: #0f1511;
}

/* No light mode */

/* ---------- GLOBAL RESET / BASE ---------- */
*, *::before, *::after { box-sizing: border-box; }

body,
html {
  font-family: var(--sr-font) !important;
  color: var(--sr-text);
  margin: 0;
  padding: 0;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
html { background-color: #08080b; }

/* ---------- HEADER / NAV ---------- */
.sr-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: var(--sr-header-h);
  z-index: 1000;
  background: rgba(26,26,26,0.92);
  backdrop-filter: blur(20px) saturate(180%);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  border-bottom: 1px solid var(--sr-border);
  transition: background .3s var(--sr-ease), border-color .3s var(--sr-ease);
  display: flex;
  align-items: center;
  padding: 0 24px;
}

/* No light mode header */

.sr-header-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
}

.sr-header .sr-logo {
  height: 40px;
  width: auto;
  display: flex;
  align-items: center;
}

.sr-logo img,
.sr-header .sr-logo img,
a.sr-logo img {
  max-height: 56px !important;
  width: auto !important;
  object-fit: contain !important;
  max-width: 220px !important;
}
/* v2.9.13.1 — header tightened to 72px for v1 proportion parity */
.sr-header { height: 72px !important; }
:root { --sr-header-h: 72px !important; }

.sr-nav,
.sr-header-nav {
  display: flex;
  align-items: center;
  gap: 28px;
}

.sr-nav a,
.sr-header-nav a {
  color: var(--sr-text);
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.02em;
  transition: color .25s var(--sr-ease);
  position: relative;
}

.sr-nav a::after,
.sr-header-nav a::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 0;
  width: 0;
  height: 2px;
  background: var(--sr-green-gradient);
  border-radius: 2px;
  transition: width .3s var(--sr-ease);
}

.sr-nav a:hover::after,
.sr-nav a.active::after,
.sr-header-nav a:hover::after,
.sr-header-nav a.active::after {
  width: 100%;
}

.sr-nav a:hover,
.sr-header-nav a:hover {
  color: var(--sr-green);
}

/* Header SVG icon buttons */
.sr-menu-toggle,
.sr-header-cart-btn {
  background: none;
  border: none;
  cursor: pointer;
  padding: 8px;
  color: var(--sr-text);
  display: flex;
  align-items: center;
  justify-content: center;
}

.sr-menu-toggle svg,
.sr-header-cart-btn svg {
  width: 24px;
  height: 24px;
  stroke: currentColor;
}

.sr-menu-toggle:hover,
.sr-header-cart-btn:hover {
  color: var(--sr-green);
}

.sr-nav-actions {
  display: flex;
  align-items: center;
  gap: 8px;
}

.sr-cart-badge {
  background: var(--sr-green);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: -4px;
  right: -4px;
}

.sr-header-cart-btn {
  position: relative;
}

/* Hide hamburger on desktop */
.sr-menu-toggle {
  display: none;
}

/* Float cart button */
.sr-float-cart {
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 999;
  background: var(--sr-green);
  color: #fff;
  border: none;
  border-radius: 50%;
  width: 56px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: var(--sr-shadow-lg);
}

.sr-float-cart svg {
  width: 24px;
  height: 24px;
  stroke: currentColor;
  fill: none;
}

/* Theme toggle removed — single dark mode */
.sr-theme-toggle { display: none !important; }

/* ---------- FLOATING CART BUTTON ---------- */
.sr-cart-float {
  position: relative;
  width: 44px;
  height: 44px;
  border: none;
  border-radius: 50%;
  background: var(--sr-green-gradient);
  color: #fff;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  transition: transform .3s var(--sr-ease), box-shadow .3s var(--sr-ease);
}

.sr-cart-float:hover {
  transform: scale(1.1);
  box-shadow: var(--sr-shadow-green);
}

.sr-cart-badge {
  position: absolute;
  top: -4px;
  right: -4px;
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 10px;
  background: #7ED957;
  color: #0a0a0a;
  font-size: 11px;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  border: 2px solid var(--sr-bg);
  transition: transform .3s var(--sr-ease);
  animation: sr-badge-pop .3s var(--sr-ease);
}

@keyframes sr-badge-pop {
  0% { transform: scale(0); }
  60% { transform: scale(1.3); }
  100% { transform: scale(1); }
}

/* ---------- PRODUCT CARDS (v24 white — silkroadnyc.com parity) ---------- */
.sr-card {
  background: #1f1f22 !important;
  border-radius: var(--sr-radius);
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.06) !important;
  transition: transform .4s var(--sr-ease), box-shadow .4s var(--sr-ease), border-color .4s var(--sr-ease);
  display: flex;
  flex-direction: column;
  position: relative;
  cursor: pointer;
  color: #f0f0f0 !important;
}
/* White-card variant for hero featured (matches silkroadnyc.com exactly) */
.sr-card-light,
.sr-hero-featured-cards .sr-card {
  background: #fff !important;
  color: #111 !important;
  border: 1px solid #e5e5e5 !important;
}
.sr-card-light .sr-card-name,
.sr-hero-featured-cards .sr-card .sr-card-name { color: #111 !important; }
.sr-card-light .sr-card-brand,
.sr-hero-featured-cards .sr-card .sr-card-brand { color: #666 !important; }
.sr-card-light .sr-card-price,
.sr-hero-featured-cards .sr-card .sr-card-price { color: #111 !important; }
.sr-card-light .sr-card-img-wrap,
.sr-hero-featured-cards .sr-card .sr-card-img-wrap { background: #fff !important; }
.sr-card-light .sr-card-img,
.sr-hero-featured-cards .sr-card .sr-card-img { object-fit: contain !important; padding: 8px; }

.sr-card:hover {
  transform: translateY(-6px);
  border-color: var(--sr-green);
  box-shadow: 0 12px 40px rgba(126,217,87,0.18), 0 4px 12px rgba(0,0,0,0.06);
}

body.sr-dark .sr-card:hover {
  box-shadow: 0 12px 40px rgba(126,217,87,0.22), 0 4px 12px rgba(0,0,0,0.3);
}

.sr-card-img-wrap {
  position: relative;
  width: 100%;
  padding-top: 100%;
  overflow: hidden;
  background: #2a2a2a !important;
}

.sr-card-img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s var(--sr-ease);
}

.sr-card:hover .sr-card-img {
  transform: scale(1.06);
}

.sr-card-body {
  padding: 16px;
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: 6px;
}

.sr-card-brand {
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #999 !important;
}

.sr-card-name {
  font-size: 15px;
  font-weight: 600;
  color: #f0f0f0 !important;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.sr-card-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 4px;
}

/* ---------- BADGES ---------- */
.sr-badge {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: var(--sr-radius-pill);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.03em;
  line-height: 1.4;
  white-space: nowrap;
}

.sr-badge-thc {
  background: linear-gradient(135deg, rgba(126,217,87,0.15), rgba(46,100,22,0.12));
  color: var(--sr-green-dark);
}

body.sr-dark .sr-badge-thc {
  background: linear-gradient(135deg, rgba(126,217,87,0.2), rgba(46,100,22,0.2));
  color: var(--sr-green);
}

.sr-badge-cbd {
  background: linear-gradient(135deg, rgba(126,217,87,0.13), rgba(32,159,72,0.12));
  color: #209F48;
}

body.sr-dark .sr-badge-cbd {
  background: linear-gradient(135deg, rgba(126,217,87,0.22), rgba(32,159,72,0.18));
  color: #7ED957;
}

.sr-badge-hybrid {
  background: linear-gradient(135deg, rgba(126,217,87,0.15), rgba(126,217,87,0.08));
  color: var(--sr-green-dark);
}

body.sr-dark .sr-badge-hybrid {
  color: var(--sr-green);
}

.sr-badge-sativa {
  background: linear-gradient(135deg, rgba(126,217,87,0.18), rgba(126,217,87,0.1));
  color: #166534;
}

body.sr-dark .sr-badge-sativa {
  background: linear-gradient(135deg, rgba(46,100,22,0.22), rgba(126,217,87,0.12));
  color: #7ED957;
}

.sr-badge-indica {
  background: linear-gradient(135deg, rgba(20,77,36,0.12), rgba(15,61,28,0.08));
  color: #0F3D1C;
}

body.sr-dark .sr-badge-indica {
  background: linear-gradient(135deg, rgba(15,61,28,0.34), rgba(46,100,22,0.22));
  color: #FFFFFF;
}

/* ---------- CARD PRICING ---------- */
.sr-card-price-row {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-top: auto;
  padding-top: 8px;
}

.sr-card-price {
  font-size: 18px;
  font-weight: 700;
  color: #f0f0f0 !important;
}

.sr-card-price-special {
  font-size: 18px;
  font-weight: 700;
  color: var(--sr-green);
}

.sr-card-price-old {
  font-size: 14px;
  color: #777 !important;
  text-decoration: line-through;
}

.sr-card-weight {
  font-size: 12px;
  color: #999 !important;
  font-weight: 500;
  margin-left: 4px;
}

/* ---------- CARD ADD BUTTON ---------- */
.sr-card-add-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  padding: 12px 16px;
  margin-top: 12px;
  border: none;
  border-radius: var(--sr-radius-sm);
  background: linear-gradient(135deg, #7ed957, #166534) !important;
  color: #fff !important;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: transform .25s var(--sr-ease), box-shadow .25s var(--sr-ease), opacity .25s var(--sr-ease);
  letter-spacing: 0.02em;
}

.sr-card-add-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(126,217,87,0.35);
}

.sr-card-add-btn:active {
  transform: translateY(0) scale(0.97);
}

/* ---------- CARD SKELETON ---------- */
.sr-card-skeleton {
  background: var(--sr-bg-card);
  border-radius: var(--sr-radius);
  overflow: hidden;
  border: 1.5px solid var(--sr-border);
}

.sr-card-skeleton .sr-card-img-wrap {
  background: linear-gradient(110deg, var(--sr-bg-surface) 30%, rgba(255,255,255,0.5) 50%, var(--sr-bg-surface) 70%);
  background-size: 300% 100%;
  animation: sr-shimmer 1.6s ease-in-out infinite;
}

body.sr-dark .sr-card-skeleton .sr-card-img-wrap {
  background: linear-gradient(110deg, #2a2a2a 30%, #333 50%, #2a2a2a 70%);
  background-size: 300% 100%;
  animation: sr-shimmer 1.6s ease-in-out infinite;
}

.sr-card-skeleton .sr-card-body > * {
  height: 14px;
  border-radius: 6px;
  background: linear-gradient(110deg, var(--sr-bg-surface) 30%, rgba(255,255,255,0.5) 50%, var(--sr-bg-surface) 70%);
  background-size: 300% 100%;
  animation: sr-shimmer 1.6s ease-in-out infinite;
}

body.sr-dark .sr-card-skeleton .sr-card-body > * {
  background: linear-gradient(110deg, #2a2a2a 30%, #333 50%, #2a2a2a 70%);
  background-size: 300% 100%;
}

.sr-card-skeleton .sr-card-brand { width: 40%; height: 10px; }
.sr-card-skeleton .sr-card-name { width: 75%; height: 16px; margin-top: 6px; }
.sr-card-skeleton .sr-card-price-row { width: 50%; height: 18px; margin-top: 10px; }

@keyframes sr-shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ---------- CART DRAWER ---------- */
.sr-drawer-overlay {
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.5);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  z-index: 2000;
  opacity: 0;
  visibility: hidden;
  transition: opacity .35s var(--sr-ease), visibility .35s var(--sr-ease);
}

.sr-drawer-overlay.sr-drawer-open {
  opacity: 1;
  visibility: visible;
}

.sr-drawer {
  position: fixed;
  top: 0;
  right: 0;
  width: 420px;
  max-width: 92vw;
  height: 100%;
  background: var(--sr-bg);
  z-index: 2001;
  display: flex;
  flex-direction: column;
  transform: translateX(100%);
  transition: transform .4s var(--sr-ease);
  box-shadow: -8px 0 40px rgba(0,0,0,0.15);
}

.sr-drawer.sr-drawer-open {
  transform: translateX(0);
}

.sr-drawer-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px;
  border-bottom: 1px solid var(--sr-border);
  flex-shrink: 0;
}

.sr-drawer-title {
  font-size: 20px;
  font-weight: 700;
  color: var(--sr-text);
}

.sr-drawer-close {
  width: 36px;
  height: 36px;
  border: none;
  border-radius: 50%;
  background: var(--sr-bg-surface);
  color: var(--sr-text);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  transition: background .25s var(--sr-ease), transform .25s var(--sr-ease);
}

.sr-drawer-close:hover {
  background: #209F48;
  color: #fff;
  transform: rotate(90deg);
}

/* Drawer Store Info */
.sr-drawer-store {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 24px;
  background: var(--sr-bg-surface);
  border-bottom: 1px solid var(--sr-border);
  flex-shrink: 0;
}

.sr-drawer-store-name {
  font-size: 14px;
  font-weight: 600;
  color: var(--sr-text);
}

.sr-drawer-order-type {
  font-size: 12px;
  margin-left: auto;
  padding: 4px 12px;
  border-radius: var(--sr-radius-pill);
  background: rgba(126,217,87,0.1);
  color: var(--sr-green-dark);
  font-weight: 600;
}

body.sr-dark .sr-drawer-order-type {
  color: var(--sr-green);
}

/* Drawer Items */
.sr-drawer-items {
  flex: 1;
  overflow-y: auto;
  padding: 16px 24px;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.sr-drawer-items::-webkit-scrollbar { width: 4px; }
.sr-drawer-items::-webkit-scrollbar-track { background: transparent; }
.sr-drawer-items::-webkit-scrollbar-thumb { background: var(--sr-border); border-radius: 4px; }

.sr-drawer-item {
  display: flex;
  gap: 14px;
  padding: 14px;
  border-radius: var(--sr-radius-sm);
  background: var(--sr-bg-surface);
  transition: background .25s var(--sr-ease);
}

.sr-drawer-item:hover {
  background: rgba(126,217,87,0.06);
}

body.sr-dark .sr-drawer-item:hover {
  background: rgba(126,217,87,0.08);
}

.sr-drawer-item-img {
  width: 72px;
  height: 72px;
  border-radius: 10px;
  object-fit: cover;
  flex-shrink: 0;
  background: var(--sr-bg-surface);
}

.sr-drawer-item-info {
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: 4px;
  min-width: 0;
}

.sr-drawer-item-name {
  font-size: 14px;
  font-weight: 600;
  color: var(--sr-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sr-drawer-item-brand {
  font-size: 11px;
  color: var(--sr-text-muted);
  text-transform: uppercase;
  letter-spacing: 0.06em;
  font-weight: 500;
}

.sr-drawer-item-price {
  font-size: 15px;
  font-weight: 700;
  color: var(--sr-green-dark);
}

body.sr-dark .sr-drawer-item-price {
  color: var(--sr-green);
}

.sr-drawer-item-qty-sel {
  padding: 4px 8px;
  border: 1px solid var(--sr-border);
  border-radius: 8px;
  background: var(--sr-bg);
  color: var(--sr-text);
  font-size: 13px;
  font-weight: 500;
  cursor: pointer;
  transition: border-color .25s var(--sr-ease);
  outline: none;
}

.sr-drawer-item-qty-sel:focus {
  border-color: var(--sr-green);
}

.sr-drawer-item-remove {
  background: none;
  border: none;
  color: var(--sr-text-muted);
  cursor: pointer;
  font-size: 18px;
  padding: 4px;
  transition: color .25s var(--sr-ease);
  align-self: flex-start;
  flex-shrink: 0;
}

.sr-drawer-item-remove:hover {
  color: #209F48;
}

/* Drawer Summary */
.sr-drawer-summary {
  padding: 16px 24px;
  border-top: 1px solid var(--sr-border);
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex-shrink: 0;
}

.sr-drawer-summary-row {
  display: flex;
  justify-content: space-between;
  font-size: 14px;
  color: var(--sr-text-secondary);
}

.sr-drawer-summary-row.sr-total {
  font-size: 18px;
  font-weight: 700;
  color: var(--sr-text);
  padding-top: 10px;
  border-top: 1px solid var(--sr-border);
}

/* Drawer Checkout */
.sr-drawer-checkout-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin: 0 24px 20px;
  padding: 16px;
  border: none;
  border-radius: var(--sr-radius-sm);
  background: var(--sr-green-gradient);
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  cursor: pointer;
  transition: transform .25s var(--sr-ease), box-shadow .25s var(--sr-ease);
  letter-spacing: 0.03em;
  flex-shrink: 0;
}

.sr-drawer-checkout-btn:hover {
  transform: translateY(-2px);
  box-shadow: var(--sr-shadow-green);
}

.sr-drawer-checkout-btn:active {
  transform: translateY(0) scale(0.98);
}

/* Drawer Empty State */
.sr-drawer-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  flex: 1;
  padding: 48px 24px;
  text-align: center;
  gap: 16px;
}

.sr-drawer-empty-icon {
  font-size: 64px;
  opacity: 0.3;
  line-height: 1;
}

.sr-drawer-empty-text {
  font-size: 16px;
  color: var(--sr-text-muted);
  font-weight: 500;
}

.sr-drawer-empty-btn {
  padding: 12px 28px;
  border: none;
  border-radius: var(--sr-radius-pill);
  background: var(--sr-green-gradient);
  color: #fff;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: transform .25s var(--sr-ease), box-shadow .25s var(--sr-ease);
}

.sr-drawer-empty-btn:hover {
  transform: translateY(-2px);
  box-shadow: var(--sr-shadow-green);
}

/* Drawer Disclaimer */
.sr-drawer-disclaimer {
  padding: 12px 24px 16px;
  font-size: 11px;
  color: var(--sr-text-muted);
  text-align: center;
  line-height: 1.5;
  flex-shrink: 0;
}

/* ---------- PRODUCT MODAL ---------- */
.sr-modal {
  position: fixed;
  inset: 0;
  z-index: 3000;
  /* v2.9.12.3 final — Chrome/Safari have a bug where overflow-y:auto + display:flex
     + a child taller than the container positions the child ABOVE the container.
     Switching to block + text-align:center + inline-block child avoids the bug. */
  display: block;
  padding: 24px 20px;
  overflow-y: auto;
  overscroll-behavior: contain;
  opacity: 0;
  visibility: hidden;
  transition: opacity .35s var(--sr-ease), visibility .35s var(--sr-ease);
  text-align: center;
}

.sr-modal.sr-modal-open {
  opacity: 1;
  visibility: visible;
}

.sr-modal::before {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.6);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.sr-modal-content {
  position: relative;
  background: var(--sr-bg);
  border-radius: 20px;
  max-width: 900px;
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  box-shadow: 0 24px 80px rgba(0,0,0,0.25);
  animation: sr-modal-in .4s var(--sr-ease);
  margin: 0 auto;
  text-align: left;
}
@media (max-width: 860px) {
  /* Collapse to single column so image doesn't eat the top half on mobile */
  .sr-modal-content { grid-template-columns: 1fr; }
  .sr-modal-img-col { max-height: 280px; overflow: hidden; }
  .sr-modal-img-col img { object-fit: cover; width: 100%; height: 100%; }
}

@keyframes sr-modal-in {
  0% { transform: translateY(30px) scale(0.96); opacity: 0; }
  100% { transform: translateY(0) scale(1); opacity: 1; }
}

.sr-modal-close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 40px;
  height: 40px;
  border: none;
  border-radius: 50%;
  background: rgba(0,0,0,0.06);
  color: var(--sr-text);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  z-index: 10;
  transition: background .25s var(--sr-ease), transform .25s var(--sr-ease);
}

body.sr-dark .sr-modal-close {
  background: rgba(255,255,255,0.1);
}

.sr-modal-close:hover {
  background: #209F48;
  color: #fff;
  transform: rotate(90deg);
}

.sr-modal-img-col {
  position: relative;
  background: var(--sr-bg-surface);
  border-radius: 20px 0 0 20px;
  overflow: hidden;
  min-height: 400px;
}

.sr-modal-img-col img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.sr-modal-loading {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 300px;
  width: 100%;
  grid-column: 1 / -1;
}

.sr-modal-spinner {
  width: 48px;
  height: 48px;
  border: 3px solid var(--sr-border);
  border-top-color: var(--sr-green);
  border-radius: 50%;
  animation: sr-spin 0.8s linear infinite;
}

@keyframes sr-spin {
  to { transform: rotate(360deg); }
}

.sr-modal-variant-btn {
  padding: 10px 20px;
  border: 1.5px solid var(--sr-border);
  border-radius: var(--sr-radius-pill);
  background: var(--sr-bg);
  color: var(--sr-text);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: all .25s var(--sr-ease);
}

.sr-modal-variant-btn:hover,
.sr-modal-variant-btn.active {
  border-color: var(--sr-green);
  background: rgba(126,217,87,0.1);
  color: var(--sr-green-dark);
}

body.sr-dark .sr-modal-variant-btn:hover,
body.sr-dark .sr-modal-variant-btn.active {
  color: var(--sr-green);
}

/* ---------- AGE GATE — pixel-match silkroadnyc.com (v2.9.9) ----------
   v1 uses the age-gate plugin's v2 CSS (hyphen selectors).
   We cover BOTH hyphen AND BEM double-underscore for forward compat.
   Background: solid black + tiled BITCOIN (₿, U+20BF) symbol watermark.
   Logo: v1's white-text SR-Logo-Footer.webp (injected via JS if missing).
   Buttons: flat #166534 green, radius 8, side-by-side Yes + No.         */

body.age-gate-open,
.age-gate-background-color,
.age-gate__background-color {
  background-color: #000000 !important;
}

.age-gate-background,
.age-gate__background {
  background-color: #000000 !important;
  /* v2.9.12.7 — Pixel-matched to v1 (silkroadnyc.com age gate): same WebP hero,
     cover fit, centered, scroll (not fixed — v1 uses scroll per live inspection). */
  background-image: url("/wp-content/plugins/silk-road-nyc/assets/brand/sr-agegate-hero.webp") !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
  background-position: 50% 50% !important;
  background-attachment: scroll !important;
  opacity: 1 !important;
  position: absolute !important;
  inset: 0 !important;
}

.age-gate,
.age-gate__wrapper .age-gate {
  background: transparent !important;
  box-shadow: none !important;
  border: none !important;
  border-radius: 0 !important;
  max-width: 560px !important;
  padding: 0 !important;
}

.age-gate-form,
.age-gate__form {
  padding: 32px !important;
  text-align: center !important;
  background: transparent !important;
}

.age-gate-heading,
.age-gate__heading {
  text-align: center !important;
  margin: 0 auto !important;
}

.age-gate-heading-title-logo,
.age-gate__heading-title--logo,
.sr-age-logo-injected {
  max-width: 320px !important;
  width: 100% !important;
  height: auto !important;
  margin: 0 auto !important;
  display: block !important;
}

.age-gate-headline,
.age-gate__headline {
  color: #ffffff !important;
  font-family: Poppins, "Segoe UI", system-ui, sans-serif !important;
  font-size: clamp(28px, 4vw, 38px) !important;
  font-weight: 800 !important;
  letter-spacing: -0.01em !important;
  margin: 16px 0 0 0 !important;
  text-shadow: none !important;
}

.age-gate-subheadline,
.age-gate__subheadline { display: none !important; }

.age-gate-challenge,
.age-gate__challenge {
  color: #ffffff !important;
  font-family: Poppins, "Segoe UI", system-ui, sans-serif !important;
  font-size: 16px !important;
  font-weight: 400 !important;
  margin: 8px 0 20px 0 !important;
}

.age-gate-buttons,
.age-gate__buttons {
  display: flex !important;
  gap: 10px !important;
  justify-content: center !important;
  margin-top: 8px !important;
}

button.age-gate-submit-yes,
button.age-gate-submit-no,
button.age-gate__submit,
button.age-gate__submit--yes,
button.age-gate__submit--no,
.age-gate__submit--yes,
.age-gate__submit--no {
  background-color: #166534 !important;
  color: #ffffff !important;
  border: none !important;
  border-radius: 8px !important;
  padding: 16px 32px !important;
  font-family: Poppins, "Segoe UI", system-ui, sans-serif !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  cursor: pointer !important;
  transition: background-color .2s ease, transform .15s ease !important;
  min-width: auto !important;
}

/* Force Yes before No via CSS order (v2 plugin renders No first) */
button.age-gate-submit-yes,
button.age-gate__submit--yes { order: 1 !important; }
button.age-gate-submit-no,
button.age-gate__submit--no  { order: 2 !important; }

button.age-gate-submit-yes:hover,
button.age-gate-submit-no:hover,
.age-gate__submit--yes:hover,
.age-gate__submit--no:hover {
  background-color: #3a7a1c !important;
  transform: translateY(-1px) !important;
  box-shadow: none !important;
}

button.age-gate-submit-yes:focus,
.age-gate__submit--yes:focus {
  background-color: #166534 !important;
  outline: 2px solid rgba(126,217,87,.45) !important;
  outline-offset: 2px !important;
}

.age-gate-errors,
.age-gate__errors {
  color: #209F48 !important;
  font-size: 13px !important;
  margin-top: 12px !important;
}

.age-gate-remember-wrapper,
.age-gate__remember-wrapper { display: none !important; }

/* ---------- ASTRA THEME OVERRIDES ---------- */
/* Force Astra containers to be full-width for our plugin content */
.page-id-32 .site-content,
.page-id-32 .ast-container,
.page-id-32 .content-area,
.page-id-32 .site-main,
.page-id-32 .entry-content,
.page-id-32 article {
  max-width: 100% !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* Hide Astra's default header — we build our own */
.page-id-32 .ast-hfb-header,
.page-id-32 #ast-desktop-header,
.page-id-32 .ast-above-header-bar,
.page-id-32 .ast-primary-header-bar,
.page-id-32 .ast-below-header-bar,
.page-id-32 #masthead {
  display: none !important;
}

/* Hide Astra's default footer — we build our own */
.page-id-32 .site-footer,
.page-id-32 .ast-footer-overlay {
  display: none !important;
}

/* Remove default page title */
.page-id-32 .ast-archive-description,
.page-id-32 .page-title,
.page-id-32 .entry-title {
  display: none !important;
}

/* Also apply to menu page (page-id-33) */
.page-id-33 .site-content,
.page-id-33 .ast-container,
.page-id-33 .content-area,
.page-id-33 .site-main,
.page-id-33 .entry-content,
.page-id-33 article {
  max-width: 100% !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
}

.page-id-33 .ast-hfb-header,
.page-id-33 #ast-desktop-header,
.page-id-33 #masthead {
  display: none !important;
}

.page-id-33 .site-footer,
.page-id-33 .ast-footer-overlay {
  display: none !important;
}

.page-id-33 .entry-title {
  display: none !important;
}

/* ---------- UTILITY ---------- */
.sr-container {
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 24px;
}

::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--sr-border); border-radius: 6px; }
::-webkit-scrollbar-thumb:hover { background: var(--sr-text-muted); }

/* ---------- RESPONSIVE ---------- */
@media (max-width: 1024px) {
  .sr-header { padding: 0 16px; }
}

@media (max-width: 768px) {
  .sr-modal-content {
    grid-template-columns: 1fr;
    max-width: 95vw;
  }
  .sr-modal-img-col {
    border-radius: 20px 20px 0 0;
    min-height: 250px;
  }
  .sr-header-nav { gap: 16px; }
  .sr-header-nav a { font-size: 13px; }
  .sr-drawer { width: 100%; max-width: 100%; }
}

@media (max-width: 480px) {
  :root { --sr-header-h: 60px; }
  .sr-card-body { padding: 12px; }
  .sr-card-name { font-size: 14px; }
  .sr-card-price { font-size: 16px; }
  .sr-card-price-special { font-size: 16px; }
  .sr-drawer-item-img { width: 60px; height: 60px; }
}

/* ============================================================
   v23 ADDITIONS — Trippy BG, Premium Cart, Toast, Modal Fix,
   IG Feed, Press Grid, Events, SEO Content Blocks
   ============================================================ */

/* ---------- TRIPPY BACKGROUND (aurora mesh + stars + cosmic spin) ---------- */
body {
  background-color: #08080b !important;
  background-image:
    radial-gradient(ellipse 900px 600px at 18% 12%, rgba(126,217,87,0.10), transparent 60%),
    radial-gradient(ellipse 700px 700px at 82% 22%, rgba(130,50,220,0.09), transparent 60%),
    radial-gradient(ellipse 600px 800px at 48% 70%, rgba(255,140,60,0.06), transparent 60%),
    radial-gradient(ellipse 900px 500px at 70% 90%, rgba(60,180,220,0.06), transparent 60%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Ctext x='40' y='48' font-size='28' text-anchor='middle' fill='%23ffffff' opacity='0.03' font-family='sans-serif'%3E%E0%B8%BF%3C/text%3E%3C/svg%3E") !important;
  background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, repeat !important;
  background-attachment: fixed, fixed, fixed, fixed, fixed !important;
  position: relative;
}
body::before {
  content: '';
  position: fixed;
  inset: -10%;
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(1.4px 1.4px at 12% 18%, rgba(255,255,255,.55), transparent 60%),
    radial-gradient(1.2px 1.2px at 28% 48%, rgba(255,255,255,.40), transparent 60%),
    radial-gradient(1.6px 1.6px at 52% 26%, rgba(255,255,255,.55), transparent 60%),
    radial-gradient(1px 1px at 74% 64%, rgba(255,255,255,.35), transparent 60%),
    radial-gradient(1.8px 1.8px at 91% 34%, rgba(255,255,255,.65), transparent 60%),
    radial-gradient(1.2px 1.2px at 22% 82%, rgba(126,217,87,.55), transparent 60%),
    radial-gradient(2px 2px at 47% 57%, rgba(180,120,255,.50), transparent 60%),
    radial-gradient(1.4px 1.4px at 66% 86%, rgba(126,217,87,.40), transparent 60%);
  animation: sr-starfield 60s linear infinite;
  opacity: .7;
}
body::after {
  content: '';
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: conic-gradient(from 180deg at 50% 50%, rgba(126,217,87,0.03), rgba(130,50,220,0.03), rgba(255,140,60,0.02), rgba(126,217,87,0.03));
  mix-blend-mode: screen;
  animation: sr-cosmic-spin 120s linear infinite;
}
@keyframes sr-starfield {
  0% { transform: translate3d(0,0,0); }
  50% { transform: translate3d(30px,-40px,0); }
  100% { transform: translate3d(0,0,0); }
}
@keyframes sr-cosmic-spin { to { transform: rotate(1turn); } }
.sr-wrap, .sr-header { position: relative; z-index: 2; }

/* ---------- PREMIUM FLOATING CART BUTTON (v23) ---------- */
.sr-float-cart-v23 {
  position: fixed;
  bottom: 28px;
  right: 28px;
  width: 64px;
  height: 64px;
  border: none;
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
  z-index: 999;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.sr-float-cart-v23 .sr-float-cart-ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: conic-gradient(from 0deg, #7ed957, #166534, #7ed957, #b8ff7c, #7ed957);
  animation: sr-cart-ring-spin 6s linear infinite;
  filter: blur(2px);
  opacity: .9;
}
.sr-float-cart-v23 .sr-float-cart-core {
  position: relative;
  z-index: 1;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: radial-gradient(circle at 30% 25%, #1c1c1c 0%, #0a0a0a 70%);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #7ed957;
  box-shadow: 0 10px 40px rgba(126,217,87,.35), inset 0 0 0 1px rgba(126,217,87,.25);
  transition: transform .25s ease;
}
.sr-float-cart-v23:hover .sr-float-cart-core { transform: scale(1.08); }
.sr-float-cart-v23 svg { width: 24px; height: 24px; }
.sr-float-cart-v23 .sr-cart-badge {
  position: absolute; top: -2px; right: -2px;
  min-width: 22px; height: 22px; padding: 0 6px;
  background: linear-gradient(135deg, #7ED957, #209F48);
  color: #0a0a0a; font-size: 11px; font-weight: 800;
  border-radius: 11px; display: flex; align-items: center; justify-content: center;
  border: 2px solid #08080b;
  box-shadow: 0 4px 12px rgba(32,159,72,.45);
  z-index: 2;
}
@keyframes sr-cart-ring-spin { to { transform: rotate(1turn); } }

/* ---------- MODAL FIX ---------- */
#sr-modal-overlay {
  position: fixed; inset: 0; z-index: 3000;
  opacity: 0; visibility: hidden;
  transition: opacity .3s var(--sr-ease), visibility .3s var(--sr-ease);
}
#sr-modal-overlay.sr-modal-open { opacity: 1; visibility: visible; }
.sr-modal.sr-modal-open { opacity: 1 !important; visibility: visible !important; }

/* ---------- TOAST ---------- */
.sr-toast-host { position: fixed; top: 90px; right: 24px; z-index: 4000; display: flex; flex-direction: column; gap: 10px; pointer-events: none; }
.sr-toast {
  display: flex; align-items: center; gap: 10px;
  padding: 12px 18px 12px 14px;
  background: rgba(20,20,22,.96);
  border: 1px solid rgba(126,217,87,.3);
  border-radius: 14px;
  color: #fff; font-size: 13px; font-weight: 600;
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  box-shadow: 0 12px 40px rgba(0,0,0,.5);
  transform: translateX(120%); opacity: 0;
  transition: transform .35s var(--sr-ease), opacity .35s var(--sr-ease);
  max-width: 340px;
}
.sr-toast.sr-toast-in { transform: translateX(0); opacity: 1; }
.sr-toast-dot { width: 8px; height: 8px; border-radius: 50%; background: #7ed957; box-shadow: 0 0 8px rgba(126,217,87,.8); flex-shrink: 0; }
.sr-toast-error .sr-toast-dot { background: #209F48; box-shadow: 0 0 8px rgba(32,159,72,.8); }

/* ---------- INSTAGRAM / LIVE FEED GRID ---------- */
.sr-igf-section { padding: 64px 24px; position: relative; }
.sr-igf-head { max-width: 1400px; margin: 0 auto 28px; display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.sr-igf-head h2 { font-size: 28px; font-weight: 800; color: #fff; margin: 0; letter-spacing: -.01em; }
.sr-igf-head p { font-size: 14px; color: rgba(255,255,255,.55); margin: 6px 0 0; max-width: 540px; }
.sr-igf-follow {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 10px 18px; border-radius: 50px;
  background: linear-gradient(135deg, #feda75, #fa7e1e, #d62976, #962fbf, #4f5bd5);
  color: #fff; text-decoration: none; font-weight: 700; font-size: 13px;
  box-shadow: 0 6px 22px rgba(214,41,118,.35);
}
.sr-igf-grid { max-width: 1400px; margin: 0 auto; display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; }
.sr-igf-tile {
  position: relative; aspect-ratio: 1/1; border-radius: 14px; overflow: hidden;
  background: #161616; text-decoration: none; color: #fff;
  transition: transform .4s var(--sr-ease), box-shadow .4s var(--sr-ease);
}
.sr-igf-tile img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--sr-ease); }
.sr-igf-tile:hover { transform: translateY(-4px); box-shadow: 0 14px 40px rgba(126,217,87,.18); }
.sr-igf-tile:hover img { transform: scale(1.06); }
.sr-igf-tile .sr-ig-caption {
  position: absolute; inset: auto 0 0 0; padding: 14px 12px 10px;
  background: linear-gradient(to top, rgba(0,0,0,.82), transparent);
  font-size: 12px; font-weight: 500; line-height: 1.3;
}
.sr-igf-tile .sr-ig-kind {
  position: absolute; top: 10px; left: 10px;
  background: rgba(0,0,0,.6); color: #7ed957;
  font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .12em;
  padding: 4px 10px; border-radius: 30px; backdrop-filter: blur(6px);
}
@media (max-width: 1024px) { .sr-igf-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 640px) { .sr-igf-grid { grid-template-columns: repeat(2, 1fr); } }

/* ---------- AS SEEN IN / PRESS ---------- */
.sr-press-section { padding: 48px 24px; text-align: center; }
.sr-press-eyebrow { font-size: 10px; font-weight: 800; letter-spacing: .24em; color: rgba(255,255,255,.35); text-transform: uppercase; margin-bottom: 10px; }
.sr-press-title { font-size: 22px; font-weight: 700; color: #fff; margin: 0 0 28px; }
.sr-press-row { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: repeat(6, 1fr); gap: 20px; align-items: center; }
.sr-press-item { font-size: 13px; font-weight: 700; color: rgba(255,255,255,.45); letter-spacing: .08em; text-transform: uppercase; padding: 10px; text-align: center; border: 1px solid rgba(255,255,255,.08); border-radius: 12px; transition: all .3s; }
.sr-press-item:hover { color: #7ed957; border-color: rgba(126,217,87,.4); }
@media (max-width: 768px) { .sr-press-row { grid-template-columns: repeat(3, 1fr); gap: 12px; } }

/* ---------- EVENTS STRIP ---------- */
.sr-events-section { padding: 56px 24px; }
.sr-events-inner { max-width: 1400px; margin: 0 auto; }
.sr-events-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 24px; }
.sr-event-card {
  position: relative; padding: 24px; border-radius: 18px;
  background: linear-gradient(135deg, rgba(20,20,22,.85), rgba(12,12,14,.9));
  border: 1px solid rgba(126,217,87,.15);
  transition: transform .35s var(--sr-ease), border-color .35s var(--sr-ease);
  overflow: hidden;
}
.sr-event-card::before { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at top right, rgba(126,217,87,.1), transparent 60%); opacity: 0; transition: opacity .35s; }
.sr-event-card:hover { transform: translateY(-6px); border-color: rgba(126,217,87,.4); }
.sr-event-card:hover::before { opacity: 1; }
.sr-event-date { font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; color: #7ed957; margin-bottom: 10px; position: relative; z-index: 1; }
.sr-event-title { font-size: 18px; font-weight: 700; color: #fff; margin: 0 0 6px; letter-spacing: -.01em; position: relative; z-index: 1; }
.sr-event-desc { font-size: 13px; color: rgba(255,255,255,.55); line-height: 1.5; margin: 0 0 14px; position: relative; z-index: 1; }
.sr-event-meta { display: flex; align-items: center; gap: 10px; font-size: 11px; color: rgba(255,255,255,.45); position: relative; z-index: 1; }
@media (max-width: 768px) { .sr-events-grid { grid-template-columns: 1fr; } }

/* ---------- CONSISTENT CARD SIZE (v24 tight cap) ---------- */
.sr-hero-featured-cards { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 10px !important; max-width: 560px; margin-left: auto; margin-right: auto; }
.sr-hero-featured-cards .sr-card { min-width: 0; }
.sr-hero-featured-cards .sr-card .sr-card-body { padding: 10px; gap: 4px; }
.sr-hero-featured-cards .sr-card .sr-card-name { font-size: 12px; line-height: 1.3; }
.sr-hero-featured-cards .sr-card .sr-card-brand { font-size: 9px; }
.sr-hero-featured-cards .sr-card .sr-card-price { font-size: 14px; }
.sr-hero-featured-cards .sr-card .sr-card-add-btn { padding: 8px 10px; font-size: 11px; margin-top: 8px; }
.sr-hero-featured-cards .sr-card .sr-card-meta { gap: 3px; }
.sr-hero-featured-cards .sr-card .sr-badge { padding: 2px 6px; font-size: 9px; }

/* ---------- NEWSLETTER DARK (v24) ---------- */
.sr-newsletter { background: rgba(14,14,16,.85) !important; border: 1px solid rgba(126,217,87,.18); border-radius: 24px; padding: 48px 32px !important; margin: 48px 24px !important; max-width: 900px; margin-left: auto !important; margin-right: auto !important; text-align: center; position: relative; overflow: hidden; }
.sr-newsletter::before { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 50% 0%, rgba(126,217,87,.12), transparent 70%); pointer-events: none; }
.sr-newsletter h2 { color: #fff !important; font-size: 28px !important; font-weight: 800 !important; margin: 0 0 10px !important; position: relative; }
.sr-newsletter p { color: rgba(255,255,255,.55) !important; font-size: 15px; margin: 0 0 24px; position: relative; }
.sr-newsletter-form { background: rgba(255,255,255,.04) !important; border-color: rgba(126,217,87,.25) !important; position: relative; }
.sr-newsletter-form input[type="email"] { color: #fff !important; }
.sr-newsletter-form input[type="email"]::placeholder { color: rgba(255,255,255,.35) !important; }

/* ---------- FAQ DARK + silkroadnyc-style accordion (v24) ---------- */
.sr-faq { max-width: 1000px; margin: 48px auto !important; padding: 32px 24px !important; background: rgba(14,14,16,.8); border: 1px solid rgba(255,255,255,.06); border-radius: 20px; }
.sr-faq h2 { color: #fff !important; text-align: center; font-size: 32px; font-weight: 800; margin: 0 0 8px; }
.sr-faq > p { text-align: center; color: rgba(255,255,255,.55); max-width: 560px; margin: 0 auto 28px; font-size: 14px; }
.sr-faq .sr-faq-item { border-bottom: 1px solid rgba(255,255,255,.08) !important; }
.sr-faq .sr-faq-q { color: #fff !important; font-size: 15px; font-weight: 600; }
.sr-faq .sr-faq-q:hover { color: #7ed957 !important; }
.sr-faq .sr-faq-q::after { background: rgba(126,217,87,.1) !important; color: #7ed957 !important; border: 1px solid rgba(126,217,87,.25); }
.sr-faq-open .sr-faq-q::after { background: #7ed957 !important; color: #0a0a0a !important; }
.sr-faq .sr-faq-a { color: rgba(255,255,255,.65) !important; }
/* kill any theme-injected blue hover state */
.sr-faq .sr-faq-item:hover, .sr-faq .sr-faq-item:focus-within { background: transparent !important; }

/* ---------- ABOUT DARK (v24) ---------- */
.sr-about { background: rgba(14,14,16,.7) !important; color: rgba(255,255,255,.7) !important; padding: 48px 24px !important; margin: 48px auto !important; max-width: 1000px; border-radius: 20px; border: 1px solid rgba(255,255,255,.06); }
.sr-about h2 { color: #fff !important; font-size: 28px; font-weight: 800; margin: 0 0 16px; }
.sr-about p { color: rgba(255,255,255,.6) !important; font-size: 15px; line-height: 1.7; }

/* ---------- v24 SIGN UP & SAVE banner (silkroadnyc.com parity) ---------- */
.sr-signup-banner { padding: 48px 24px; }
.sr-signup-inner { max-width: 1400px; margin: 0 auto; background: #000; border-radius: 20px; position: relative; overflow: hidden; padding: 48px 56px; display: grid; grid-template-columns: 1.3fr 1fr; align-items: center; gap: 32px; }
.sr-signup-wm { position: absolute; right: 25%; top: 50%; transform: translateY(-50%); font-size: 96px; font-weight: 900; font-style: italic; color: rgba(255,255,255,.05); letter-spacing: -.04em; pointer-events: none; white-space: nowrap; font-family: 'Pacifico', cursive; }
.sr-signup-eyebrow { color: #7ed957; font-size: 12px; font-weight: 700; letter-spacing: .04em; margin-bottom: 8px; }
.sr-signup-title { color: #fff; font-size: 34px; font-weight: 800; margin: 0 0 10px; }
.sr-signup-desc { color: rgba(255,255,255,.65); font-size: 14px; margin: 0; max-width: 520px; }
.sr-signup-cta-col { text-align: right; position: relative; z-index: 2; }
.sr-signup-cta { display: inline-block; padding: 16px 36px; border: 2px solid #7ed957; border-radius: 6px; color: #7ed957; text-decoration: none; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; font-size: 14px; transition: all .3s; }
.sr-signup-cta:hover { background: #7ed957; color: #000; }
@media (max-width: 800px) { .sr-signup-inner { grid-template-columns: 1fr; padding: 32px 24px; text-align: left; } .sr-signup-cta-col { text-align: left; } .sr-signup-wm { font-size: 56px; } }

/* ---------- v24 SEO ABOUT with collage (silkroadnyc.com parity) ---------- */
.sr-seo-about { padding: 56px 24px; }
.sr-seo-about-inner { max-width: 1400px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1.1fr; gap: 56px; align-items: start; }
.sr-seo-about-collage { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto auto; gap: 16px; }
.sr-seo-about-collage > div { border-radius: 16px; overflow: hidden; border: 2px solid #7ed957; background: #141416; }
.sr-seo-about-collage img { width: 100%; height: 100%; object-fit: cover; display: block; }
.sr-collage-logo { aspect-ratio: 1/1; border: 2px solid transparent !important; background: radial-gradient(circle, rgba(126,217,87,.2), transparent 70%) !important; display: flex; align-items: center; justify-content: center; }
.sr-collage-logo img { width: 70% !important; height: auto !important; object-fit: contain !important; }
.sr-collage-staff { aspect-ratio: 1/1; }
.sr-collage-interior { aspect-ratio: 16/9; position: relative; grid-column: 1 / -1; } /* v2.7.21 widescreen, not square */
.sr-collage-caption { position: absolute; left: 12px; bottom: 12px; background: rgba(0,0,0,.75); color: #fff; font-size: 11px; font-weight: 600; padding: 8px 12px; border-radius: 8px; max-width: 70%; }
.sr-collage-counter { aspect-ratio: 3 / 1; grid-column: 1 / -1; } /* v2.7.21 matches SR-Banner 1500x492 */
.sr-seo-eyebrow { color: rgba(255,255,255,.55); font-size: 13px; font-weight: 500; margin-bottom: 6px; }
.sr-seo-h2 { color: #fff; font-size: clamp(26px, 3.5vw, 36px); font-weight: 800; margin: 0 0 18px; letter-spacing: -.02em; line-height: 1.15; }
.sr-seo-about-copy p { color: rgba(255,255,255,.7); font-size: 15px; line-height: 1.75; margin: 0 0 14px; }
.sr-seo-about-copy p strong { color: #fff; font-weight: 700; }
.sr-seo-about-copy a { color: #7ed957; }
@media (max-width: 900px) { .sr-seo-about-inner { grid-template-columns: 1fr; gap: 32px; } }

/* ---------- COMPREHENSIVE ABOUT ---------- */
.sr-about-v23 { max-width: 1240px; margin: 0 auto; padding: 120px 24px; }
.sr-about-v23 .sr-about-eyebrow { font-size: 15px; letter-spacing: .28em; color: #7ed957; text-transform: uppercase; font-weight: 800; margin-bottom: 20px; text-align: center; }
.sr-about-v23 h2 { font-size: clamp(42px, 7vw, 84px); font-weight: 900; color: #fff; margin: 0 0 26px; text-align: center; line-height: 1.04; letter-spacing: -.02em; }
.sr-about-v23 .sr-about-lede { font-size: clamp(18px, 2.2vw, 24px); color: rgba(255,255,255,.78); line-height: 1.6; text-align: center; max-width: 900px; margin: 0 auto 56px; }
.sr-about-chapters { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
.sr-about-chapter {
  padding: 28px 24px; border-radius: 20px;
  background: rgba(14,14,16,.85);
  border: 1px solid rgba(255,255,255,.06);
  position: relative; overflow: hidden;
}
.sr-about-chapter::after { content: ''; position: absolute; top: 0; left: 0; right: 0; height: 2px; background: linear-gradient(90deg, transparent, #7ed957, transparent); opacity: .6; }
.sr-about-chapter h3 { font-size: 24px; font-weight: 800; color: #7ed957; margin: 0 0 14px; }
.sr-about-chapter p { font-size: 16px; color: rgba(255,255,255,.72); line-height: 1.68; margin: 0; }
.sr-about-chapter .sr-about-num { font-size: 66px; font-weight: 900; color: rgba(126,217,87,.20); margin-bottom: 10px; line-height: 1; }
@media (max-width: 900px) { .sr-about-chapters { grid-template-columns: 1fr; } }

/* ---------- STATS STRIP ---------- */
.sr-stats { max-width: 1200px; margin: 0 auto; padding: 40px 24px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.sr-stat { text-align: center; padding: 20px; border: 1px solid rgba(255,255,255,.06); border-radius: 16px; background: rgba(14,14,16,.6); }
.sr-stat-num { font-size: 32px; font-weight: 900; color: #7ed957; letter-spacing: -.02em; line-height: 1; margin-bottom: 6px; }
.sr-stat-label { font-size: 11px; text-transform: uppercase; letter-spacing: .14em; color: rgba(255,255,255,.5); font-weight: 700; }
@media (max-width: 768px) { .sr-stats { grid-template-columns: repeat(2, 1fr); } }

/* ---------- v25 LIVE FIXES — ALL CARDS WHITE (silkroadnyc.com parity) ---------- */
body .sr-wrap .sr-card,
body .sr-carousel-track .sr-card {
  background: #fff !important;
  color: #111 !important;
  border: 1px solid #e5e5e5 !important;
}
body .sr-wrap .sr-card .sr-card-name,
body .sr-carousel-track .sr-card .sr-card-name { color: #111 !important; }
body .sr-wrap .sr-card .sr-card-brand,
body .sr-carousel-track .sr-card .sr-card-brand { color: #666 !important; font-weight: 600; text-transform: uppercase; }
body .sr-wrap .sr-card .sr-card-price,
body .sr-carousel-track .sr-card .sr-card-price { color: #111 !important; font-weight: 700; }
body .sr-wrap .sr-card .sr-card-weight { color: #666 !important; }
body .sr-wrap .sr-card .sr-card-img-wrap,
body .sr-carousel-track .sr-card .sr-card-img-wrap { background: #fff !important; }
body .sr-wrap .sr-card .sr-card-img { object-fit: contain !important; padding: 10px; }
body .sr-wrap .sr-card:hover { border-color: #7ed957 !important; box-shadow: 0 12px 32px rgba(126,217,87,.25) !important; }

/* Light-card badges: keep colored but on white bg */
body .sr-wrap .sr-card .sr-badge-hybrid { background: rgba(126,217,87,.18) !important; color: #166534 !important; }
body .sr-wrap .sr-card .sr-badge-indica { background: rgba(20,77,36,.12) !important; color: #0F3D1C !important; }
body .sr-wrap .sr-card .sr-badge-sativa { background: rgba(126,217,87,.18) !important; color: #166534 !important; }
body .sr-wrap .sr-card .sr-badge-thc { background: rgba(126,217,87,.15) !important; color: #166534 !important; }
body .sr-wrap .sr-card .sr-badge-cbd { background: rgba(126,217,87,.15) !important; color: #209F48 !important; }

/* Consistent carousel card width — v2.9.24.1: 5 visible per row on desktop. */
.sr-carousel-track { display: flex !important; flex-wrap: nowrap !important; gap: 16px !important; overflow-x: auto !important; }
.sr-carousel-track > * { flex: 0 0 calc((100% - 64px) / 5) !important; min-width: 0 !important; max-width: none !important; width: calc((100% - 64px) / 5) !important; }
@media (max-width: 1279px) and (min-width: 768px) {
  .sr-carousel-track > * { flex: 0 0 calc((100% - 28px) / 3) !important; width: calc((100% - 28px) / 3) !important; }
}
@media (max-width: 767px) {
  .sr-carousel-track > * { flex: 0 0 78% !important; width: 78% !important; }
}

/* ---------- v25 FAQ FINAL DARK LOCK-IN (kill theme injection) ---------- */
body .sr-wrap .sr-faq,
body .sr-wrap .sr-faq * { background-color: transparent !important; }
body .sr-wrap .sr-faq { background: linear-gradient(180deg, rgba(14,14,16,.92), rgba(20,20,22,.92)) !important; border: 1px solid rgba(126,217,87,.15) !important; }
body .sr-wrap .sr-faq h2, body .sr-wrap .sr-faq .sr-faq-q { color: #fff !important; }
body .sr-wrap .sr-faq .sr-faq-item { background: transparent !important; border-bottom: 1px solid rgba(255,255,255,.1) !important; }
body .sr-wrap .sr-faq .sr-faq-item:hover,
body .sr-wrap .sr-faq .sr-faq-item:focus-within,
body .sr-wrap .sr-faq-item.sr-faq-open { background: rgba(126,217,87,.04) !important; }
body .sr-wrap .sr-faq .sr-faq-q:hover { color: #7ed957 !important; }
body .sr-wrap .sr-faq .sr-faq-a { color: rgba(255,255,255,.7) !important; }

/* ---------- v25 Nuclear Trippy BG — force over any theme ---------- */
html body {
  background-color: #08080b !important;
  background-image:
    radial-gradient(ellipse 900px 600px at 18% 12%, rgba(126,217,87,.10), transparent 60%),
    radial-gradient(ellipse 700px 700px at 82% 22%, rgba(130,50,220,.09), transparent 60%),
    radial-gradient(ellipse 600px 800px at 48% 70%, rgba(255,140,60,.06), transparent 60%),
    radial-gradient(ellipse 900px 500px at 70% 90%, rgba(60,180,220,.06), transparent 60%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Ctext x='40' y='48' font-size='28' text-anchor='middle' fill='%23ffffff' opacity='0.03' font-family='sans-serif'%3E%E0%B8%BF%3C/text%3E%3C/svg%3E") !important;
  background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, repeat !important;
  background-attachment: fixed, fixed, fixed, fixed, fixed !important;
}

/* ---------- SHOP SPECIALS — v2.9.9 brand-aligned rebuild ----------
   Silk Road palette: #166534 primary green, #7ED957 accent, black ground,
   Poppins family. Replaces the washed-out light-mint tile with a refined
   dark-glass card so it fits the rest of the homepage.                 */
.sr-specials-section {
  background: #000000 !important;
  padding: 72px 24px !important;
  position: relative;
}
.sr-specials-section .sr-section-title {
  color: #ffffff !important;
  font-family: Poppins, "Segoe UI", system-ui, sans-serif !important;
  font-weight: 800 !important;
  font-size: clamp(24px, 3.2vw, 36px) !important;
  letter-spacing: -0.01em !important;
  text-align: center !important;
  margin: 0 auto 40px !important;
}
.sr-special-card {
  background: linear-gradient(180deg, rgba(46,100,22,0.10), rgba(11,11,11,0.85)) !important;
  border: 1px solid rgba(126,217,87,0.22) !important;
  border-radius: 18px !important;
  overflow: hidden !important;
  position: relative !important;
  transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease !important;
  font-family: Poppins, "Segoe UI", system-ui, sans-serif !important;
}
.sr-special-card:hover {
  transform: translateY(-4px) !important;
  border-color: #7ED957 !important;
  box-shadow: 0 14px 36px -14px rgba(126,217,87,0.35), 0 0 0 1px rgba(126,217,87,0.18) inset !important;
}
.sr-special-card .sr-special-overlay {
  opacity: 1 !important;
  background: transparent !important;
  padding: 18px 22px 22px !important;
  position: static !important;
  display: block !important;
}
.sr-special-card .sr-special-overlay span {
  color: #ffffff !important;
  font-family: Poppins, "Segoe UI", system-ui, sans-serif !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  letter-spacing: 0.02em !important;
  text-transform: uppercase !important;
  display: block !important;
}
.sr-special-card .sr-special-overlay span + span,
.sr-special-card .sr-special-overlay p {
  color: rgba(255,255,255,0.65) !important;
  font-weight: 400 !important;
  font-size: 13.5px !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  margin-top: 4px !important;
}
.sr-special-card a,
.sr-special-card .sr-btn {
  background: #166534 !important;
  color: #ffffff !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
  padding: 10px 18px !important;
  display: inline-block !important;
  margin-top: 12px !important;
  text-decoration: none !important;
  transition: background-color .2s ease !important;
}
.sr-special-card a:hover,
.sr-special-card .sr-btn:hover { background: #3a7a1c !important; }

/* ---------- v2.9.9 — MODAL BODY safety: prevent desc spill ----------
   JS now puts .sr-modal-desc INSIDE .sr-modal-content grid, but keep a
   defensive width cap on the body so old cached HTML still renders sane. */
#sr-modal-body {
  max-width: 900px !important;
  width: 100% !important;
  margin: 0 auto !important;
}

/* ============================================================
   v24 — Why Silk Road comparison + Strain landing page
   ============================================================ */
.sr-whyus-section { padding: 72px 24px; }
.sr-whyus-inner { max-width: 1100px; margin: 0 auto; }
.sr-whyus-head { text-align: center; margin-bottom: 36px; }
.sr-whyus-head h2 { font-size: clamp(24px, 3.5vw, 38px); font-weight: 800; color: #fff; margin: 10px 0 14px; letter-spacing: -.02em; }
.sr-whyus-head p { color: rgba(255,255,255,.6); font-size: 15px; max-width: 560px; margin: 0 auto; }
.sr-compare-table { border: 1px solid rgba(255,255,255,.08); border-radius: 18px; overflow: hidden; background: rgba(14,14,16,.75); backdrop-filter: blur(6px); }
.sr-compare-row { display: grid; grid-template-columns: 1.2fr 1.6fr 1.6fr; gap: 0; border-top: 1px solid rgba(255,255,255,.06); }
.sr-compare-row:first-child { border-top: none; }
.sr-compare-row > div { padding: 16px 20px; font-size: 14px; color: rgba(255,255,255,.6); line-height: 1.5; }
.sr-compare-row > div:first-child { font-weight: 700; color: rgba(255,255,255,.8); background: rgba(255,255,255,.02); border-right: 1px solid rgba(255,255,255,.06); }
.sr-compare-row > div.sr-compare-us { color: #fff; background: linear-gradient(180deg, rgba(126,217,87,.08), rgba(126,217,87,.03)); border-right: 1px solid rgba(126,217,87,.2); font-weight: 500; }
.sr-compare-head > div { font-size: 11px !important; font-weight: 800 !important; text-transform: uppercase; letter-spacing: .14em; color: rgba(255,255,255,.5) !important; }
.sr-compare-head > div.sr-compare-us { color: #7ed957 !important; }
@media (max-width: 700px) {
  .sr-compare-row { grid-template-columns: 1fr; }
  .sr-compare-row > div { border-right: none !important; border-bottom: 1px solid rgba(255,255,255,.05); }
  .sr-compare-row > div:last-child { border-bottom: none; }
}

/* ---------- STRAIN LANDING PAGE (v24) ---------- */
.sr-strain-page { max-width: 1200px; margin: 0 auto; padding: calc(var(--sr-header-h, 72px) + 40px) 24px 64px; }
.sr-strain-breadcrumb { font-size: 13px; color: rgba(255,255,255,.4); margin-bottom: 18px; }
.sr-strain-breadcrumb a { color: #7ed957; text-decoration: none; }
.sr-strain-hero { display: grid; grid-template-columns: 1.2fr 1fr; gap: 40px; align-items: center; padding: 32px 0 48px; border-bottom: 1px solid rgba(255,255,255,.06); }
.sr-strain-hero h1 { font-size: clamp(34px, 5vw, 58px); font-weight: 800; margin: 0 0 12px; color: #fff; letter-spacing: -.03em; line-height: 1.05; }
.sr-strain-hero .sr-strain-type { display: inline-block; padding: 6px 14px; border-radius: 50px; font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 16px; }
.sr-strain-hero p { font-size: 16px; color: rgba(255,255,255,.65); line-height: 1.65; margin: 0 0 20px; }
.sr-strain-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 20px; }
.sr-strain-stat { padding: 14px; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08); border-radius: 12px; text-align: center; }
.sr-strain-stat-label { font-size: 10px; letter-spacing: .14em; color: rgba(255,255,255,.45); text-transform: uppercase; font-weight: 700; margin-bottom: 4px; }
.sr-strain-stat-val { font-size: 16px; color: #7ed957; font-weight: 800; }
.sr-strain-section { padding: 40px 0; border-bottom: 1px solid rgba(255,255,255,.06); }
.sr-strain-section h2 { font-size: 24px; color: #fff; margin: 0 0 14px; font-weight: 700; }
.sr-strain-section p { color: rgba(255,255,255,.65); font-size: 15px; line-height: 1.7; }
.sr-strain-cta { display: inline-block; padding: 14px 32px; border-radius: 50px; background: linear-gradient(135deg, #7ed957, #166534); color: #fff !important; text-decoration: none; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; font-size: 13px; margin-top: 20px; }
@media (max-width: 800px) { .sr-strain-hero { grid-template-columns: 1fr; } }

/* ========================================================
   v2.6.2 — Camel logo combo + Dense BTC pattern (no compromise)
   ======================================================== */
.sr-logo-combo { display: flex !important; align-items: center !important; gap: 10px !important; height: 64px !important; text-decoration: none !important; max-width: none !important; }
.sr-logo-combo .sr-logo-camel { width: 56px !important; height: 56px !important; max-width: 56px !important; max-height: 56px !important; object-fit: contain !important; flex-shrink: 0 !important; filter: drop-shadow(0 0 12px rgba(126,217,87,.35)); }
.sr-logo-combo .sr-logo-wordmark { height: 44px !important; width: auto !important; max-height: 44px !important; max-width: 200px !important; object-fit: contain !important; flex-shrink: 0 !important; filter: drop-shadow(0 2px 8px rgba(0,0,0,.6)); }
/* v2.9.13.1 — was 88px; reduced to 72px for v1 proportion parity. */
.sr-header { height: 72px !important; padding: 0 24px !important; }
:root { --sr-header-h: 72px !important; }

/* Denser trippy BTC pattern (match silkroadnyc.com density) */
html body { background-image:
  radial-gradient(ellipse 1000px 700px at 15% 10%, rgba(126,217,87,.14), transparent 60%),
  radial-gradient(ellipse 800px 800px at 85% 20%, rgba(130,50,220,.12), transparent 60%),
  radial-gradient(ellipse 700px 900px at 50% 75%, rgba(255,140,60,.08), transparent 60%),
  radial-gradient(ellipse 900px 600px at 75% 95%, rgba(60,180,220,.08), transparent 60%),
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100' height='100'%3E%3Ctext x='50' y='62' font-size='48' text-anchor='middle' fill='%23ffffff' opacity='0.06' font-family='Georgia,serif' font-weight='700'%3E%E0%B8%BF%3C/text%3E%3C/svg%3E") !important;
  background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, repeat !important;
  background-attachment: fixed, fixed, fixed, fixed, fixed !important;
  background-size: auto, auto, auto, auto, 100px 100px !important;
}

/* Category pills row — pull up to just below announcement, silkroadnyc.com style */
.sr-pills { padding: 14px 24px 20px !important; background: linear-gradient(180deg, #0a0a0a, transparent) !important; margin: 0 !important; border-bottom: 1px solid rgba(126,217,87,.08) !important; }
.sr-pill { padding: 8px 18px !important; font-size: 11px !important; border-radius: 50px !important; }

/* Mobile: hide wordmark, keep camel */
@media (max-width: 600px) {
  .sr-logo-combo .sr-logo-wordmark { display: none !important; }
  .sr-logo-combo .sr-logo-camel { width: 44px !important; height: 44px !important; }
  .sr-header { height: 68px !important; padding: 0 16px !important; }
  :root { --sr-header-h: 68px !important; }
}

/* ========================================================
   v2.7.0 — White header to mirror silkroadnyc.com + Matrix cursor blink
   ======================================================== */
@keyframes sr-blink { 50% { opacity: 0; } }

.sr-header-v27 {
  background: #fff !important;
  /* v2.9.13.1 — header tightened 92px → 72px for v1 proportion parity */
  height: 72px !important;
  padding: 0 32px !important;
  border-bottom: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.sr-header-v27 .sr-header-inner {
  display: flex !important;
  align-items: center !important;
  gap: 24px !important;
  max-width: 1500px !important;
  margin: 0 auto !important;
  width: 100% !important;
}
.sr-logo-v27 {
  display: flex !important;
  align-items: center !important;
  height: 68px !important;
  flex-shrink: 0 !important;
  max-width: none !important;
}
.sr-logo-v27 img {
  height: 60px !important;
  width: auto !important;
  max-width: none !important;
  max-height: 60px !important;
  object-fit: contain !important;
  filter: none !important;
}
.sr-nav-v27 {
  display: flex !important;
  align-items: center !important;
  gap: 28px !important;
  flex: 1 !important;
  justify-content: center !important;
}
.sr-nav-v27 a {
  color: #0b0b0b !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  position: relative !important;
  white-space: nowrap !important;
  letter-spacing: .01em !important;
}
.sr-nav-v27 a::after { display: none !important; }
.sr-nav-v27 a:hover { color: #166534 !important; }
.sr-nav-v27 a.sr-nav-drop .sr-caret { font-size: 11px; margin-left: 2px; opacity: .55; }

.sr-header-search {
  display: flex !important;
  align-items: center !important;
  background: #f7f7f9 !important;
  border: 1.5px solid #e5e5e5 !important;
  border-radius: 10px !important;
  overflow: hidden !important;
  width: 300px !important;
  max-width: 300px !important;
  height: 42px !important;
  flex-shrink: 0 !important;
  padding-left: 12px !important;
  transition: border-color .25s ease, box-shadow .25s ease, background-color .25s ease;
}
.sr-header-search:focus-within { border-color: #7ed957 !important; background: #fff !important; box-shadow: 0 0 0 3px rgba(126,217,87,.18); }
.sr-header-search-icon {
  font-size: 17px !important;
  color: #888 !important;
  line-height: 1 !important;
  margin-right: 4px !important;
  transition: color .25s ease;
  font-weight: 700 !important;
}
.sr-header-search:focus-within .sr-header-search-icon { color: #209F48 !important; }
.sr-header-search input[type="search"] {
  flex: 1 !important;
  padding: 10px 12px !important;
  border: none !important;
  outline: none !important;
  background: transparent !important;
  color: #0b0b0b !important;
  font-size: 13.5px !important;
  font-family: 'Poppins', -apple-system, sans-serif !important;
  font-weight: 500 !important;
  min-width: 0 !important;
}
.sr-header-search input[type="search"]::-webkit-search-cancel-button { display: none; }
.sr-header-search input::placeholder { color: #999 !important; font-weight: 400 !important; }
.sr-header-search button {
  height: 100% !important;
  padding: 0 18px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: linear-gradient(135deg,#7ED957,#209F48) !important;
  color: #0a0a0a !important;
  border: none !important;
  cursor: pointer !important;
  flex-shrink: 0 !important;
  font: 700 12px/1 'Poppins', -apple-system, sans-serif !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  transition: filter .15s ease;
}
.sr-header-search button:hover { filter: brightness(1.08); }
.sr-header-search button svg { display: none; }  /* legacy svg hidden */
@media (max-width: 900px) { .sr-header-search { width: 200px !important; max-width: 200px !important; } .sr-header-search-btn-text { display: none; } .sr-header-search button::after { content: '\2315'; font-size: 18px; font-weight: 800; } }
.sr-header-v27 .sr-header-cart-btn { color: #0b0b0b !important; background: transparent !important; padding: 8px !important; position: relative; }
.sr-header-v27 .sr-header-cart-btn:hover { color: #166534 !important; }
.sr-header-v27 .sr-header-cart-btn .sr-cart-badge { background: #7ed957 !important; color: #0b0b0b !important; border: 2px solid #fff !important; }

/* Pills row BELOW the white header (on white bg, then dark pickup strip after) */
.sr-pills { background: #fff !important; padding: 14px 32px 16px !important; border-bottom: 1px solid #f0f0f0 !important; justify-content: center !important; flex-wrap: wrap !important; }
.sr-pill { color: #0b0b0b !important; background: #fff !important; border-color: #7ed957 !important; border-width: 1.5px !important; }
.sr-pill:hover { background: rgba(126,217,87,.08) !important; color: #166534 !important; }
.sr-pill.sr-pill-active { background: linear-gradient(135deg,#7ed957,#166534) !important; color: #fff !important; }

/* Status bar directly below pills: dark pickup strip like silkroadnyc.com */
.sr-status-bar { margin: 0 !important; padding: 0 !important; max-width: none !important; background: #0b0b0b !important; }
.sr-status-inner { background: #0b0b0b !important; box-shadow: none !important; border-radius: 0 !important; border: none !important; padding: 12px 32px !important; justify-content: space-between !important; max-width: 1500px !important; margin: 0 auto !important; }

/* Mobile */
@media (max-width: 900px) {
  .sr-header-v27 { height: 72px !important; padding: 0 16px !important; }
  .sr-logo-v27 img { height: 44px !important; }
  .sr-nav-v27 { display: none !important; }
  .sr-nav-v27.sr-nav-open { display: flex !important; position: absolute; top: 72px; left: 0; right: 0; background: #fff; flex-direction: column; padding: 20px; gap: 18px; border-bottom: 1px solid #eee; z-index: 1001; }
}
@media (max-width: 600px) {
  .sr-header-search { display: none !important; }
  .sr-menu-toggle { color: #0b0b0b !important; display: flex !important; }
}

/* ========================================================
   v2.7.2 — MATCH v1 EXACTLY: camel emblem + script wordmark combo,
   pill text visible with max specificity, spacing parity.
   ======================================================== */

/* Combo logo — camel emblem left, script wordmark right (like silkroadnyc.com) */
a.sr-logo-v27-combo,
.sr-header .sr-logo.sr-logo-v27-combo {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  height: 72px !important;
  flex-shrink: 0 !important;
  max-width: none !important;
  text-decoration: none !important;
  padding: 0 !important;
}
.sr-logo-v27-combo .sr-logo-emblem {
  width: 64px !important;
  height: 64px !important;
  max-width: 64px !important;
  max-height: 64px !important;
  object-fit: contain !important;
  flex-shrink: 0 !important;
  display: block !important;
}
.sr-logo-v27-combo .sr-logo-wordmark {
  height: 54px !important;
  width: auto !important;
  max-height: 54px !important;
  max-width: 260px !important;
  object-fit: contain !important;
  flex-shrink: 0 !important;
  display: block !important;
  filter: none !important;
}

/* MAX-SPECIFICITY pill text visibility — override anything */
body .sr-wrap .sr-pills .sr-pill,
body .sr-wrap .sr-pills a.sr-pill,
.sr-pills > a,
.sr-pills > .sr-pill {
  color: #0b0b0b !important;
  background: #fff !important;
  border: 1.5px solid #7ed957 !important;
  padding: 10px 22px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: .05em !important;
  text-transform: uppercase !important;
  border-radius: 50px !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  white-space: nowrap !important;
  min-height: 36px !important;
  line-height: 1 !important;
}
body .sr-wrap .sr-pills .sr-pill:hover,
.sr-pills > a:hover {
  background: rgba(126,217,87,.08) !important;
  color: #166534 !important;
  border-color: #166534 !important;
}
body .sr-wrap .sr-pills .sr-pill.sr-pill-active,
.sr-pills > a.sr-pill-active {
  background: linear-gradient(135deg,#7ed957,#166534) !important;
  color: #fff !important;
  border-color: transparent !important;
  box-shadow: 0 4px 14px rgba(126,217,87,.35) !important;
}
.sr-pills {
  background: #fff !important;
  padding: 14px 32px 18px !important;
  border-bottom: 1px solid #e8e8e8 !important;
  display: flex !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  gap: 10px !important;
}

/* Mobile logo combo */
@media (max-width: 900px) {
  .sr-logo-v27-combo { gap: 8px !important; height: 56px !important; }
  .sr-logo-v27-combo .sr-logo-emblem { width: 46px !important; height: 46px !important; }
  .sr-logo-v27-combo .sr-logo-wordmark { height: 40px !important; max-width: 160px !important; }
}
@media (max-width: 600px) {
  .sr-logo-v27-combo .sr-logo-wordmark { display: none !important; }
  .sr-logo-v27-combo .sr-logo-emblem { width: 42px !important; height: 42px !important; }
}

/* ========================================================
   v2.7.4 — Master Logo Theme: black header matching Silk Road Nyc
   black-and-green aesthetic from the Canva master logo
   ======================================================== */

/* v2.9.14.21 — REVERTED from dark header to WHITE to match v1 exactly.
   The Silk Road Live script logo is black, so a dark header made it black-on-black
   (invisible). v1 runs a white header with black script — locking that in. */
.sr-header-v27 {
  background: #ffffff !important;
  border-bottom: 1px solid rgba(0,0,0,0.06) !important;
  box-shadow: 0 2px 14px rgba(0,0,0,0.08) !important;
}

/* Master logo renders tall — give it breathing room */
.sr-logo-master {
  display: flex !important;
  align-items: center !important;
  height: 80px !important;
  padding: 4px 0 !important;
  text-decoration: none !important;
  max-width: none !important;
  flex-shrink: 0 !important;
}
.sr-logo-master img {
  height: 72px !important;
  width: auto !important;
  max-height: 72px !important;
  max-width: 260px !important;
  object-fit: contain !important;
  display: block !important;
  filter: drop-shadow(0 0 16px rgba(126,217,87,.25));
}

/* v2.9.14.21 — Nav + cart + search: dark text on WHITE header (v1 parity) */
.sr-nav-v27 a { color: #0b0b0b !important; }
.sr-nav-v27 a:hover { color: #209F48 !important; }

/* Search bar restored to light theme matching white header */
.sr-header-search {
  background: #f7f7f9 !important;
  border: 1.5px solid #e5e5e5 !important;
}
.sr-header-search input[type="search"] { color: #0b0b0b !important; }
.sr-header-search input::placeholder { color: #888 !important; }
.sr-header-search:focus-within { border-color: #7ed957 !important; box-shadow: 0 0 0 3px rgba(126,217,87,.18) !important; background: #fff !important; }

/* Header cart icon dark (v1 parity) */
.sr-header-v27 .sr-header-cart-btn { color: #0b0b0b !important; }
.sr-header-v27 .sr-header-cart-btn:hover { color: #209F48 !important; }

/* Hamburger on white header — dark icon + green border */
.sr-wrap .sr-header-v27 .sr-menu-toggle,
.sr-wrap .sr-header-v27 #sr-menu-toggle { color: #0b0b0b !important; }

/* Pills row: now on dark bg to match */
.sr-pills {
  background: #0a0a0a !important;
  border-bottom: 1px solid rgba(126,217,87,.15) !important;
  padding: 14px 32px 18px !important;
}
body .sr-wrap .sr-pills .sr-pill,
.sr-pills > a {
  background: transparent !important;
  color: #f0f0f0 !important;
  border: 1.5px solid rgba(126,217,87,.4) !important;
}
body .sr-wrap .sr-pills .sr-pill:hover,
.sr-pills > a:hover {
  background: rgba(126,217,87,.12) !important;
  border-color: #7ed957 !important;
  color: #7ed957 !important;
  box-shadow: 0 4px 14px rgba(126,217,87,.25) !important;
}
body .sr-wrap .sr-pills .sr-pill.sr-pill-active,
.sr-pills > a.sr-pill-active {
  background: linear-gradient(135deg,#7ed957,#166534) !important;
  color: #fff !important;
  border-color: transparent !important;
}

/* Mobile adjustments */
@media (max-width: 900px) {
  .sr-logo-master { height: 60px !important; }
  .sr-logo-master img { height: 52px !important; max-width: 180px !important; }
}
@media (max-width: 600px) {
  .sr-logo-master img { max-width: 140px !important; }
}

/* ========================================================
   v2.7.5 — Canva-learned visual polish
   Always-on matrix rain behind dark sections + green flame
   side borders on hero + green smoke drift + dense BTC pattern
   ======================================================== */

/* Matrix rain background layer — always on, low opacity, behind everything else */
.sr-hero-cinematic,
#srnyc-hero {
  position: relative !important;
}
.sr-hero-cinematic::before,
#srnyc-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background:
    repeating-linear-gradient(180deg,
      rgba(126,217,87,.08) 0px,
      rgba(126,217,87,.08) 1px,
      transparent 1px,
      transparent 24px),
    radial-gradient(ellipse 80% 60% at 50% 50%, transparent 0%, rgba(0,0,0,.5) 100%);
  mask-image: linear-gradient(180deg, rgba(0,0,0,.9), rgba(0,0,0,.4));
  -webkit-mask-image: linear-gradient(180deg, rgba(0,0,0,.9), rgba(0,0,0,.4));
  opacity: .6;
}

/* Green flame side borders on hero (Canva "Best Weed in NY" banner signature) */
.sr-hero-cinematic::after,
#srnyc-hero::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(90deg, rgba(126,217,87,.25) 0%, transparent 6%, transparent 94%, rgba(126,217,87,.25) 100%),
    linear-gradient(90deg, rgba(62,255,62,.4) 0%, transparent 3%, transparent 97%, rgba(62,255,62,.4) 100%);
  mix-blend-mode: screen;
  animation: sr-flame-flicker 3s ease-in-out infinite alternate;
  filter: blur(1px);
}
@keyframes sr-flame-flicker {
  0% { opacity: .6; }
  25% { opacity: .9; }
  50% { opacity: .5; }
  75% { opacity: 1; }
  100% { opacity: .7; }
}

/* Green smoke drift overlay on hero */
.sr-hero-cinematic > *,
#srnyc-hero > * { position: relative; z-index: 2; }

/* Add subtle smoke layer */
#srnyc-hero {
  background-image:
    radial-gradient(ellipse 60% 40% at 20% 80%, rgba(126,217,87,.06) 0%, transparent 60%),
    radial-gradient(ellipse 50% 50% at 80% 20%, rgba(62,255,62,.04) 0%, transparent 60%),
    linear-gradient(180deg,#0a0a0a 0%,#111 50%,#1a1a1a 100%) !important;
  animation: sr-smoke-drift 16s ease-in-out infinite alternate;
}
@keyframes sr-smoke-drift {
  0% { background-position: 0% 0%, 0% 0%, 0% 0%; }
  100% { background-position: 6% -4%, -8% 5%, 0% 0%; }
}

/* DENSER BTC ฿ pattern — matches Canva "Best Weed in NY" + Brick by Brick density */
html body {
  background-image:
    radial-gradient(ellipse 1000px 700px at 15% 10%, rgba(126,217,87,.14), transparent 60%),
    radial-gradient(ellipse 800px 800px at 85% 20%, rgba(130,50,220,.10), transparent 60%),
    radial-gradient(ellipse 700px 900px at 50% 75%, rgba(62,255,62,.08), transparent 60%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Ctext x='40' y='58' font-size='52' text-anchor='middle' fill='%23ffffff' opacity='0.10' font-family='Georgia,serif' font-weight='900'%3E%E0%B8%BF%3C/text%3E%3C/svg%3E") !important;
  background-repeat: no-repeat, no-repeat, no-repeat, repeat !important;
  background-attachment: fixed, fixed, fixed, fixed !important;
  background-size: auto, auto, auto, 80px 80px !important;
}

/* ========================================================
   v2.7.6 — Pills match silkroadnyc.com (v1) exactly
   White band with dark text + green-outlined pills
   Sits between black header and dark hero (sandwich look)
   ======================================================== */
body .sr-wrap .sr-pills,
.sr-pills {
  background: #ffffff !important;
  background-image: none !important;
  padding: 18px 32px 20px !important;
  border-top: 1px solid #e8e8e8 !important;
  border-bottom: 1px solid #e8e8e8 !important;
  display: flex !important;
  justify-content: center !important;
  flex-wrap: nowrap !important;
  overflow-x: auto !important;
  gap: 12px !important;
  scrollbar-width: none;
}
body .sr-wrap .sr-pills::-webkit-scrollbar, .sr-pills::-webkit-scrollbar { display: none; }

body .sr-wrap .sr-pills .sr-pill,
body .sr-wrap .sr-pills a.sr-pill,
.sr-pills > a,
.sr-pills > a.sr-pill {
  background: #ffffff !important;
  color: #0b0b0b !important;
  border: 1.5px solid #7ed957 !important;
  padding: 12px 24px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: .06em !important;
  text-transform: uppercase !important;
  border-radius: 50px !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  white-space: nowrap !important;
  line-height: 1 !important;
  transition: all .25s ease !important;
  box-shadow: none !important;
  flex-shrink: 0 !important;
}
body .sr-wrap .sr-pills .sr-pill:hover,
.sr-pills > a:hover {
  background: rgba(126,217,87,.1) !important;
  color: #166534 !important;
  border-color: #166534 !important;
  transform: translateY(-1px);
}
body .sr-wrap .sr-pills .sr-pill.sr-pill-active,
.sr-pills > a.sr-pill-active {
  background: linear-gradient(135deg,#7ed957,#166534) !important;
  color: #ffffff !important;
  border-color: transparent !important;
  box-shadow: 0 4px 14px rgba(126,217,87,.35) !important;
}

/* ========================================================
   v2.7.7 — REAL BTC SVG pattern everywhere + kill stuck watermark
   ======================================================== */

/* v2.7.21 — BTC pattern REMOVED from body per Sohan. Galaxy canvas owns the bg.
   Body = deep space navy gradient only; BTC lives on footer + age gate. */
html body {
  background-color: #131833 !important;
  background-image:
    radial-gradient(ellipse 1200px 900px at 15% 10%, rgba(126,217,87,.16), transparent 58%),
    radial-gradient(ellipse 900px 900px at 85% 25%, rgba(130,70,220,.14), transparent 58%),
    radial-gradient(ellipse 900px 1100px at 50% 80%, rgba(62,255,62,.08), transparent 60%),
    linear-gradient(180deg, #131833 0%, #181f40 50%, #1d254b 100%) !important;
  background-repeat: no-repeat, no-repeat, no-repeat, no-repeat !important;
  background-attachment: fixed, fixed, fixed, fixed !important;
  background-size: auto, auto, auto, auto !important;
}

/* Kill the stuck-middle hero watermark — causes "funny middle logo" artifact */
.sr-hero-watermark,
#srnyc-hero img[style*="watermark"],
.sr-hero-cinematic > img:not(.sr-logo):not(.sr-card-img):not(.sr-special-card img):not(.sr-hero-feat-img img) {
  display: none !important;
}
#srnyc-hero > div[style*="opacity:0.05"],
#srnyc-hero > div[style*="opacity: 0.05"] {
  display: none !important;
}
#srnyc-hero [style*="SR-Logo-Footer"] {
  display: none !important;
}

/* Apply BTC pattern + green aura to age gate background */
.age-gate__background-color,
/* v2.9.12.7 — Age gate overrides REMOVED. The v1-matching rules at ~line 1049
   are now the single source of truth (SR-Hero.webp cover, no BTC pattern,
   transparent card on image, v1 button sizing). Keeping the v1 rules beats
   the BTC-pattern version for pixel parity with silkroadnyc.com. */
body.age-gate-open {
  background: #000 !important;
  background-image: none !important;
}

/* Fix modal readability bug — dark on dark title */
.sr-modal-name,
.sr-modal h2,
.sr-modal-brand,
.sr-modal-price,
.sr-modal-desc {
  color: #fff !important;
}
.sr-modal-brand { color: rgba(255,255,255,.55) !important; }
.sr-modal-price { color: #7ed957 !important; font-size: 28px !important; font-weight: 800 !important; }
.sr-modal-desc { color: rgba(255,255,255,.75) !important; }
.sr-modal-info-col { background: #0b0b0b !important; padding: 32px !important; }
.sr-modal-content { background: #0b0b0b !important; }

/* ========================================================
   v2.7.9 — Clean gradient body + sparse gray BTC ONLY in
   specific banner/hero contexts. Text sections get solid dark.
   Matches v1 v1 density (sparse, subtle watermark style)
   ======================================================== */

/* v2.7.20 — let the new deep-space navy from top of file win (was forcing #08080b with !important) */
html body.__sr-old-bg-disabled {
  background-color: #08080b !important;
  background-image:
    radial-gradient(ellipse 1200px 800px at 20% 10%, rgba(126,217,87,.10), transparent 60%),
    radial-gradient(ellipse 1000px 1000px at 85% 30%, rgba(130,50,220,.06), transparent 60%),
    radial-gradient(ellipse 900px 1100px at 50% 85%, rgba(62,255,62,.05), transparent 60%),
    linear-gradient(180deg, #08080b 0%, #0c0c10 50%, #08080b 100%) !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;
  background-size: auto !important;
}

/* Hero gets the sparse BTC pattern as WATERMARK — low opacity, gray, spaced */
#srnyc-hero,
.sr-hero-cinematic {
  background-color: #0a0a0a !important;
  background-image: url("https://u8l.335.myftpupload.com/wp-content/uploads/2026/04/SR-BTC-Pattern.svg?v=2721") !important;
  background-repeat: repeat !important;
  background-size: 320px 320px !important;
  background-attachment: local !important;
}

/* Status strip + announcement + footer = solid dark, NO pattern */
.sr-announce,
.sr-status-bar,
.sr-status-inner,
.sr-footer {
  background-image: none !important;
  background-color: #0a0a0a !important;
}

/* Lounge + events + ig + press + about + why-us sections: solid dark gradient, no pattern */
.sr-lounge-section,
.sr-events-section,
.sr-igf-section,
.sr-press-section,
.sr-about-v23,
.sr-whyus-section,
.sr-seo-about,
.sr-newsletter,
.sr-about,
.sr-faq,
.sr-signup-inner,
.sr-stats {
  background-image: linear-gradient(180deg, #0a0a0a, #0e0e10) !important;
}

/* Kill leftover pseudo-element patterns that were layering extra junk */
.sr-wrap::before,
.sr-wrap::after {
  display: none !important;
}

/* Kill any old body::before/::after starfield that made the mess worse */
body::before,
body::after {
  display: none !important;
}

/* Pills row stays white (v2.7.6) - no override needed */

/* v2.9.10 — specials section stays dark-brand, no light-green fallback */
.sr-specials-section.sr-legacy-mint { background: #e8f7dd !important; background-image: none !important; }

/* ========================================================
   v2.7.10 — v1 EXACT pattern: large gray ₿ brick-tiled
   + big spinning Silk Road script watermark behind age gate
   ======================================================== */

/* Update tile size to match the new SVG (400x400 for brick-offset) */
#srnyc-hero,
.sr-hero-cinematic {
  background-image: url("https://u8l.335.myftpupload.com/wp-content/uploads/2026/04/SR-BTC-Pattern.svg?v=2721") !important;
  background-repeat: repeat !important;
  background-size: 400px 400px !important;
}

/* v2.9.12.7 — REMOVED layered-BTC/wordmark age gate override. v1 parity via
   single SR-Hero.webp cover rule at line 1049 is now the canonical source. */
/* v2.9.12.7 — REMOVED (was BTC pattern; v1-parity SR-Hero.webp at line 1049 wins) */

/* ========================================================
   v2.7.11 — Hero mirrors silkroadnyc.com EXACTLY
   Big Silk Road script watermark behind + smoke/mist atmosphere
   BTC pattern ONLY on age gate (removed from hero)
   ======================================================== */

/* HERO: remove the BTC pattern. Apply v1's structure:
   - Dark gradient bg
   - Giant SR script wordmark watermark centered, very faded
   - Soft green smoke/mist radial overlays (aurora glow)
   - Grainy noise for depth (optional) */
#srnyc-hero,
.sr-hero-cinematic {
  background-color: #0a0a0a !important;
  background-image:
    radial-gradient(ellipse 70% 55% at 50% 50%, rgba(126,217,87,.05) 0%, transparent 70%),
    radial-gradient(ellipse 50% 40% at 20% 80%, rgba(62,255,62,.04) 0%, transparent 60%),
    radial-gradient(ellipse 45% 45% at 85% 20%, rgba(130,50,220,.04) 0%, transparent 60%),
    url("https://u8l.335.myftpupload.com/wp-content/uploads/2026/04/SR-Logo-Footer.webp"),
    linear-gradient(180deg, #0a0a0a 0%, #0d0d10 50%, #111115 100%) !important;
  background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, no-repeat !important;
  background-position: center, left center, right top, center center, center !important;
  background-size:
    auto,
    auto,
    auto,
    min(900px, 80%) auto,
    auto !important;
  background-attachment: local !important;
}

/* Slight green smoke-drift animation on hero for atmosphere */
#srnyc-hero::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  background:
    radial-gradient(ellipse 60% 40% at 30% 100%, rgba(126,217,87,.08), transparent 65%),
    radial-gradient(ellipse 55% 35% at 70% 0%, rgba(62,255,62,.05), transparent 65%) !important;
  mix-blend-mode: screen !important;
  animation: sr-smoke-drift 16s ease-in-out infinite alternate !important;
  display: block !important;
}
.sr-hero-cinematic::before,
.sr-hero-cinematic::after {
  display: none !important;
}

/* Fade the giant wordmark to really low opacity so products pop */
#srnyc-hero {
  position: relative !important;
}

/* Slight overlay to desaturate + tone down the watermark bleed-through */
#srnyc-hero::after {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background:
    linear-gradient(180deg, rgba(10,10,10,.6) 0%, rgba(10,10,10,.35) 50%, rgba(10,10,10,.75) 100%) !important;
  display: block !important;
}

/* Keep hero content above the atmospheric layers */
#srnyc-hero > *,
.sr-hero-cinematic > * {
  position: relative !important;
  z-index: 2 !important;
}

/* Kill any tiled BTC bg on hero - was v2.7.10 bug */
#srnyc-hero { background-image: none !important; }
/* Re-apply the layered bg (cascade trick) */
#srnyc-hero {
  background-image:
    radial-gradient(ellipse 70% 55% at 50% 50%, rgba(126,217,87,.06) 0%, transparent 70%),
    url("https://u8l.335.myftpupload.com/wp-content/uploads/2026/04/SR-Logo-Footer.webp"),
    linear-gradient(180deg, #0a0a0a 0%, #0d0d10 60%, #111115 100%) !important;
  background-repeat: no-repeat, no-repeat, no-repeat !important;
  background-position: center, center center, center !important;
  background-size: auto, min(900px, 75%) auto, auto !important;
  background-attachment: local !important;
  background-blend-mode: normal, overlay, normal !important;
}

/* ========================================================
   v2.7.12 — Match v1 FAQ (white bg, dark text) + Footer (BTC pattern)
   ======================================================== */

/* FAQ section: WHITE bg with dark text, matches v1 "Silk Road Cannabis FAQs" */
body .sr-wrap .sr-faq,
.sr-faq {
  background: #ffffff !important;
  background-image: none !important;
  color: #0b0b0b !important;
  border: none !important;
  border-radius: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 64px 24px !important;
}
body .sr-wrap .sr-faq h2 {
  color: #0b0b0b !important;
  font-size: 32px !important;
  font-weight: 800 !important;
  text-align: center !important;
}
body .sr-wrap .sr-faq > p {
  color: #555 !important;
  text-align: center !important;
}
body .sr-wrap .sr-faq .sr-faq-item {
  border-bottom: 1px solid #e5e5e5 !important;
  background: transparent !important;
  max-width: 900px !important;
  margin: 0 auto !important;
}
body .sr-wrap .sr-faq .sr-faq-q {
  color: #0b0b0b !important;
  font-size: 17px !important;
  font-weight: 600 !important;
  padding: 20px 0 !important;
}
body .sr-wrap .sr-faq .sr-faq-q:hover { color: #166534 !important; }
body .sr-wrap .sr-faq .sr-faq-q::after {
  background: transparent !important;
  color: #0b0b0b !important;
  border: 1px solid #d0d0d0 !important;
  font-size: 20px !important;
  width: 28px !important;
  height: 28px !important;
}
body .sr-wrap .sr-faq-open .sr-faq-q::after {
  background: #7ed957 !important;
  color: #fff !important;
  border-color: transparent !important;
}
body .sr-wrap .sr-faq .sr-faq-a {
  color: #444 !important;
  background: transparent !important;
}

/* Footer: BLACK bg with BTC pattern tiled + large script wordmark edge */
body .sr-wrap .sr-footer,
.sr-footer {
  background-color: #0a0a0a !important;
  background-image: url("https://u8l.335.myftpupload.com/wp-content/uploads/2026/04/SR-BTC-Pattern.svg?v=2721") !important;
  background-repeat: repeat !important;
  background-size: 400px 400px !important;
  position: relative;
  overflow: hidden;
  padding: 64px 32px 32px !important;
}
.sr-footer::before {
  content: '' !important;
  position: absolute;
  inset: 0;
  z-index: 0;
  background: linear-gradient(180deg, rgba(10,10,10,.55) 0%, rgba(10,10,10,.4) 50%, rgba(10,10,10,.85) 100%);
  pointer-events: none;
}
.sr-footer > * { position: relative; z-index: 1; }
.sr-footer-col h4 { color: #fff !important; }
.sr-footer-col a { color: rgba(255,255,255,.75) !important; }
.sr-footer-col a:hover { color: #7ed957 !important; }
.sr-footer-bottom { color: rgba(255,255,255,.5) !important; border-top-color: rgba(255,255,255,.1) !important; }

/* ========================================================
   v2.7.13 — Crisp footer layout + FAQ decorative watermark
   ======================================================== */

/* FAQ: add decorative big faded Silk Road wordmark on right edge (matches v1) */
body .sr-wrap .sr-faq {
  position: relative !important;
  overflow: hidden !important;
}
body .sr-wrap .sr-faq::before {
  content: '' !important;
  position: absolute;
  right: -15%;
  top: 50%;
  transform: translateY(-50%);
  width: 500px;
  height: 500px;
  background: url("https://u8l.335.myftpupload.com/wp-content/uploads/2026/04/SR-Logo-Footer.webp") no-repeat center;
  background-size: contain;
  opacity: 0.05;
  filter: grayscale(1);
  pointer-events: none;
  z-index: 0;
}
body .sr-wrap .sr-faq > * { position: relative; z-index: 1; }

/* Footer layout polish */
/* v2.8.1 — 5-column footer (Logo · Shop · About · Hours · Contact) */
.sr-footer-inner {
  display: grid !important;
  grid-template-columns: 1.3fr 1fr 1fr 1.2fr 1.1fr !important;
  gap: 40px !important;
  max-width: 1400px !important;
  margin: 0 auto !important;
  align-items: start !important;
}
@media (max-width: 1100px) {
  .sr-footer-inner { grid-template-columns: 1fr 1fr 1fr !important; gap: 32px !important; }
}
.sr-footer-col.sr-footer-logo img {
  max-width: 240px !important;
  height: auto !important;
  margin-bottom: 20px !important;
  display: block;
}
.sr-footer-social {
  display: flex !important;
  gap: 12px !important;
}
.sr-footer-social a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  border: 1px solid rgba(255,255,255,.2) !important;
  color: #fff !important;
  padding: 0 !important;
  background: transparent !important;
}
.sr-footer-social a:hover {
  background: #7ed957 !important;
  border-color: #7ed957 !important;
  color: #0a0a0a !important;
  padding: 0 !important;
}

.sr-footer-col h4 {
  font-size: 18px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: #fff !important;
  margin: 0 0 16px !important;
}
.sr-footer-col a {
  color: rgba(255,255,255,.7) !important;
  font-size: 14px !important;
  padding: 5px 0 !important;
  display: block;
  text-decoration: none !important;
}
.sr-footer-col a:hover { color: #7ed957 !important; padding-left: 0 !important; }

.sr-footer-hours {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
}
.sr-footer-hours > div {
  display: flex !important;
  justify-content: space-between !important;
  font-size: 13px !important;
  color: rgba(255,255,255,.75) !important;
  padding: 2px 0 !important;
  gap: 16px !important;
}
.sr-footer-hours span:first-child { font-weight: 600; color: #fff; }

.sr-footer-bottom {
  max-width: 1400px !important;
  margin: 32px auto 0 !important;
  padding-top: 24px !important;
  border-top: 1px solid rgba(255,255,255,.1) !important;
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  gap: 20px !important;
  flex-wrap: wrap !important;
  font-size: 12px !important;
  color: rgba(255,255,255,.55) !important;
}
.sr-footer-legal a { color: rgba(255,255,255,.7) !important; text-decoration: none; }
.sr-footer-legal a:hover { color: #7ed957 !important; }

@media (max-width: 900px) {
  .sr-footer-inner { grid-template-columns: 1fr 1fr !important; gap: 32px !important; }
  .sr-footer-bottom { flex-direction: column; text-align: center; }
}
@media (max-width: 600px) {
  .sr-footer-inner { grid-template-columns: 1fr !important; gap: 28px !important; }
}

/* ========================================================
   v2.7.14 — BTC pattern now matches user's exact reference
   (white ₿, -10° tilt, brick offset 240x240 tile)
   Apply on hero section + footer, with fade-to-dark gradient overlay
   ======================================================== */

/* Update tile size everywhere */
#srnyc-hero,
.sr-hero-cinematic {
  background-color: #0a0a0a !important;
  background-image:
    linear-gradient(135deg, rgba(10,10,10,.3) 0%, rgba(10,10,10,.85) 100%),
    url("https://u8l.335.myftpupload.com/wp-content/uploads/2026/04/SR-BTC-Pattern.svg?v=2721"),
    radial-gradient(ellipse 70% 55% at 50% 50%, rgba(126,217,87,.08) 0%, transparent 70%),
    linear-gradient(180deg, #0a0a0a 0%, #0d0d10 60%, #0a0a0a 100%) !important;
  background-repeat: no-repeat, repeat, no-repeat, no-repeat !important;
  background-size: auto, 240px 240px, auto, auto !important;
  background-position: center, 0 0, center, center !important;
  background-attachment: local !important;
}

/* Footer gets same pattern with darker overlay */
body .sr-wrap .sr-footer,
.sr-footer {
  background-color: #0a0a0a !important;
  background-image:
    linear-gradient(135deg, rgba(10,10,10,.35) 0%, rgba(10,10,10,.9) 100%),
    url("https://u8l.335.myftpupload.com/wp-content/uploads/2026/04/SR-BTC-Pattern.svg?v=2721") !important;
  background-repeat: no-repeat, repeat !important;
  background-size: auto, 240px 240px !important;
}

/* v2.9.12.7 — REMOVED age-gate BTC-pattern override (conflicted with v1-parity
   SR-Hero.webp at line 1049). Age gate bg is now that single source of truth. */

/* ============================================================
   v2.7.20 — PRODUCT MODAL rebuild (qty buttons green, clean layout)
   ============================================================ */
.sr-modal-qty-row {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 20px 0 16px;
}
.sr-qty-btn {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  border: 1.5px solid rgba(126,217,87,.35);
  background: rgba(126,217,87,.08);
  color: #7ed957;
  font-size: 20px;
  font-weight: 700;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background .25s, border-color .25s, transform .15s;
  font-family: inherit;
  padding: 0;
  line-height: 1;
}
.sr-qty-btn:hover {
  background: rgba(126,217,87,.18);
  border-color: #7ed957;
}
.sr-qty-btn:active { transform: scale(.95); }
.sr-qty-val {
  min-width: 48px;
  text-align: center;
  font-size: 17px;
  font-weight: 700;
  color: #fff;
}
.sr-modal-add-btn {
  display: block;
  width: 100%;
  padding: 15px 20px;
  border-radius: 12px;
  border: none;
  background: linear-gradient(135deg, #7ed957, #166534);
  color: #fff;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: .4px;
  cursor: pointer;
  transition: transform .2s, box-shadow .25s;
  font-family: inherit;
  box-shadow: 0 6px 20px rgba(126,217,87,.25);
}
.sr-modal-add-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 10px 28px rgba(126,217,87,.4);
}
.sr-modal-add-btn:active { transform: translateY(0); }

/* Modal layout cleanup — description + effects + related */
.sr-modal-content {
  display: grid !important;
  grid-template-columns: minmax(280px, 420px) 1fr;
  gap: 0;
  min-height: auto !important;
}
.sr-modal-img-col {
  background: #12142a !important;
  min-height: 380px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 32px;
}
.sr-modal-img-col img {
  width: 100% !important;
  height: auto !important;
  max-height: 400px;
  object-fit: contain !important;
  border-radius: 14px;
}
.sr-modal-info-col {
  background: #0b0b0b !important;
  padding: 32px 32px 24px !important;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
.sr-modal-brand {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: #7ed957 !important;
  margin-bottom: 6px;
}
.sr-modal-name {
  font-size: 22px !important;
  line-height: 1.25;
  font-weight: 800;
  margin: 0 0 14px !important;
}
.sr-modal-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 16px;
}
.sr-modal-variants {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 10px 0 8px;
}
.sr-modal-variant-btn.sr-variant-active {
  background: rgba(126,217,87,.18) !important;
  border-color: #7ed957 !important;
  color: #7ed957 !important;
}
.sr-modal-desc {
  padding: 24px 32px 32px !important;
  border-top: 1px solid rgba(255,255,255,.08);
  font-size: 14.5px;
  line-height: 1.65;
  grid-column: 1 / -1;
}
.sr-modal-desc:empty { display: none; }

/* v2.7.26 — FIX modal centering + backdrop.
   `.sr-modal` is the FIXED full-viewport flex container (must stay full-width).
   `.sr-modal-content` is the actual dialog — max-width goes HERE. */
.sr-modal {
  max-width: none !important;
  width: auto !important;
  height: auto !important;
  max-height: none !important;
}
.sr-modal-content {
  max-width: 900px !important;
  max-height: 90vh !important;
  width: 100% !important;
  overflow-y: auto !important;
  border-radius: 20px !important;
}
/* Overlay must have a real backdrop */
#sr-modal-overlay.sr-modal-open {
  background: rgba(0,0,0,.65) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
}

@media (max-width: 740px) {
  .sr-modal-content { grid-template-columns: 1fr; }
  .sr-modal-img-col { min-height: 280px; padding: 20px; border-radius: 20px 20px 0 0; }
  .sr-modal-info-col { padding: 24px 22px 20px !important; }
}

/* ============================================================
   v2.7.22 — FINAL body bg override. Galaxy-only, BTC NOT on body.
   Appended last so it wins against all the earlier html body rules.
   ============================================================ */
html body,
body.home,
html body.page,
body.page-id-32,
body.page-id-33 {
  /* v2.7.23 — DARK space (was #131833 navy-blue, too light per Sohan) */
  background-color: #06080f !important;
  background-image:
    radial-gradient(ellipse 1000px 700px at 15% 8%, rgba(126,217,87,.10), transparent 60%),
    radial-gradient(ellipse 900px 900px at 85% 28%, rgba(130,70,220,.09), transparent 60%),
    radial-gradient(ellipse 800px 1000px at 50% 85%, rgba(62,255,62,.04), transparent 62%),
    linear-gradient(180deg, #05070e 0%, #080b17 55%, #0b0f1e 100%) !important;
  background-repeat: no-repeat !important;
  background-attachment: fixed !important;
  background-size: auto !important;
  background-position: center !important;
}
html body::before,
html body::after {
  background-image: none !important;
  background: none !important;
}

/* ============================================================
   v2.7.22 — HERO Matrix digital rain (0s and 1s falling green)
   Canvas injected into #srnyc-hero via JS (hero-matrix.js).
   CSS here sizes the canvas + keeps content above it.
   ============================================================ */
#srnyc-hero,
.sr-hero-cinematic,
.sr-hero {
  position: relative;
  overflow: hidden;
}
.sr-hero-matrix-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 0;
  opacity: 0.38; /* v2.7.23 softer */
  mix-blend-mode: screen;
}
#srnyc-hero-grid > *:not(.sr-hero-matrix-canvas),
#srnyc-hero > *:not(.sr-hero-matrix-canvas),
.sr-hero-cinematic > *:not(.sr-hero-matrix-canvas),
.sr-hero > *:not(.sr-hero-matrix-canvas) {
  position: relative;
  z-index: 2;
}
/* Boost hero smoke visibility on top of matrix */
#srnyc-hero::before, .sr-hero-cinematic::before, .sr-hero::before,
#srnyc-hero::after, .sr-hero-cinematic::after, .sr-hero::after {
  z-index: 1 !important;
}
@media (prefers-reduced-motion: reduce) {
  .sr-hero-matrix-canvas { display: none; }
}

/* ============================================================
   v2.7.27 — FUTURISTIC DARK GLASS SYSTEM
   Replaces blasting white panels with dark translucent glass.
   Menu wrapper + product cards + modal all get the same treatment.
   ============================================================ */

/* Menu page main container — frosted dark glass sitting on galaxy */
.sr-menu-wrap,
#sr-menu-app > .sr-menu-wrap {
  background: linear-gradient(180deg, rgba(14,18,36,0.82) 0%, rgba(10,13,28,0.86) 100%) !important;
  backdrop-filter: blur(28px) saturate(130%);
  -webkit-backdrop-filter: blur(28px) saturate(130%);
  border: 1px solid rgba(126,217,87,0.18);
  border-radius: 24px;
  box-shadow: 0 24px 80px rgba(0,0,0,0.55),
              inset 0 1px 0 rgba(255,255,255,0.05);
  padding: 28px !important;
  margin: 24px auto;
  max-width: 1380px;
  position: relative;
  overflow: hidden;
  z-index: 2;
}
/* HUD corner-bracket accents on menu wrap */
.sr-menu-wrap::before,
.sr-menu-wrap::after {
  content: '';
  position: absolute;
  width: 40px;
  height: 40px;
  border: 1.5px solid rgba(126,217,87,0.45);
  pointer-events: none;
}
.sr-menu-wrap::before {
  top: -1px;
  left: -1px;
  border-right: none;
  border-bottom: none;
  border-top-left-radius: 24px;
}
.sr-menu-wrap::after {
  bottom: -1px;
  right: -1px;
  border-left: none;
  border-top: none;
  border-bottom-right-radius: 24px;
}

/* Sidebar — dark glass sub-panel */
.sr-menu-sidebar {
  background: rgba(8,11,22,0.6) !important;
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 18px !important;
  padding: 18px !important;
  color: rgba(255,255,255,0.85);
}
.sr-menu-sidebar .sr-filter-label {
  color: rgba(255,255,255,0.55) !important;
  font-size: 11px;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  font-weight: 700;
  margin: 18px 0 8px;
}
.sr-menu-sidebar .sr-filter-btn {
  background: rgba(255,255,255,0.02) !important;
  color: rgba(255,255,255,0.7) !important;
  border: 1px solid rgba(255,255,255,0.06) !important;
}
.sr-menu-sidebar .sr-filter-btn:hover {
  background: rgba(126,217,87,0.08) !important;
  border-color: rgba(126,217,87,0.3) !important;
  color: #fff !important;
}
.sr-menu-sidebar .sr-filter-btn.sr-filter-active {
  background: linear-gradient(135deg, rgba(126,217,87,0.22), rgba(46,100,22,0.18)) !important;
  border-color: rgba(126,217,87,0.55) !important;
  color: #b8ff8a !important;
  box-shadow: 0 0 16px rgba(126,217,87,0.18);
}
.sr-menu-search input {
  background: rgba(8,11,22,0.6) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  color: #fff !important;
}
.sr-menu-search input:focus {
  border-color: #7ed957 !important;
  box-shadow: 0 0 0 3px rgba(126,217,87,0.12);
}

/* Menu top bar (Menu > Edibles · 24 products+) */
.sr-menu-wrap .sr-menu-breadcrumb,
.sr-menu-wrap select {
  background: rgba(8,11,22,0.55) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  color: #fff !important;
  border-radius: 10px;
}

/* PRODUCT CARDS — dark glass with HUD top accent.
   (light-panel sections override this below to stay white per v1 rhythm.) */
.sr-card {
  background: linear-gradient(180deg, rgba(18,22,42,0.85) 0%, rgba(10,13,28,0.90) 100%) !important;
  border: 1px solid rgba(126,217,87,0.10) !important;
  color: #fff !important;
  position: relative;
  backdrop-filter: blur(12px);
  overflow: hidden;
  transition: transform .35s var(--sr-ease), border-color .35s var(--sr-ease), box-shadow .35s var(--sr-ease) !important;
}
.sr-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1.5px;
  background: linear-gradient(90deg, transparent 0%, rgba(126,217,87,0.65) 50%, transparent 100%);
  opacity: 0.35;
  transition: opacity .4s var(--sr-ease);
}
.sr-card:hover {
  transform: translateY(-5px);
  border-color: rgba(126,217,87,0.45) !important;
  box-shadow: 0 20px 50px rgba(126,217,87,0.2), 0 0 0 1px rgba(126,217,87,0.15) !important;
}
.sr-card:hover::before { opacity: 1; }
.sr-card .sr-card-img-wrap { background: rgba(255,255,255,0.04) !important; }
.sr-card .sr-card-brand {
  color: rgba(255,255,255,0.55) !important;
  font-size: 11px !important;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  font-weight: 700;
}
.sr-card .sr-card-name { color: #fff !important; font-weight: 700; }
.sr-card .sr-card-price { color: #7ed957 !important; font-size: 17px !important; font-weight: 800 !important; }
.sr-card .sr-card-price-old { color: rgba(255,255,255,0.4) !important; text-decoration: line-through; }

/* Light-panel sections — product cards stay white (v1 style) */
.sr-panel-light .sr-card,
.sr-specials-section .sr-card {
  background: #fff !important;
  color: #0f1511 !important;
  border: 1px solid rgba(10,13,26,0.08) !important;
  backdrop-filter: none;
}
.sr-panel-light .sr-card::before,
.sr-specials-section .sr-card::before { display: none; }
.sr-panel-light .sr-card .sr-card-name,
.sr-specials-section .sr-card .sr-card-name { color: #0f1511 !important; }
.sr-panel-light .sr-card .sr-card-price,
.sr-specials-section .sr-card .sr-card-price { color: #166534 !important; }

/* MODAL — dark glass (was forcing #0b0b0b opaque). Also fix centering bug. */
.sr-modal {
  max-width: none !important;
  width: auto !important;
  height: auto !important;
  max-height: none !important;
}
.sr-modal-content {
  max-width: 920px !important;
  max-height: 88vh !important;
  width: calc(100% - 40px) !important;
  margin: 0 auto !important;
  overflow-y: auto !important;
  border-radius: 22px !important;
  background: linear-gradient(180deg, rgba(14,18,36,0.95) 0%, rgba(8,11,22,0.97) 100%) !important;
  backdrop-filter: blur(28px) saturate(130%);
  -webkit-backdrop-filter: blur(28px) saturate(130%);
  border: 1px solid rgba(126,217,87,0.28) !important;
  box-shadow: 0 30px 100px rgba(0,0,0,0.75), 0 0 0 1px rgba(126,217,87,0.1), inset 0 1px 0 rgba(255,255,255,0.06) !important;
}
.sr-modal-content::before {
  content: '';
  position: absolute;
  top: 0; left: 24px; right: 24px;
  height: 2px;
  background: linear-gradient(90deg, transparent, #7ed957, transparent);
  opacity: 0.5;
  pointer-events: none;
}
.sr-modal-info-col {
  background: transparent !important;
}
.sr-modal-img-col {
  background: rgba(255,255,255,0.03) !important;
  border-right: 1px solid rgba(126,217,87,0.12);
}
#sr-modal-overlay.sr-modal-open {
  background: rgba(0,0,0,0.72) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}
.sr-modal-close {
  background: rgba(255,255,255,0.08) !important;
  color: #fff !important;
  border: 1px solid rgba(255,255,255,0.12) !important;
  width: 36px !important;
  height: 36px !important;
  border-radius: 50% !important;
  font-size: 20px !important;
  transition: background .2s, transform .2s, border-color .2s;
}
.sr-modal-close:hover {
  background: rgba(239,68,68,0.8) !important;
  border-color: rgba(239,68,68,0.6) !important;
  transform: rotate(90deg);
}

/* ============================================================
   v2.7.29 — BREATHING CAMEL + INVERTED TICKER + LIGHTER DARK BG
   ============================================================ */

/* Slightly lighter body (was #06080f, now #0a0e1c) — still dark but less pitch */
html body,
body.home,
html body.page,
body.page-id-32,
body.page-id-33 {
  background-color: #0a0e1c !important;
  background-image:
    radial-gradient(ellipse 1200px 800px at 15% 8%, rgba(126,217,87,.13), transparent 60%),
    radial-gradient(ellipse 1000px 1000px at 85% 28%, rgba(130,70,220,.12), transparent 60%),
    radial-gradient(ellipse 1000px 1100px at 50% 85%, rgba(62,255,62,.06), transparent 62%),
    linear-gradient(180deg, #080c18 0%, #0c1222 55%, #101628 100%) !important;
}

/* Breathing camel — pulses 2.8s, scales + green halo glow */
.sr-header .sr-logo,
.sr-header a[class*="logo"] img,
.sr-header-logo img,
img[alt*="Silk Road"][src*="Logo"],
#sr-logo-img {
  animation: sr-camel-breathe 2.8s ease-in-out infinite;
  transform-origin: center center;
  transition: filter .3s;
}
@keyframes sr-camel-breathe {
  0%, 100% {
    transform: scale(1);
    filter: drop-shadow(0 0 0 rgba(126,217,87,0));
  }
  50% {
    transform: scale(1.06);
    filter: drop-shadow(0 0 14px rgba(126,217,87,.55));
  }
}
@media (prefers-reduced-motion: reduce) {
  .sr-header .sr-logo, #sr-logo-img { animation: none !important; }
}

/* v2.9.14.2 / v2.9.25.21 — Legacy announcement fallback only.
   v1 (silkroadnyc.com) confirmed via Playwright: #000 bg + green "420 AROUND THE WORLD..." text.
   v2.9.25.21 removes broad announce matching and forbidden yellow so stale
   generations cannot bleed into the live May black/white bar. */
.sr-announce,
.sr-announcement,
.sr-header-announce,
.sr-ticker,
.sr-header-announcement {
  background: #000000 !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  letter-spacing: 0.6px !important;
  text-shadow: none !important;
  border-bottom: 1px solid rgba(255,255,255,0.22) !important;
}
.sr-announce a, .sr-announcement a, .sr-header-announce a, .sr-ticker a {
  color: #ffffff !important;
  text-decoration: underline;
  text-underline-offset: 2px;
  font-weight: 800 !important;
}
.sr-announce a:hover, .sr-announcement a:hover { color: #7ED957 !important; }
.sr-ticker-track, .sr-announcement-track, .sr-marquee-track {
  color: #ffffff !important;
}
html body .sr-announce,
html body div.sr-announce,
html body .sr-announce .sr-announce-inner {
  background: #000000 !important;
  background-color: #000000 !important;
  color: #ffffff !important;
}

/* Digital breathing on ORDER ONLINE CTA — subtle */
.sr-hero-cta {
  animation: sr-cta-pulse 3.4s ease-in-out infinite;
}
@keyframes sr-cta-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(126,217,87,0); }
  50% { box-shadow: 0 0 28px rgba(126,217,87,.4), 0 0 0 1px rgba(126,217,87,.3) inset; }
}

/* Subtle digital-glitch flicker on key panels every ~4s */
@keyframes sr-micro-flicker {
  0%, 94%, 100% { opacity: 1; }
  95% { opacity: 0.88; }
  96% { opacity: 1; }
  97% { opacity: 0.92; }
}
.sr-menu-wrap, .sr-modal-content {
  animation: sr-micro-flicker 8s infinite;
}
@media (prefers-reduced-motion: reduce) {
  .sr-menu-wrap, .sr-modal-content, .sr-hero-cta { animation: none !important; }
}

/* ============================================================
   v2.7.31 — AI BUDTENDER FAB + DRAWER (bottom-left)
   Mirrors cart-right but chat-focused, with voice I/O.
   ============================================================ */
.sr-bud-fab {
  position: fixed;
  left: 22px; bottom: 22px;
  z-index: 2000;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 13px 8px 8px;
  border-radius: 50px;
  border: 1px solid rgba(126,217,87,0.5);
  background: linear-gradient(135deg, #7ed957 0%, #166534 100%);
  color: #fff;
  cursor: pointer;
  font-family: inherit;
  font-weight: 800;
  box-shadow: 0 14px 40px rgba(126,217,87,0.35), 0 0 0 1px rgba(126,217,87,0.15) inset;
  animation: sr-bud-fab-pulse 3.2s ease-in-out infinite;
  transition: transform .2s ease;
}
.sr-bud-fab:hover { transform: translateY(-2px) scale(1.02); }
.sr-bud-fab-icon {
  width: 34px; height: 34px;
  border-radius: 50%;
  background: rgba(0,0,0,0.25);
  color: #fff;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid rgba(255,255,255,0.2);
}
.sr-bud-fab-text {
  display: inline-flex; flex-direction: column; align-items: flex-start;
  line-height: 1.1;
}
.sr-bud-fab-eyebrow {
  font-size: 8px; letter-spacing: 1.4px; opacity: .82; font-weight: 700;
}
.sr-bud-fab-label {
  font-size: 12px; font-weight: 800; letter-spacing: .2px;
}
.sr-bud-fab-pulse {
  position: absolute;
  inset: -6px;
  border-radius: 60px;
  border: 1px solid rgba(126,217,87,0.45);
  pointer-events: none;
  animation: sr-bud-fab-ping 2.4s ease-out infinite;
}
@keyframes sr-bud-fab-pulse {
  0%, 100% { box-shadow: 0 14px 40px rgba(126,217,87,0.35); }
  50% { box-shadow: 0 18px 55px rgba(126,217,87,0.55), 0 0 0 8px rgba(126,217,87,0.08); }
}
@keyframes sr-bud-fab-ping {
  0% { opacity: 0.6; transform: scale(1); }
  80%, 100% { opacity: 0; transform: scale(1.35); }
}

/* Drawer */
.sr-bud-drawer {
  position: fixed;
  left: 0; top: 0; bottom: 0;
  width: 420px;
  max-width: 92vw;
  z-index: 2100;
  background: linear-gradient(180deg, rgba(10,14,28,0.96) 0%, rgba(5,8,18,0.98) 100%);
  backdrop-filter: blur(28px) saturate(130%);
  -webkit-backdrop-filter: blur(28px) saturate(130%);
  border-right: 1px solid rgba(126,217,87,0.22);
  box-shadow: 0 30px 100px rgba(0,0,0,0.6), 1px 0 0 rgba(126,217,87,0.08) inset;
  transform: translateX(-105%);
  transition: transform .4s cubic-bezier(.4,0,.2,1);
  display: flex;
  flex-direction: column;
  color: #fff;
  overflow: hidden;
}
.sr-bud-drawer.sr-bud-open { transform: translateX(0); }
.sr-bud-drawer::before {
  content: '';
  position: absolute;
  top: 0; left: 20px; right: 20px;
  height: 2px;
  background: linear-gradient(90deg, transparent, #7ed957, transparent);
  opacity: 0.55;
  pointer-events: none;
}
.sr-bud-close {
  position: absolute; top: 14px; right: 14px;
  width: 34px; height: 34px;
  border-radius: 50%;
  background: rgba(255,255,255,0.08);
  color: #fff;
  border: 1px solid rgba(255,255,255,0.1);
  font-size: 22px; line-height: 1;
  cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  transition: background .2s, transform .2s;
}
.sr-bud-close:hover { background: rgba(239,68,68,.7); transform: rotate(90deg); }

.sr-bud-header {
  padding: 24px 24px 18px;
  border-bottom: 1px solid rgba(126,217,87,0.12);
}
.sr-bud-eyebrow { font-size: 10px; letter-spacing: 2px; color: #7ed957; font-weight: 700; margin-bottom: 4px; }
.sr-bud-title { font-size: 22px; font-weight: 800; color: #fff; letter-spacing: -.2px; }
.sr-bud-sub { font-size: 13px; color: rgba(255,255,255,0.55); margin-top: 6px; line-height: 1.4; }

.sr-bud-messages {
  flex: 1;
  overflow-y: auto;
  padding: 18px 22px;
  display: flex; flex-direction: column;
  gap: 10px;
  scroll-behavior: smooth;
}
.sr-bud-msg {
  max-width: 86%;
  padding: 11px 14px;
  border-radius: 14px;
  font-size: 14px;
  line-height: 1.55;
  word-wrap: break-word;
}
.sr-bud-msg-bot {
  align-self: flex-start;
  background: rgba(126,217,87,0.1);
  border: 1px solid rgba(126,217,87,0.22);
  color: rgba(255,255,255,.92);
  border-bottom-left-radius: 4px;
}
.sr-bud-msg-bot a { text-decoration: underline; text-underline-offset: 2px; }
.sr-bud-msg-bot strong { color: #b8ff8a; }
.sr-bud-picks {
  display: grid;
  gap: 10px;
  margin-top: 12px;
}
.sr-bud-pick {
  display: grid;
  grid-template-columns: 72px 1fr;
  gap: 10px;
  padding: 10px;
  border-radius: 12px;
  background: rgba(255,255,255,0.055);
  border: 1px solid rgba(126,217,87,0.18);
}
.sr-bud-pick img {
  width: 72px;
  height: 72px;
  object-fit: cover;
  border-radius: 10px;
  background: rgba(255,255,255,0.06);
}
.sr-bud-pick-body {
  min-width: 0;
}
.sr-bud-pick-brand {
  margin-bottom: 3px;
  color: #7ed957;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.sr-bud-pick strong {
  display: block;
  color: #fff;
  font-size: 13px;
  line-height: 1.25;
}
.sr-bud-pick-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin: 7px 0 8px;
}
.sr-bud-pick-meta span {
  padding: 3px 6px;
  border-radius: 999px;
  background: rgba(126,217,87,0.12);
  color: rgba(255,255,255,0.82);
  font-size: 10px;
  font-weight: 700;
}
.sr-bud-add {
  appearance: none;
  border: 0;
  border-radius: 999px;
  background: #7ed957;
  color: #081009;
  padding: 7px 11px;
  font-size: 11px;
  font-weight: 900;
  cursor: pointer;
  box-shadow: 0 8px 18px rgba(126,217,87,0.24);
}
.sr-bud-add:hover {
  filter: brightness(1.05);
  transform: translateY(-1px);
}
.sr-bud-note {
  margin-top: 10px;
  color: rgba(255,255,255,0.62);
  font-size: 11px;
  line-height: 1.45;
}
.sr-bud-msg-user {
  align-self: flex-end;
  background: linear-gradient(135deg, #7ed957 0%, #166534 100%);
  color: #fff;
  border: 1px solid rgba(126,217,87,0.5);
  border-bottom-right-radius: 4px;
  font-weight: 600;
}
.sr-bud-typing { display: inline-flex; gap: 5px; align-items: center; padding: 14px 16px; }
.sr-bud-typing span {
  width: 6px; height: 6px; border-radius: 50%;
  background: #7ed957;
  animation: sr-bud-dot 1.2s infinite ease-in-out;
}
.sr-bud-typing span:nth-child(2) { animation-delay: .15s; }
.sr-bud-typing span:nth-child(3) { animation-delay: .3s; }
@keyframes sr-bud-dot {
  0%, 60%, 100% { opacity: .3; transform: translateY(0); }
  30% { opacity: 1; transform: translateY(-4px); }
}

.sr-bud-chips {
  display: flex; flex-wrap: wrap;
  gap: 6px;
  padding: 10px 22px 6px;
  border-top: 1px solid rgba(255,255,255,0.06);
}
.sr-bud-chip {
  padding: 7px 13px;
  border-radius: 30px;
  background: rgba(255,255,255,0.04);
  color: rgba(255,255,255,0.82);
  border: 1px solid rgba(255,255,255,0.08);
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  transition: all .2s;
  font-family: inherit;
}
.sr-bud-chip:hover {
  background: rgba(126,217,87,0.14);
  border-color: rgba(126,217,87,0.45);
  color: #fff;
}

.sr-bud-input-row {
  display: flex;
  gap: 6px;
  padding: 14px 20px 12px;
  border-top: 1px solid rgba(255,255,255,0.06);
  align-items: center;
}
.sr-bud-mic {
  flex: 0 0 42px;
  width: 42px; height: 42px;
  border-radius: 50%;
  background: rgba(126,217,87,0.12);
  border: 1px solid rgba(126,217,87,0.3);
  color: #7ed957;
  cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  transition: all .2s;
}
.sr-bud-mic:hover { background: rgba(126,217,87,.22); }
.sr-bud-mic:disabled { opacity: .35; cursor: not-allowed; }
.sr-bud-mic-active {
  background: rgba(239,68,68,.3) !important;
  border-color: rgba(239,68,68,.6) !important;
  color: #fca5a5 !important;
  animation: sr-bud-mic-rec 1s infinite;
}
@keyframes sr-bud-mic-rec {
  0%, 100% { box-shadow: 0 0 0 0 rgba(239,68,68,.3); }
  50% { box-shadow: 0 0 0 8px rgba(239,68,68,0); }
}
.sr-bud-input {
  flex: 1;
  padding: 12px 16px;
  border-radius: 30px;
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1);
  color: #fff;
  font-family: inherit;
  font-size: 14px;
  outline: none;
}
.sr-bud-input:focus {
  border-color: #7ed957;
  box-shadow: 0 0 0 3px rgba(126,217,87,0.12);
  background: rgba(255,255,255,0.08);
}
.sr-bud-send {
  width: 42px; height: 42px;
  border-radius: 50%;
  background: linear-gradient(135deg, #7ed957 0%, #166534 100%);
  color: #fff;
  border: 0;
  cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  transition: transform .2s;
}
.sr-bud-send:hover { transform: scale(1.08); }

.sr-bud-foot {
  padding: 0 20px 14px;
  text-align: center;
}
.sr-bud-tts {
  padding: 6px 14px;
  font-size: 11px;
  letter-spacing: .5px;
  color: rgba(255,255,255,.55);
  background: transparent;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 20px;
  cursor: pointer;
  font-family: inherit;
  font-weight: 600;
  transition: all .2s;
}
.sr-bud-tts:hover { color: #fff; border-color: rgba(126,217,87,0.4); }
.sr-bud-tts[aria-pressed="true"] {
  color: #7ed957;
  border-color: rgba(126,217,87,0.4);
  background: rgba(126,217,87,0.1);
}

@media (max-width: 640px) {
  .sr-bud-fab {
    left: 12px; bottom: 80px;
    padding: 10px 14px 10px 10px;
  }
  .sr-bud-fab-text { display: none; }
  .sr-bud-drawer { width: 100vw; }
}

/* v2.7.31 — Epic "Built by So$$$" footer credit */
.sr-footer-credit {
  margin: 18px auto 0;
  padding: 14px 24px;
  max-width: 560px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
  border: 1px solid rgba(126,217,87,0.25);
  border-radius: 50px;
  background: linear-gradient(90deg, rgba(126,217,87,0.08), rgba(130,50,220,0.06), rgba(126,217,87,0.08));
  font-size: 12px;
  letter-spacing: .4px;
  position: relative;
  overflow: hidden;
}
.sr-footer-credit::before {
  content: '';
  position: absolute;
  top: 0; left: -100%;
  width: 100%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(126,217,87,0.18), transparent);
  animation: sr-credit-shine 4.5s ease-in-out infinite;
}
@keyframes sr-credit-shine {
  0% { left: -100%; }
  60%, 100% { left: 120%; }
}
.sr-credit-eyebrow {
  font-size: 10px;
  letter-spacing: 2px;
  color: rgba(255,255,255,0.55);
  font-weight: 700;
}
.sr-credit-name {
  font-weight: 900;
  font-size: 14px;
  color: #fff;
  text-decoration: none;
  background: linear-gradient(135deg, #7ed957 0%, #b8ff8a 50%, #7ed957 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: .3px;
  text-shadow: 0 0 20px rgba(126,217,87,0.3);
  position: relative;
}
.sr-credit-name:hover {
  filter: brightness(1.2);
}
.sr-credit-sep {
  color: rgba(126,217,87,0.55);
  font-weight: 700;
}
.sr-credit-mail {
  color: rgba(255,255,255,0.78);
  text-decoration: none;
  border-bottom: 1px dashed rgba(126,217,87,0.4);
  padding-bottom: 1px;
  transition: color .2s;
}
.sr-credit-mail:hover { color: #7ed957; border-bottom-color: #7ed957; }
@media (max-width: 640px) {
  .sr-footer-credit { font-size: 11px; padding: 12px 18px; }
}

/* ============================================================
   v2.7.34 — Weed Logic Engine additions
   Category badge + modal info panel + mobile tweaks
   ============================================================ */
.sr-badge-cat {
  background: rgba(126,217,87,.12) !important;
  color: rgba(255,255,255,.82) !important;
  border: 1px solid rgba(126,217,87,.28);
  text-transform: capitalize;
  letter-spacing: .03em;
}
.sr-modal-info-panel {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 10px 18px;
  padding: 14px 16px;
  margin: 16px 0;
  background: rgba(126,217,87,.06);
  border: 1px solid rgba(126,217,87,.22);
  border-radius: 10px;
  color: rgba(255,255,255,.82);
  font-size: 13px;
  line-height: 1.4;
}
.sr-modal-info-panel div { display:flex; flex-direction:column; gap:3px; }
.sr-modal-info-panel strong { color: #7ed957; font-size: 12px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; }
.sr-modal-desc p { margin: 0 0 10px; line-height: 1.55; }
.sr-modal-desc p:last-child { margin-bottom: 0; }
.sr-modal-desc strong { color: #7ed957; }
.sr-modal-desc em { color: rgba(255,255,255,.55); font-style: italic; }

/* ============================================================
   v2.8.0 — DREAMY VISUAL POLISH (public-facing, disciplined)
   Negative-space only. Never overlays product images.
   Scroll reveals · halo hover · gradient dividers · polished CTA
   ============================================================ */

/* ----- Product cards: luxurious hover (no overlays) ----- */
.sr-card {
  position: relative;
  transition: transform .35s cubic-bezier(.2,1,.3,1), box-shadow .35s ease, border-color .3s;
}
.sr-card:hover {
  transform: translateY(-6px);
  border-color: rgba(126,217,87,.45) !important;
  box-shadow: 0 22px 50px rgba(0,0,0,.5), 0 0 40px rgba(126,217,87,.18), 0 0 0 1px rgba(126,217,87,.25) inset;
}
.sr-card .sr-card-img { transition: transform .6s cubic-bezier(.2,1,.3,1); }
.sr-card:hover .sr-card-img { transform: scale(1.04); }

/* ----- Clean premium Add-To-Cart button ----- */
.sr-card-add-btn {
  position: relative;
  background: linear-gradient(135deg,#7ed957 0%,#209F48 100%) !important;
  color: #0a0f17 !important;
  border: none !important;
  border-radius: 10px !important;
  padding: 9px 16px !important;
  font: 800 12px/1 -apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif !important;
  text-transform: uppercase !important;
  letter-spacing: .06em !important;
  cursor: pointer;
  overflow: hidden;
  isolation: isolate;
  transition: transform .22s ease, box-shadow .22s ease, filter .22s ease !important;
  box-shadow: 0 8px 20px rgba(126,217,87,.22), 0 2px 6px rgba(0,0,0,.2);
}
.sr-card-add-btn::before {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(90deg,transparent 0%,rgba(255,255,255,.35) 50%,transparent 100%);
  transform: translateX(-110%);
  transition: transform .6s cubic-bezier(.2,1,.3,1);
  pointer-events: none; z-index: -1;
}
.sr-card-add-btn:hover {
  transform: translateY(-1px) scale(1.02);
  box-shadow: 0 0 0 3px rgba(126,217,87,.22), 0 14px 30px rgba(126,217,87,.35), 0 0 28px rgba(126,217,87,.2);
  filter: brightness(1.08);
}
.sr-card-add-btn:hover::before { transform: translateX(110%); }
.sr-card-add-btn:active { transform: translateY(0) scale(1); filter: brightness(.96); }
.sr-card-add-btn svg { transition: transform .22s; }
.sr-card-add-btn:hover svg { transform: rotate(-8deg) scale(1.1); }

/* ----- Mood & category cards — luxurious hover ----- */
.sr-mood-card, .sr-category-card {
  transition: transform .4s cubic-bezier(.2,1,.3,1), box-shadow .4s ease;
}
.sr-mood-card:hover, .sr-category-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 20px 44px rgba(0,0,0,.4), 0 0 36px rgba(126,217,87,.2), 0 0 0 1px rgba(126,217,87,.35) inset;
}
.sr-mood-card img, .sr-category-card img { transition: transform .6s cubic-bezier(.2,1,.3,1); }
.sr-mood-card:hover img, .sr-category-card:hover img { transform: scale(1.06); }

/* ----- Special banner cards — halo on hover ----- */
.sr-special-card {
  position: relative;
  transition: transform .4s cubic-bezier(.2,1,.3,1), box-shadow .4s ease;
}
.sr-special-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 26px 60px rgba(0,0,0,.45), 0 0 46px rgba(126,217,87,.18);
}

/* ============================================================
   Scroll-reveal (sections fade up as they scroll into view)
   ============================================================ */
.sr-reveal {
  opacity: 0;
  transform: translateY(32px);
  transition: opacity .9s cubic-bezier(.2,1,.3,1), transform .9s cubic-bezier(.2,1,.3,1);
}
.sr-reveal.sr-revealed { opacity: 1; transform: translateY(0); }
.sr-reveal-stagger > * {
  opacity: 0; transform: translateY(24px);
  transition: opacity .7s cubic-bezier(.2,1,.3,1), transform .7s cubic-bezier(.2,1,.3,1);
}
.sr-reveal-stagger.sr-revealed > *:nth-child(1) { opacity:1; transform:translateY(0); transition-delay:.05s; }
.sr-reveal-stagger.sr-revealed > *:nth-child(2) { opacity:1; transform:translateY(0); transition-delay:.12s; }
.sr-reveal-stagger.sr-revealed > *:nth-child(3) { opacity:1; transform:translateY(0); transition-delay:.19s; }
.sr-reveal-stagger.sr-revealed > *:nth-child(4) { opacity:1; transform:translateY(0); transition-delay:.26s; }
.sr-reveal-stagger.sr-revealed > *:nth-child(5) { opacity:1; transform:translateY(0); transition-delay:.32s; }
.sr-reveal-stagger.sr-revealed > *:nth-child(6) { opacity:1; transform:translateY(0); transition-delay:.38s; }
.sr-reveal-stagger.sr-revealed > *:nth-child(n+7) { opacity:1; transform:translateY(0); transition-delay:.45s; }
@media (prefers-reduced-motion: reduce) {
  .sr-reveal, .sr-reveal-stagger > * { opacity: 1; transform: none; transition: none; }
}

/* ============================================================
   Section dividers — soft gradient shimmer between sections
   (negative space only, never on content)
   ============================================================ */
.sr-section-divider {
  position: relative;
  height: 1px;
  margin: 0 auto;
  max-width: 1200px;
  background: linear-gradient(90deg, transparent 0%, rgba(126,217,87,.3) 50%, transparent 100%);
  overflow: visible;
}
.sr-section-divider::after {
  content: "";
  position: absolute;
  top: -1px; left: 0;
  width: 80px; height: 3px;
  background: linear-gradient(90deg, transparent, #7ed957, transparent);
  filter: blur(2px);
  animation: srDividerSlide 6s ease-in-out infinite;
}
@keyframes srDividerSlide {
  0% { left: 0; opacity: 0; }
  15% { opacity: 1; }
  85% { opacity: 1; }
  100% { left: calc(100% - 80px); opacity: 0; }
}

/* ============================================================
   Section titles — slight gradient + letter-spacing polish
   ============================================================ */
.sr-section-title {
  background: linear-gradient(135deg, #fff 0%, rgba(255,255,255,.75) 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: -.01em;
}
/* Light-bg sections keep dark text */
.sr-panel-light .sr-section-title,
.sr-specials-section .sr-section-title,
.sr-moods-section .sr-section-title {
  background: none !important;
  -webkit-text-fill-color: initial !important;
  color: #111 !important;
}

/* ============================================================
   Primary CTA polish — halo + micro-transform
   ============================================================ */
.sr-menu-load-more,
.sr-signup-cta,
.sr-lounge-cta,
.sr-delivery-cta-primary {
  transition: transform .25s cubic-bezier(.2,1,.3,1), box-shadow .25s ease, filter .2s ease;
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.sr-menu-load-more::before,
.sr-signup-cta::before,
.sr-lounge-cta::before,
.sr-delivery-cta-primary::before {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(90deg,transparent 0%,rgba(255,255,255,.3) 50%,transparent 100%);
  transform: translateX(-110%);
  transition: transform .6s cubic-bezier(.2,1,.3,1);
  pointer-events: none; z-index: -1;
}
.sr-menu-load-more:hover::before,
.sr-signup-cta:hover::before,
.sr-lounge-cta:hover::before,
.sr-delivery-cta-primary:hover::before { transform: translateX(110%); }
.sr-menu-load-more:hover,
.sr-signup-cta:hover,
.sr-lounge-cta:hover,
.sr-delivery-cta-primary:hover {
  transform: translateY(-2px) scale(1.02);
  filter: brightness(1.08);
  box-shadow: 0 18px 44px rgba(126,217,87,.35), 0 0 40px rgba(126,217,87,.25);
}

/* ============================================================
   Loading skeleton — shimmer gradient instead of static grey
   ============================================================ */
.sr-card-skel {
  background: linear-gradient(110deg, rgba(255,255,255,.04) 0%, rgba(255,255,255,.08) 50%, rgba(255,255,255,.04) 100%);
  background-size: 200% 100%;
  animation: srShimmer 1.6s linear infinite;
}
@keyframes srShimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ============================================================
   Hero — subtle content parallax (content floats above background)
   Applied via JS on scroll: --sr-hero-parallax 0..1
   ============================================================ */
#srnyc-hero { transition: background-position .6s ease; }
#srnyc-hero-grid {
  transform: translateY(calc(var(--sr-hero-parallax, 0) * -20px));
  transition: transform .2s linear;
}

/* ============================================================
   Orbital element in hero negative space (subtle, stays out of cards)
   ============================================================ */
.sr-hero-orbit {
  position: absolute;
  top: 50%; left: 8%;
  width: 220px; height: 220px;
  pointer-events: none;
  opacity: .35;
  transform: translateY(-50%);
  z-index: 0;
  display: none; /* show only on wider screens to avoid overlap */
}
@media (min-width: 1400px) {
  .sr-hero-orbit { display: block; }
}
.sr-hero-orbit-ring {
  position: absolute; inset: 0;
  border: 1px dashed rgba(126,217,87,.3);
  border-radius: 50%;
  animation: srOrbitRot 50s linear infinite;
}
.sr-hero-orbit-dot {
  position: absolute;
  top: 50%; left: 50%;
  width: 10px; height: 10px;
  margin: -5px;
  background: #7ed957;
  border-radius: 50%;
  box-shadow: 0 0 14px #7ed957;
  animation: srOrbit 14s linear infinite;
}
@keyframes srOrbitRot { to { transform: rotate(360deg); } }
@keyframes srOrbit {
  from { transform: rotate(0deg) translateX(110px); }
  to { transform: rotate(360deg) translateX(110px); }
}

/* ============================================================
   Scroll progress bar (tiny green line top of viewport)
   ============================================================ */
.sr-scroll-progress {
  position: fixed; top: 0; left: 0;
  height: 2px;
  background: linear-gradient(90deg, #7ed957, #209F48);
  box-shadow: 0 0 8px rgba(126,217,87,.55);
  z-index: 99998;
  width: 0;
  transition: width .08s linear;
  pointer-events: none;
}

/* ============================================================
   v2.8.1 — FAQ subtitle lede (matches v1 copy pattern)
   ============================================================ */
.sr-faq .sr-faq-lede {
  text-align: center;
  color: rgba(255,255,255,.6);
  font-size: 15px;
  line-height: 1.6;
  max-width: 640px;
  margin: -6px auto 28px;
  font-weight: 400;
}
body .sr-wrap .sr-faq .sr-faq-lede { color: rgba(255,255,255,.65) !important; }

/* ============================================================
   v2.8.2 — Product modal trust line (always-rendered, negative-space polish)
   ============================================================ */
.sr-modal-trust {
  margin: 20px 0 4px;
  padding: 12px 16px;
  background: linear-gradient(135deg, rgba(126,217,87,.06), rgba(126,217,87,.02));
  border: 1px solid rgba(126,217,87,.22);
  border-radius: 10px;
  color: rgba(255,255,255,.72);
  font-size: 13px;
  line-height: 1.55;
  letter-spacing: .01em;
}
.sr-modal-trust a {
  color: #7ed957 !important;
  text-decoration: none;
  font-weight: 700;
  border-bottom: 1px dashed rgba(126,217,87,.4);
}
.sr-modal-trust a:hover { color: #98ff6a !important; border-bottom-color: #7ed957; }

/* ============================================================
   v2.8.3 — Product card glassmorphic polish
   Transparency, futuristic gradient, depth on hover
   Disciplined — FX stays in card frame, never overlays product image
   ============================================================ */
.sr-card {
  background: linear-gradient(165deg, rgba(255,255,255,.04) 0%, rgba(255,255,255,.015) 100%) !important;
  backdrop-filter: blur(14px) saturate(140%);
  -webkit-backdrop-filter: blur(14px) saturate(140%);
  border: 1px solid rgba(255,255,255,.06) !important;
  border-radius: 16px !important;
  overflow: hidden;
  position: relative;
  isolation: isolate;
}
.sr-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(126,217,87,.06) 0%, transparent 45%, transparent 75%, rgba(126,217,87,.04) 100%);
  pointer-events: none;
  opacity: 0;
  transition: opacity .45s cubic-bezier(.2,1,.3,1);
  z-index: 0;
  border-radius: inherit;
}
.sr-card:hover::before { opacity: 1; }
.sr-card > * { position: relative; z-index: 1; }
.sr-card .sr-card-body {
  background: linear-gradient(180deg, rgba(8,10,14,.05) 0%, rgba(8,10,14,.28) 100%);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.sr-card .sr-card-img-wrap {
  background: #0d1018;
  overflow: hidden;
  position: relative;
}
/* Futuristic price typography — monospace for authority-grade feel */
.sr-card-price, .sr-card-price-special {
  font-family: ui-monospace, 'SF Mono', Menlo, Consolas, monospace !important;
  font-weight: 800 !important;
  letter-spacing: -.01em !important;
  font-variant-numeric: tabular-nums !important;
}
.sr-card-brand {
  font-size: 10px !important;
  letter-spacing: .18em !important;
  text-transform: uppercase !important;
  color: rgba(126,217,87,.9) !important;
  font-weight: 700 !important;
}
.sr-card-name {
  background: linear-gradient(180deg, #fff 0%, rgba(255,255,255,.88) 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing: -.005em;
}
/* Strain badges — glassy + crisp */
.sr-card .sr-badge {
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  letter-spacing: .04em;
}
.sr-card .sr-badge-indica { background: rgba(15,61,28,.34) !important; border-color: rgba(126,217,87,.4) !important; color: #FFFFFF !important; }
.sr-card .sr-badge-sativa { background: rgba(46,100,22,.22) !important; border-color: rgba(126,217,87,.4) !important; color: #7ED957 !important; }
.sr-card .sr-badge-hybrid { background: rgba(126,217,87,.18) !important; border-color: rgba(126,217,87,.35) !important; color: #c9f5a8 !important; }
.sr-card .sr-badge-thc { background: rgba(126,217,87,.1) !important; border-color: rgba(126,217,87,.3) !important; color: #a3e080 !important; font-variant-numeric: tabular-nums; }
.sr-card .sr-badge-cbd { background: rgba(120,180,230,.12) !important; border-color: rgba(120,180,230,.3) !important; color: #9ec8ee !important; font-variant-numeric: tabular-nums; }

@supports not (backdrop-filter: blur(1px)) {
  .sr-card { background: rgba(18,22,30,.85) !important; }
  .sr-card .sr-card-body { background: rgba(12,15,22,.6); }
}

/* ============================================================
   v2.8.4 — DESIGN TOKEN SYSTEM (single source of truth)
   Palette · Typography · Spacing · Motion · Depth · Radius
   All new rules reference these vars; legacy rules migrate over time.
   ============================================================ */
:root {
  /* --- PALETTE: Primary (signal green, used with intention) --- */
  --sr-green-50:  #E8F5E0;
  --sr-green-100: #C8EAA8;
  --sr-green-200: #A3DD73;
  --sr-green-500: #7ED957;  /* primary brand */
  --sr-green-600: #5FB43A;  /* deep green, solid fills */
  --sr-green-700: #4A8F2B;
  --sr-green-glow: rgba(126,217,87,0.35);

  /* --- PALETTE: Neutrals (near-black with navy warmth) --- */
  --sr-ink-900: #05070C;
  --sr-ink-800: #0A0D14;
  --sr-ink-700: #111622;
  --sr-ink-600: #1A2130;
  --sr-ink-500: #2A3344;

  /* --- PALETTE: Text on dark --- */
  --sr-text-primary:   rgba(255,255,255,0.96);
  --sr-text-secondary: rgba(255,255,255,0.72);
  --sr-text-tertiary:  rgba(255,255,255,0.52);
  --sr-text-muted:     rgba(255,255,255,0.38);

  /* --- PALETTE: Cream (editorial warmth, used sparingly on premium surfaces) --- */
  --sr-cream:     #F5F1E8;
  --sr-cream-dim: rgba(245,241,232,0.82);

  /* --- TYPOGRAPHY --- */
  --sr-font-display: 'Space Grotesk', 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --sr-font-body:    'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --sr-font-serif:   'Instrument Serif', Georgia, 'Times New Roman', serif;
  --sr-font-mono:    ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
  --sr-font-script:  'Pacifico', cursive; /* retained for logo wordmark */

  /* Type scale */
  --sr-fs-xs:   11px;
  --sr-fs-sm:   13px;
  --sr-fs-base: 15px;
  --sr-fs-md:   17px;
  --sr-fs-lg:   20px;
  --sr-fs-xl:   24px;
  --sr-fs-2xl:  clamp(26px, 3vw, 36px);
  --sr-fs-3xl:  clamp(34px, 4.5vw, 52px);
  --sr-fs-hero: clamp(44px, 7vw, 92px);

  /* --- SPACING (4px base) --- */
  --sr-sp-1: 4px;  --sr-sp-2: 8px;   --sr-sp-3: 12px; --sr-sp-4: 16px;
  --sr-sp-5: 24px; --sr-sp-6: 32px;  --sr-sp-7: 48px; --sr-sp-8: 64px;
  --sr-sp-9: 96px; --sr-sp-10: 128px;

  /* --- MOTION --- */
  --sr-ease-out:     cubic-bezier(0.2, 1, 0.3, 1);
  --sr-ease-in-out:  cubic-bezier(0.4, 0, 0.2, 1);
  --sr-ease-bounce:  cubic-bezier(0.34, 1.56, 0.64, 1);
  --sr-dur-fast:     .15s;
  --sr-dur-base:     .3s;
  --sr-dur-slow:     .6s;
  --sr-dur-epic:     1.2s;

  /* --- DEPTH --- */
  --sr-shadow-sm:   0 2px 6px rgba(0,0,0,0.25);
  --sr-shadow-md:   0 8px 20px rgba(0,0,0,0.35);
  --sr-shadow-lg:   0 22px 50px rgba(0,0,0,0.5);
  --sr-shadow-glow: 0 0 48px var(--sr-green-glow);

  /* --- RADIUS --- */
  --sr-radius-sm:   6px;
  --sr-radius-md:   12px;
  --sr-radius-lg:   16px;
  --sr-radius-xl:   24px;
  --sr-radius-pill: 999px;
}

/* ============================================================
   v2.8.4 — BASE TYPOGRAPHY (apply new fonts site-wide)
   High-specificity so legacy rules don't clobber.
   ============================================================ */
html, body { font-family: var(--sr-font-body); font-feature-settings: 'ss01','cv11'; }
.sr-wrap, .sr-wrap p { font-family: var(--sr-font-body); }
.sr-wrap h1, .sr-wrap h2, .sr-wrap h3,
.sr-section-title,
.sr-compare-us, .sr-compare-row > div:first-child {
  font-family: var(--sr-font-display);
  letter-spacing: -0.018em;
  font-feature-settings: 'ss01';
}
.sr-serif, .sr-hero-headline-serif, .sr-accent-serif { font-family: var(--sr-font-serif); font-style: italic; font-weight: 400; letter-spacing: -0.01em; }

/* ============================================================
   v2.8.4 — REDESIGN HERO (editorial, Apple-tier hierarchy)
   Replaces v2.7.x inline-styled hero.
   ============================================================ */
.sr-hero-v284 {
  position: relative;
  overflow: hidden;
  width: 100%;
  padding: clamp(48px, 8vw, 96px) clamp(20px, 4vw, 40px) clamp(40px, 6vw, 72px);
  background:
    radial-gradient(ellipse 90% 70% at 30% 10%, rgba(126,217,87,0.08) 0%, transparent 60%),
    linear-gradient(180deg, var(--sr-ink-900) 0%, var(--sr-ink-800) 40%, var(--sr-ink-700) 100%);
  isolation: isolate;
}
.sr-hero-watermark {
  position: absolute; inset: 50% 0 auto 50%;
  transform: translate(-50%, -50%);
  width: clamp(260px, 40vw, 480px);
  opacity: 0.035;
  pointer-events: none;
  z-index: 0;
}
.sr-hero-watermark img { width: 100%; height: auto; display: block; }
.sr-hero-glow-primary {
  position: absolute; top: -20%; left: -10%;
  width: 55%; height: 160%;
  background: radial-gradient(ellipse at center, rgba(126,217,87,0.10) 0%, transparent 65%);
  pointer-events: none; z-index: 0;
  filter: blur(40px);
}
.sr-hero-glow-accent {
  position: absolute; bottom: -30%; right: -10%;
  width: 45%; height: 120%;
  background: radial-gradient(ellipse at center, rgba(245,241,232,0.04) 0%, transparent 60%);
  pointer-events: none; z-index: 0;
  filter: blur(60px);
}
.sr-hero-grid-v284 {
  position: relative; z-index: 2;
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: clamp(40px, 6vw, 96px);
  max-width: 1400px;
  margin: 0 auto;
  align-items: center;
}
@media (max-width: 980px) {
  .sr-hero-grid-v284 { grid-template-columns: 1fr; gap: 48px; }
}
.sr-hero-col-text { max-width: 680px; }

/* Eyebrow — refined, editorial */
.sr-hero-eyebrow {
  display: inline-block;
  font-family: var(--sr-font-display);
  font-size: var(--sr-fs-xs);
  font-weight: 600;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--sr-green-500);
  padding: 6px 14px;
  border: 1px solid rgba(126,217,87,0.3);
  border-radius: var(--sr-radius-pill);
  margin-bottom: var(--sr-sp-5);
  background: rgba(126,217,87,0.04);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}

/* Headline — massive, confident, editorial */
.sr-hero-headline {
  font-family: var(--sr-font-display) !important;
  font-size: var(--sr-fs-hero) !important;
  font-weight: 700 !important;
  line-height: 0.94 !important;
  letter-spacing: -0.035em !important;
  margin: 0 0 var(--sr-sp-5) !important;
  color: var(--sr-text-primary) !important;
  text-wrap: balance;
}
.sr-hero-headline-serif {
  font-family: var(--sr-font-serif);
  font-style: italic;
  font-weight: 400;
  color: var(--sr-green-500);
  letter-spacing: -0.02em;
  padding-left: 0.02em;
}

/* Subhead — refined body, cream accent */
.sr-hero-subhead {
  font-family: var(--sr-font-body);
  font-size: var(--sr-fs-md);
  font-weight: 400;
  color: var(--sr-text-secondary);
  line-height: 1.45;
  max-width: 56ch;
  margin-bottom: var(--sr-sp-5);
  letter-spacing: 0.002em;
}

/* Mono terminal line — retained character, refined */
.sr-hero-mono {
  display: inline-block;
  font-family: var(--sr-font-mono);
  font-size: var(--sr-fs-xs);
  font-weight: 700;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--sr-green-500);
  text-shadow: 0 0 14px var(--sr-green-glow);
  margin-bottom: var(--sr-sp-6);
}
.sr-hero-cursor { animation: sr-blink 1s infinite; }
@keyframes sr-blink { 50% { opacity: 0; } }

/* CTA pair */
.sr-hero-cta-row { display: flex; flex-wrap: wrap; gap: var(--sr-sp-3); }
.sr-hero-cta-primary {
  display: inline-flex; align-items: center;
  font-family: var(--sr-font-display);
  font-size: var(--sr-fs-base);
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--sr-ink-900) !important;
  background: linear-gradient(135deg, var(--sr-green-500) 0%, var(--sr-green-600) 100%);
  padding: 14px 28px;
  border-radius: var(--sr-radius-md);
  text-decoration: none;
  box-shadow: 0 14px 32px var(--sr-green-glow), 0 2px 6px rgba(0,0,0,.4);
  transition: transform var(--sr-dur-base) var(--sr-ease-out), box-shadow var(--sr-dur-base) var(--sr-ease-out), filter var(--sr-dur-base) var(--sr-ease-out);
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.sr-hero-cta-primary::before {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,.4) 50%, transparent 100%);
  transform: translateX(-110%);
  transition: transform .6s var(--sr-ease-out);
  pointer-events: none; z-index: -1;
}
.sr-hero-cta-primary:hover {
  transform: translateY(-2px) scale(1.02);
  filter: brightness(1.08);
  box-shadow: 0 22px 48px var(--sr-green-glow), 0 4px 10px rgba(0,0,0,.5);
}
.sr-hero-cta-primary:hover::before { transform: translateX(110%); }

.sr-hero-cta-ghost {
  display: inline-flex; align-items: center;
  font-family: var(--sr-font-display);
  font-size: var(--sr-fs-base);
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--sr-cream) !important;
  background: transparent;
  padding: 14px 24px;
  border: 1px solid rgba(245,241,232,0.22);
  border-radius: var(--sr-radius-md);
  text-decoration: none;
  transition: color var(--sr-dur-base) var(--sr-ease-out), border-color var(--sr-dur-base) var(--sr-ease-out), background var(--sr-dur-base) var(--sr-ease-out);
}
.sr-hero-cta-ghost:hover {
  color: var(--sr-green-500) !important;
  border-color: var(--sr-green-500);
  background: rgba(126,217,87,0.06);
}

/* Right column — Featured This Week */
.sr-hero-col-features { position: relative; }
.sr-hero-features-label {
  font-family: var(--sr-font-display);
  font-size: var(--sr-fs-xs);
  font-weight: 600;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--sr-text-tertiary);
  margin-bottom: var(--sr-sp-4);
  padding-left: var(--sr-sp-3);
  border-left: 2px solid var(--sr-green-500);
}

/* Section titles elevated with new typography */
.sr-section-title {
  font-family: var(--sr-font-display) !important;
  font-weight: 700 !important;
  letter-spacing: -0.02em !important;
  font-size: var(--sr-fs-3xl) !important;
  line-height: 1.1 !important;
  text-wrap: balance;
}

/* Editorial pull-quote component (reusable) */
.sr-pull-quote {
  font-family: var(--sr-font-serif);
  font-style: italic;
  font-size: clamp(22px, 3vw, 32px);
  line-height: 1.3;
  color: var(--sr-cream);
  max-width: 62ch;
  margin: var(--sr-sp-7) auto;
  padding: 0 var(--sr-sp-5);
  border-left: 3px solid var(--sr-green-500);
  letter-spacing: -0.01em;
}

/* ============================================================
   v2.8.4 — Modal scroll unification (critical bug fix)
   BEFORE: .sr-modal-content scrolled internally at 88vh, but .sr-modal-desc
   sat OUTSIDE the scroll container — on mobile viewports the entire
   description was below-the-fold and unreachable (no scroll available).
   AFTER: the whole #sr-modal scrolls as a single unit; description sits
   naturally in flow and users can simply scroll down to read it.
   ============================================================ */
#sr-modal {
  max-height: 92vh !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch;
  border-radius: var(--sr-radius-xl);
  scrollbar-width: thin;
  scrollbar-color: rgba(126,217,87,0.4) transparent;
}
#sr-modal::-webkit-scrollbar { width: 6px; }
#sr-modal::-webkit-scrollbar-track { background: transparent; }
#sr-modal::-webkit-scrollbar-thumb { background: rgba(126,217,87,0.35); border-radius: 3px; }
#sr-modal::-webkit-scrollbar-thumb:hover { background: rgba(126,217,87,0.6); }

/* Release the inner scroll so the parent modal owns scrolling */
#sr-modal .sr-modal-content {
  max-height: none !important;
  overflow: visible !important;
  overflow-y: visible !important;
}
/* Description sits under content, flows naturally, scrolls with modal */
#sr-modal .sr-modal-desc {
  padding: var(--sr-sp-5) var(--sr-sp-6) var(--sr-sp-6);
  border-top: 1px solid rgba(255,255,255,0.08);
  margin-top: 0;
}
#sr-modal .sr-modal-desc p { margin: 0 0 var(--sr-sp-4); line-height: 1.65; color: var(--sr-text-secondary); }
#sr-modal .sr-modal-desc strong { color: var(--sr-text-primary); font-weight: 600; }
#sr-modal .sr-modal-info-panel {
  display: flex; flex-wrap: wrap; gap: var(--sr-sp-3);
  padding: var(--sr-sp-4) var(--sr-sp-6);
  background: rgba(126,217,87,0.04);
  border-top: 1px solid rgba(255,255,255,0.06);
  border-bottom: 1px solid rgba(255,255,255,0.06);
  font-size: var(--sr-fs-sm);
  color: var(--sr-text-secondary);
}
#sr-modal .sr-modal-info-panel > div { padding: 4px 10px; background: rgba(255,255,255,0.04); border-radius: var(--sr-radius-sm); }

/* ============================================================
   v2.9.0 — Nerd Depth Blocks inside the product modal
   Strain type explainer + effects grid with readable blurbs +
   deep-link to our programmatic /strain/<slug>/ page.
   ============================================================ */
.sr-nerd-section-label {
  display: block;
  font-family: var(--sr-font-mono, ui-monospace, monospace);
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: #7ED957;
  margin-bottom: 8px;
}
.sr-nerd-strain-explain {
  margin: 18px 24px 8px;
  padding: 14px 16px;
  background: linear-gradient(135deg, rgba(126,217,87,0.07), rgba(126,217,87,0.02));
  border: 1px solid rgba(126,217,87,0.22);
  border-radius: 12px;
}
.sr-nerd-strain-body {
  font-size: 14px;
  line-height: 1.55;
  color: rgba(255,255,255,0.82);
}
.sr-nerd-strain-body strong {
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  font-weight: 700;
  font-size: 13px;
  background: rgba(126,217,87,0.18);
  padding: 2px 8px;
  border-radius: 4px;
  margin-right: 6px;
}

.sr-nerd-effects-block {
  margin: 14px 24px 8px;
  padding: 14px 16px;
  background: rgba(255,255,255,0.025);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 12px;
}
.sr-nerd-effects-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
}
.sr-nerd-effect-card {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 12px;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(126,217,87,0.12);
  border-radius: 10px;
  transition: background .2s, border-color .2s, transform .2s;
}
.sr-nerd-effect-card:hover {
  background: rgba(126,217,87,0.05);
  border-color: rgba(126,217,87,0.3);
  transform: translateY(-1px);
}
.sr-nerd-effect-emoji {
  font-size: 20px;
  line-height: 1;
  flex-shrink: 0;
  margin-top: 1px;
}
.sr-nerd-effect-meta { min-width: 0; }
.sr-nerd-effect-label {
  font-size: 13px;
  font-weight: 700;
  color: #fff;
  text-transform: capitalize;
  letter-spacing: 0.01em;
  margin-bottom: 2px;
}
.sr-nerd-effect-blurb {
  font-size: 12px;
  line-height: 1.4;
  color: rgba(255,255,255,0.62);
}

.sr-nerd-strain-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin: 10px 24px 8px;
  padding: 10px 14px;
  background: rgba(126,217,87,0.08);
  border: 1px solid rgba(126,217,87,0.32);
  border-radius: 10px;
  color: #7ED957 !important;
  font-family: var(--sr-font-body);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.01em;
  text-decoration: none;
  text-transform: capitalize;
  transition: background .2s, color .2s, border-color .2s;
}
.sr-nerd-strain-link:hover {
  background: #7ED957;
  color: #000 !important;
  border-color: #7ED957;
}

/* ============================================================
   v2.9.1 — Category pills above hero (v1-inspired, elevated)
   Glassy pills, active state with gradient, hover lift,
   horizontal scroll on mobile with snap + no scrollbar clutter.
   ============================================================ */
.sr-pills-v291 {
  background: linear-gradient(180deg, #05070c 0%, #0a0d14 100%);
  border-bottom: 1px solid rgba(126,217,87,0.12);
  padding: 12px 0 14px;
  position: relative;
  z-index: 5;
}
.sr-pills-v291 .sr-pills-inner {
  display: flex;
  gap: 10px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  padding: 0 clamp(16px, 3vw, 28px);
  max-width: 1440px;
  margin: 0 auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.sr-pills-v291 .sr-pills-inner::-webkit-scrollbar { display: none; }

.sr-pills-v291 .sr-pill {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  flex: 0 0 auto;
  font-family: 'Poppins', -apple-system, sans-serif;
  font-size: 11.5px;
  font-weight: 600;
  letter-spacing: .11em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.78) !important;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(126,217,87,0.22);
  padding: 10px 18px;
  border-radius: 999px;
  text-decoration: none;
  scroll-snap-align: start;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  transition: background .22s ease, color .22s ease, border-color .22s ease, transform .22s ease, box-shadow .22s ease;
  white-space: nowrap;
}
.sr-pills-v291 .sr-pill:hover {
  background: rgba(126,217,87,0.08);
  border-color: rgba(126,217,87,0.5);
  color: #fff !important;
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(126,217,87,0.18);
}
.sr-pills-v291 .sr-pill-active {
  background: linear-gradient(135deg, #7ED957 0%, #5FB43A 100%);
  color: #05070c !important;
  border-color: #7ED957;
  font-weight: 700;
  box-shadow: 0 4px 14px rgba(126,217,87,0.35), inset 0 1px 0 rgba(255,255,255,0.35);
}
.sr-pills-v291 .sr-pill-active:hover {
  color: #05070c !important;
  background: linear-gradient(135deg, #8fe268 0%, #6fc946 100%);
  transform: translateY(-1px);
  box-shadow: 0 6px 20px rgba(126,217,87,0.5), inset 0 1px 0 rgba(255,255,255,0.5);
}
.sr-pill-dot {
  width: 6px;
  height: 6px;
  background: currentColor;
  border-radius: 50%;
  box-shadow: 0 0 8px currentColor;
  flex-shrink: 0;
}

/* ============================================================
   v2.9.1 — Product card internal layout responsive polish
   Add-to-cart button stays proportional when card narrows.
   Price row becomes column on narrow cards.
   ============================================================ */
.sr-card-price-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
}
.sr-card-price-row > div:first-child {
  flex: 1 1 auto;
  min-width: 0;
}
.sr-card-add-btn {
  flex: 0 0 auto !important;
  min-width: 0 !important;
  font-size: clamp(10px, 1.2vw, 12px) !important;
  padding: 9px 14px !important;
  white-space: nowrap;
}
.sr-card-add-btn svg { flex-shrink: 0; }
@container (max-width: 220px) {
  .sr-card-add-btn { width: 100%; padding: 10px !important; margin-top: 8px !important; }
}
@media (max-width: 420px) {
  .sr-card-add-btn { padding: 8px 10px !important; font-size: 10.5px !important; }
  .sr-card-price-row { gap: 6px !important; }
}

/* ============================================================
   v2.9.2 — Kill all neon / Matrix-rain carryover.
   User reported "its neon showing" — caused by v2.7.25 Matrix canvas
   AND v2.8.5 neon hero classes. Nuking them here so nothing can surface
   even if a class accidentally gets applied or the asset is cached.
   ============================================================ */
/* v2.9.24.50 — removed .sr-hero-matrix-canvas from this nuke rule. The
   matrix canvas IS the ₿-smoke + green lightning Sohan wants visible.
   Kept the other neon-era classes hidden. */
.sr-hero-grid-floor,
.sr-hero-scanlines,
.sr-hero-vignette,
.sr-hero-glow-primary,
.sr-hero-glow-accent,
.sr-hero-headline-script,
.sr-hero-cta-neon { display: none !important; }

/* Defensive: if a legacy 285/286 class ever gets applied, strip neon styling */
.sr-hero-v285, .sr-hero-v286 { background: linear-gradient(180deg,#0a0a0a 0%,#111 50%,#1a1a1a 100%) !important; }
.sr-hero-v285 h1, .sr-hero-v286 h1 { text-shadow: none !important; background: none !important; -webkit-text-fill-color: #fff !important; color: #fff !important; }

/* ============================================================
   v2.9.3 — Light-panel product card contrast fix
   Sections with cream / pastel backgrounds (Specials, Moods, Categories panels)
   previously inherited white text from the dark-theme card defaults,
   PLUS v2.8.3's gradient-clipped text rendered TRANSPARENT on light bgs.
   Force solid dark-readable text + opaque white card surface on light panels.
   ============================================================ */
.sr-panel-light .sr-card,
.sr-specials-section .sr-card,
.sr-moods-section .sr-card,
.sr-categories-section .sr-card,
section[class*="panel-light"] .sr-card,
.sr-section[style*="rgb(232"] .sr-card,
.sr-section[style*="rgb(245"] .sr-card {
  background: #ffffff !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: 1px solid rgba(10,13,20,0.08) !important;
  box-shadow: 0 4px 14px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04) !important;
}
.sr-panel-light .sr-card::before,
.sr-specials-section .sr-card::before,
.sr-moods-section .sr-card::before,
.sr-categories-section .sr-card::before { display: none !important; }
.sr-panel-light .sr-card .sr-card-body,
.sr-specials-section .sr-card .sr-card-body,
.sr-moods-section .sr-card .sr-card-body,
.sr-categories-section .sr-card .sr-card-body {
  background: #ffffff !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
/* Kill the gradient-text treatment on light panels (was v2.8.3) */
.sr-panel-light .sr-card .sr-card-name,
.sr-specials-section .sr-card .sr-card-name,
.sr-moods-section .sr-card .sr-card-name,
.sr-categories-section .sr-card .sr-card-name {
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  -webkit-text-fill-color: #0f1511 !important;
  color: #0f1511 !important;
  font-weight: 600 !important;
}
/* Brand label — darker green on light bg so it's readable */
.sr-panel-light .sr-card .sr-card-brand,
.sr-specials-section .sr-card .sr-card-brand,
.sr-moods-section .sr-card .sr-card-brand,
.sr-categories-section .sr-card .sr-card-brand {
  color: #166534 !important; /* dark emerald, readable on white */
}
/* Price — dark green on white */
.sr-panel-light .sr-card .sr-card-price,
.sr-specials-section .sr-card .sr-card-price,
.sr-moods-section .sr-card .sr-card-price,
.sr-categories-section .sr-card .sr-card-price {
  color: #166534 !important;
}
.sr-panel-light .sr-card .sr-card-price-old,
.sr-specials-section .sr-card .sr-card-price-old {
  color: rgba(10,13,20,0.45) !important;
}
/* Weight/size meta next to price */
.sr-panel-light .sr-card .sr-card-weight,
.sr-specials-section .sr-card .sr-card-weight,
.sr-moods-section .sr-card .sr-card-weight,
.sr-categories-section .sr-card .sr-card-weight {
  color: rgba(10,13,20,0.6) !important;
}
/* Badges — dark text on light tinted bg */
.sr-panel-light .sr-card .sr-badge,
.sr-specials-section .sr-card .sr-badge,
.sr-moods-section .sr-card .sr-badge,
.sr-categories-section .sr-card .sr-badge {
  background: rgba(10,13,20,0.06) !important;
  border: 1px solid rgba(10,13,20,0.12) !important;
  color: #0f1511 !important;
}
.sr-panel-light .sr-card .sr-badge-indica,
.sr-specials-section .sr-card .sr-badge-indica {
  background: rgba(20,77,36,0.12) !important; border-color: rgba(46,100,22,0.35) !important; color: #0F3D1C !important;
}
.sr-panel-light .sr-card .sr-badge-sativa,
.sr-specials-section .sr-card .sr-badge-sativa {
  background: rgba(126,217,87,0.18) !important; border-color: rgba(126,217,87,0.42) !important; color: #166534 !important;
}
.sr-panel-light .sr-card .sr-badge-hybrid,
.sr-specials-section .sr-card .sr-badge-hybrid {
  background: rgba(126,217,87,0.16) !important; border-color: rgba(126,217,87,0.4) !important; color: #166534 !important;
}
.sr-panel-light .sr-card .sr-badge-thc,
.sr-specials-section .sr-card .sr-badge-thc {
  background: rgba(126,217,87,0.1) !important; border-color: rgba(126,217,87,0.3) !important; color: #166534 !important;
}
.sr-panel-light .sr-card .sr-badge-cbd,
.sr-specials-section .sr-card .sr-badge-cbd {
  background: rgba(40,110,180,0.12) !important; border-color: rgba(40,110,180,0.3) !important; color: #1e4e8a !important;
}
/* Add-to-Cart button on light panels — green fill, dark ink */
.sr-panel-light .sr-card .sr-card-add-btn,
.sr-specials-section .sr-card .sr-card-add-btn,
.sr-moods-section .sr-card .sr-card-add-btn,
.sr-categories-section .sr-card .sr-card-add-btn {
  background: linear-gradient(135deg,#7ed957 0%,#209F48 100%) !important;
  color: #05070c !important;
  box-shadow: 0 4px 12px rgba(22,101,52,0.22) !important;
}

/* Also: Shop Specials & Save section heading + its sub copy — was white-on-cream? */
.sr-specials-section .sr-section-title,
.sr-moods-section .sr-section-title {
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  -webkit-text-fill-color: #0f1511 !important;
  color: #0f1511 !important;
  background: none !important;
}
.sr-specials-section .sr-section-sub,
.sr-moods-section .sr-section-sub {
  color: rgba(10,13,20,0.68) !important;
}

/* ============================================================
   v2.9.8 — Custom branded checkout modal
   Replaces jamaica-checkout.silkroadnyc.com redirect with a
   multi-step flow that stays 100% on silkroaddispensary.com
   ============================================================ */
/* v2.9.24.69 — Modal uses flex-center so the panel shrinks + scrolls
   without the translate(-50%,-50%) trick that caused mobile viewport
   bleed (panel taller than viewport clipped top+bottom, hid form fields
   behind iOS URL bar + keyboard). Now: flex-centered with dvh-aware
   max-height, internal scroll, no clip. */
.sr-co-modal {
  position: fixed; inset: 0; z-index: 100000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  height: 100vh;
  height: 100dvh;
  overflow: hidden;
  box-sizing: border-box;
}
.sr-co-overlay {
  position: absolute; inset: 0;
  background: rgba(0,0,0,0.72);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.sr-co-panel {
  position: relative;
  width: clamp(320px, 92vw, 540px);
  max-height: calc(100vh - 32px);
  max-height: calc(100dvh - 32px);
  overflow-y: auto;
  overscroll-behavior: contain;
  background: linear-gradient(180deg, #0e1220 0%, #080b15 100%);
  color: #f3f5f9;
  border: 1px solid rgba(126,217,87,0.3);
  border-radius: 22px;
  box-shadow: 0 36px 90px rgba(0,0,0,0.7), 0 0 0 1px rgba(126,217,87,0.12) inset;
  padding: 28px 22px 24px;
  font-family: 'Poppins', 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  -webkit-overflow-scrolling: touch;
  box-sizing: border-box;
}
.sr-co-close {
  position: absolute; top: 10px; right: 12px;
  background: transparent; border: 0;
  color: rgba(255,255,255,0.7);
  font-size: 28px; cursor: pointer;
  width: 36px; height: 36px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  transition: background .2s, color .2s;
}
.sr-co-close:hover { background: rgba(255,255,255,0.08); color: #fff; }

.sr-co-steps {
  display: flex; gap: 8px; justify-content: center;
  margin: 4px 0 22px;
  font-family: var(--sr-font-mono, ui-monospace, monospace);
  font-size: 10.5px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
}
.sr-co-step {
  padding: 6px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,0.04);
  color: rgba(255,255,255,0.45);
  border: 1px solid rgba(255,255,255,0.08);
}
.sr-co-step-active {
  background: #7ED957;
  color: #05070c;
  border-color: #7ED957;
  font-weight: 700;
}
.sr-co-step-done {
  background: rgba(126,217,87,0.16);
  color: #7ED957;
  border-color: rgba(126,217,87,0.3);
}

.sr-co-title {
  font-size: clamp(20px, 4vw, 26px);
  font-weight: 700;
  margin: 0 0 10px;
  letter-spacing: -0.015em;
  color: #fff;
}
.sr-co-lede {
  color: rgba(255,255,255,0.72);
  font-size: 14px;
  margin: 0 0 16px;
  line-height: 1.5;
}
.sr-co-back {
  background: transparent; border: 0;
  color: rgba(255,255,255,0.65);
  font-size: 13px; padding: 0 0 12px; cursor: pointer;
  font-family: inherit;
}
.sr-co-back:hover { color: #7ED957; }

/* Step 1: Pickup or Delivery choice */
.sr-co-choice-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-top: 10px;
}
.sr-co-choice {
  background: rgba(255,255,255,0.03);
  border: 1.5px solid rgba(126,217,87,0.2);
  border-radius: 14px;
  padding: 20px 14px;
  cursor: pointer;
  color: #fff;
  text-align: center;
  font-family: inherit;
  transition: background .25s, border-color .25s, transform .2s, box-shadow .25s;
}
.sr-co-choice:hover {
  background: rgba(126,217,87,0.08);
  border-color: #7ED957;
  transform: translateY(-2px);
  box-shadow: 0 12px 24px rgba(126,217,87,0.18);
}
.sr-co-choice-icon { font-size: 34px; line-height: 1; margin-bottom: 10px; }
.sr-co-choice-name { font-weight: 700; font-size: 17px; margin-bottom: 4px; }
.sr-co-choice-sub { font-size: 12px; color: rgba(255,255,255,0.6); line-height: 1.4; }

/* Form labels + inputs */
.sr-co-label {
  display: block;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.6);
  margin: 14px 0 6px;
}
.sr-co-label.sr-co-optional { opacity: 0.7; text-transform: none; letter-spacing: 0; font-size: 12px; font-weight: 400; }
.sr-co-input {
  width: 100%;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 10px;
  padding: 12px 14px;
  color: #fff;
  font-family: inherit;
  font-size: 15px;
  transition: border-color .2s, background .2s;
  box-sizing: border-box;
}
.sr-co-input:focus {
  outline: none;
  border-color: #7ED957;
  background: rgba(126,217,87,0.06);
}
.sr-co-input::placeholder { color: rgba(255,255,255,0.35); }

.sr-co-fee-note {
  margin: 14px 0;
  padding: 12px 14px;
  background: rgba(126,217,87,0.08);
  border: 1px solid rgba(126,217,87,0.22);
  border-radius: 10px;
  font-size: 13px;
  color: rgba(255,255,255,0.85);
  line-height: 1.6;
}

/* Primary CTA */
.sr-co-cta {
  width: 100%;
  margin-top: 18px;
  background: linear-gradient(135deg, #7ED957 0%, #209F48 100%);
  color: #05070c;
  border: 0;
  border-radius: 12px;
  padding: 15px 18px;
  font-family: inherit;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.02em;
  cursor: pointer;
  box-shadow: 0 12px 28px rgba(126,217,87,0.28);
  transition: transform .22s, filter .22s, box-shadow .22s;
}
.sr-co-cta:hover { transform: translateY(-1px); filter: brightness(1.06); box-shadow: 0 16px 36px rgba(126,217,87,0.4); }
.sr-co-cta:active { transform: translateY(0); filter: brightness(.96); }

/* Step 2: Payment method cards */
.sr-co-pay-row { display: grid; grid-template-columns: 1fr; gap: 10px; margin-top: 12px; }
.sr-co-pay {
  display: grid;
  grid-template-columns: 44px 1fr auto;
  align-items: center;
  gap: 12px;
  background: rgba(255,255,255,0.03);
  border: 1.5px solid rgba(126,217,87,0.2);
  border-radius: 12px;
  padding: 12px 14px;
  cursor: pointer;
  text-align: left;
  color: #fff;
  font-family: inherit;
  transition: background .2s, border-color .2s, transform .2s;
}
.sr-co-pay:hover { background: rgba(126,217,87,0.08); border-color: #7ED957; transform: translateY(-1px); }
.sr-co-pay-logo {
  width: 44px; height: 44px;
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-weight: 800; font-size: 20px; color: #fff;
}
.sr-co-pay-venmo { background: #008CFF; }
.sr-co-pay-zelle { background: #6D1ED4; }
.sr-co-pay-phone { background: #7ED957; color: #05070c; font-size: 22px; }
.sr-co-pay-name { font-weight: 700; font-size: 15px; }
.sr-co-pay-sub { font-size: 12px; color: rgba(255,255,255,0.6); margin-top: 2px; }

/* Step 3: Venmo / Zelle payment box */
.sr-co-pay-box {
  margin: 16px 0 12px;
  padding: 16px;
  background: linear-gradient(135deg, rgba(126,217,87,0.08), rgba(126,217,87,0.02));
  border: 1px solid rgba(126,217,87,0.3);
  border-radius: 14px;
}
.sr-co-pay-row-inline {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 8px 0; border-bottom: 1px dashed rgba(126,217,87,0.18);
}
.sr-co-pay-row-inline:last-of-type { border-bottom: 0; }
.sr-co-pay-handle {
  font-family: var(--sr-font-mono, ui-monospace, monospace);
  font-size: 15px; font-weight: 700; color: #fff;
  word-break: break-all;
}
.sr-co-pay-amount {
  font-family: var(--sr-font-mono, ui-monospace, monospace);
  font-size: 22px; font-weight: 800; color: #7ED957;
}
.sr-co-copy {
  background: rgba(126,217,87,0.15);
  color: #7ED957;
  border: 1px solid rgba(126,217,87,0.35);
  padding: 7px 12px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
  font-family: inherit;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  transition: background .2s, color .2s;
}
.sr-co-copy:hover { background: #7ED957; color: #05070c; }
.sr-co-pay-note { font-size: 12px; color: rgba(255,255,255,0.6); padding-top: 10px; line-height: 1.5; }

.sr-co-ul { margin: 12px 0; padding-left: 20px; color: rgba(255,255,255,0.78); font-size: 14px; line-height: 1.6; }
.sr-co-ul li { margin: 6px 0; }

.sr-co-loading {
  text-align: center; padding: 28px 0;
  color: rgba(255,255,255,0.72);
}

/* Success */
.sr-co-success { text-align: center; padding: 10px 0 4px; }
.sr-co-success-icon { font-size: 54px; line-height: 1; margin-bottom: 8px; }
.sr-co-success-num {
  font-family: var(--sr-font-mono, ui-monospace, monospace);
  font-size: 20px; font-weight: 800; letter-spacing: 0.1em;
  color: #7ED957; margin: 6px 0 14px;
  text-shadow: 0 0 16px rgba(126,217,87,0.4);
}
.sr-co-recap {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 12px;
  padding: 14px 16px;
  margin: 14px auto;
  max-width: 420px;
  text-align: left;
  font-size: 13px;
  color: rgba(255,255,255,0.8);
  line-height: 1.9;
}

@media (max-width: 480px) {
  /* v2.9.24.69 — mobile: modal uses the full visible viewport (dvh-aware) so
     iOS address bar + on-screen keyboard never hide form fields. Panel itself
     scrolls internally, page under it is locked (body.style.overflow:hidden
     set by openModal()). */
  .sr-co-modal { padding: 8px; }
  .sr-co-panel {
    padding: 22px 18px 18px;
    width: 100%;
    max-height: calc(100vh - 16px);
    max-height: calc(100dvh - 16px);
    border-radius: 18px;
  }
  .sr-co-choice-row { grid-template-columns: 1fr; }
  .sr-co-title { font-size: 20px; }
  .sr-co-steps { font-size: 9.5px; gap: 4px; }
  .sr-co-step { padding: 5px 8px; }
}

/* ============================================================
   v2.9.4 — Kill the gradient-clipped card-name treatment GLOBALLY.
   My v2.8.3 editorial gradient was intended for a dark glassy card,
   but Dutchie cards render with a white bg everywhere, so the
   transparent text-fill-color made the product name invisible.
   Force solid currentColor text on every card name regardless of context.
   ============================================================ */
.sr-card .sr-card-name {
  background: none !important;
  -webkit-background-clip: initial !important;
          background-clip: initial !important;
  -webkit-text-fill-color: currentColor !important;
  color: #111 !important;
  font-weight: 700 !important;
  letter-spacing: -0.003em !important;
}
/* Brand label: always dark-on-light, grey secondary */
.sr-card .sr-card-brand {
  color: #444 !important;
  font-weight: 700 !important;
}
/* Price: always dark + bold */
.sr-card .sr-card-price { color: #111 !important; font-weight: 800 !important; }
.sr-card .sr-card-price-special { color: #166534 !important; }
.sr-card .sr-card-price-old { color: rgba(0,0,0,0.42) !important; }

/* ============================================================
   v2.9.5 — Specials section: 3-col grid, softer warm-white bg,
   tighter padding to remove the awkward 2+1 layout and jarring
   cream break.
   ============================================================ */
/* v2.9.10 — Specials section rebuilt to match v2 dark Dr. Doom palette.
   Old rules (white card, light-green bg) hid text by stacking white on white. */
.sr-specials-section {
  background: #000 !important;
  background-image: none !important;
  padding: 72px clamp(18px, 3vw, 32px) !important;
  border-top: 1px solid rgba(126,217,87,0.12);
  border-bottom: 1px solid rgba(126,217,87,0.12);
}
.sr-specials-section .sr-section-title {
  margin: 0 auto 36px !important;
  max-width: 1100px;
  text-align: center;
  color: #ffffff !important;
  font-family: 'Poppins', sans-serif !important;
  font-weight: 800 !important;
  font-size: clamp(26px, 3.2vw, 38px) !important;
  letter-spacing: -0.01em !important;
}
.sr-specials-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 20px !important;
  max-width: 1240px !important;
  margin: 0 auto !important;
}
@media (max-width: 900px) { .sr-specials-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 16px !important; } }
@media (max-width: 600px) { .sr-specials-grid { grid-template-columns: 1fr !important; gap: 14px !important; } }
.sr-special-card {
  background: linear-gradient(180deg, rgba(126,217,87,0.08), rgba(11,11,11,0.92)) !important;
  border: 1px solid rgba(126,217,87,0.28) !important;
  border-radius: 18px !important;
  overflow: hidden;
  box-shadow: 0 2px 10px rgba(0,0,0,0.4), 0 0 0 1px rgba(126,217,87,0.05) inset;
  transition: transform .35s cubic-bezier(.2,1,.3,1), box-shadow .35s ease, border-color .3s;
  font-family: 'Poppins', sans-serif !important;
}
.sr-special-card:hover {
  transform: translateY(-4px);
  border-color: #7ED957 !important;
  box-shadow: 0 18px 42px rgba(0,0,0,0.55), 0 0 34px rgba(126,217,87,0.28);
}
.sr-special-card .sr-special-overlay,
.sr-special-card > *:not(img):not(a) {
  background: transparent !important;
  color: #ffffff !important;
  padding: 16px 20px !important;
}
.sr-special-card .sr-special-overlay span,
.sr-special-card .sr-special-title,
.sr-special-card h3 {
  color: #ffffff !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  letter-spacing: 0.02em !important;
  display: block !important;
}
.sr-special-card .sr-special-overlay p,
.sr-special-card p {
  color: rgba(255,255,255,0.72) !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  margin-top: 4px !important;
}
.sr-special-card a {
  color: #7ED957 !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}
.sr-special-card a:hover { color: #ffffff !important; }

/* Moods section: similar bg softening */
.sr-moods-section {
  background: linear-gradient(180deg, #f5f7fb 0%, #eef2f8 100%) !important;
  padding: 44px clamp(18px, 3vw, 32px) !important;
  border-top: 1px solid rgba(255,255,255,0.04);
  border-bottom: 1px solid rgba(255,255,255,0.04);
}

/* ============================================================
   v2.9.5 — Product card REACTOR pulse (energy borders)
   Subtle always-on green pulse + amplified glow on hover.
   "Pulser" feel — not distracting, signals aliveness.
   ============================================================ */
@keyframes sr-card-reactor {
  0%, 100% {
    box-shadow:
      0 0 0 1px rgba(126,217,87,0.18),
      0 2px 10px rgba(0,0,0,0.05);
  }
  50% {
    box-shadow:
      0 0 0 1px rgba(126,217,87,0.38),
      0 0 14px rgba(126,217,87,0.14),
      0 2px 10px rgba(0,0,0,0.05);
  }
}
.sr-card {
  position: relative;
  animation: sr-card-reactor 3.4s ease-in-out infinite;
  transition: transform .3s cubic-bezier(.2,1,.3,1), box-shadow .3s ease, border-color .3s;
}
.sr-card:hover {
  animation: none;
  transform: translateY(-3px);
  border-color: rgba(126,217,87,0.55) !important;
  box-shadow:
    0 0 0 1px rgba(126,217,87,0.6),
    0 0 30px rgba(126,217,87,0.3),
    0 0 68px rgba(126,217,87,0.16),
    0 8px 22px rgba(0,0,0,0.14);
}
@media (prefers-reduced-motion: reduce) {
  .sr-card { animation: none; }
}

/* ============================================================
   v2.9.5 — Modal polish: tighter nerd-depth blocks, cleaner
   hierarchy, better breathing between sections.
   ============================================================ */
#sr-modal .sr-nerd-strain-explain { margin: 14px 20px 4px; padding: 12px 14px; border-radius: 10px; }
#sr-modal .sr-nerd-effects-block { margin: 10px 20px 4px; padding: 12px 14px; border-radius: 10px; }
#sr-modal .sr-nerd-effects-grid { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 8px; }
#sr-modal .sr-nerd-effect-card { padding: 8px 10px; border-radius: 8px; }
#sr-modal .sr-nerd-effect-label { font-size: 12px; }
#sr-modal .sr-nerd-effect-blurb { font-size: 11px; line-height: 1.35; }
#sr-modal .sr-nerd-effect-emoji { font-size: 16px; }
#sr-modal .sr-nerd-strain-link { margin: 8px 20px; padding: 9px 12px; font-size: 12px; }
#sr-modal .sr-modal-desc { padding: 16px 20px 20px; }
#sr-modal .sr-modal-desc p { margin: 0 0 12px; font-size: 13.5px; }
#sr-modal .sr-modal-trust { margin: 14px 20px 4px; padding: 10px 14px; font-size: 12px; border-radius: 10px; }

/* ============================================================
   v2.8.5 — HERO 2.0: Loudstar DNA + Pacifico script logo-headline
   Deep-space radial · perspective grid · scanlines · neon bloom
   Matches the logo wordmark. Futurama/Blade Runner energy on a
   cannabis retail surface — dominance, not decoration.
   ============================================================ */
.sr-hero-v285 {
  position: relative;
  overflow: hidden;
  width: 100%;
  min-height: clamp(620px, 88vh, 880px);
  padding: clamp(80px, 10vw, 140px) clamp(20px, 4vw, 40px) clamp(60px, 8vw, 100px);
  background:
    radial-gradient(ellipse 80% 60% at 50% 30%, #0a1220 0%, #06080f 55%, #02040a 100%);
  isolation: isolate;
  display: flex;
  align-items: center;
}

/* TRON-style perspective floor grid */
.sr-hero-grid-floor {
  position: absolute;
  left: -10%; right: -10%;
  bottom: -20%;
  height: 80%;
  background-image:
    linear-gradient(rgba(126,217,87,0.14) 1px, transparent 1px),
    linear-gradient(90deg, rgba(126,217,87,0.14) 1px, transparent 1px);
  background-size: 60px 60px;
  transform: perspective(800px) rotateX(62deg) translateY(0);
  transform-origin: center bottom;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0%, black 30%, black 70%, transparent 100%);
          mask-image: linear-gradient(to bottom, transparent 0%, black 30%, black 70%, transparent 100%);
  pointer-events: none;
  z-index: 0;
  opacity: 0.75;
  animation: sr-grid-drift 30s linear infinite;
}
@keyframes sr-grid-drift {
  from { background-position: 0 0, 0 0; }
  to   { background-position: 0 60px, 60px 0; }
}

/* CRT scanlines */
.sr-hero-scanlines {
  position: absolute; inset: 0;
  background: repeating-linear-gradient(
    0deg,
    transparent 0,
    transparent 2px,
    rgba(126,217,87,0.02) 3px,
    transparent 4px
  );
  pointer-events: none;
  z-index: 1;
  opacity: 0.6;
  mix-blend-mode: overlay;
  animation: sr-scan-move 8s linear infinite;
}
@keyframes sr-scan-move { from { background-position: 0 0; } to { background-position: 0 100vh; } }

/* Ambient glows */
.sr-hero-glow-primary {
  position: absolute;
  top: -25%; left: -15%;
  width: 70%; height: 140%;
  background: radial-gradient(ellipse at center, rgba(126,217,87,0.18) 0%, transparent 60%);
  filter: blur(60px);
  pointer-events: none;
  z-index: 0;
}
.sr-hero-glow-accent {
  position: absolute;
  bottom: -30%; right: -15%;
  width: 55%; height: 110%;
  background: radial-gradient(ellipse at center, rgba(245,241,232,0.06) 0%, transparent 65%);
  filter: blur(80px);
  pointer-events: none;
  z-index: 0;
}
.sr-hero-vignette {
  position: absolute; inset: 0;
  background: radial-gradient(ellipse 120% 100% at center, transparent 50%, rgba(0,0,0,0.5) 100%);
  pointer-events: none;
  z-index: 1;
}

/* Grid: text left, featured right */
.sr-hero-grid-v285 {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: clamp(40px, 6vw, 96px);
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  align-items: center;
}
@media (max-width: 980px) {
  .sr-hero-grid-v285 { grid-template-columns: 1fr; gap: 56px; }
}
.sr-hero-col-text { max-width: 780px; }

/* Eyebrow — live-status pill, loudstar terminal DNA */
.sr-hero-v285 .sr-hero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: var(--sr-font-mono);
  font-size: var(--sr-fs-xs);
  font-weight: 600;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--sr-green-500);
  padding: 7px 14px 7px 12px;
  border: 1px solid rgba(126,217,87,0.35);
  border-radius: var(--sr-radius-pill);
  margin-bottom: var(--sr-sp-6);
  background: rgba(126,217,87,0.06);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  box-shadow: 0 0 24px rgba(126,217,87,0.22), inset 0 0 12px rgba(126,217,87,0.1);
}
.sr-hero-eyebrow-dot {
  width: 7px; height: 7px;
  background: var(--sr-green-500);
  border-radius: 50%;
  box-shadow: 0 0 10px var(--sr-green-500), 0 0 20px rgba(126,217,87,0.8);
  animation: sr-pulse 2s ease-in-out infinite;
}
@keyframes sr-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50% { opacity: 0.55; transform: scale(0.85); }
}

/* THE SCRIPT HEADLINE — Pacifico, massive, neon bloom */
.sr-hero-headline-script {
  font-family: var(--sr-font-script) !important;
  font-size: clamp(64px, 11vw, 164px) !important;
  font-weight: 400 !important;
  line-height: 0.92 !important;
  letter-spacing: -0.02em !important;
  margin: 0 0 var(--sr-sp-5) !important;
  color: #fff !important;
  text-shadow:
    0 0 10px rgba(126,217,87,0.9),
    0 0 24px rgba(126,217,87,0.75),
    0 0 48px rgba(126,217,87,0.55),
    0 0 96px rgba(126,217,87,0.35);
  background: linear-gradient(180deg, #ffffff 0%, #d8f5c3 60%, #7ED957 100%);
  -webkit-background-clip: text;
          background-clip: text;
  -webkit-text-fill-color: transparent;
  filter: drop-shadow(0 0 18px rgba(126,217,87,0.35)) drop-shadow(0 0 42px rgba(126,217,87,0.2));
  text-wrap: balance;
  /* Subtle shimmer sweep */
  position: relative;
}
.sr-hero-headline-script::after {
  content: "Silk Road NYC";
  position: absolute;
  inset: 0;
  background: linear-gradient(110deg, transparent 35%, rgba(255,255,255,0.7) 50%, transparent 65%);
  background-size: 200% 100%;
  -webkit-background-clip: text;
          background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: sr-shimmer 4.5s ease-in-out infinite;
  animation-delay: 1.2s;
  pointer-events: none;
}
@keyframes sr-shimmer {
  0%   { background-position: 180% 0; opacity: 0; }
  20%  { opacity: 1; }
  50%  { background-position: -80% 0; opacity: 1; }
  70%  { opacity: 0; }
  100% { background-position: -80% 0; opacity: 0; }
}

/* Subhead + mono line */
.sr-hero-v285 .sr-hero-subhead {
  font-family: var(--sr-font-body);
  font-size: var(--sr-fs-md);
  color: var(--sr-cream-dim);
  line-height: 1.5;
  max-width: 58ch;
  margin: 0 0 var(--sr-sp-5);
  letter-spacing: 0.002em;
}
.sr-hero-v285 .sr-hero-mono {
  display: inline-block;
  font-family: var(--sr-font-mono);
  font-size: var(--sr-fs-xs);
  font-weight: 700;
  letter-spacing: .22em;
  text-transform: uppercase;
  color: var(--sr-green-500);
  text-shadow: 0 0 12px var(--sr-green-glow);
  margin-bottom: var(--sr-sp-6);
  padding: 6px 0 6px 12px;
  border-left: 2px solid var(--sr-green-500);
}

/* Neon CTA — Blade Runner button */
.sr-hero-cta-row { display: flex; flex-wrap: wrap; gap: var(--sr-sp-3); align-items: center; }
.sr-hero-cta-neon {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: var(--sr-font-display);
  font-size: var(--sr-fs-base);
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--sr-ink-900) !important;
  background: linear-gradient(135deg, #a3dd73 0%, #7ED957 45%, #5FB43A 100%);
  padding: 16px 28px;
  border-radius: var(--sr-radius-md);
  text-decoration: none;
  box-shadow:
    0 0 0 1px rgba(126,217,87,0.6),
    0 0 24px rgba(126,217,87,0.5),
    0 0 60px rgba(126,217,87,0.3),
    0 6px 24px rgba(0,0,0,0.5),
    inset 0 1px 0 rgba(255,255,255,0.5);
  transition: transform .25s var(--sr-ease-out), box-shadow .3s var(--sr-ease-out), filter .2s;
  overflow: hidden;
  isolation: isolate;
}
.sr-hero-cta-neon::before {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.5) 50%, transparent 100%);
  transform: translateX(-110%);
  transition: transform .6s var(--sr-ease-out);
  pointer-events: none; z-index: -1;
}
.sr-hero-cta-neon:hover {
  transform: translateY(-2px) scale(1.03);
  filter: brightness(1.08);
  box-shadow:
    0 0 0 1px rgba(126,217,87,0.8),
    0 0 40px rgba(126,217,87,0.75),
    0 0 100px rgba(126,217,87,0.5),
    0 10px 30px rgba(0,0,0,0.55),
    inset 0 1px 0 rgba(255,255,255,0.7);
}
.sr-hero-cta-neon:hover::before { transform: translateX(110%); }
.sr-hero-cta-neon-arrow {
  display: inline-block;
  font-family: var(--sr-font-mono);
  font-size: 1.3em;
  line-height: 1;
  transition: transform .25s var(--sr-ease-out);
}
.sr-hero-cta-neon:hover .sr-hero-cta-neon-arrow { transform: translateX(4px); }

.sr-hero-v285 .sr-hero-cta-ghost {
  display: inline-flex;
  align-items: center;
  font-family: var(--sr-font-display);
  font-size: var(--sr-fs-base);
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--sr-cream) !important;
  background: transparent;
  padding: 14px 22px;
  border: 1px solid rgba(245,241,232,0.25);
  border-radius: var(--sr-radius-md);
  text-decoration: none;
  transition: color .25s, border-color .25s, background .25s, box-shadow .25s;
}
.sr-hero-v285 .sr-hero-cta-ghost:hover {
  color: var(--sr-green-500) !important;
  border-color: var(--sr-green-500);
  background: rgba(126,217,87,0.06);
  box-shadow: 0 0 28px rgba(126,217,87,0.28);
}

/* Right column — Featured */
.sr-hero-v285 .sr-hero-col-features { position: relative; z-index: 2; }
.sr-hero-v285 .sr-hero-features-label {
  font-family: var(--sr-font-mono);
  font-size: var(--sr-fs-xs);
  font-weight: 700;
  letter-spacing: .25em;
  text-transform: uppercase;
  color: var(--sr-green-500);
  margin-bottom: var(--sr-sp-4);
  text-shadow: 0 0 10px var(--sr-green-glow);
}

/* Reduced motion respect */
@media (prefers-reduced-motion: reduce) {
  .sr-hero-grid-floor, .sr-hero-scanlines, .sr-hero-headline-script::after, .sr-hero-eyebrow-dot { animation: none !important; }
}

/* ============================================================
   v2.8.6 — HERO 3.0: Exact v1 copy + Bitcoin-smoke canvas
   Pure black box · centered logo + Poppins H1 · "Order Online" CTA
   ============================================================ */
.sr-hero-v286 {
  position: relative;
  overflow: hidden;
  width: 100%;
  min-height: clamp(580px, 82vh, 760px);
  padding: clamp(60px, 8vw, 112px) clamp(20px, 4vw, 40px);
  background: #000000;
  isolation: isolate;
  display: flex;
  align-items: center;
}
/* v2.8.8 — z-index corrected: smoke sits BELOW hero content */
#srnyc-hero .sr-hero-bsmoke {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;  /* v2.9.14.5 — was 0 (under grid z:3); bumped to 1 so smoke is visible behind text but above bg */
  pointer-events: none !important;
  display: block !important;
  opacity: 0.95 !important;
  /* v2.9.14.5 — lighter mask: was cutting top 2% completely which might have
     hidden all particles if canvas was stale-sized. Now mid-to-bottom fully
     visible, subtle top fade only. */
  -webkit-mask-image: linear-gradient(to top, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 60%, rgba(0,0,0,0.5) 100%);
          mask-image: linear-gradient(to top, rgba(0,0,0,1) 0%, rgba(0,0,0,1) 60%, rgba(0,0,0,0.5) 100%);
}
/* Ensure hero grid is above the smoke canvas */
#srnyc-hero #srnyc-hero-grid { position: relative !important; z-index: 3 !important; }
.sr-hero-v286 .sr-hero-grid-v286 {
  position: relative;
  z-index: 3;
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: clamp(40px, 6vw, 88px);
  max-width: 1400px;
  width: 100%;
  margin: 0 auto;
  align-items: center;
}
@media (max-width: 980px) {
  .sr-hero-v286 .sr-hero-grid-v286 { grid-template-columns: 1fr; gap: 48px; text-align: center; }
  .sr-hero-v286 .sr-hero-logo { justify-content: center; }
  .sr-hero-v286 .sr-hero-cta-row { justify-content: center; }
}
.sr-hero-v286 .sr-hero-col-text { max-width: 720px; }

/* Logo wordmark (script + camel) — centered on mobile, top of text column on desktop */
.sr-hero-v286 .sr-hero-logo {
  display: flex;
  align-items: center;
  margin-bottom: clamp(20px, 3vw, 32px);
}
.sr-hero-v286 .sr-hero-logo img {
  height: auto;
  width: clamp(200px, 22vw, 280px);
  display: block;
  filter: drop-shadow(0 4px 20px rgba(126,217,87,0.25));
}

/* V1 H1: Poppins 48px bold white */
.sr-hero-v286 .sr-hero-headline-v1 {
  font-family: 'Poppins', -apple-system, BlinkMacSystemFont, sans-serif !important;
  font-size: clamp(32px, 5.5vw, 56px) !important;
  font-weight: 700 !important;
  line-height: 1.08 !important;
  letter-spacing: -0.015em !important;
  color: #ffffff !important;
  margin: 0 0 clamp(14px, 2vw, 22px) !important;
  text-wrap: balance;
  text-shadow: 0 2px 24px rgba(0,0,0,0.7);
}

.sr-hero-v286 .sr-hero-tagline-v1 {
  font-family: 'Poppins', -apple-system, sans-serif;
  font-size: clamp(14px, 1.4vw, 17px);
  font-weight: 400;
  color: rgba(255,255,255,0.72);
  margin: 0 0 clamp(24px, 3vw, 36px);
  letter-spacing: 0.002em;
}

/* CTA — v1 style: transparent dark glass with green text + 8px radius */
.sr-hero-v286 .sr-hero-cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.sr-hero-v286 .sr-hero-cta-v1 {
  display: inline-flex;
  align-items: center;
  font-family: 'Poppins', sans-serif;
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.03em;
  color: #7ED957 !important;
  background: rgba(0,0,0,0.24);
  padding: 14px 28px;
  border: 1px solid rgba(126,217,87,0.5);
  border-radius: 8px;
  text-decoration: none;
  transition: background .25s var(--sr-ease-out), border-color .25s, color .25s, box-shadow .25s;
}
.sr-hero-v286 .sr-hero-cta-v1:hover {
  background: #7ED957;
  color: #000000 !important;
  border-color: #7ED957;
  box-shadow: 0 0 32px rgba(126,217,87,0.5), 0 6px 18px rgba(0,0,0,0.4);
}
.sr-hero-v286 .sr-hero-cta-ghost-v1 {
  display: inline-flex;
  align-items: center;
  font-family: 'Poppins', sans-serif;
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 0.02em;
  color: rgba(255,255,255,0.7) !important;
  background: transparent;
  padding: 14px 22px;
  border: 1px solid rgba(255,255,255,0.18);
  border-radius: 8px;
  text-decoration: none;
  transition: color .25s, border-color .25s;
}
.sr-hero-v286 .sr-hero-cta-ghost-v1:hover {
  color: #ffffff !important;
  border-color: rgba(255,255,255,0.45);
}

/* Right column: Featured This Week */
.sr-hero-v286 .sr-hero-features-label-v1 {
  font-family: 'Poppins', sans-serif;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.25em;
  text-transform: uppercase;
  color: rgba(126,217,87,0.9);
  margin-bottom: 16px;
  padding-left: 12px;
  border-left: 2px solid #7ED957;
}

/* ============================================================
   v2.9.9 — GAME-LEVEL PROGRESSION feel for the product modal
   Each nerd-depth section gets an "LVL N" badge + stagger fade-in.
   Subtle dispensary-meets-arcade vibe. Only active in modal.
   ============================================================ */
.sr-modal .sr-lvl-badge {
  display: inline-block;
  font-family: "JetBrains Mono", "SF Mono", Menlo, monospace;
  font-style: normal;
  font-weight: 800;
  font-size: 10px;
  letter-spacing: 0.12em;
  color: #000;
  background: linear-gradient(135deg, #7ED957, #166534);
  padding: 3px 7px;
  border-radius: 4px;
  margin-right: 8px;
  vertical-align: middle;
  box-shadow: 0 0 0 1px rgba(126,217,87,0.35), 0 0 12px rgba(126,217,87,0.25);
  text-shadow: 0 1px 0 rgba(255,255,255,0.25);
}
.sr-modal .sr-lvl-card {
  position: relative;
  opacity: 0;
  transform: translateY(12px);
  animation: sr-lvl-in .55s cubic-bezier(.2,.8,.2,1) forwards;
}
.sr-modal .sr-lvl-card[data-lvl="2"] { animation-delay: .10s; }
.sr-modal .sr-lvl-card[data-lvl="3"] { animation-delay: .22s; }
.sr-modal .sr-lvl-card[data-lvl="4"] { animation-delay: .34s; }
@keyframes sr-lvl-in {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  .sr-modal .sr-lvl-card { opacity: 1; transform: none; animation: none; }
}
/* LVL 1 visual marker on the image column so the "drop" reads as start of the run */
.sr-modal-img-col::before {
  content: "LVL 1 · THE DROP";
  position: absolute;
  top: 14px; left: 14px;
  font-family: "JetBrains Mono", "SF Mono", Menlo, monospace;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.14em;
  color: #7ED957;
  background: rgba(0,0,0,0.55);
  padding: 4px 8px;
  border-radius: 4px;
  border: 1px solid rgba(126,217,87,0.3);
  z-index: 2;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
.sr-modal-img-col { position: relative; }
/* Upgrade the LVL 4 "strain profile" link so it feels like unlocking the next zone */
.sr-modal .sr-nerd-strain-link.sr-lvl-card {
  display: flex;
  align-items: center;
  gap: 0;
  margin-top: 18px;
  padding: 14px 18px;
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(126,217,87,0.10), rgba(46,100,22,0.22));
  border: 1px solid rgba(126,217,87,0.35);
  color: #fff;
  font-weight: 700;
  letter-spacing: 0.01em;
  text-decoration: none;
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.sr-modal .sr-nerd-strain-link.sr-lvl-card:hover {
  transform: translateY(-2px);
  border-color: #7ED957;
  box-shadow: 0 10px 26px -10px rgba(126,217,87,0.45);
}

/* ============================================================
   v2.9.10 — GLOBAL BRAND ENFORCEMENT (v1 token parity)
   Forces Poppins + v1's exact green palette over Astra/Elementor defaults.
   ============================================================ */
html body,
html body input,
html body button,
html body textarea,
html body select,
.sr-wrap,
.sr-wrap * {
  font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
}
/* Preserve monospace for LVL badges + code-like UI */
.sr-wrap .sr-lvl-badge,
.sr-wrap code,
.sr-wrap pre,
.sr-modal-img-col::before {
  font-family: 'JetBrains Mono', 'SF Mono', Menlo, monospace !important;
}
/* Preserve script fonts where intentional (Pacifico hero, etc.) */
.sr-wrap .sr-hero-script,
.sr-wrap [class*="pacifico"] {
  font-family: 'Pacifico', cursive !important;
}

/* Align v2 CTA buttons to v1 kit (8px radius, 16×32 padding, Poppins 700) */
.sr-wrap .sr-btn,
.sr-wrap .sr-hero-cta-primary,
.sr-wrap .sr-card-add-btn,
.sr-wrap .sr-modal-add-btn,
.sr-wrap button.sr-hero-cta {
  border-radius: 8px !important;
  padding: 16px 32px !important;
  font-weight: 700 !important;
  font-family: 'Poppins', sans-serif !important;
  transition: background-color .2s ease, transform .15s ease !important;
}
.sr-wrap .sr-btn:hover,
.sr-wrap .sr-hero-cta-primary:hover,
.sr-wrap .sr-card-add-btn:hover,
.sr-wrap .sr-modal-add-btn:hover {
  background-color: #209F48 !important;
  transform: translateY(-1px) !important;
}

/* Strain + THC badge pills: v1 uses 8px radius squares, not full pills */
.sr-wrap .sr-card-badge,
.sr-wrap .sr-modal-badges > *,
.sr-wrap .sr-badge-strain,
.sr-wrap .sr-badge-thc {
  border-radius: 8px !important;
}

/* v1 body link style: green underlined, Poppins 700 */
.sr-wrap .sr-article-body a,
.sr-wrap .sr-modal-desc a,
.sr-wrap p a:not(.sr-btn):not(.sr-card-add-btn):not([class*="cta"]) {
  color: #7ED957 !important;
  text-decoration: underline !important;
  font-weight: 700 !important;
}
.sr-wrap .sr-article-body a:hover,
.sr-wrap .sr-modal-desc a:hover,
.sr-wrap p a:not(.sr-btn):not(.sr-card-add-btn):not([class*="cta"]):hover {
  color: #209F48 !important;
}

/* Kill the gradient-clipped text on section titles — v1 uses solid white on dark */
.sr-wrap .sr-section-title {
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  -webkit-text-fill-color: currentColor !important;
  color: #ffffff !important;
  font-family: 'Poppins', sans-serif !important;
  font-weight: 700 !important;
  line-height: 1.2 !important;
}

/* ============================================================
   v2.9.11 — CHECKOUT CLARITY: delivery minimum + upfront pricing
   ============================================================ */

/* Cart subtotal line in Step 1 */
.sr-co-sub-summary {
  margin: 0 0 16px;
  padding: 10px 14px;
  background: rgba(126,217,87,0.06);
  border: 1px solid rgba(126,217,87,0.22);
  border-radius: 10px;
  color: rgba(255,255,255,0.82);
  font-size: 13.5px;
  font-family: 'Poppins', sans-serif;
}
.sr-co-sub-summary strong { color: #fff; font-weight: 700; }

/* Locked delivery choice when below minimum */
.sr-co-choice.sr-co-choice-locked {
  opacity: 0.55;
  cursor: not-allowed;
  background: rgba(255,255,255,0.03) !important;
  border-color: rgba(255,255,255,0.08) !important;
}
.sr-co-choice.sr-co-choice-locked:hover {
  transform: none !important;
  box-shadow: none !important;
}
.sr-co-gate-note {
  color: #ffb366;
  font-weight: 700;
}

/* Gate banner when cart < delivery minimum */
.sr-co-gate-banner {
  margin-top: 18px;
  padding: 14px 16px;
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(255,179,102,0.10), rgba(255,179,102,0.04));
  border: 1px solid rgba(255,179,102,0.35);
  color: rgba(255,255,255,0.88);
  font-size: 14px;
  line-height: 1.5;
  font-family: 'Poppins', sans-serif;
}
.sr-co-gate-banner strong { color: #ffb366; }
.sr-co-gate-keep-shopping {
  display: inline-block;
  margin-top: 12px;
  padding: 8px 14px;
  background: transparent;
  border: 1px solid rgba(255,255,255,0.25);
  color: #fff;
  border-radius: 8px;
  cursor: pointer;
  font-weight: 700;
  font-family: 'Poppins', sans-serif;
}
.sr-co-gate-keep-shopping:hover {
  border-color: #7ED957;
  color: #7ED957;
}

/* Price summary block at TOP of address step */
.sr-co-price-summary {
  margin: 8px 0 20px;
  padding: 14px 16px;
  background: linear-gradient(180deg, rgba(126,217,87,0.06), rgba(11,11,11,0.6));
  border: 1px solid rgba(126,217,87,0.28);
  border-radius: 12px;
  font-family: 'Poppins', sans-serif;
}
.sr-co-price-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 12px;
  padding: 4px 0;
  color: rgba(255,255,255,0.78);
  font-size: 13.5px;
}
.sr-co-price-row strong { color: #fff; font-weight: 700; }
.sr-co-price-row .sr-co-free {
  color: #7ED957;
  font-weight: 800;
  letter-spacing: 0.02em;
}
.sr-co-price-row .sr-co-dim {
  color: rgba(255,255,255,0.55);
  font-size: 12px;
  font-weight: 400;
}
.sr-co-price-row > span:first-child {
  flex: 1;
}
.sr-co-price-total {
  margin-top: 6px;
  padding-top: 10px;
  border-top: 1px solid rgba(126,217,87,0.25);
  font-size: 16px;
  color: #fff !important;
  font-weight: 800;
}
.sr-co-price-total span { color: #fff !important; font-weight: 800 !important; }

/* Cart drawer — delivery policy note under totals */
.sr-drawer-delivery-note {
  margin: 10px 0;
  padding: 10px 12px;
  border-radius: 10px;
  background: rgba(126,217,87,0.08);
  border: 1px solid rgba(126,217,87,0.25);
  font-size: 12.5px;
  font-weight: 600;
  color: rgba(255,255,255,0.9);
  font-family: 'Poppins', sans-serif;
  line-height: 1.4;
}
.sr-drawer-delivery-note.sr-drawer-delivery-good {
  background: linear-gradient(135deg, rgba(126,217,87,0.14), rgba(126,217,87,0.04));
  border-color: #7ED957;
  color: #7ED957;
  font-weight: 800;
  letter-spacing: 0.02em;
}
.sr-drawer-delivery-note.sr-drawer-delivery-warn {
  background: rgba(255,179,102,0.08);
  border-color: rgba(255,179,102,0.4);
  color: #ffd0a1;
}
.sr-drawer-delivery-dim {
  color: rgba(255,255,255,0.55);
  font-weight: 400;
}

/* Zone disclosure below price summary in Step 1b */
.sr-co-zone-note {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px dashed rgba(126,217,87,0.22);
  color: rgba(255,255,255,0.62);
  font-size: 12px;
  line-height: 1.5;
}
.sr-co-zone-note strong {
  color: #7ED957;
  font-weight: 700;
}

/* ============================================================
   v2.9.12 — Zone-aware checkout: live resolver in Step 1b
   ============================================================ */
.sr-co-zone-live { margin: 0 0 18px; }
.sr-co-zone-empty {
  padding: 14px 16px;
  background: rgba(255,255,255,0.03);
  border: 1px dashed rgba(126,217,87,0.32);
  border-radius: 12px;
  font-family: 'Poppins', sans-serif;
}
.sr-co-zone-empty-k {
  font: 700 10px/1 ui-monospace, monospace;
  color: rgba(126,217,87,0.85);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  margin-bottom: 6px;
}
.sr-co-zone-empty-v { color: rgba(255,255,255,0.7); font-size: 13px; }

.sr-co-zone-hit {
  padding: 14px 16px;
  border-radius: 12px;
  border: 1px solid;
  font-family: 'Poppins', sans-serif;
}
.sr-co-zone-ok {
  background: rgba(126,217,87,0.08);
  border-color: rgba(126,217,87,0.48);
}
.sr-co-zone-warn {
  background: rgba(255,179,102,0.08);
  border-color: rgba(255,179,102,0.5);
}
.sr-co-zone-head {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
.sr-co-zone-name { font: 800 15px/1.2 'Poppins', sans-serif; color: #fff; letter-spacing: -0.005em; }
.sr-co-zone-stats { display: flex; gap: 6px; align-items: center; font: 700 12px/1 ui-monospace, monospace; color: rgba(255,255,255,0.8); letter-spacing: 0.04em; flex-wrap: wrap; }
.sr-co-zone-stats > span { display: inline-block; }
.sr-co-zone-free { color: #7ED957; font-weight: 800; }

.sr-co-zone-bar {
  height: 6px;
  background: rgba(255,255,255,0.08);
  border-radius: 3px;
  overflow: hidden;
  margin: 8px 0 6px;
}
.sr-co-zone-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, #7ED957, #209F48);
  transition: width 0.4s cubic-bezier(0.2, 0.9, 0.3, 1);
}
.sr-co-zone-warn .sr-co-zone-bar-fill { background: linear-gradient(90deg, #ffb366, #ff8f3c); }
.sr-co-zone-bar-lbl {
  display: flex;
  justify-content: space-between;
  gap: 10px;
  font: 500 12px/1.3 'Poppins', sans-serif;
  color: rgba(255,255,255,0.7);
  flex-wrap: wrap;
}
.sr-co-zone-bar-lbl strong { color: #ffd75e; font-weight: 800; }
.sr-co-zone-ok .sr-co-zone-bar-lbl strong { color: #7ED957; }

.sr-co-gate-inline {
  margin-top: 12px;
  padding: 12px 14px;
  background: rgba(255,193,7,0.07);
  border: 1px solid rgba(255,193,7,0.38);
  border-radius: 10px;
  color: #ffd75e;
  font: 500 13px/1.5 'Poppins', sans-serif;
}
.sr-co-gate-inline strong { color: #fff; font-weight: 800; }
.sr-co-gate-shop {
  display: inline-block;
  margin-left: 8px;
  padding: 6px 12px;
  background: transparent;
  border: 1px solid rgba(255,215,94,0.5);
  color: #ffd75e;
  border-radius: 6px;
  font: 700 11px/1 'Poppins', sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  cursor: pointer;
}
.sr-co-gate-shop:hover { background: rgba(255,215,94,0.1); }

/* Below-min CTA state */
.sr-co-cta.sr-co-cta-warn {
  background: rgba(255,255,255,0.08) !important;
  color: rgba(255,255,255,0.55) !important;
  box-shadow: none !important;
  cursor: not-allowed;
  border: 1px dashed rgba(255,179,102,0.5) !important;
}
.sr-co-cta[disabled] { opacity: 0.7; }

.sr-co-dim { color: rgba(255,255,255,0.45); font-weight: 400; font-size: 12px; }

/* ============================================================
   v2.9.12 — Cart drawer zone progress bar
   ============================================================ */
.sr-drawer-zone-bar {
  height: 5px;
  background: rgba(255,255,255,0.1);
  border-radius: 3px;
  overflow: hidden;
  margin: 8px 0 6px;
}
.sr-drawer-zone-bar-fill {
  height: 100%;
  background: linear-gradient(90deg, #ffb366, #ff8f3c);
  transition: width 0.4s ease;
}
.sr-drawer-delivery-good .sr-drawer-zone-bar-fill {
  background: linear-gradient(90deg, #7ED957, #209F48);
}
.sr-drawer-zone-bar-lbl {
  font: 500 12px/1.4 'Poppins', sans-serif;
  color: rgba(255,255,255,0.72);
}
.sr-drawer-zone-bar-lbl strong { color: #ffd75e; font-weight: 800; }
.sr-drawer-delivery-good .sr-drawer-zone-bar-lbl strong { color: #7ED957; }

/* ============================================================
   v2.9.12 — Specials section HARDENED FIX
   Screenshot showed white-on-white card bodies + unreadable title.
   These late rules override any earlier light-theme overrides.
   ============================================================ */
.sr-specials-section,
.sr-wrap .sr-specials-section {
  background: #000 !important;
  background-image: none !important;
  color: #fff !important;
}
.sr-specials-section > .sr-section-title,
.sr-specials-section .sr-section-title,
.sr-wrap .sr-specials-section .sr-section-title {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  font-family: 'Poppins', sans-serif !important;
  font-weight: 800 !important;
  text-align: center !important;
}
.sr-specials-section .sr-special-card,
.sr-wrap .sr-specials-section .sr-special-card {
  background: linear-gradient(180deg, rgba(126,217,87,0.08), rgba(11,11,11,0.95)) !important;
  background-color: #0b0b0b !important;
  border: 1px solid rgba(126,217,87,0.3) !important;
  color: #ffffff !important;
}
.sr-specials-section .sr-special-card *:not(img),
.sr-wrap .sr-specials-section .sr-special-card *:not(img) {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}
.sr-specials-section .sr-special-card .sr-special-overlay,
.sr-wrap .sr-specials-section .sr-special-card .sr-special-overlay {
  background: linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,0.85)) !important;
  padding: 22px 20px 16px !important;
}
.sr-specials-section .sr-special-card .sr-special-overlay span,
.sr-wrap .sr-specials-section .sr-special-card .sr-special-overlay span {
  color: #ffffff !important;
  font: 800 15px/1.3 'Poppins', sans-serif !important;
  letter-spacing: 0.02em !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}
.sr-specials-section .sr-special-card .sr-special-overlay span::after {
  content: '\2192';
  color: #7ED957;
  font-weight: 800;
}

/* ============================================================
   v2.9.12.1 — Drawer fulfillment picker (Pickup / Delivery tiles)
   so users commit to a fulfillment BEFORE checkout
   ============================================================ */
.sr-drawer-ful-label {
  font: 700 10px/1 ui-monospace, monospace;
  color: rgba(126,217,87,0.85);
  letter-spacing: 0.14em;
  text-transform: uppercase;
  margin: 14px 0 8px;
}
.sr-drawer-ful-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  margin-bottom: 10px;
}
.sr-drawer-ful {
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.14);
  border-radius: 10px;
  padding: 12px 12px;
  text-align: left;
  cursor: pointer;
  font-family: 'Poppins', sans-serif;
  color: #fff;
  transition: all 0.18s ease;
}
.sr-drawer-ful:hover:not(.sr-drawer-ful-gated) {
  border-color: rgba(126,217,87,0.55);
  background: rgba(126,217,87,0.06);
}
.sr-drawer-ful-active {
  border-color: #7ED957 !important;
  background: rgba(126,217,87,0.12) !important;
  box-shadow: 0 0 0 2px rgba(126,217,87,0.25);
}
.sr-drawer-ful-gated {
  opacity: 0.72;
  cursor: not-allowed;
}
.sr-drawer-ful-icon { font-size: 22px; line-height: 1; margin-bottom: 6px; display: block; }
.sr-drawer-ful-name { font: 800 13px/1.2 'Poppins', sans-serif; color: #fff; margin-bottom: 4px; }
.sr-drawer-ful-sub  { font: 500 11px/1.3 'Poppins', sans-serif; color: rgba(255,255,255,0.65); }
.sr-drawer-ful-active .sr-drawer-ful-sub { color: rgba(255,255,255,0.82); }
.sr-drawer-ful-gate-chip {
  display: inline-block;
  margin-left: 6px;
  padding: 2px 7px;
  background: rgba(255,179,102,0.14);
  color: #ffd0a1;
  border: 1px solid rgba(255,179,102,0.4);
  border-radius: 4px;
  font: 700 10px/1 ui-monospace, monospace;
  letter-spacing: 0.02em;
  vertical-align: 1px;
}

/* "See all 7 zones" link under Proceed button */
.sr-drawer-zones-link {
  display: block;
  margin-top: 8px;
  text-align: center;
  padding: 8px;
  color: #7ED957;
  text-decoration: none;
  font: 600 12px/1 'Poppins', sans-serif;
  letter-spacing: 0.03em;
}
.sr-drawer-zones-link:hover { color: #fff; }

/* ============================================================
   v2.9.12.1 — Delivery discovery toast (nudge variant)
   ============================================================ */
.sr-toast-nudge {
  background: linear-gradient(135deg, rgba(126,217,87,0.18), rgba(32,159,72,0.12)) !important;
  border: 1px solid rgba(126,217,87,0.5) !important;
  color: #fff !important;
  display: flex !important;
  align-items: center;
  gap: 10px;
  padding: 12px 14px !important;
  font: 600 13px/1.35 'Poppins', sans-serif !important;
  max-width: 380px;
}
.sr-toast-nudge .sr-toast-msg { flex: 1; }
.sr-toast-nudge .sr-toast-cta {
  padding: 6px 12px;
  background: #7ED957;
  color: #0a0a0a;
  text-decoration: none;
  border-radius: 6px;
  font: 800 11px/1 'Poppins', sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  white-space: nowrap;
}
.sr-toast-nudge .sr-toast-cta:hover { filter: brightness(1.1); }
.sr-toast-nudge .sr-toast-x {
  background: transparent;
  border: 0;
  color: rgba(255,255,255,0.6);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  padding: 0 4px;
}
.sr-toast-nudge .sr-toast-x:hover { color: #fff; }

/* ============================================================
   v2.9.12.1 — Inline field errors in Step 1b (no more silent toasts)
   ============================================================ */
.sr-co-err {
  min-height: 0;
  font: 500 12px/1.4 'Poppins', sans-serif;
  color: #ff8787;
  padding: 0 2px;
  margin: 4px 0 2px;
}
.sr-co-err:empty { display: none; }

.sr-co-input-zip {
  max-width: 140px;
  letter-spacing: 0.16em !important;
  font-family: ui-monospace, monospace !important;
  font-weight: 700 !important;
  font-size: 18px !important;
  text-align: center;
}

/* ============================================================
   v2.9.12.2 — Product card delivery chip (zone-aware discovery)
   ============================================================ */
.sr-card-img-wrap { position: relative; }
.sr-card-deliv-chip {
  position: absolute;
  top: 8px;
  right: 8px;
  padding: 4px 8px;
  background: rgba(11, 11, 11, 0.78);
  backdrop-filter: blur(6px);
  color: #fff;
  border: 1px solid rgba(126, 217, 87, 0.45);
  border-radius: 100px;
  font: 700 10px/1 'Poppins', sans-serif;
  letter-spacing: 0.04em;
  z-index: 2;
  pointer-events: none;
  display: inline-flex;
  align-items: center;
  gap: 3px;
}
.sr-card-deliv-chip.sr-card-deliv-free {
  background: linear-gradient(135deg, rgba(126,217,87,0.95), rgba(32,159,72,0.95));
  color: #0a0a0a;
  border-color: #7ED957;
}

/* ============================================================
   v2.9.12.2 — State-of-the-art confirmation screen
   ============================================================ */
.sr-co-success { text-align: left; padding: 12px 4px; font-family: 'Poppins', sans-serif; }
.sr-co-success-icon {
  width: 64px; height: 64px;
  background: linear-gradient(135deg, #7ED957, #209F48);
  color: #0a0a0a;
  border-radius: 50%;
  font: 800 36px/64px 'Poppins', sans-serif;
  text-align: center;
  margin: 0 auto 16px;
  animation: srConfPop 0.5s cubic-bezier(0.2, 1.4, 0.5, 1);
  box-shadow: 0 18px 44px rgba(32,159,72,0.35);
}
@keyframes srConfPop { 0% { transform: scale(0); } 100% { transform: scale(1); } }
.sr-co-success .sr-co-title { text-align: center; margin: 0 0 10px; font: 800 22px/1.2 'Poppins', sans-serif; color: #fff; }
.sr-co-success-num {
  text-align: center;
  display: inline-block;
  margin: 0 auto 14px;
  padding: 6px 14px;
  background: rgba(126,217,87,0.12);
  color: #7ED957;
  border: 1px solid rgba(126,217,87,0.4);
  border-radius: 8px;
  font: 800 13px/1 ui-monospace, monospace;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  width: auto;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}
.sr-co-eta {
  text-align: center;
  padding: 12px 14px;
  background: rgba(126,217,87,0.08);
  border: 1px solid rgba(126,217,87,0.32);
  border-radius: 10px;
  margin: 14px 0 18px;
  font: 700 14px/1.3 'Poppins', sans-serif;
  color: #fff;
}
.sr-co-recap {
  display: grid;
  gap: 8px;
  margin: 0 0 18px;
  padding: 14px 16px;
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 10px;
}
.sr-co-recap > div {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font: 500 13px/1.3 'Poppins', sans-serif;
  color: rgba(255,255,255,0.72);
}
.sr-co-recap > div span { color: rgba(255,255,255,0.5); font-weight: 600; }
.sr-co-recap > div strong { color: #fff; font-weight: 700; text-align: right; }
.sr-co-recap-total {
  padding-top: 8px;
  border-top: 1px solid rgba(255,255,255,0.1);
  font-size: 15px !important;
}
.sr-co-recap-total strong { color: #7ED957 !important; font-weight: 800 !important; font-size: 16px; }
.sr-co-next {
  padding: 14px 16px;
  background: rgba(0,173,240,0.06);
  border: 1px solid rgba(0,173,240,0.25);
  border-radius: 10px;
  margin: 0 0 16px;
}
.sr-co-next-k { font: 700 10px/1 ui-monospace, monospace; color: #6ec3f5; letter-spacing: 0.14em; text-transform: uppercase; margin-bottom: 8px; }
.sr-co-next ol { margin: 0; padding-left: 20px; color: rgba(255,255,255,0.82); font: 500 13px/1.6 'Poppins', sans-serif; }
.sr-co-next ol li { margin-bottom: 3px; }
.sr-co-next ol li strong { color: #fff; font-weight: 700; }
.sr-co-success-help { text-align: center; font: 500 12px/1.5 'Poppins', sans-serif; color: rgba(255,255,255,0.55); margin: 0 0 16px; }
.sr-co-success-help a { color: #7ED957; text-decoration: none; font-weight: 700; }
.sr-co-success-cta-row { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.sr-co-cta-2 {
  padding: 14px 20px;
  background: transparent;
  color: #e8edf2;
  border: 1px solid rgba(255,255,255,0.2);
  border-radius: 8px;
  font: 700 13px/1 'Poppins', sans-serif;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  cursor: pointer;
}
.sr-co-cta-2:hover { border-color: #7ED957; color: #7ED957; }

/* ============================================================
   v2.9.13 — Dutchie checkout overlay (routes Proceed to Dutchie hosted
   checkout until E-Commerce Pro lands; orders go straight to POS)
   ============================================================ */
#sr-dutchie-overlay {
  position: fixed;
  inset: 0;
  z-index: 9500;
  background: #0a0d15;
  display: flex;
  flex-direction: column;
  font-family: 'Poppins', -apple-system, sans-serif;
  animation: srDoFadeIn .22s ease-out;
}
@keyframes srDoFadeIn { from { opacity: 0; } to { opacity: 1; } }
#sr-dutchie-overlay .sr-do-topbar {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 14px 20px;
  background: linear-gradient(180deg, #0a0d15, #0a0d15 70%, rgba(10,13,21,.92));
  border-bottom: 1px solid rgba(126,217,87,.18);
  color: #fff;
}
#sr-dutchie-overlay .sr-do-brand {
  display: flex;
  flex-direction: column;
  gap: 2px;
  flex: 0 0 auto;
  min-width: 210px;
}
#sr-dutchie-overlay .sr-do-brand strong {
  font: 800 15px/1.1 'Poppins', sans-serif;
  color: #fff;
  letter-spacing: -.01em;
}
#sr-dutchie-overlay .sr-do-brand span {
  font: 500 11px/1.3 'Poppins', sans-serif;
  color: #7ED957;
  letter-spacing: .04em;
}
#sr-dutchie-overlay .sr-do-chiplist {
  flex: 1 1 auto;
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  overflow-x: auto;
  min-width: 0;
}
#sr-dutchie-overlay .sr-do-chip {
  padding: 6px 10px;
  background: rgba(126,217,87,.1);
  border: 1px solid rgba(126,217,87,.32);
  color: #fff;
  border-radius: 100px;
  font: 600 12px/1.2 'Poppins', sans-serif;
  white-space: nowrap;
  letter-spacing: .01em;
}
#sr-dutchie-overlay .sr-do-chip-empty {
  background: rgba(255,255,255,.04);
  border-color: rgba(255,255,255,.12);
  color: rgba(255,255,255,.6);
  font-weight: 500;
}
#sr-dutchie-overlay .sr-do-close {
  flex: 0 0 auto;
  padding: 10px 18px;
  background: transparent;
  border: 1px solid rgba(255,255,255,.22);
  color: #fff;
  border-radius: 8px;
  font: 700 12px/1 'Poppins', sans-serif;
  letter-spacing: .06em;
  text-transform: uppercase;
  cursor: pointer;
  transition: all .15s ease;
}
#sr-dutchie-overlay .sr-do-close:hover {
  border-color: #7ED957;
  color: #7ED957;
}
#sr-dutchie-overlay .sr-do-frame-wrap {
  flex: 1 1 auto;
  min-height: 0;
  background: #fff;
  position: relative;
}
#sr-dutchie-overlay .sr-do-iframe {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
}
@media (max-width: 720px) {
  #sr-dutchie-overlay .sr-do-topbar { flex-wrap: wrap; padding: 10px 14px; gap: 10px; }
  #sr-dutchie-overlay .sr-do-brand { min-width: 0; flex: 1 1 100%; }
  #sr-dutchie-overlay .sr-do-chiplist { flex: 1 1 100%; }
  #sr-dutchie-overlay .sr-do-close { flex: 0 0 auto; padding: 8px 14px; }
}

/* ============================================================
   v2.9.13.1 — DESIGN POLISH PASS
   Audit-driven refinements; memory-checked against v1 kit spec
   (8px radius, 16x32 padding stays). Dr. Doom dominance kept.
   ============================================================ */

/* Hero eyebrow: agent flagged rgba(.4) — boost to full white for readability */
.sr-wrap #srnyc-hero p[style*="color:#7ed957"],
#srnyc-hero > div > div > p:first-of-type {
  color: #7ED957 !important;
  opacity: 1 !important;
}

/* Section heading italic off (v1 parity) — italic restricted to metadata only */
.sr-wrap .sr-section-title,
.sr-wrap .sr-carousel-section h2,
.sr-wrap .sr-hero-featured-cards + * h2 {
  font-style: normal !important;
}
/* Re-allow italic for the "Featured Brand" intentional flourish (scoped) */
#srnyc-hero h2 { font-style: italic !important; }

/* Product card hover: subtle green instead of white flash. (Already set at
   line 1599; this locks it in at highest specificity.) */
body .sr-wrap .sr-card:hover {
  border-color: rgba(126, 217, 87, 0.55) !important;
  box-shadow: 0 14px 36px rgba(126, 217, 87, 0.18) !important;
}

/* Price typography: boost to 800 weight where still at 700 */
.sr-wrap .sr-card .sr-card-price { font-weight: 800 !important; }

/* ============================================================
   v2.9.13.1 — MOBILE BUG FIXES (375px audit findings)
   ============================================================ */
@media (max-width: 480px) {
  /* Announce bar: readable at narrow viewports, wrap marquee text */
  .sr-announce { padding: 8px 12px !important; }
  .sr-announce-inner {
    font-size: 13px !important;
    line-height: 1.35 !important;
    /* keep marquee behavior but slower on tight screens so users can read */
    animation-duration: 40s !important;
  }

  /* Category pills: horizontal scroll with snap instead of wrapping-mess */
  .sr-pills, .sr-pills-inner {
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    scroll-snap-type: x mandatory !important;
    scrollbar-width: none !important;
    -webkit-overflow-scrolling: touch;
    padding: 10px 12px !important;
  }
  .sr-pills::-webkit-scrollbar, .sr-pills-inner::-webkit-scrollbar { display: none; }
  .sr-pill { flex: 0 0 auto !important; scroll-snap-align: start !important; }

  /* Cart badge: prevent overlap with product name + ensure readable */
  .sr-cart-badge, .sr-header-cart-btn .sr-cart-badge {
    min-width: 22px !important;
    height: 22px !important;
    right: -6px !important;
    top: -6px !important;
    font-size: 11px !important;
    border: 2px solid #fff !important;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.35) !important;
  }

  /* Hero: force 1-column below 480px so featured cards stack under text */
  #srnyc-hero-grid { flex-direction: column !important; gap: 24px !important; }
  #srnyc-hero-grid > div { flex: 1 1 100% !important; min-width: 0 !important; width: 100% !important; }

  /* Product cards on the menu: ensure 2-col min, no 3-col squeeze */
  .sr-carousel-grid, .sr-specials-grid, .sr-menu-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 10px !important;
  }
}
@media (max-width: 360px) {
  .sr-carousel-grid, .sr-specials-grid, .sr-menu-grid {
    grid-template-columns: 1fr !important;
  }
}

/* ============================================================
   v2.9.14.7 — MOBILE POLISH PASS
   Gaps vs v1 mobile: hamburger buried, hero too tall (matrix eyebrow
   wraps, SEO H2 eats vertical space, trust row cramped), pills undersized.
   ============================================================ */
@media (max-width: 720px) {

  /* v2.9.14.20 — mobile header tightened to match v1 vertical density (56-60px total) */
  .sr-wrap .sr-header-v27,
  .sr-wrap .sr-header { height: 58px !important; }
  :root { --sr-header-h: 58px !important; }

  /* Hamburger: compact tap target, left of logo */
  .sr-wrap .sr-menu-toggle,
  .sr-wrap #sr-menu-toggle {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 40px !important;
    height: 40px !important;
    padding: 0 !important;
    background: transparent !important;
    border: 1.5px solid rgba(126,217,87,0.45) !important;
    border-radius: 8px !important;
    color: #209F48 !important;
    cursor: pointer !important;
    margin-right: 8px !important;
    flex-shrink: 0 !important;
    order: -1 !important;  /* left of logo */
  }
  .sr-wrap .sr-menu-toggle svg,
  .sr-wrap #sr-menu-toggle svg { width: 22px !important; height: 22px !important; }

  /* Logo slightly smaller on mobile for balance */
  .sr-wrap .sr-logo-v1 img { height: 38px !important; max-width: 170px !important; }

  /* Header inner: spread items with hamburger + logo + cart */
  .sr-wrap .sr-header-inner,
  .sr-wrap .sr-header-v27 .sr-header-inner {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 8px !important;
    padding: 0 14px !important;
    width: 100% !important;
  }
  .sr-wrap .sr-header-v27 { padding: 0 !important; }

  /* Search hidden on mobile (accessed via hamburger drawer) */
  .sr-wrap .sr-header-search { display: none !important; }

  /* v2.9.14.20 — TIGHT hero to match v1 mobile vertical density.
     Camel ribbon overlays (absolute) instead of pushing content; hero starts near top. */
  #srnyc-hero.sr-hero-v14 { padding: 88px 16px 24px !important; }
  .sr-hero-v14 .sr-hero-tagline { font-size: 12.5px !important; margin: 0 0 6px !important; }
  /* Matrix eyebrow: one line, smaller font, tighter letterspacing */
  .sr-hero-v14 .sr-hero-eyebrow {
    font-size: 9.5px !important;
    letter-spacing: 0.12em !important;
    padding: 5px 10px 5px 8px !important;
    gap: 6px !important;
    margin-bottom: 12px !important;
    white-space: nowrap !important;
  }
  .sr-hero-v14 .sr-hero-eyebrow-dot { width: 6px !important; height: 6px !important; }
  /* H1 scaled + tighter leading. v2.9.14.20 — tighter vertical spacing */
  .sr-hero-v14 .sr-hero-h1 {
    font-size: clamp(30px, 9.2vw, 44px) !important;
    line-height: 1.0 !important;
    margin: 0 0 8px !important;
  }
  /* SEO H2 hidden visually on mobile (kept in DOM for crawlers) */
  .sr-hero-v14 .sr-hero-h2 {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
  }
  /* v2.9.14.20 — tighter lede, compact CTA, trust-row as single wrap */
  .sr-hero-v14 .sr-hero-lede {
    font-size: 13.5px !important;
    line-height: 1.45 !important;
    margin: 0 0 14px !important;
  }
  .sr-hero-v14 .sr-hero-cta-row { gap: 8px !important; margin: 0 0 12px !important; }
  .sr-hero-v14 .sr-hero-cta-primary,
  .sr-hero-v14 .sr-hero-cta-secondary {
    width: 100% !important;
    text-align: center !important;
    padding: 13px 18px !important;
    font-size: 13px !important;
  }
  /* Trust strip: single flex row, compact */
  .sr-hero-v14 .sr-hero-trust {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 4px 10px !important;
    font-size: 11px !important;
    line-height: 1.4 !important;
  }
  .sr-hero-v14 .sr-hero-trust > span { justify-content: flex-start !important; }

  /* Featured brand section: below hero copy (already stacked via grid 1fr), tighter gap */
  .sr-hero-v14 .sr-hero-feat { margin-top: 12px !important; }
  .sr-hero-v14 .sr-hero-feat-eyebrow { font-size: 10px !important; margin-bottom: 10px !important; }
  .sr-hero-v14 .sr-hero-featured-cards { gap: 8px !important; }

  /* Category pills: smaller so 4+ fit on screen */
  .sr-wrap .sr-pill {
    padding: 9px 14px !important;
    font-size: 11.5px !important;
    letter-spacing: 0.04em !important;
  }
  .sr-wrap .sr-pills, .sr-wrap .sr-pills-inner {
    padding: 10px 12px !important;
    gap: 8px !important;
  }

  /* Announce bar: readable on mobile */
  .sr-announce-inner { font-size: 12px !important; }
}

/* Hamburger drawer when active */
@media (max-width: 720px) {
  .sr-wrap .sr-nav.sr-nav-open,
  .sr-wrap .sr-nav-v27.sr-nav-open {
    display: flex !important;
    position: fixed !important;
    top: 72px !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    background: #0a0d15 !important;
    flex-direction: column !important;
    padding: 20px 18px !important;
    gap: 0 !important;
    border-top: 1px solid rgba(126,217,87,0.25) !important;
    z-index: 1001 !important;
    overflow-y: auto !important;
  }
  .sr-wrap .sr-nav-open a,
  .sr-wrap .sr-nav-v27.sr-nav-open a {
    padding: 16px 0 !important;
    border-bottom: 1px solid rgba(255,255,255,0.08) !important;
    color: #fff !important;
    font: 700 15px/1 'Poppins', sans-serif !important;
    letter-spacing: 0.04em !important;
  }
}

/* ============================================================
   v2.9.14.18 — PRODUCT CARDS: all-white clean card (v1 parity)
   Sohan: body color close to product image bg for readability.
   Now: white card top-to-bottom with green accent border + dark text.
   ============================================================ */
.sr-wrap .sr-card,
body .sr-wrap .sr-card {
  background: #ffffff !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border: 1px solid rgba(126,217,87,0.28) !important;
  box-shadow: 0 8px 22px rgba(0,0,0,0.35), 0 0 0 1px rgba(126,217,87,0.06) inset !important;
  position: relative !important;
  overflow: hidden !important;
  border-radius: 14px !important;
}
/* Kill any BTC overlay pseudo-element (was ::after) */
.sr-wrap .sr-card::after { display: none !important; }
/* Product image well: WHITE bg like v1 so product photos (shot on white) show correctly */
.sr-wrap .sr-card .sr-card-img-wrap {
  background: #ffffff !important;
  aspect-ratio: 1 / 1 !important;
  overflow: hidden !important;
  display: block !important;
}
.sr-wrap .sr-card .sr-card-img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;  /* v1 uses contain — shows full product; cover was cropping */
  padding: 10px !important;
  background: #ffffff !important;
  transition: transform 0.3s ease;
}
.sr-wrap .sr-card:hover .sr-card-img { transform: scale(1.03); }
.sr-wrap .sr-card .sr-card-body {
  /* v2.9.14.18 — Seamless white continuation of the product image well.
     Sohan: "make it closer to the product image background color" — so body
     matches the #fff image bg for readable dark text, v1-style clean cards. */
  background: #ffffff !important;
  padding: 12px 14px 14px !important;
  border-top: none !important;
  position: relative !important;
}
/* Kill the dark overlay + BTC texture that was making bottom half unreadable */
.sr-wrap .sr-card .sr-card-body::before { display: none !important; }
.sr-wrap .sr-card .sr-card-body > * {
  position: relative;
  z-index: 1;
}
/* v2.9.14.18 — Dark text on white card body for readability */
.sr-wrap .sr-card .sr-card-brand {
  color: #209F48 !important;  /* v1 hover-green for brand eyebrow */
  font: 700 9px/1 ui-monospace, monospace !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  margin-bottom: 4px !important;
}
.sr-wrap .sr-card .sr-card-name {
  color: #0a0a0a !important;
  font: 700 13px/1.3 'Poppins', sans-serif !important;
  margin-bottom: 8px !important;
  min-height: 2.6em !important;
}
.sr-wrap .sr-card .sr-card-price {
  color: #166534 !important;  /* deep green, readable on white */
  font: 800 17px/1 'Poppins', sans-serif !important;
}
.sr-wrap .sr-card .sr-card-weight {
  color: rgba(10,10,10,0.55) !important;
  font: 500 11px/1 'Poppins', sans-serif !important;
  margin-left: 6px !important;
}
/* Badges get darker outline for white bg */
.sr-wrap .sr-card .sr-badge,
.sr-wrap .sr-card .sr-card-meta span {
  color: #0a0a0a !important;
  border: 1px solid rgba(126,217,87,0.4) !important;
  background: rgba(126,217,87,0.12) !important;
}
.sr-wrap .sr-card .sr-card-add-btn {
  width: 100% !important;
  margin-top: 10px !important;
  padding: 10px 12px !important;
  background: linear-gradient(135deg, #7ED957, #209F48) !important;
  color: #0a0a0a !important;
  border: none !important;
  border-radius: 8px !important;
  font: 800 12px/1 'Poppins', sans-serif !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
.sr-wrap .sr-card:hover {
  border-color: rgba(126,217,87,0.6) !important;
  box-shadow: 0 14px 34px rgba(32,159,72,0.2), 0 0 0 1px rgba(126,217,87,0.2) inset !important;
  transform: translateY(-3px) !important;
}
/* Mobile 2-col enforcement (was cramming 3 across at 390px, clipping content) */
@media (max-width: 720px) {
  .sr-wrap .sr-carousel-track,
  .sr-wrap .sr-carousel-grid,
  .sr-wrap .sr-menu-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
  }
  .sr-wrap .sr-card .sr-card-img-wrap { aspect-ratio: 1 / 1 !important; }
  .sr-wrap .sr-card .sr-card-body { padding: 10px 12px 12px !important; }
  .sr-wrap .sr-card .sr-card-name { font-size: 12.5px !important; min-height: 2.6em !important; }
  .sr-wrap .sr-card .sr-card-price { font-size: 15px !important; }
  .sr-wrap .sr-card .sr-card-add-btn { padding: 9px 8px !important; font-size: 11px !important; letter-spacing: 0.04em !important; }
  /* Hide delivery chip on mobile cards — it was cramping the layout */
  .sr-wrap .sr-card .sr-card-deliv-chip {
    top: 4px !important;
    right: 4px !important;
    padding: 2px 6px !important;
    font-size: 8.5px !important;
  }
}
/* Carousel horizontal scroll tracks — v2.9.24.1: 5 visible desktop / 3 tablet / 1.2 mobile.
   Was hardcoded 200px which let 7+ fit on a 1811px wrap. Now calc'd from container width
   so exactly 5 fit per row on desktop, matching the slider page-step. */
.sr-wrap .sr-carousel-track .sr-card,
.sr-wrap .sr-carousel-track .sr-card-skeleton {
  flex: 0 0 calc((100% - 64px) / 5) !important;
  width: calc((100% - 64px) / 5) !important;
  max-width: none !important;
  min-width: 0 !important;
}
@media (max-width: 1279px) and (min-width: 768px) {
  .sr-wrap .sr-carousel-track .sr-card,
  .sr-wrap .sr-carousel-track .sr-card-skeleton {
    flex: 0 0 calc((100% - 28px) / 3) !important;
    width: calc((100% - 28px) / 3) !important;
  }
}
@media (max-width: 767px) {
  .sr-wrap .sr-carousel-track .sr-card,
  .sr-wrap .sr-carousel-track .sr-card-skeleton {
    flex: 0 0 78% !important;
    width: 78% !important;
  }
}
@media (max-width: 720px) {
  .sr-wrap .sr-carousel-track .sr-card {
    flex: 0 0 180px !important;  /* v2.9.14.12 — was 150, bumped to 180 so price + ADD TO CART fit */
    width: 180px !important;
    max-width: 180px !important;
  }
}

/* ============================================================
   v2.9.14.12 — Product card text contrast + price row layout fix
   Issue: names rendering invisible, price + weight wrapping ugly,
   ADD TO CART clipped on narrow cards.
   ============================================================ */
.sr-wrap .sr-card .sr-card-name,
body .sr-wrap .sr-card .sr-card-name,
.sr-wrap .sr-carousel-track .sr-card .sr-card-name {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  opacity: 1 !important;
}
/* Price row: force single-line layout, no flex squeeze */
.sr-wrap .sr-card .sr-card-price-row {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 8px !important;
}
.sr-wrap .sr-card .sr-card-price-row > div:first-child {
  display: flex !important;
  align-items: baseline !important;
  gap: 6px !important;
  flex-wrap: nowrap !important;
  min-width: 0 !important;
}
.sr-wrap .sr-card .sr-card-price {
  white-space: nowrap !important;
  color: #7ED957 !important;
  font: 800 16px/1 'Poppins', sans-serif !important;
}
.sr-wrap .sr-card .sr-card-weight {
  white-space: nowrap !important;
  color: rgba(255,255,255,0.5) !important;
  font: 500 11px/1 'Poppins', sans-serif !important;
  margin-left: 0 !important;
}
/* Ensure ADD TO CART shows full text at 180px+ cards */
.sr-wrap .sr-card .sr-card-add-btn {
  width: 100% !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  padding: 10px 6px !important;
  min-width: 0 !important;
  overflow: visible !important;
  text-overflow: clip !important;
  font-size: 11px !important;
  letter-spacing: 0.03em !important;
}
.sr-wrap .sr-card .sr-card-add-btn svg {
  flex-shrink: 0 !important;
  margin-right: 4px !important;
}
@media (max-width: 400px) {
  .sr-wrap .sr-card .sr-card-add-btn { font-size: 10.5px !important; padding: 9px 4px !important; }
}

/* ============================================================
   v2.9.14.16 — UFO THRUSTER CAMEL GLOW
   Tight rim light around the silhouette, not a big nuclear halo.
   "Power thruster alien ufo glow" — concentrated right around the
   camel outline, gentle breath, no wide diffuse aura.
   ============================================================ */
#srnyc-hero.sr-hero-v14 > .sr-hero-camel,
.sr-hero-v14 .sr-hero-camel {
  position: absolute !important;
  top: 18px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: clamp(280px, 34vw, 460px) !important;
  height: auto !important;
  aspect-ratio: 3.6 / 1 !important;
  z-index: 4 !important;
  pointer-events: none !important;
}
/* Kill the previous wide outer aura */
.sr-hero-v14 .sr-hero-camel::before { display: none !important; }
/* Kill the separate halo div — use only drop-shadows on the image itself so
   the glow hugs the actual camel silhouette (alpha-aware) instead of the
   bounding box */
.sr-hero-v14 .sr-hero-camel-flame { display: none !important; }
.sr-hero-v14 .sr-hero-camel-img {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  /* v2.9.24.26 — Perf fix (Agent1 audit): 4-stack drop-shadow -> 2, and
     srCamelThruster disabled (it animates filter = most expensive prop on
     mobile, and it competed with sr-doombot-breathe further down the file
     for the same img — double-animation on filter was Sohan's "slow" feel). */
  filter:
    drop-shadow(0 0 8px rgba(126, 217, 87, 0.75))
    drop-shadow(0 2px 6px rgba(0, 0, 0, 0.55));
  animation: none !important;
}
@keyframes srCamelThruster {
  0% {
    transform: scale(1);
    filter:
      drop-shadow(0 0 3px rgba(200, 255, 160, 0.7))
      drop-shadow(0 0 8px rgba(126, 217, 87, 0.55))
      drop-shadow(0 0 14px rgba(32, 159, 72, 0.3))
      drop-shadow(0 2px 6px rgba(0, 0, 0, 0.5));
  }
  100% {
    transform: scale(1.02);
    filter:
      drop-shadow(0 0 6px rgba(200, 255, 160, 1))
      drop-shadow(0 0 14px rgba(168, 255, 112, 0.85))
      drop-shadow(0 0 22px rgba(126, 217, 87, 0.55))
      drop-shadow(0 2px 8px rgba(0, 0, 0, 0.55));
  }
}
@media (max-width: 960px) {
  .sr-hero-v14 .sr-hero-camel {
    top: 14px !important;
    width: clamp(240px, 60vw, 360px) !important;
  }
}
@media (max-width: 720px) {
  .sr-hero-v14 .sr-hero-camel {
    top: 10px !important;
    width: 72vw !important;
    max-width: 320px !important;
  }
}
@media (prefers-reduced-motion: reduce) {
  .sr-hero-v14 .sr-hero-camel,
  .sr-hero-v14 .sr-hero-camel-flame,
  .sr-hero-v14 .sr-hero-camel-img { animation: none !important; }
}

/* ============================================================
   v2.9.14.9 — SHOP SPECIALS & SAVE mobile sizing fix
   Cards were rendering 498px wide at 390px viewport = horizontal overflow.
   Root cause: .sr-specials-grid had grid-template-columns: 348px (fixed) not 1fr.
   ============================================================ */
@media (max-width: 720px) {
  .sr-wrap .sr-specials-section {
    padding: 48px 14px !important;
  }
  .sr-wrap .sr-specials-grid {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    max-width: 100% !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  .sr-wrap .sr-special-card {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
  }
  .sr-wrap .sr-special-card img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 3 / 1 !important;
    object-fit: cover !important;
    display: block !important;
  }
  .sr-wrap .sr-special-card .sr-special-overlay {
    padding: 14px 16px !important;
  }
  .sr-wrap .sr-special-card .sr-special-overlay span {
    font-size: 13px !important;
  }
}



/* ============================================================
   v2.9.14 — UNIFIED DESIGN SYSTEM POLISH
   One consolidated block: footer, modal, pills, headings, cards.
   ============================================================ */

/* --- Section heading rhythm (consistent scale + spacing) --- */
.sr-wrap .sr-section-title,
.sr-wrap .sr-carousel-section > h2,
.sr-wrap .sr-specials-section .sr-section-title {
  font: 800 clamp(22px, 3vw, 32px)/1.15 'Poppins', -apple-system, sans-serif !important;
  letter-spacing: -0.015em !important;
  color: #ffffff !important;
  text-align: center !important;
  margin: 0 auto 28px !important;
  max-width: 900px !important;
}
.sr-wrap .sr-section-sub {
  font: 500 14px/1.55 'Poppins', sans-serif !important;
  color: rgba(255,255,255,0.62) !important;
  text-align: center !important;
  margin: -20px auto 32px !important;
  max-width: 640px !important;
  letter-spacing: 0 !important;
}

/* --- Category pills: active glow + hover lift --- */
.sr-wrap .sr-pill {
  transition: transform .15s ease, border-color .15s ease, background-color .15s ease, box-shadow .2s ease !important;
  padding: 10px 18px !important;
  font: 700 13px/1 'Poppins', sans-serif !important;
  letter-spacing: 0.03em !important;
  border-width: 1.5px !important;
}
.sr-wrap .sr-pill.sr-pill-active {
  box-shadow: 0 8px 22px rgba(126,217,87,0.32), 0 0 0 1px rgba(126,217,87,0.5) !important;
  background: linear-gradient(135deg, #7ED957, #209F48) !important;
  color: #0a0a0a !important;
  border-color: transparent !important;
}
.sr-wrap .sr-pill:not(.sr-pill-active):hover {
  transform: translateY(-1px);
  border-color: rgba(126,217,87,0.65) !important;
  background: rgba(126,217,87,0.06) !important;
}
.sr-wrap .sr-pill-dot { display: none; }

/* --- Product modal typography polish --- */
.sr-wrap .sr-modal-brand {
  font: 700 10px/1 ui-monospace, monospace !important;
  letter-spacing: 0.16em !important;
  text-transform: uppercase !important;
  color: rgba(126,217,87,0.9) !important;
  margin-bottom: 8px !important;
}
.sr-wrap .sr-modal-name {
  font: 800 clamp(22px, 2.6vw, 30px)/1.15 'Poppins', sans-serif !important;
  letter-spacing: -0.015em !important;
  color: #ffffff !important;
  margin: 0 0 14px !important;
}
.sr-wrap .sr-modal-price {
  font: 800 30px/1.1 'Poppins', sans-serif !important;
  color: #7ED957 !important;
  margin: 14px 0 18px !important;
  letter-spacing: -0.01em !important;
}
.sr-wrap .sr-modal-badges {
  margin-bottom: 14px !important;
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
}

/* --- Footer polish (tighter typography, green section labels + BTC watermark bg) --- */
.sr-wrap .sr-footer {
  padding: 52px 24px 0 !important;
  background-color: #0a0a0a !important;
  /* v2.9.14.15 — v1 parity: BTC pattern watermark across footer bg */
  background-image: url("https://u8l.335.myftpupload.com/wp-content/uploads/2026/04/SR-BTC-Pattern.svg?v=2721") !important;
  background-repeat: repeat !important;
  background-size: 200px 200px !important;
  background-position: 0 0 !important;
  background-blend-mode: overlay !important;
  border-top: 1px solid rgba(126,217,87,0.12) !important;
  position: relative !important;
}
/* Dark overlay to dim the BTC pattern so text stays readable */
.sr-wrap .sr-footer::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(10,10,10,0.85) 0%, rgba(10,10,10,0.92) 100%);
  pointer-events: none;
  z-index: 0;
}
.sr-wrap .sr-footer > * { position: relative; z-index: 1; }
.sr-wrap .sr-footer-inner {
  max-width: 1280px !important;
  margin: 0 auto !important;
  display: grid !important;
  grid-template-columns: 1.2fr 1fr 1fr 1fr 1fr !important;
  gap: 32px !important;
  padding-bottom: 36px !important;
  border-bottom: 1px solid rgba(255,255,255,0.08) !important;
}
@media (max-width: 900px) {
  .sr-wrap .sr-footer-inner { grid-template-columns: 1fr 1fr !important; gap: 28px !important; }
}
@media (max-width: 560px) {
  .sr-wrap .sr-footer-inner { grid-template-columns: 1fr !important; gap: 24px !important; }
}
.sr-wrap .sr-footer-col h4 {
  font: 800 12px/1 'Poppins', sans-serif !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: #7ED957 !important;
  margin: 0 0 14px !important;
}
.sr-wrap .sr-footer-col a,
.sr-wrap .sr-footer-col p {
  display: block;
  font: 500 13.5px/1.9 'Poppins', sans-serif !important;
  color: rgba(255,255,255,0.72) !important;
  text-decoration: none !important;
  transition: color .15s ease;
}
.sr-wrap .sr-footer-col a:hover { color: #7ED957 !important; }
/* v2.9.14.15 — Big camel logo in footer left column, matches v1 exactly */
.sr-wrap .sr-footer-logo img,
.sr-wrap img.sr-footer-logo-img {
  width: 100% !important;
  max-width: 260px !important;
  height: auto !important;
  margin-bottom: 12px !important;
  display: block !important;
  filter: drop-shadow(0 0 20px rgba(126,217,87,0.35));
}
.sr-wrap .sr-footer-social {
  display: flex !important;
  gap: 10px !important;
  margin-top: 6px;
}
.sr-wrap .sr-footer-social a {
  width: 32px !important;
  height: 32px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(126,217,87,0.32) !important;
  border-radius: 6px !important;
  color: #7ED957 !important;
  line-height: 1 !important;
  transition: all .15s ease;
}
.sr-wrap .sr-footer-social a:hover {
  background: rgba(126,217,87,0.1) !important;
  border-color: #7ED957 !important;
  transform: translateY(-1px);
}
.sr-wrap .sr-footer-hours > div {
  display: flex !important;
  justify-content: space-between !important;
  gap: 10px !important;
  font: 500 12.5px/1.8 'Poppins', sans-serif !important;
  color: rgba(255,255,255,0.72) !important;
}
.sr-wrap .sr-footer-hours > div span:last-child { color: rgba(255,255,255,0.5) !important; }
.sr-wrap .sr-footer-bottom {
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 20px 0 !important;
  display: flex !important;
  justify-content: space-between !important;
  gap: 16px !important;
  flex-wrap: wrap !important;
  font: 500 12px/1.55 'Poppins', sans-serif !important;
  color: rgba(255,255,255,0.55) !important;
}
.sr-wrap .sr-footer-legal { color: rgba(255,255,255,0.55) !important; }
.sr-wrap .sr-footer-legal a { color: rgba(255,255,255,0.7) !important; text-decoration: none !important; }
.sr-wrap .sr-footer-legal a:hover { color: #7ED957 !important; }
.sr-wrap .sr-footer-credit {
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 14px 0 28px !important;
  border-top: 1px dashed rgba(255,255,255,0.06) !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  flex-wrap: wrap !important;
  font: 500 11px/1.4 'Poppins', sans-serif !important;
}
.sr-wrap .sr-credit-eyebrow {
  font: 700 10px/1 ui-monospace, monospace !important;
  color: rgba(126,217,87,0.7) !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
}
.sr-wrap .sr-credit-name {
  color: #fff !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}
.sr-wrap .sr-credit-name:hover { color: #7ED957 !important; }
.sr-wrap .sr-credit-sep { color: rgba(255,255,255,0.3) !important; }
.sr-wrap .sr-credit-mail { color: rgba(255,255,255,0.55) !important; text-decoration: none !important; font-family: ui-monospace, monospace !important; }
.sr-wrap .sr-credit-mail:hover { color: #7ED957 !important; }

/* --- Product card subtle upgrade: image ratio consistency + price alignment --- */
.sr-wrap .sr-card .sr-card-img-wrap {
  aspect-ratio: 1 / 1 !important;
  overflow: hidden;
  background: #111;
}
.sr-wrap .sr-card .sr-card-img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  transition: transform .35s ease;
}
.sr-wrap .sr-card:hover .sr-card-img { transform: scale(1.04); }
.sr-wrap .sr-card .sr-card-body { padding: 14px 14px 16px !important; }
.sr-wrap .sr-card .sr-card-brand {
  font: 700 9px/1 ui-monospace, monospace !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: rgba(126,217,87,0.7) !important;
  margin-bottom: 4px !important;
}
.sr-wrap .sr-card .sr-card-name {
  font: 700 14px/1.3 'Poppins', sans-serif !important;
  color: #fff !important;
  letter-spacing: -0.005em !important;
  margin-bottom: 8px !important;
  min-height: 2.6em;
}

/* ============================================================
   v2.9.14.17 — Header logo: B&W pro + lightning/power look
   Sohan directive: "make it black and white, not led/neon — super pro
   look like powerful lightning." Grayscale + boosted contrast +
   white/black crisp drop-shadows for an electrical punch.
   ============================================================ */
.sr-wrap .sr-logo.sr-logo-v1,
.sr-wrap .sr-logo-v1 {
  display: inline-flex !important;
  align-items: center !important;
  flex-shrink: 0 !important;
  height: auto !important;
  max-width: none !important;
}
.sr-wrap .sr-logo-v1 img,
.sr-wrap img.sr-logo-wordmark-v1 {
  height: 52px !important;
  max-height: 52px !important;
  width: auto !important;
  max-width: 260px !important;
  object-fit: contain !important;
  display: block !important;
  /* v2.9.14.21 — v1 logo asset is already pure B&W. Minimal filter for a
     subtle "powerful lightning" edge lift — no grayscale (it's already B&W). */
  filter: drop-shadow(0 2px 6px rgba(0,0,0,0.15)) !important;
  transition: transform 0.2s ease;
}
.sr-wrap .sr-logo-v1:hover img {
  transform: scale(1.02);
  filter: drop-shadow(0 4px 12px rgba(0,0,0,0.22)) !important;
}
@media (max-width: 720px) {
  .sr-wrap .sr-logo-v1 img { height: 42px !important; max-width: 200px !important; }
}

/* ============================================================
   v2.9.14.13 / v2.9.25.21 — Footer compliance banner.
   Kept high-contrast like v1, but without the old yellow palette.
   ============================================================ */
.sr-wrap .sr-footer-compliance {
  /* Full-bleed compliance band (escape the footer's max-width container) */
  margin: 0 -9999px !important;
  padding: 20px 20px 22px !important;
  background: #ffffff !important;
  border-top: 1px solid rgba(0,0,0,.14) !important;
  font: 600 12.5px/1.55 'Poppins', -apple-system, sans-serif !important;
  color: #0a0a0a !important;
  text-align: center !important;
  position: relative !important;
}
.sr-wrap .sr-footer-compliance > * {
  max-width: 960px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.sr-wrap .sr-footer-compliance p {
  margin: 0 auto 8px !important;
  max-width: 960px !important;
  color: #0a0a0a !important;
}
.sr-wrap .sr-footer-compliance p:last-child { margin-bottom: 0 !important; }
.sr-wrap .sr-footer-compliance strong {
  color: #000000 !important;
  font-weight: 800 !important;
}
.sr-wrap .sr-footer-compliance a {
  color: #0a0a0a !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
  font-weight: 800 !important;
}
.sr-wrap .sr-footer-compliance a:hover {
  color: #166534 !important;
}
@media (max-width: 720px) {
  .sr-wrap .sr-footer-compliance {
    padding: 16px 14px 18px !important;
    font-size: 11.5px !important;
    line-height: 1.5 !important;
  }
}


/* ============================================================
   v2.9.14.1 — HERO REDESIGN
   Dr. Doom dominance: bold benefit headline, tight hierarchy,
   trust strip, zone-aware sub-copy.
   ============================================================ */
.sr-hero-v14 {
  position: relative;
  background:
    radial-gradient(ellipse 80% 60% at 20% 30%, rgba(126,217,87,0.08), transparent 60%),
    radial-gradient(ellipse 60% 60% at 85% 70%, rgba(32,159,72,0.06), transparent 60%),
    linear-gradient(180deg, #06080f 0%, #0a0d15 60%, #050710 100%);
  padding: 56px 24px 52px !important;
  overflow: hidden;
  width: 100%;
  border-bottom: 1px solid rgba(126,217,87,0.1);
}
/* v2.9.14.4 — ID+class selector needed: `#srnyc-hero > *` at line 2163
   sets position:relative on every child. Bump specificity to beat it. */
#srnyc-hero.sr-hero-v14 > .sr-hero-wm,
.sr-hero-v14 .sr-hero-wm {
  /* v2.9.14.17 — moved to LEFT (was centered), ALL WHITE via brightness(0) + invert
     for a futuristic digital watermark feel. */
  position: absolute !important;
  top: 50% !important;
  left: 0 !important;
  transform: translate(-18%, -50%) !important;
  opacity: 0.11 !important;
  pointer-events: none !important;
  z-index: 0 !important;
  width: auto !important;
  max-width: none !important;
  height: auto !important;
  line-height: 0 !important;
}
#srnyc-hero.sr-hero-v14 > .sr-hero-wm img,
.sr-hero-v14 .sr-hero-wm img {
  width: clamp(500px, 65vw, 900px) !important;
  height: auto !important;
  display: block !important;
  max-width: none !important;
  /* All white: flattens any color to pure white silhouette */
  filter: brightness(0) invert(1) drop-shadow(0 0 24px rgba(255,255,255,0.15)) !important;
}
@media (max-width: 720px) {
  .sr-hero-v14 .sr-hero-wm { transform: translate(-30%, -50%) !important; opacity: 0.08 !important; }
  .sr-hero-v14 .sr-hero-wm img { width: 95vw !important; }
}
#srnyc-hero.sr-hero-v14 > .sr-hero-glow,
.sr-hero-v14 .sr-hero-glow {
  position: absolute !important;
  top: -20% !important; left: -10% !important;
  width: 55% !important; height: 150% !important;
  pointer-events: none !important;
  z-index: 0 !important;
}
.sr-hero-v14 .sr-hero-glow {
  position: absolute;
  top: -20%; left: -10%;
  width: 55%; height: 150%;
  background: radial-gradient(ellipse at center, rgba(126,217,87,0.07) 0%, transparent 70%);
  pointer-events: none;
  z-index: 0;
}
.sr-hero-v14 .sr-hero-grid {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: 56px;
  max-width: 1360px;
  margin: 0 auto;
  /* v2.9.14.2 — top-align cols so tall featured-products column doesn't push
     the H1 below the fold (v2.9.14.1 regression). */
  align-items: start;
}
@media (max-width: 960px) {
  .sr-hero-v14 .sr-hero-grid { grid-template-columns: 1fr; gap: 32px; }
}

/* Copy column */
.sr-hero-v14 .sr-hero-copy { position: relative; z-index: 2; }
/* v2.9.14.2 — italic green tagline above eyebrow (v1 parity) */
.sr-hero-v14 .sr-hero-tagline {
  font: 500 italic 15px/1.3 'Poppins', sans-serif;
  color: #7ED957;
  margin: 0 0 10px;
  letter-spacing: 0.005em;
}
.sr-hero-v14 .sr-hero-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 14px 6px 10px;
  background: rgba(126,217,87,0.08);
  border: 1px solid rgba(126,217,87,0.38);
  border-radius: 100px;
  font: 800 11px/1 ui-monospace, Menlo, monospace;
  color: #7ED957;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  margin-bottom: 14px;
}
/* v2.9.14.2 — H2 under H1: SEO-anchor keyword, visible but secondary */
.sr-hero-v14 .sr-hero-h2 {
  font: 600 14px/1.4 'Poppins', sans-serif;
  color: rgba(255,255,255,0.55);
  letter-spacing: 0.03em;
  text-transform: uppercase;
  margin: -14px 0 20px;
}
.sr-hero-v14 .sr-hero-eyebrow-dot {
  width: 8px; height: 8px;
  border-radius: 50%;
  background: #7ED957;
  animation: srHeroPulse 1.6s ease-in-out infinite;
  box-shadow: 0 0 0 0 rgba(126,217,87,0.7);
}
@keyframes srHeroPulse {
  0%,100% { box-shadow: 0 0 0 0 rgba(126,217,87,0.7); }
  50% { box-shadow: 0 0 0 10px rgba(126,217,87,0); }
}
.sr-hero-v14 .sr-hero-cursor { animation: sr-blink 1s infinite; margin-left: 2px; }

.sr-hero-v14 .sr-hero-h1 {
  font: 800 clamp(36px, 5.4vw, 72px)/0.98 'Poppins', -apple-system, sans-serif;
  color: #ffffff;
  letter-spacing: -0.025em;
  margin: 0 0 22px;
  text-shadow: 0 2px 20px rgba(0,0,0,0.5);
}
.sr-hero-v14 .sr-hero-accent {
  background: linear-gradient(135deg, #7ED957, #209F48);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

.sr-hero-v14 .sr-hero-lede {
  font: 500 clamp(15px, 1.5vw, 18px)/1.5 'Poppins', sans-serif;
  color: rgba(255,255,255,0.78);
  margin: 0 0 28px;
  max-width: 600px;
}
.sr-hero-v14 .sr-hero-lede strong { color: #7ED957; font-weight: 800; }

.sr-hero-v14 .sr-hero-cta-row {
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
  align-items: center;
  margin-bottom: 24px;
}
.sr-hero-v14 .sr-hero-cta-primary {
  display: inline-block;
  padding: 17px 32px;
  background: linear-gradient(135deg, #7ED957, #209F48);
  color: #0a0a0a;
  border-radius: 8px;
  text-decoration: none;
  font: 800 14px/1 'Poppins', sans-serif;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  box-shadow: 0 12px 32px rgba(32,159,72,0.38);
  transition: transform 0.18s ease, box-shadow 0.18s ease;
}
.sr-hero-v14 .sr-hero-cta-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 42px rgba(32,159,72,0.55);
  color: #0a0a0a;
}
.sr-hero-v14 .sr-hero-cta-secondary {
  display: inline-block;
  padding: 16px 24px;
  background: rgba(255,255,255,0.02);
  border: 1px solid rgba(126,217,87,0.45);
  border-radius: 8px;
  color: #e8edf2;
  text-decoration: none;
  font: 700 13px/1 'Poppins', sans-serif;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  transition: all 0.18s ease;
}
.sr-hero-v14 .sr-hero-cta-secondary:hover {
  border-color: #7ED957;
  color: #7ED957;
  background: rgba(126,217,87,0.06);
}

/* v2.9.25.133 — AI Budtender hero CTA (additive; opens existing drawer).
   Two-line, distinct green-glow treatment so it reads as the "smart" door. */
.sr-hero-v14 .sr-hero-cta-bud {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  padding: 11px 20px;
  background: rgba(126,217,87,0.08);
  border: 1px solid rgba(126,217,87,0.55);
  border-radius: 8px;
  color: #e8edf2;
  cursor: pointer;
  font-family: 'Poppins', sans-serif;
  text-align: left;
  line-height: 1.2;
  transition: transform 0.18s ease, box-shadow 0.18s ease, background 0.18s ease;
}
.sr-hero-v14 .sr-hero-cta-bud:hover {
  transform: translateY(-2px);
  background: rgba(126,217,87,0.16);
  box-shadow: 0 14px 34px rgba(126,217,87,0.45);
}
.sr-hero-v14 .sr-hero-cta-bud-r1 {
  font: 800 13.5px/1.2 'Poppins', sans-serif;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}
.sr-hero-v14 .sr-hero-cta-bud-spark { color: #7ED957; }
.sr-hero-v14 .sr-hero-cta-bud-r2 {
  font: 500 11.5px/1.25 'Poppins', sans-serif;
  color: rgba(200,220,205,0.82);
  letter-spacing: 0;
  text-transform: none;
}
.sr-hero-v14 .sr-hero-cta-bud-pulse {
  position: absolute;
  top: -5px; right: -5px;
  width: 11px; height: 11px;
  border-radius: 50%;
  background: #7ED957;
  box-shadow: 0 0 0 0 rgba(126,217,87,0.6);
  animation: srBudCtaPulse 1.9s infinite;
}
@keyframes srBudCtaPulse {
  0%   { box-shadow: 0 0 0 0 rgba(126,217,87,0.55); }
  70%  { box-shadow: 0 0 0 9px rgba(126,217,87,0); }
  100% { box-shadow: 0 0 0 0 rgba(126,217,87,0); }
}
@media (prefers-reduced-motion: reduce) {
  .sr-hero-v14 .sr-hero-cta-bud-pulse { animation: none; }
}

/* Trust strip */
.sr-hero-v14 .sr-hero-trust {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  align-items: center;
  font: 600 12.5px/1.4 'Poppins', sans-serif;
  color: rgba(255,255,255,0.62);
  letter-spacing: 0.01em;
}
.sr-hero-v14 .sr-hero-trust > span {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.sr-hero-v14 .sr-hero-trust strong {
  color: #7ED957;
  font-weight: 800;
  margin-right: 2px;
}

/* Featured brand column */
.sr-hero-v14 .sr-hero-feat { position: relative; z-index: 2; }
.sr-hero-v14 .sr-hero-feat-eyebrow {
  font: 800 11px/1 ui-monospace, Menlo, monospace;
  color: rgba(126,217,87,0.85);
  letter-spacing: 0.18em;
  text-transform: uppercase;
  margin: 0 0 14px;
  text-align: center;
}
.sr-hero-v14 .sr-hero-featured-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
}
@media (max-width: 600px) {
  .sr-hero-v14 .sr-hero-featured-cards { grid-template-columns: repeat(3, 1fr); gap: 6px; }
  .sr-hero-v14 { padding: 36px 16px 40px !important; }
  .sr-hero-v14 .sr-hero-h1 { font-size: clamp(32px, 9vw, 44px); }
  .sr-hero-v14 .sr-hero-cta-primary { width: 100%; text-align: center; padding: 16px 20px; }
  .sr-hero-v14 .sr-hero-cta-secondary { width: 100%; text-align: center; padding: 14px 20px; }
  .sr-hero-v14 .sr-hero-cta-bud { width: 100%; align-items: center; text-align: center; padding: 12px 20px; }
  .sr-hero-v14 .sr-hero-trust { gap: 10px; font-size: 11.5px; }
}

/* ============================================================
   v2.9.15 — V1 PARITY THEME OVERRIDE  (2026-04-19)
   Flips v2 from Dr-Doom-dark to v1-white visual parity.
   Hero stays dark — creates the single dark BAND like v1.
   Everything else: white body, white nav, green accents, dark text.
   Loaded LAST so it beats all prior dark rules.
   ============================================================ */
:root {
  --sr-bg: #FFFFFF;
  --sr-bg-card: #FFFFFF;
  --sr-bg-surface: #F3F4F3;
  --sr-text: #000000;
  --sr-text-secondary: #333333;
  --sr-text-muted: #666666;
  --sr-border: #E5E5E5;
}
html { background-color: #FFFFFF !important; }
body {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  background-image: none !important;
  color: #000000 !important;
}
body::before, body::after { display: none !important; }
#sr-galaxy { display: none !important; }

/* v2.9.25.21 — Deprecated green announce generation neutralized.
   Keep selector for cascade compatibility, but force the canonical black/white
   bar so first paint never exposes an old green treatment. */
html body .sr-announce,
html body div.sr-announce,
html body .sr-wrap .sr-announce,
html body .sr-announce .sr-announce-inner {
  background: #000000 !important;
  background-image: none !important;
  color: #FFFFFF !important;
  border-bottom: 1px solid rgba(255,255,255,.22) !important;
  padding: 6px 0 !important;
}
html body .sr-announce,
html body .sr-announce a,
html body .sr-announce * { color: #FFFFFF !important; }
html body .sr-announce a { text-decoration: underline !important; font-weight: 700 !important; }

/* Header — white with dark text */
.sr-header {
  background: #FFFFFF !important;
  border-bottom: 1px solid #E5E5E5 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
.sr-header,
.sr-header a,
.sr-header .sr-nav a,
.sr-header .sr-nav > * { color: #000000 !important; }
.sr-header a:hover,
.sr-header .sr-nav a:hover { color: #209F48 !important; }

/* Pills bar — white bg with green outlined pills */
.sr-pills,
.sr-pills-v291 {
  background: #FFFFFF !important;
  background-image: none !important;
  border-bottom: 1px solid #E5E5E5 !important;
  padding: 14px 32px 16px !important;
}
body .sr-wrap .sr-pills .sr-pill,
.sr-pills > a,
.sr-pills a.sr-pill {
  background: #FFFFFF !important;
  color: #000000 !important;
  border: 2px solid #7ED957 !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  font-weight: 700 !important;
}
body .sr-wrap .sr-pills .sr-pill:hover,
.sr-pills > a:hover {
  background: #E1FDD6 !important;
  color: #000000 !important;
  border-color: #209F48 !important;
}
body .sr-wrap .sr-pills .sr-pill.sr-pill-active,
.sr-pills > a.sr-pill-active {
  background: #7ED957 !important;
  color: #FFFFFF !important;
  border-color: #7ED957 !important;
}
.sr-pill-dot { display: none !important; }

/* Status bar — white under-nav strip (html body for homepage-v3.css override) */
html body .sr-status-bar,
html body div.sr-status-bar,
html body .sr-wrap .sr-status-bar,
html body .sr-status-bar-top {
  background: #FFFFFF !important;
  background-image: none !important;
  color: #000000 !important;
  border-bottom: 1px solid #E5E5E5 !important;
  padding: 8px 24px !important;
}
html body .sr-status-bar *,
html body .sr-status-bar a { color: #000000 !important; }
html body .sr-status-open { background: #7ED957 !important; }
html body .sr-status-closed { background: #e55 !important; }
html body .sr-status-inner {
  display: flex !important;
  gap: 14px !important;
  align-items: center !important;
  justify-content: center !important;
  flex-wrap: wrap !important;
  max-width: 1400px !important;
  margin: 0 auto !important;
  padding: 8px 24px !important;
  background: #FFFFFF !important;
  background-image: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: #000000 !important;
  font: 600 13px/1.3 'Poppins', sans-serif !important;
}
/* Kill the old status bar's negative-margin pull-up + narrow width */
html body .sr-wrap .sr-status-bar {
  max-width: none !important;
  margin: 0 !important;
}
html body .sr-status-divider {
  width: 1px !important; height: 14px !important;
  background: #cfcfcf !important;
  display: inline-block !important;
}

/* Hero — keep dark band but clean clutter */
.sr-hero-v14,
#srnyc-hero {
  background: #0f1511 !important;
  background-image:
    radial-gradient(ellipse at 30% 30%, rgba(126,217,87,0.08) 0%, transparent 60%),
    linear-gradient(180deg, #0f1511 0%, #121a2f 100%) !important;
}
.sr-hero-wm { opacity: 0.10 !important; }
.sr-hero-bsmoke { opacity: 0.55 !important; }

/* Content sections — white with dark text */
.sr-section,
.sr-specials-section,
.sr-carousel-section,
.sr-moods-section,
.sr-categories-section,
.sr-lounge-section,
.sr-faq-section,
.sr-about-section,
.sr-press-section,
.sr-igf-section,
.sr-events-section,
.sr-stats-section,
.sr-whyus-section,
.sr-signup-banner,
.sr-seo-about {
  background: #FFFFFF !important;
  color: #000000 !important;
}
.sr-section *,
.sr-specials-section *,
.sr-carousel-section *,
.sr-moods-section *,
.sr-categories-section *,
.sr-lounge-section .sr-lounge-perk-text {
  color: inherit;
}

/* Section titles — solid black, no gradient-clip */
.sr-section-title,
.sr-carousel-title,
.sr-wrap h2.sr-section-title,
.sr-wrap h2.sr-carousel-title {
  color: #000000 !important;
  background: none !important;
  background-image: none !important;
  background-clip: unset !important;
  -webkit-background-clip: unset !important;
  -webkit-text-fill-color: #000000 !important;
}
.sr-section-sub { color: #333333 !important; }

/* Product / special / carousel cards — white with border */
.sr-card,
.sr-product-card,
.sr-special-card,
.sr-carousel-track .sr-card,
.sr-mood-card,
.sr-category-card {
  background: #FFFFFF !important;
  color: #000000 !important;
  border: 1px solid #E5E5E5 !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.05) !important;
}
.sr-card *,
.sr-product-card *,
.sr-card-body,
.sr-card-body * { color: #000000 !important; }
.sr-card-body .sr-price,
.sr-card-body .sr-badge-hybrid { color: #FFFFFF !important; }
.sr-card-body .sr-badge-sativa { color: #166534 !important; }
.sr-card-body .sr-badge-indica { color: #0F3D1C !important; }

/* Newsletter — brand dark */
.sr-newsletter {
  background: linear-gradient(180deg, #0a0d0a, #0f1511) !important;
  color: #ffffff !important;
  border-top: 1px solid rgba(126,217,87,.24) !important;
}
.sr-newsletter input {
  background: #0f1511 !important;
  color: #ffffff !important;
  border: 1px solid rgba(126,217,87,.28) !important;
}

/* Lounge section — v2.9.24.5: radial gradient (charcoal → near-black) per Sohan paint note. */
.sr-lounge-section {
  background:
    radial-gradient(ellipse 1100px 600px at 18% 12%, rgba(126,217,87,0.10), transparent 60%),
    radial-gradient(ellipse 900px 700px at 82% 88%, rgba(32,159,72,0.08), transparent 60%),
    linear-gradient(165deg, #1a2030 0%, #0f1511 50%, #050608 100%) !important;
  color: #FFFFFF !important;
}
.sr-lounge-section .sr-section-title,
.sr-lounge-section h2,
.sr-lounge-section h3,
.sr-lounge-title {
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
}
.sr-lounge-section p,
.sr-lounge-section span,
.sr-lounge-pass-footer span,
.sr-lounge-perk-text span { color: #c8d0e0 !important; }

/* Footer — white */
.site-footer, .ast-footer-site-identity, .footer-widget-area {
  background: #FFFFFF !important;
  color: #000000 !important;
}

/* v2.9.15.3 — Camel stays in hero center with breathe/glow (reverted per Sohan) */

/* v2.9.15.6 — SCROLL-PERF: scrolling was janky. Kill the big offenders:
   1. background-attachment: fixed on body — massive scroll cost every frame
   2. backdrop-filter blur(20px) on header — expensive composite on scroll
   3. Keep galaxy canvas OFF (was display:none, reinforce w/ visibility)
   4. Remove box-shadow transitions on hover-heavy elements
   Need html body.sr-overridden to beat line-1295's body {...!important} chain,
   which has 5 fixed-attachment layers painting every scroll frame. */
html body,
html body.page,
html body.home,
html body.page-id-32 {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  background-image: none !important;
  background-attachment: scroll !important;
  background-repeat: no-repeat !important;
}
html body #sr-galaxy,
html body canvas#sr-galaxy {
  display: none !important;
  visibility: hidden !important;
}
html body .sr-header {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
/* Defuse expensive filters on sections that exist all over the page */
html body .sr-card:hover,
html body .sr-product-card:hover,
html body .sr-special-card:hover,
html body .sr-mood-card:hover,
html body .sr-category-card:hover {
  transform: translateY(-2px) !important;
}
html body .sr-card,
html body .sr-product-card {
  will-change: auto !important;
}
/* Disable any lingering fixed-position body::before decoration */
html body::before, html body::after {
  position: static !important;
  display: none !important;
}
/* v2.9.15.8 — PRODUCT MODAL CONTRAST FIX
   The modal was transparent (bg: var(--sr-bg) not applying on nested layers)
   over a dark backdrop (.sr-modal::before = rgba(0,0,0,0.6) + blur 8px).
   Effect: dim gray text on dark backdrop = unreadable.
   Fix: solid white content surface + dark text throughout. */
html body .sr-modal-content,
html body .sr-modal-content > * {
  color: #0a0a0a !important;
}
html body .sr-modal-content {
  background: #FFFFFF !important;
  box-shadow: 0 24px 80px rgba(0,0,0,0.25) !important;
  border-radius: 20px !important;
}
html body .sr-modal-img-col {
  background: #F3F4F3 !important;
}
html body .sr-modal-info-col {
  background: #FFFFFF !important;
  padding: 32px 28px !important;
}
html body .sr-modal-brand {
  color: #209F48 !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  font-size: 12px !important;
}
html body .sr-modal-title,
html body .sr-modal h1,
html body .sr-modal h2 {
  color: #0a0a0a !important;
}
html body .sr-modal-price {
  color: #209F48 !important;
}
/* Pills row: EDIBLES / HYBRID / THC — dark on white */
html body .sr-modal .sr-badge,
html body .sr-modal [class*="sr-badge"],
html body .sr-modal-category,
html body .sr-modal-strain-type,
html body .sr-modal-thc {
  background: #F3F4F3 !important;
  color: #0a0a0a !important;
  border: 1px solid #E5E5E5 !important;
}
/* The "1 case available" + "EFFECTS:" pills that were barely-visible gray */
html body .sr-modal-stock,
html body .sr-modal-effects-pill,
html body .sr-modal [class*="stock"],
html body .sr-modal [class*="effects"] {
  color: #444 !important;
  background: #F7F8F7 !important;
  border: 1px solid #E5E5E5 !important;
}
/* Modal close button visible on white */
html body .sr-modal-close {
  background: #F3F4F3 !important;
  color: #0a0a0a !important;
  border: 1px solid #E5E5E5 !important;
}
html body .sr-modal-close:hover {
  background: #209F48 !important;
  color: #fff !important;
  border-color: #209F48 !important;
}
/* Quantity stepper */
html body .sr-modal-qty-btn,
html body .sr-modal button[class*="qty"] {
  background: #FFFFFF !important;
  color: #0a0a0a !important;
  border: 1px solid #E5E5E5 !important;
}
html body .sr-modal-qty-input,
html body .sr-modal input[type="number"] {
  background: #FFFFFF !important;
  color: #0a0a0a !important;
  border: 1px solid #E5E5E5 !important;
}
/* Description + body copy */
html body .sr-modal-description,
html body .sr-modal-body-section,
html body .sr-modal p,
html body .sr-modal li,
html body .sr-modal-content p,
html body .sr-modal-content li {
  color: #1a1a1a !important;
}
/* LVL badges — keep green, just ensure good contrast */
html body .sr-modal .sr-lvl-badge,
html body .sr-modal [class*="lvl-badge"] {
  background: #7ED957 !important;
  color: #0a0a0a !important;
  font-weight: 800 !important;
}
/* v2.9.15.8 — real class names: sr-nerd-* + sr-lvl-card (not sr-effect-*) */
html body .sr-modal .sr-lvl-card,
html body .sr-modal .sr-nerd-effects-block,
html body .sr-modal .sr-nerd-strain-block,
html body .sr-modal [class*="nerd-"][class*="-block"] {
  background: #F7F8F7 !important;
  border: 1px solid #E5E5E5 !important;
  color: #0a0a0a !important;
}
html body .sr-modal .sr-nerd-section-label {
  color: #209F48 !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
}
html body .sr-modal .sr-nerd-effects-grid {
  background: transparent !important;
}
html body .sr-modal .sr-nerd-effect-card {
  background: #FFFFFF !important;
  border: 1px solid #E5E5E5 !important;
  color: #0a0a0a !important;
}
html body .sr-modal .sr-nerd-effect-label {
  color: #0a0a0a !important;
  font-weight: 700 !important;
}
html body .sr-modal .sr-nerd-effect-blurb,
html body .sr-modal .sr-nerd-effect-meta,
html body .sr-modal .sr-nerd-effect-meta * {
  color: #444 !important;
}
html body .sr-modal .sr-nerd-strain-pill,
html body .sr-modal [class*="strain-pill"] {
  background: #7ED957 !important;
  color: #0a0a0a !important;
  font-weight: 700 !important;
}
html body .sr-modal .sr-nerd-strain-desc,
html body .sr-modal [class*="strain-desc"] {
  color: #1a1a1a !important;
}
/* Catch-all for any nerd-panel text */
html body .sr-modal [class*="nerd-"] {
  color: #0a0a0a !important;
}
html body .sr-modal [class*="nerd-"] em,
html body .sr-modal [class*="nerd-"] span:not(.sr-lvl-badge):not(.sr-nerd-section-label):not(.sr-nerd-strain-pill):not([class*="pill"]):not(.sr-nerd-effect-emoji) {
  color: inherit !important;
}
/* Add-to-cart stays green gradient — no change needed */

/* Also: cart drawer text readability (if any dim parts) */
html body .sr-drawer {
  background: #FFFFFF !important;
  color: #0a0a0a !important;
}
html body .sr-drawer *,
html body .sr-drawer h2,
html body .sr-drawer h3,
html body .sr-drawer p,
html body .sr-drawer span:not(.sr-badge):not([class*="badge"]),
html body .sr-drawer a:not(.sr-cta):not([class*="cta"]) {
  color: #0a0a0a !important;
}
html body .sr-drawer .sr-drawer-item {
  background: #FFFFFF !important;
  border-bottom: 1px solid #E5E5E5 !important;
}
html body .sr-drawer-summary {
  background: #F7F8F7 !important;
}

/* ============================================================
   v2.9.16 — HARD WHITE + SEO PARITY (beats all prior dark rules)
   Agents found 35% v1 parity because body was still rgb(10,14,28)
   even after my override. Nuke at highest specificity.
   ============================================================ */
html, html body, body.sr-dark, body:not(.sr-dark) {
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  background-image: none !important;
  color: #0a0a0a !important;
}
html body::before, html body::after { content: none !important; display: none !important; }
html body #sr-galaxy, html #sr-galaxy, canvas#sr-galaxy {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
}
/* Specials section — v1 pale mint band, not black */
html body .sr-specials-section {
  background: #E1FDD6 !important;
  background-image: none !important;
  color: #0a0a0a !important;
  padding: 48px 0 !important;
}
html body .sr-specials-section .sr-section-title,
html body .sr-specials-section h2 {
  color: #0a0a0a !important;
  -webkit-text-fill-color: #0a0a0a !important;
  background: none !important;
  background-image: none !important;
}
/* Hide Astra's empty entry-header on homepage */
body.home .entry-header,
body.page-id-32 .entry-header,
body.home h1.entry-title,
body.page-id-32 h1.entry-title,
h1.entry-title.sr-demoted {
  display: none !important;
}
/* ========== end v2.9.16 override ========== */




/* ==========================================================================
   v2.9.22.0 — VISUAL POLISH per Sohan-approved design options
   V2 hero padding compress, V3 H1 two-line editorial, V4 section density,
   V5 Budtender drawer phantom-height fix, V7 explore-by 2-col.
   ========================================================================== */

/* V2 — hero padding compress.
   Mobile 88/16/24 → 56/16/40 (balance + save 16px).
   Desktop 56/24/52 → 48/24/40 (tighter breathing). */
@media (max-width: 720px) {
  html body #srnyc-hero.sr-hero-v14,
  html body .sr-hero-v14 {
    padding: 56px 16px 40px !important;
  }
}
html body .sr-hero-v14 {
  padding: 48px 24px 40px !important;
}

/* V3 — H1 two-line editorial with weight contrast.
   Line-height 1.0 was cramped; bump to 1.12. If the HTML uses a <br> to split
   the H1 into two lines, this styles the second line as lighter weight + muted. */
html body .sr-hero-v14 .sr-hero-h1 {
  line-height: 1.12 !important;
  letter-spacing: -0.015em !important;
  font-weight: 800 !important;
}
html body .sr-hero-v14 .sr-hero-h1 .sr-hero-h1-sub,
html body .sr-hero-v14 .sr-hero-h1 br + * {
  font-weight: 400 !important;
  color: rgba(255,255,255,0.72) !important;
  font-size: 0.62em !important;
  letter-spacing: 0 !important;
  display: inline-block !important;
  margin-top: 4px !important;
}
/* Fallback for v2 home hero where second sentence sits inside the h1 as plain text
   after a <br>. Apply to the h1's text-node via a CSS pseudo trick doesn't work
   reliably, so rely on the JS-side html having the span.sr-hero-h1-sub wrap. */

/* V4 — homepage section padding tighten 80/60 → 48.
   Applies to homepage-v3.css section rhythm classes + generic .sr-section. */
html body .sr-section,
html body [class*="sr-section-"],
html body .sr-home > section,
html body #srnyc-home > section,
html body .sr-featured-section,
html body .sr-moods-section,
html body .sr-categories-section,
html body .sr-specials-section,
html body .sr-events-section,
html body .sr-press-section,
html body .sr-strain-section,
html body .sr-about-section,
html body .sr-faq-section,
html body .sr-igf-section,
html body .sr-stats-section {
  padding-top: 48px !important;
  padding-bottom: 48px !important;
}
@media (max-width: 720px) {
  html body .sr-section,
  html body [class*="sr-section-"],
  html body .sr-home > section,
  html body #srnyc-home > section,
  html body .sr-featured-section,
  html body .sr-moods-section,
  html body .sr-categories-section,
  html body .sr-specials-section,
  html body .sr-events-section,
  html body .sr-press-section,
  html body .sr-strain-section,
  html body .sr-about-section,
  html body .sr-faq-section,
  html body .sr-igf-section,
  html body .sr-stats-section {
    padding-top: 36px !important;
    padding-bottom: 36px !important;
  }
}

/* V5 — AI Budtender drawer fixed-position slide-in. Stops phantom 1202px layout. */
html body .sr-bud-drawer {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: auto !important;
  width: 400px !important;
  max-width: 90vw !important;
  height: 100vh !important;
  max-height: 100vh !important;
  margin: 0 !important;
  z-index: 9998 !important;
  transform: translateX(100%) !important;
  transition: transform .32s cubic-bezier(.4,0,.2,1) !important;
  overflow-y: auto !important;
  box-shadow: -24px 0 60px rgba(0,0,0,.4) !important;
  will-change: transform !important;
}
html body .sr-bud-drawer.sr-bud-open {
  transform: translateX(0) !important;
}
@media (max-width: 600px) {
  html body .sr-bud-drawer {
    width: 100vw !important;
    max-width: 100vw !important;
  }
}

/* V7 — explore-by 2-col on desktop.
   Let the inner div flex across 2 columns so the pill groups stack side-by-side
   above the viewport width, cutting vertical height ~50%. */
@media (min-width: 960px) {
  html body .sr-explore-by > div {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 24px 40px !important;
    align-items: start !important;
  }
  /* Group 1 (categories) + group 2 (effects) side by side = row 1 */
  /* Group 3 (strains) spans full width — too many pills for a column */
  html body .sr-explore-by > div > div:nth-of-type(3),
  html body .sr-explore-by > div > div:nth-of-type(5),
  html body .sr-explore-by > div > div:nth-of-type(6) {
    grid-column: 1 / -1 !important;
  }
  html body .sr-explore-by h2 {
    grid-column: 1 / -1 !important;
  }
  html body .sr-explore-by > div > p:first-of-type {
    grid-column: 1 / -1 !important;
  }
}

/* ========== end v2.9.22.0 visual polish ========== */

/* ==========================================================================
   v2.9.23.0 — V8 footer fix + Wave combo 1+3 (SVG ribbon + canvas on dark band)
   Sohan's picks: V8 bug-fix, V9/V11-B images + link (handled in homepage-v5.js),
   V10-B merge deferred (simpler alternative: just tighten padding further here),
   wave = options 1+3 layered per his pick.
   ========================================================================== */

/* V8 — Footer bug: nuke the light inner-card background so the whole footer is
   one dark slab like v1. Also fix the dark-on-dark invisible dev credit. */
html body .sr-footer-inner,
html body .sr-wrap .sr-footer-inner {
  background: transparent !important;
  background-color: transparent !important;
}
html body .sr-footer,
html body .sr-wrap .sr-footer,
html body footer.sr-footer {
  background: #0a0a0a !important;
  color: rgba(255,255,255,0.78) !important;
}
/* Credit row: Sohan keeps the "BUILT BY So$$$" credit but it needs to be READABLE.
   Force white text on the dark footer; keep the green accent on hover. */
html body .sr-footer-credit,
html body .sr-wrap .sr-footer-credit {
  color: rgba(255,255,255,0.58) !important;
  background: transparent !important;
}
html body .sr-footer-credit .sr-credit-eyebrow {
  color: rgba(126,217,87,0.9) !important;
}
html body .sr-footer-credit a,
html body .sr-footer-credit .sr-credit-name,
html body .sr-footer-credit .sr-credit-mail {
  color: #ffffff !important;
  text-decoration: none !important;
}
html body .sr-footer-credit a:hover {
  color: #7ED957 !important;
}
/* Column h4 / links — match v1's white-on-dark */
html body .sr-wrap .sr-footer-col h4 {
  color: #7ED957 !important;
}
html body .sr-wrap .sr-footer-col a,
html body .sr-wrap .sr-footer-col p,
html body .sr-wrap .sr-footer-col span {
  color: rgba(255,255,255,0.78) !important;
}

/* V10-B-lite — tighten sr-whyus + sr-lounge padding further. Full merge deferred
   to next ship; this at least stops them looking as empty. Pair with a denser
   content pass when time permits. */
html body .sr-whyus-section,
html body .sr-lounge-section {
  padding-top: 40px !important;
  padding-bottom: 40px !important;
}
@media (max-width: 720px) {
  html body .sr-whyus-section,
  html body .sr-lounge-section {
    padding-top: 28px !important;
    padding-bottom: 28px !important;
  }
}

/* === WAVE COMBO 1 + 3 — Sohan's pick ============================================
   Option 1: SVG sine ribbon of micro ₿ glyphs on white section boundaries.
   Option 3: Canvas ₿ flow-field on the dark hero band only.
   Per feedback_v2_discipline.md: FX confined to negative space — NEVER over
   product cards. Hero band is dark so canvas; section dividers are white so SVG.
   ================================================================================ */

/* 1 — SVG ribbon band, auto-injected between sections via the inline separator. */
.sr-wave-ribbon {
  position: relative;
  height: 48px;
  overflow: hidden;
  pointer-events: none;
  opacity: 0.55;
  margin: 0;
}
.sr-wave-ribbon svg {
  position: absolute;
  inset: 0;
  width: 200%;
  height: 100%;
  transform: translateY(-50%);
  top: 50%;
}
.sr-wave-ribbon text {
  font: bold 11px ui-monospace, Menlo, monospace;
  fill: #209F48;
  letter-spacing: 0.1em;
}
.sr-wave-ribbon .sr-wave-stream {
  animation: sr-wave-drift 18s linear infinite;
}
@keyframes sr-wave-drift {
  to { transform: translateX(-60px); }
}
@media (prefers-reduced-motion: reduce) {
  .sr-wave-ribbon .sr-wave-stream { animation: none; }
}

/* Auto-ribbon between major sections — inserted via the homepage-v5 inject hook. */
.sr-wave-ribbon.sr-wave-above-hero-footer {
  opacity: 0.45;
  margin-top: -20px;
}

/* 3 — Canvas flow-field on hero band (tuned sr-galaxy if present).
   Uses the existing #sr-galaxy canvas — we just swap its particle glyph from
   stars to ₿ when data-sr-wave="combo" is set on body. */
body[data-sr-wave="combo"] #sr-galaxy,
body[data-sr-wave="combo"] .sr-hero-v14 canvas {
  opacity: 0.62 !important;
  mix-blend-mode: screen !important;
}

/* ========== end v2.9.23.0 ========== */

/* ==========================================================================
   v2.9.23.2 — DOOMBOT glowing+breathing effect on v2 hero camel.
   Sohan 2026-04-19 23:30: "save what u got on v2 the glowing and breathing is perfect".
   The camel image itself was swapped in homepage-v5.js to the trademark
   512x512 webp. These rules add breath + bloom + halo + reduced-motion support.
   Class chain: .sr-hero-camel.doombot-camel on the wrapper.
   ========================================================================== */

html body .sr-hero-camel.doombot-camel {
  position: relative;
  isolation: isolate;
}

html body .sr-hero-camel.doombot-camel .sr-hero-camel-img {
  position: relative;
  z-index: 2;
  filter:
    drop-shadow(0 0 10px rgba(126, 217, 87, 0.75))
    drop-shadow(0 0 22px rgba(126, 217, 87, 0.55))
    drop-shadow(0 0 42px rgba(32, 159, 72, 0.40)) !important;
  animation: sr-doombot-breathe 2.6s cubic-bezier(.45,.05,.55,.95) infinite !important;
  will-change: transform, filter;
}

/* Halo ring behind the camel — sits in the flame div we already have */
html body .sr-hero-camel.doombot-camel::before {
  content: '';
  position: absolute;
  inset: -8%;
  z-index: 1;
  border-radius: 50%;
  background: radial-gradient(
    circle at 50% 50%,
    rgba(126, 217, 87, 0.48) 0%,
    rgba(126, 217, 87, 0.24) 30%,
    rgba(32, 159, 72, 0.10) 60%,
    transparent 75%
  );
  filter: blur(18px);
  animation: sr-doombot-halo 3.8s ease-in-out infinite;
  pointer-events: none;
}

@keyframes sr-doombot-breathe {
  0%, 100% {
    transform: scale(1);
    filter: drop-shadow(0 0 10px rgba(126,217,87,.75)) drop-shadow(0 0 22px rgba(126,217,87,.55)) drop-shadow(0 0 42px rgba(32,159,72,.40));
  }
  50% {
    transform: scale(1.04);
    filter: drop-shadow(0 0 16px rgba(126,217,87,.95)) drop-shadow(0 0 32px rgba(126,217,87,.72)) drop-shadow(0 0 58px rgba(32,159,72,.58));
  }
}

@keyframes sr-doombot-halo {
  0%, 100% { opacity: 0.8; transform: scale(1);    }
  50%      { opacity: 1;   transform: scale(1.08); }
}

@media (prefers-reduced-motion: reduce) {
  html body .sr-hero-camel.doombot-camel .sr-hero-camel-img,
  html body .sr-hero-camel.doombot-camel::before { animation: none !important; }
}

/* ========== end v2.9.23.2 ========== */

/* v2.9.24.1 — carousel sizing handled in-place above (lines 1610 + 6809
   directly edited). No append-only override needed. */

/* ========== v2.9.24.4 — Sohan paint feedback ship (19 marks) ==========
   Pulled from /wp-json/silkroad/v1/paint-feedback. Every rule below maps to
   a specific painted note. */

/* A — REMOVALS ============================================================== */

/* #19 — hide 160-link "Explore Silk Road NYC" footer section per Sohan note
   "i think all this down here needs to be hidden" at y=14458 */
html body .sr-explore-by { display: none !important; }

/* B — SIZING ================================================================ */

/* #1 — hero featured cards bigger (was cramped 220px) */
@media (min-width: 768px) {
  html body .sr-hero-featured-cards {
    max-width: 720px !important;
    gap: 14px !important;
  }
  html body .sr-hero-featured-cards .sr-card .sr-card-name {
    font-size: 13.5px !important;
    line-height: 1.35 !important;
  }
  html body .sr-hero-featured-cards .sr-card .sr-card-price {
    font-size: 16px !important;
  }
  html body .sr-hero-featured-cards .sr-card .sr-card-body {
    padding: 12px !important;
    gap: 5px !important;
  }
  html body .sr-hero-featured-cards .sr-card .sr-card-add-btn {
    padding: 10px !important;
    font-size: 12px !important;
  }
}

/* #2 — Shop Specials cards: source images are 1500×492 (3.05:1 banner ratio).
   v2.9.24.11 — was forcing min-height:360 + object-fit:cover which CROPPED the
   rectangular banners and lost half the image. Now match the source aspect
   ratio so the entire banner shows. */
html body .sr-special-card {
  border-radius: 14px !important;
  overflow: hidden !important;
  aspect-ratio: 1500 / 492 !important;
  min-height: 0 !important;
  height: auto !important;
  background: #0f1511 !important;
}
html body .sr-special-card img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  min-height: 0 !important;
  display: block !important;
}
html body .sr-specials-grid {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 16px !important;
  max-width: 1280px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
@media (max-width: 900px) {
  html body .sr-specials-grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
}

/* #3 — Mood pill labels bigger + clean borders */
html body .sr-mood-label {
  font-size: 15px !important;
  font-weight: 700 !important;
  padding: 10px 22px !important;
  border: 1.5px solid rgba(255,255,255,0.35) !important;
  border-radius: 100px !important;
  letter-spacing: 0.04em !important;
  background: rgba(0,0,0,0.55) !important;
  backdrop-filter: blur(4px) !important;
  -webkit-backdrop-filter: blur(4px) !important;
}
html body .sr-mood-card { border-radius: 12px !important; overflow: hidden !important; }

/* #4 — Product card body — better info hierarchy: brand → name → meta → price+btn */
html body .sr-wrap .sr-carousel-track .sr-card .sr-card-body {
  padding: 14px 16px 16px !important;
  gap: 6px !important;
  display: flex !important;
  flex-direction: column !important;
}
html body .sr-wrap .sr-carousel-track .sr-card .sr-card-brand {
  font-size: 10.5px !important;
  letter-spacing: 0.08em !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  color: #6b7280 !important;
  margin-bottom: 2px !important;
}
html body .sr-wrap .sr-carousel-track .sr-card .sr-card-name {
  font-size: 14.5px !important;
  line-height: 1.32 !important;
  min-height: 2.6em !important;
  font-weight: 700 !important;
  color: #0a0a0a !important;
}
html body .sr-wrap .sr-carousel-track .sr-card .sr-card-meta {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 6px !important;
  margin-top: 4px !important;
}
html body .sr-wrap .sr-carousel-track .sr-card .sr-card-price {
  font-size: 17.5px !important;
  font-weight: 800 !important;
  color: #0a0a0a !important;
  margin-top: 6px !important;
}
html body .sr-wrap .sr-carousel-track .sr-card .sr-card-add-btn {
  margin-top: 8px !important;
  padding: 11px !important;
  font-weight: 700 !important;
  letter-spacing: 0.05em !important;
  border-radius: 8px !important;
  background: linear-gradient(180deg, #7ED957, #209F48) !important;
  color: #051a09 !important;
}

/* #7 — sr-cat-label (category labels) larger + contrast */
html body .sr-cat-label {
  font-size: 17px !important;
  font-weight: 800 !important;
  padding: 14px 22px !important;
  letter-spacing: 0.04em !important;
  background: rgba(0,0,0,0.7) !important;
  color: #fff !important;
  border: 1.5px solid rgba(126,217,87,0.4) !important;
  border-radius: 100px !important;
  backdrop-filter: blur(4px) !important;
  -webkit-backdrop-filter: blur(4px) !important;
}

/* #10 — sr-event-meta 11px → 14px */
html body .sr-event-meta {
  font-size: 14px !important;
  color: rgba(255,255,255,0.75) !important;
  gap: 14px !important;
  font-weight: 500 !important;
}

/* #11 — sr-igf-tile bigger (223 → 280px) */
html body .sr-igf-tile {
  min-height: 280px !important;
  aspect-ratio: 1/1 !important;
  border-radius: 12px !important;
}

/* C — POLISH =============================================================== */

/* #6 — Lounge section solid #0f1511 → radial gradient (charcoal → near-black) */
html body .sr-lounge-section {
  background:
    radial-gradient(ellipse 1100px 600px at 18% 12%, rgba(126,217,87,0.10), transparent 60%),
    radial-gradient(ellipse 900px 700px at 82% 88%, rgba(32,159,72,0.08), transparent 60%),
    linear-gradient(165deg, #1a2030 0%, #0f1511 50%, #050608 100%) !important;
}
html body .sr-lounge-section .sr-lounge-perk {
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(126,217,87,0.18) !important;
  border-radius: 12px !important;
  padding: 16px !important;
}

/* #9 — sr-compare-us text contrast (was barely-visible white-on-light-green) */
html body .sr-compare-us,
html body .sr-compare-row > div:first-child {
  color: #fff !important;
  background: linear-gradient(180deg, rgba(126,217,87,0.18), rgba(126,217,87,0.08)) !important;
  font-weight: 600 !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.5) !important;
}
html body .sr-compare-head > div.sr-compare-us {
  color: #7ED957 !important;
  text-shadow: 0 0 12px rgba(126,217,87,0.5) !important;
}

/* #12 — sr-signup-cta upgrade: solid green button instead of outlined (more "do it") */
html body .sr-signup-cta {
  background: linear-gradient(180deg, #7ED957, #209F48) !important;
  color: #051a09 !important;
  border-color: #7ED957 !important;
  font-size: 15px !important;
  padding: 18px 44px !important;
  box-shadow: 0 8px 24px rgba(126,217,87,0.28) !important;
}
html body .sr-signup-cta:hover {
  filter: brightness(1.08) !important;
  transform: translateY(-1px) !important;
}

/* #13 — sr-collage-logo: PNG without transparent bg looks bad on light card.
   Replace bg with branded gradient frame so the logo "fits" intentionally. */
html body .sr-collage-logo {
  background: linear-gradient(135deg, rgba(126,217,87,0.22), #0f1511 55%) !important;
  border: 1.5px solid rgba(126,217,87,0.4) !important;
  box-shadow: 0 0 0 1px rgba(0,0,0,0.05), 0 8px 24px rgba(0,0,0,0.06) !important;
}

/* #14 — sr-collage-interior renders blank for Sohan ("this is blank, why").
   Image loads at 1024x576 but visually weak — hide it; layout stays clean
   without it. Logo + Staff + Counter banner remain. */
html body .sr-collage-interior { display: none !important; }

/* #16 — Footer camel logo: glow + breathe (same as hero camel) */
@keyframes sr-footer-camel-breathe {
  0%, 100% {
    transform: scale(1);
    filter: drop-shadow(0 0 18px rgba(126,217,87,0.28));
  }
  50% {
    transform: scale(1.035);
    filter:
      drop-shadow(0 0 32px rgba(126,217,87,0.55))
      drop-shadow(0 0 56px rgba(126,217,87,0.3));
  }
}
html body .sr-wrap .sr-footer-logo img,
html body .sr-wrap img.sr-footer-logo-img,
html body img.sr-footer-logo-img {
  animation: sr-footer-camel-breathe 3.4s ease-in-out infinite !important;
  transform-origin: center center !important;
}
@media (prefers-reduced-motion: reduce) {
  html body .sr-wrap .sr-footer-logo img,
  html body .sr-wrap img.sr-footer-logo-img,
  html body img.sr-footer-logo-img { animation: none !important; }
}

/* #17 — Footer ₿ background pattern + faint logo watermark (like v1) */
html body .sr-footer { position: relative !important; isolation: isolate !important; }
html body .sr-footer::before {
  content: "";
  position: absolute;
  top: 0; right: 0; bottom: 0; left: 0;
  pointer-events: none;
  z-index: 0;
  opacity: 0.85;
  background-image:
    radial-gradient(ellipse 800px 400px at 50% 0%, rgba(126,217,87,0.08), transparent 60%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Ctext x='70' y='90' font-size='52' text-anchor='middle' fill='%237ED957' opacity='0.05' font-family='-apple-system,Helvetica,sans-serif' font-weight='700'%3E%E2%82%BF%3C/text%3E%3C/svg%3E");
  background-repeat: no-repeat, repeat;
  background-size: auto, 140px 140px;
}
html body .sr-footer > * { position: relative; z-index: 1; }

/* #18 — Hunt yellow in footer. Replace any amber/yellow with brand green or white. */
html body .sr-footer [style*="color:#ffcc"],
html body .sr-footer [style*="color: #ffcc"],
html body .sr-footer [style*="color:#fbbf24"],
html body .sr-footer [style*="color:yellow"],
html body .sr-footer .sr-yellow,
html body .sr-footer .sr-amber,
html body .sr-footer [class*="amber"],
html body .sr-footer [class*="yellow"] {
  color: #7ED957 !important;
}
html body .sr-footer h2,
html body .sr-footer h3,
html body .sr-footer h4,
html body .sr-footer .sr-footer-title,
html body .sr-footer .sr-footer-eyebrow,
html body .sr-footer-col h4 { color: #fff !important; }
html body .sr-footer a { color: rgba(255,255,255,0.78) !important; }
html body .sr-footer a:hover { color: #7ED957 !important; }

/* ========== end v2.9.24.4 ========== */

/* ========== v2.9.24.5 — Sohan blank-area + Codex feedback + splash =========
   Maps to: chapter cards looking "blank" + lounge gradient cascade + Codex notes
   on stale event date + premium-trust footer credit removal. */

/* Sr-about-v23 chapter cards: were small dark cards floating in big white expanse.
   Make them visually loud so the section reads as intentional, not blank. */
html body section.sr-about-v23,
html body div.sr-about-v23 {
  padding: 96px 24px !important;
  max-width: 1280px !important;
  background: linear-gradient(180deg, #f8faf6 0%, #ffffff 50%, #f8faf6 100%) !important;
}
html body .sr-about-v23 .sr-about-eyebrow {
  font-size: 13px !important;
  letter-spacing: 0.28em !important;
}
html body .sr-about-v23 h2 {
  font-size: clamp(32px, 5vw, 52px) !important;
  color: #0a0a0a !important;
  margin-bottom: 22px !important;
}
html body .sr-about-v23 .sr-about-lede {
  font-size: 19px !important;
  color: rgba(10, 10, 10, 0.72) !important;
  max-width: 820px !important;
  margin: 0 auto 56px !important;
}
html body .sr-about-chapters {
  gap: 28px !important;
}
html body .sr-about-chapter {
  padding: 40px 32px !important;
  min-height: 340px !important;
  background: linear-gradient(180deg, #0f1511 0%, #050608 100%) !important;
  border: 1px solid rgba(126, 217, 87, 0.35) !important;
  box-shadow: 0 24px 56px rgba(0,0,0,0.22), 0 0 0 1px rgba(126,217,87,0.15) !important;
  border-radius: 16px !important;
  position: relative;
  overflow: hidden;
}
html body .sr-about-chapter::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse at top right, rgba(126,217,87,0.10), transparent 60%);
  pointer-events: none;
}
html body .sr-about-chapter > * { position: relative; z-index: 1; }
html body .sr-about-chapter .sr-about-num {
  font-size: 64px !important;
  color: rgba(126, 217, 87, 0.32) !important;
  margin-bottom: 12px !important;
  font-weight: 900 !important;
}
html body .sr-about-chapter h3 {
  font-size: 24px !important;
  color: #7ED957 !important;
  margin-bottom: 16px !important;
  font-weight: 800 !important;
}
html body .sr-about-chapter p {
  font-size: 15.5px !important;
  color: rgba(255, 255, 255, 0.82) !important;
  line-height: 1.7 !important;
}

/* Hide "BUILT BY So$$$ Website Maker" credit per Codex premium-trust note.
   Specificity boosted to beat .sr-wrap .sr-footer-credit (0,0,2,0) at line 7201. */
html body .sr-wrap .sr-footer-credit,
html body .sr-footer .sr-footer-credit,
html body div.sr-footer-credit { display: none !important; }

/* Hide the redundant `.sr-about` block (the chapters above already tell the story).
   The newsletter→FAQ "blank gap" Sohan flagged was this generic about block looking
   weak. Removing it tightens flow. */
html body .sr-newsletter + .sr-faq-section,
html body .sr-newsletter ~ .sr-about,
html body div.sr-about:not(.sr-about-v23) { display: none !important; }

/* ========== end v2.9.24.5 ========== */

/* ========== v2.9.24.7 — Spacing + responsive pass (v1 vs v2 audit) ============
   Audit: v1 = 7,775px doc · 7 sections each ~500px · tight + intentional
          v2 = 13,265px doc · 18 sections · 1,776px combined padding (way too much)
   Strategy: standardize section padding at 32px desktop / 24px tablet / 20px mobile.
   Drops total doc by ~700-900px, sections feel intentional instead of bloated. */

/* Standardize all v2 section padding (was 40-96px, now 32px) */
html body .sr-wrap .sr-specials-section,
html body .sr-wrap .sr-moods-section,
html body .sr-wrap .sr-categories-section,
html body .sr-wrap .sr-carousel-section,
html body .sr-wrap .sr-whyus-section,
html body .sr-wrap .sr-events-section,
html body .sr-wrap .sr-igf-section,
html body .sr-wrap .sr-press-section,
html body .sr-wrap .sr-signup-banner,
html body .sr-wrap .sr-seo-about,
html body .sr-wrap .sr-newsletter,
html body .sr-wrap .sr-faq-section,
html body .sr-wrap .sr-faq,
html body .sr-wrap .sr-stats-section,
html body .sr-wrap .sr-lounge-section {
  padding-top: 36px !important;
  padding-bottom: 36px !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* About-v23 chapters section — was 96px, now 48px (still has visual breathing room) */
html body .sr-wrap .sr-about-v23,
html body section.sr-about-v23,
html body div.sr-about-v23 {
  padding: 48px 24px !important;
}

/* Footer — slightly more padding for last-section weight */
html body .sr-wrap .sr-footer { padding-top: 48px !important; padding-bottom: 24px !important; }

/* Tablet — tighter still */
@media (max-width: 1024px) {
  html body .sr-wrap .sr-specials-section,
  html body .sr-wrap .sr-moods-section,
  html body .sr-wrap .sr-categories-section,
  html body .sr-wrap .sr-carousel-section,
  html body .sr-wrap .sr-whyus-section,
  html body .sr-wrap .sr-events-section,
  html body .sr-wrap .sr-igf-section,
  html body .sr-wrap .sr-press-section,
  html body .sr-wrap .sr-signup-banner,
  html body .sr-wrap .sr-seo-about,
  html body .sr-wrap .sr-newsletter,
  html body .sr-wrap .sr-faq-section,
  html body .sr-wrap .sr-faq,
  html body .sr-wrap .sr-stats-section,
  html body .sr-wrap .sr-lounge-section {
    padding-top: 28px !important;
    padding-bottom: 28px !important;
  }
  html body .sr-wrap .sr-about-v23 { padding: 36px 20px !important; }
}

/* Mobile — even tighter */
@media (max-width: 640px) {
  html body .sr-wrap .sr-specials-section,
  html body .sr-wrap .sr-moods-section,
  html body .sr-wrap .sr-categories-section,
  html body .sr-wrap .sr-carousel-section,
  html body .sr-wrap .sr-whyus-section,
  html body .sr-wrap .sr-events-section,
  html body .sr-wrap .sr-igf-section,
  html body .sr-wrap .sr-press-section,
  html body .sr-wrap .sr-signup-banner,
  html body .sr-wrap .sr-seo-about,
  html body .sr-wrap .sr-newsletter,
  html body .sr-wrap .sr-faq-section,
  html body .sr-wrap .sr-faq,
  html body .sr-wrap .sr-stats-section,
  html body .sr-wrap .sr-lounge-section {
    padding-top: 22px !important;
    padding-bottom: 22px !important;
  }
  html body .sr-wrap .sr-about-v23 { padding: 28px 16px !important; }
  html body .sr-wrap .sr-footer { padding-top: 32px !important; padding-bottom: 16px !important; }
}

/* Section-title margin bottom standardize (some had 40px, some 16px) */
html body .sr-wrap .sr-section-title,
html body .sr-wrap .sr-carousel-title,
html body .sr-wrap h2.sr-section-title,
html body .sr-wrap h2.sr-carousel-title {
  margin-top: 0 !important;
  margin-bottom: 18px !important;
}
html body .sr-wrap .sr-section-sub {
  margin-top: 0 !important;
  margin-bottom: 22px !important;
}

/* Section content max-width — keep wide content from over-stretching on huge desktops */
html body .sr-wrap .sr-specials-section,
html body .sr-wrap .sr-moods-section,
html body .sr-wrap .sr-categories-section,
html body .sr-wrap .sr-carousel-section,
html body .sr-wrap .sr-events-section,
html body .sr-wrap .sr-igf-section,
html body .sr-wrap .sr-faq,
html body .sr-wrap .sr-newsletter {
  max-width: 1280px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Side padding — consistent 24px desktop / 16px mobile */
html body .sr-wrap .sr-specials-section,
html body .sr-wrap .sr-moods-section,
html body .sr-wrap .sr-categories-section,
html body .sr-wrap .sr-carousel-section,
html body .sr-wrap .sr-events-section,
html body .sr-wrap .sr-igf-section,
html body .sr-wrap .sr-press-section,
html body .sr-wrap .sr-signup-banner,
html body .sr-wrap .sr-newsletter,
html body .sr-wrap .sr-faq,
html body .sr-wrap .sr-stats-section {
  padding-left: 24px !important;
  padding-right: 24px !important;
}
@media (max-width: 640px) {
  html body .sr-wrap .sr-specials-section,
  html body .sr-wrap .sr-moods-section,
  html body .sr-wrap .sr-categories-section,
  html body .sr-wrap .sr-carousel-section,
  html body .sr-wrap .sr-events-section,
  html body .sr-wrap .sr-igf-section,
  html body .sr-wrap .sr-press-section,
  html body .sr-wrap .sr-signup-banner,
  html body .sr-wrap .sr-newsletter,
  html body .sr-wrap .sr-faq,
  html body .sr-wrap .sr-stats-section {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }
}

/* ========== end v2.9.24.7 ========== */

/* ============================================================
   v2.9.24.25 — MOBILE READABILITY + CARD-SIZING PASS
   Codex flagged "undersized specials + moods cards". Fix: widen
   grid max-width, bump gaps, bump card typography, relax mobile
   minimum tap-target font size. No structural change — pure
   sizing + typography.
   ============================================================ */
/* Specials: widen container + card spacing */
html body .sr-wrap .sr-specials-grid {
  max-width: 1320px !important;
  gap: 24px !important;
}
html body .sr-wrap .sr-special-card .sr-special-overlay,
html body .sr-wrap .sr-special-card > *:not(img):not(a) {
  padding: 20px 22px !important;
}
html body .sr-wrap .sr-special-card .sr-special-title,
html body .sr-wrap .sr-special-card .sr-special-overlay span,
html body .sr-wrap .sr-special-card h3 {
  font-size: 16px !important;
  line-height: 1.3 !important;
}
html body .sr-wrap .sr-special-card p,
html body .sr-wrap .sr-special-card .sr-special-overlay p {
  font-size: 14.5px !important;
  line-height: 1.5 !important;
}

/* Moods: larger minimum tile, more gap */
html body .sr-wrap .sr-moods-grid {
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)) !important;
  gap: 20px !important;
}
html body .sr-wrap .sr-mood-card .sr-mood-label {
  font-size: 15px !important;
  padding: 8px 24px !important;
}

/* Categories: larger minimum tile */
html body .sr-wrap .sr-categories-grid {
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)) !important;
  gap: 20px !important;
}

/* Mobile readability bumps (414/375/360) */
@media (max-width: 768px) {
  /* Hero trust + eyebrow: one notch larger for readable chips */
  html body .sr-hero-v14 .sr-hero-trust { font-size: 12.5px !important; gap: 6px 12px !important; }
  html body .sr-hero-v14 .sr-hero-eyebrow { font-size: 10.5px !important; }
  html body .sr-hero-v14 .sr-hero-lede { font-size: 14.5px !important; line-height: 1.5 !important; }

  /* Announce-bar marquee readable at thumb distance */
  html body .sr-wrap .sr-announce-inner,
  html body .sr-announce .sr-announce-inner { font-size: 13px !important; letter-spacing: 0.03em !important; }

  /* Category pills: taller tap targets */
  html body .sr-wrap .sr-pill { padding: 11px 16px !important; font-size: 12.5px !important; }

  /* Specials + moods: on narrow phones, 1 col full-width with breathing room */
  html body .sr-wrap .sr-moods-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 14px !important; }
}
@media (max-width: 414px) {
  /* H1 stays readable on 414/375/360 without clipping */
  html body .sr-hero-v14 .sr-hero-h1 { font-size: clamp(28px, 8.6vw, 38px) !important; }
  /* Section titles one notch smaller so they don't overshoot on 360 */
  html body .sr-section-title { font-size: clamp(22px, 6.4vw, 30px) !important; }
  /* Specials 1-col so cards can breathe */
  html body .sr-wrap .sr-specials-grid { grid-template-columns: 1fr !important; gap: 16px !important; }
}
/* ========== end v2.9.24.25 ========== */


/* ============================================================
   v2.9.24.26 — PERF FIXES + 3 DESIGN DIRECTIONS
   Agent1 audit -> these 3 fixes plus the srCamelThruster kill above.
   Agent2 directions -> full D1/D2/D3 CSS scoped by design body classes.
   Feature flag: ?design=1|2|3 via homepage-v5.js IIFE head.
   ============================================================ */

/* --- Perf fix: bump hero-grid above camel at <=720px so any camel
       scale-keyframe nudge never clips the H1. Agent1 fix #3. */
@media (max-width: 720px) {
  .sr-hero-v14 .sr-hero-grid { z-index: 5 !important; position: relative !important; }
}

/* --- Perf fix: kill backdrop-filter on header at <=720px.
       Known iOS Safari scroll-jank source. Agent1 fix #4. */
@media (max-width: 720px) {
  .sr-header,
  .sr-wrap .sr-header,
  .sr-wrap .sr-header-v27 {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    background: rgba(18,20,28,0.97) !important;
  }
}

/* --- Perf fix: belt-and-suspenders reduced-motion kill for bsmoke canvas. */
@media (prefers-reduced-motion: reduce) {
  .sr-hero-bsmoke { display: none !important; }
}
/* v2.9.25.27 — design-lab direction blocks moved to assets/css/design-lab.css and lazy-loaded by homepage-v5.js only for ?design=1|2|3 or persisted design lab sessions. */

/* ============================================================================
   v2.9.24.68 — WCAG 2.2 AA accessibility pass (a11y) · 2026-04-21
   Fixes:
   · color-contrast (pill active, "See all" green, FEATURED BRAND eyebrow,
     compare-row columns inheriting black text inside dark tables)
   · link-in-text-block — body-text inline green links now underlined
   · visible :focus-visible rings on every interactive element
   · skip-link (WP-provided) gets a high-contrast visible treatment on focus
   All rules are HIGH-specificity overrides so they win over the existing
   cascade without touching earlier blocks.
   ============================================================================ */

/* --- 1. Active pill: dark ink on brand green (was #fff on #7ED957 = 1.75:1) */
html body .sr-wrap .sr-pills .sr-pill.sr-pill-active,
html body .sr-pills > a.sr-pill-active,
html body .sr-pill.sr-pill-active {
  color: #0a0a0a !important;
  background: linear-gradient(135deg, #7ED957, #5FB43A) !important;
  border-color: #7ED957 !important;
  text-shadow: none !important;
  font-weight: 700 !important;
}
html body .sr-wrap .sr-pills .sr-pill.sr-pill-active .sr-pill-dot,
html body .sr-pill.sr-pill-active .sr-pill-dot {
  background: #0a0a0a !important;
}

/* --- 2. Carousel "See all" — deep-green for 7:1 on white (was #209F48 = 3.43:1)
   Specificity must exceed `html body .sr-wrap .sr-carousel-section a[href]`
   (0,3,3). We match the same chain + the class-hook so we win at (0,4,3). */
html body .sr-wrap .sr-carousel-section .sr-carousel-header a.sr-carousel-see-all[href],
html body .sr-wrap .sr-carousel-section a.sr-carousel-see-all[href],
html body .sr-wrap .sr-carousel-section a.sr-carousel-see-all {
  color: #166534 !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
  text-decoration-thickness: 1px !important;
}
html body .sr-wrap .sr-carousel-section a.sr-carousel-see-all[href]:hover,
html body .sr-wrap .sr-carousel-section a.sr-carousel-see-all:hover,
html body .sr-wrap .sr-carousel-section a.sr-carousel-see-all[href]:focus-visible,
html body .sr-wrap .sr-carousel-section a.sr-carousel-see-all:focus-visible {
  color: #1E4610 !important;
  text-decoration-thickness: 2px !important;
}

/* --- 3. FEATURED BRAND eyebrow — only tighten contrast when it lands on a
   light-canvas context. Within the dark hero (its primary home) the existing
   rgba(126,217,87,0.85) is fine. When it's re-used on white, use deep green. */
html body .sr-seo-about .sr-hero-feat-eyebrow,
html body .sr-whyus-section .sr-hero-feat-eyebrow,
html body .sr-faq-section .sr-hero-feat-eyebrow,
html body .sr-newsletter .sr-hero-feat-eyebrow,
html body .sr-featured-brand-head .sr-hero-feat-eyebrow {
  color: #166534 !important;
  opacity: 1 !important;
}

/* --- 4. Compare-row contrast fix.
   The `.sr-whyus-section * { color: inherit }` rule (line ~7750) was forcing
   black text into the dark "us vs them" table cells, producing 2.23:1 black
   on #4a4a4c. Re-declare the dark-mode colors inside the whyus section at
   higher specificity so the table stays legible regardless of inherit. */
html body .sr-whyus-section .sr-compare-table { color: rgba(255,255,255,0.9) !important; }
html body .sr-whyus-section .sr-compare-row > div,
html body .sr-whyus-section .sr-compare-row > div:nth-child(2),
html body .sr-whyus-section .sr-compare-row > div:nth-child(3) {
  color: rgba(255,255,255,0.82) !important; /* 9.5:1 on rgba(14,14,16,.75) table bg */
}
html body .sr-whyus-section .sr-compare-head > div {
  color: rgba(255,255,255,0.72) !important; /* 7.4:1 — header row */
}
html body .sr-whyus-section .sr-compare-head > div.sr-compare-us {
  color: #7ED957 !important; /* 10.6:1 brand-green on dark */
}
html body .sr-whyus-section .sr-compare-row > div.sr-compare-us {
  color: #ffffff !important;
}
html body .sr-whyus-section .sr-compare-row > div:first-child {
  color: rgba(255,255,255,0.92) !important;
}

/* --- 5. Body-text inline-styled green links — add underline so they're
   distinguishable without relying on color (WCAG 1.4.1). Scoped to About,
   Whyus, FAQ, and author-credit aside where such inline styles exist. */
html body .sr-eeat-review a[style*="#7ED957"],
html body .sr-author-credit a[style*="#7ED957"],
html body .sr-seo-about a[style*="#7ED957"],
html body .sr-faq-section a[style*="#7ED957"],
html body aside[itemprop="author"] a[style*="#7ED957"],
html body .sr-expertise-aside a[style*="#7ED957"] {
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
  text-decoration-thickness: 1px !important;
}

/* --- 6. :focus-visible rings — every interactive element gets a bright
   2px solid green ring + 2px offset so keyboard users can see focus.
   Doesn't replace :hover; coexists. */
html body a:focus-visible,
html body button:focus-visible,
html body [role="button"]:focus-visible,
html body input:focus-visible,
html body textarea:focus-visible,
html body select:focus-visible,
html body summary:focus-visible,
html body [tabindex]:focus-visible {
  outline: 2px solid #7ED957 !important;
  outline-offset: 2px !important;
  border-radius: 4px;
  box-shadow: 0 0 0 4px rgba(126,217,87,0.25) !important;
}
/* Primary CTAs on green get a dark ring for separation */
html body .sr-cta-primary:focus-visible,
html body .sr-hero-cta:focus-visible,
html body .sr-pill.sr-pill-active:focus-visible {
  outline: 3px solid #0a0a0a !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 6px rgba(126,217,87,0.55) !important;
}

/* --- 7. WordPress-provided skip link — make it properly visible on focus.
   The theme ships .skip-link .screen-reader-text. Re-declare high-specificity
   treatment for case of theme conflicts and to force a branded look. */
html body .skip-link.screen-reader-text:focus,
html body .skip-link:focus-visible {
  position: fixed !important;
  top: 8px !important;
  left: 8px !important;
  width: auto !important;
  height: auto !important;
  padding: 10px 18px !important;
  background: #0a0a0a !important;
  color: #7ED957 !important;
  border: 2px solid #7ED957 !important;
  border-radius: 6px !important;
  font: 700 14px/1 Poppins, system-ui, sans-serif !important;
  text-decoration: none !important;
  z-index: 2147483647 !important;
  clip: auto !important;
  clip-path: none !important;
  box-shadow: 0 4px 16px rgba(126,217,87,0.5) !important;
}

/* --- 8. Cart/menu drawer with role=dialog gets focus-within accent */
html body .sr-drawer[role="dialog"]:focus-within {
  box-shadow: -8px 0 24px rgba(0,0,0,0.5), inset 2px 0 0 #7ED957 !important;
}

/* --- 9. Icon-only buttons — ensure 44x44 min tap target per WCAG 2.5.5 AA. */
html body .sr-drawer-close,
html body .sr-drawer-item-remove,
html body .sr-bud-mic,
html body .sr-bud-send,
html body .sr-faq-q {
  min-width: 44px;
  min-height: 44px;
}

/* --- 10. Reduced-motion — honor user preference, no ring halo pulse */
@media (prefers-reduced-motion: reduce) {
  html body a:focus-visible,
  html body button:focus-visible,
  html body input:focus-visible,
  html body textarea:focus-visible,
  html body select:focus-visible {
    box-shadow: none !important;
    outline: 2px solid #7ED957 !important;
  }
}
/* --- 11a. .sr-seo-eyebrow on white — deep green for 7:1 (was #209F48 = 3.43:1) */
html body .sr-seo-about .sr-seo-eyebrow,
html body .sr-seo-about-copy .sr-seo-eyebrow,
html body .sr-seo-eyebrow {
  color: #166534 !important;
}

/* --- 11b. "Read the full story →" about-link — was #7ED957 on #fff (1.75:1).
   Must beat `.sr-wrap p a:not(.sr-btn):not(.sr-card-add-btn):not([class*="cta"])`
   (specificity 0,4,1). Use matching chain + attribute for (0,5,1). */
html body .sr-wrap p.sr-seo-about-meta a[href]:not(.sr-btn):not(.sr-card-add-btn),
html body p.sr-seo-about-meta a[href$="/about/"],
html body .sr-seo-about-meta a[href] {
  color: #166534 !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
  text-decoration-thickness: 1px !important;
  font-weight: 700 !important;
}

/* --- 11c. Sort dropdown without visible label (menu page) — add an aria-label
   in JS if possible; as CSS we can't set aria-label. Flagged for JS pass. */

/* --- 12. Screen-reader-only utility class (WCAG 1.3.1 name-without-visible
   label for things like newsletter inputs whose placeholder IS the label). */
html body .sr-visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  white-space: nowrap !important;
  border: 0 !important;
}
/* ========== end v2.9.24.68 a11y ========== */

/* ============================================================
   v2.9.25.2 — HERO MOTION CANVAS GRID-FLOW FIX
   SR.heroMotion inserts .sr-hero-motion-canvas and the mode toggle inside
   #srnyc-hero-grid. Without explicit positioning they become real CSS grid
   children, pushing the copy to column 2 and Featured Brand to row 2.
   Keep both motion canvases as background layers and keep the toggle out
   of grid flow.
   ============================================================ */
html body .sr-hero-v14 .sr-hero-grid {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
}

html body .sr-hero-v14 .sr-hero-motion-canvas,
html body .sr-hero-v14 .sr-hero-matrix-canvas {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: 0 !important;
  pointer-events: none !important;
}

html body .sr-hero-v14 .sr-hero-motion-canvas { opacity: .26 !important; }
html body .sr-hero-v14 .sr-hero-matrix-canvas { opacity: .18 !important; }

html body .sr-hero-v14 .sr-hero-copy,
html body .sr-hero-v14 .sr-hero-feat {
  position: relative !important;
  z-index: 3 !important;
}

html body .sr-hero-v14 .sr-hero-motion-toggle {
  position: absolute !important;
  right: 18px !important;
  bottom: 14px !important;
  z-index: 4 !important;
  pointer-events: auto !important;
  width: auto !important;
  max-width: calc(100% - 36px) !important;
  display: inline-flex !important;
  gap: 4px !important;
  padding: 4px !important;
  border-radius: 999px !important;
  background: rgba(5, 14, 8, .82) !important;
  border: 1px solid rgba(126, 217, 87, .42) !important;
  box-shadow: 0 12px 30px rgba(0, 0, 0, .38), inset 0 1px 0 rgba(255,255,255,.08) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}

html body .sr-hero-v14 .sr-hero-motion-toggle button {
  appearance: none !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  color: #dfffd2 !important;
  font: 800 11px/1 ui-monospace, "SF Mono", Menlo, monospace !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  padding: 9px 12px !important;
  min-height: 34px !important;
  min-width: 0 !important;
  white-space: nowrap !important;
}

html body .sr-hero-v14 .sr-hero-motion-toggle button.active,
html body .sr-hero-v14 .sr-hero-motion-toggle button[aria-selected="true"] {
  background: #7ED957 !important;
  color: #061207 !important;
  box-shadow: 0 0 18px rgba(126,217,87,.34) !important;
}

html body .sr-hero-v14 .sr-hero-motion-toggle .dot { display: none !important; }

html body .sr-hero-v14 .sr-hero-featured-cards .sr-card .sr-card-name,
html body .sr-hero-v14 .sr-hero-featured-cards .sr-card .sr-product-name,
html body .sr-hero-v14 .sr-hero-featured-cards .sr-card .sr-card-brand,
html body .sr-hero-v14 .sr-hero-featured-cards .sr-card .sr-product-brand,
html body .sr-hero-v14 .sr-hero-featured-cards .sr-card .sr-card-price,
html body .sr-hero-v14 .sr-hero-featured-cards .sr-card .sr-price {
  color: #0F1511 !important;
  text-shadow: none !important;
}

@media (max-width: 720px) {
  html body .sr-hero-v14 .sr-hero-motion-toggle {
    right: 12px !important;
    bottom: 10px !important;
    max-width: calc(100% - 24px) !important;
  }
}
/* ========== end v2.9.25.2 ========== */

/* ==========================================================================
   v2.9.25.4 — professional visible-surface polish
   ========================================================================== */
html body .sr-wrap .sr-announce,
html body .sr-announce {
  position: relative !important;
  z-index: 80 !important;
  min-height: 44px !important;
  height: auto !important;
  overflow: hidden !important;
  background: #050806 !important;
  border-bottom: 1px solid rgba(126,217,87,.28) !important;
}
html body .sr-announce .sr-announce__inner,
html body .sr-wrap .sr-announce .sr-announce__inner {
  min-height: 44px !important;
  padding: 6px clamp(14px, 2vw, 24px) !important;
  display: grid !important;
  grid-template-columns: auto minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 18px !important;
  background: #050806 !important;
}
html body .sr-announce__live {
  min-width: max-content !important;
  color: #fff !important;
  background: rgba(126,217,87,.12) !important;
  border: 1px solid rgba(126,217,87,.35) !important;
  border-radius: 999px !important;
  padding: 6px 12px !important;
  line-height: 1 !important;
}
html body .sr-announce__rail {
  min-width: 0 !important;
  overflow: hidden !important;
}
html body .sr-announce__rail-inner {
  display: flex !important;
  align-items: center !important;
  gap: 18px !important;
  width: max-content !important;
}
html body .sr-announce__item {
  color: rgba(255,255,255,.76) !important;
  white-space: nowrap !important;
}
html body .sr-announce__item b,
html body .sr-announce .sr-accent {
  color: #7ED957 !important;
}

html body .sr-wrap .sr-header,
html body .sr-wrap .sr-header-v27 {
  background: #fff !important;
  color: #0a0a0a !important;
}
html body .sr-wrap .sr-header img,
html body .sr-wrap .sr-logo img {
  opacity: 1 !important;
  filter: none !important;
}

html body .sr-wrap .sr-specials-section {
  padding: clamp(36px, 5vw, 64px) clamp(16px, 4vw, 32px) !important;
}
html body .sr-wrap .sr-specials-section .sr-specials-grid,
html body .sr-specials-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: clamp(14px, 1.6vw, 22px) !important;
  padding: 0 !important;
}
html body .sr-wrap .sr-specials-section .sr-special-card,
html body .sr-special-card {
  aspect-ratio: 1500 / 492 !important;
  min-height: 0 !important;
  height: auto !important;
  display: block !important;
  position: relative !important;
  border-radius: 12px !important;
  overflow: hidden !important;
  border: 1px solid rgba(15,21,17,.12) !important;
  background: #07100b !important;
  box-shadow: 0 14px 34px -22px rgba(0,0,0,.45) !important;
}
html body .sr-special-card img {
  width: 100% !important;
  height: 100% !important;
  aspect-ratio: auto !important;
  object-fit: contain !important;
  object-position: center !important;
  display: block !important;
}
html body .sr-special-card .sr-special-overlay {
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  padding: 32px 18px 16px !important;
  background: linear-gradient(180deg, transparent 0%, rgba(0,0,0,.70) 100%) !important;
  color: #fff !important;
  pointer-events: none !important;
}
html body .sr-special-card .sr-special-overlay span {
  display: inline-flex !important;
  align-items: center !important;
  max-width: 100% !important;
  min-height: 32px !important;
  padding: 8px 12px !important;
  border-radius: 999px !important;
  background: rgba(0,0,0,.72) !important;
  border: 1px solid rgba(126,217,87,.55) !important;
  color: #fff !important;
  font: 800 13px/1.05 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  letter-spacing: .08em !important;
  text-transform: uppercase !important;
  text-shadow: none !important;
  white-space: normal !important;
}

html body .sr-cowork-banner h2 span {
  color: #7ED957 !important;
  background: none !important;
  -webkit-text-fill-color: #7ED957 !important;
  text-shadow: 0 0 18px rgba(126,217,87,.22) !important;
}
html body .sr-cowork-banner-metrics {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 10px !important;
  max-width: 760px !important;
  margin: 18px auto 0 !important;
}
html body .sr-cowork-banner-metric {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 3px !important;
  min-height: 66px !important;
  padding: 10px !important;
  border: 1px solid rgba(126,217,87,.28) !important;
  border-radius: 10px !important;
  background: rgba(0,0,0,.24) !important;
  color: #fff !important;
  text-align: center !important;
}
html body .sr-cowork-banner-metric .n {
  color: #7ED957 !important;
  font: 900 18px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
}
html body .sr-cowork-banner-metric .l {
  color: rgba(255,255,255,.78) !important;
  font: 700 11px/1.2 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
}

@media (max-width: 720px) {
  html body .sr-announce .sr-announce__inner {
    grid-template-columns: 1fr !important;
    gap: 6px !important;
    padding: 7px 14px !important;
  }
  html body .sr-announce__live {
    justify-content: center !important;
    width: 100% !important;
    font-size: 10px !important;
  }
  html body .sr-announce__rail { display: none !important; }
  html body .sr-wrap .sr-specials-section .sr-specials-grid,
  html body .sr-specials-grid {
    grid-template-columns: 1fr !important;
  }
  html body .sr-special-card .sr-special-overlay {
    padding: 26px 14px 12px !important;
  }
  html body .sr-special-card .sr-special-overlay span {
    font-size: 12px !important;
  }
  html body .sr-cowork-banner-metrics {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
/* ========== end v2.9.25.4 ========== */

/* ==========================================================================
   v2.9.25.5 — restore top announcement visibility
   Critical CSS from v2.9.24.x checks for the old `.sr-announce-inner`
   class name, while the current JS renders `.sr-announce__inner`.
   ========================================================================== */
html body .sr-wrap .sr-announce,
html body .sr-announce {
  visibility: visible !important;
}
html body.sr-js-ready .sr-announce .sr-announce__inner,
html body .sr-announce .sr-announce__inner {
  opacity: 1 !important;
  visibility: visible !important;
}
/* ========== end v2.9.25.5 ========== */

/* ==========================================================================
   v2.9.25.7 — product-card readability and on-brand color guard
   Late override to beat older conflicting 12px/gray/blue-ish card rules.
   ========================================================================== */
html body .sr-wrap .sr-carousel-section {
  background: #ffffff !important;
}
html body .sr-wrap .sr-carousel-track {
  min-width: 0 !important;
  scroll-snap-type: x proximity !important;
  -webkit-overflow-scrolling: touch !important;
}
html body .sr-wrap .sr-carousel-track .sr-card,
html body .sr-wrap .sr-menu-grid .sr-card,
html body .sr-wrap .sr-card {
  background: #ffffff !important;
  color: #0F1511 !important;
  border-color: rgba(126,217,87,.24) !important;
  scroll-snap-align: start !important;
}
html body .sr-wrap .sr-carousel-track .sr-card .sr-card-body,
html body .sr-wrap .sr-menu-grid .sr-card .sr-card-body,
html body .sr-wrap .sr-card .sr-card-body {
  background: #ffffff !important;
  color: #0F1511 !important;
  min-width: 0 !important;
  text-align: left !important;
}
html body .sr-wrap .sr-carousel-track .sr-card .sr-card-brand,
html body .sr-wrap .sr-menu-grid .sr-card .sr-card-brand,
html body .sr-wrap .sr-card .sr-card-brand,
html body .sr-carousel-section .sr-card .sr-product-brand {
  color: #31513A !important;
  opacity: 1 !important;
  font-weight: 800 !important;
  letter-spacing: .11em !important;
}
html body .sr-wrap .sr-carousel-track .sr-card .sr-card-name,
html body .sr-wrap .sr-menu-grid .sr-card .sr-card-name,
html body .sr-wrap .sr-card .sr-card-name,
html body .sr-carousel-section .sr-card .sr-product-name,
html body .sr-carousel-section .sr-card h3 {
  color: #0A0A0A !important;
  -webkit-text-fill-color: #0A0A0A !important;
  font-size: clamp(15px, 1.08vw, 16.5px) !important;
  line-height: 1.28 !important;
  font-weight: 850 !important;
  letter-spacing: 0 !important;
  min-height: 2.55em !important;
  overflow-wrap: anywhere !important;
}
html body .sr-wrap .sr-carousel-track .sr-card .sr-card-meta span,
html body .sr-wrap .sr-card .sr-badge,
html body .sr-wrap .sr-card [class*="sr-badge-"] {
  background: rgba(126,217,87,.15) !important;
  border-color: rgba(32,159,72,.28) !important;
  color: #173B20 !important;
  font-weight: 800 !important;
}
html body .sr-wrap .sr-carousel-track .sr-card .sr-card-price,
html body .sr-wrap .sr-menu-grid .sr-card .sr-card-price,
html body .sr-wrap .sr-card .sr-card-price,
html body .sr-wrap .sr-card .sr-price {
  color: #0A0A0A !important;
  font-size: clamp(18px, 1.25vw, 20px) !important;
  font-weight: 900 !important;
}
html body .sr-wrap .sr-carousel-track .sr-card .sr-card-add-btn,
html body .sr-wrap .sr-menu-grid .sr-card .sr-card-add-btn,
html body .sr-wrap .sr-card .sr-card-add-btn,
html body .sr-wrap .sr-card button[class*="cart"] {
  background: linear-gradient(180deg, #7ED957 0%, #27AE4B 100%) !important;
  color: #051A09 !important;
  border: 0 !important;
  box-shadow: 0 10px 22px -16px rgba(5,26,9,.55) !important;
}
html body .sr-wrap .sr-carousel-section a[href]:not(.sr-carousel-see-all):not(.sr-card-add-btn),
html body .sr-wrap .sr-pills a,
html body .sr-wrap .sr-pill,
html body .sr-wrap button {
  --sr-blue-guard: #7ED957;
}
@media (max-width: 767px) {
  html body .sr-wrap .sr-carousel-track {
    gap: 12px !important;
    padding-inline: 8px 20px !important;
  }
  html body .sr-wrap .sr-carousel-track .sr-card,
  html body .sr-wrap .sr-carousel-track .sr-card-skeleton {
    flex: 0 0 min(82vw, 280px) !important;
    width: min(82vw, 280px) !important;
    max-width: min(82vw, 280px) !important;
  }
  html body .sr-wrap .sr-carousel-track .sr-card .sr-card-name,
  html body .sr-wrap .sr-card .sr-card-name {
    font-size: 15.5px !important;
    min-height: auto !important;
  }
  html body .sr-wrap .sr-carousel-track .sr-card .sr-card-brand,
  html body .sr-wrap .sr-card .sr-card-brand {
    font-size: 10.5px !important;
  }
  html body .sr-wrap .sr-carousel-track .sr-card .sr-card-price,
  html body .sr-wrap .sr-card .sr-card-price {
    font-size: 19px !important;
  }
}
/* ========== end v2.9.25.7 ========== */

/* ==========================================================================
   v2.9.25.8 — Shop by Category rescue
   Current category art is temporary, but labels/buttons must be unmistakable.
   ========================================================================== */
html body .sr-wrap .sr-categories-section {
  background: #FFFFFF !important;
  color: #0F1511 !important;
}
html body .sr-wrap .sr-categories-section .sr-section-title,
html body .sr-wrap .sr-categories-section .sr-section-sub,
html body .sr-wrap .sr-categories-section .sr-section-subtitle {
  color: #0F1511 !important;
  opacity: 1 !important;
}
html body .sr-wrap .sr-categories-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: clamp(14px, 1.6vw, 22px) !important;
}
html body .sr-wrap .sr-category-card {
  position: relative !important;
  display: block !important;
  aspect-ratio: 4 / 3 !important;
  min-height: 188px !important;
  overflow: hidden !important;
  border-radius: 14px !important;
  border: 1px solid rgba(15,21,17,.14) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(126,217,87,.18), transparent 45%),
    linear-gradient(180deg, #111B14 0%, #07100B 100%) !important;
  box-shadow: 0 18px 42px -28px rgba(0,0,0,.58) !important;
}
html body .sr-wrap .sr-category-card img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  opacity: .92 !important;
  filter: saturate(1.08) contrast(1.08) brightness(.82) !important;
  background: #07100B !important;
}
html body .sr-wrap .sr-category-card::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background:
    linear-gradient(180deg, rgba(0,0,0,.04) 0%, rgba(0,0,0,.08) 38%, rgba(0,0,0,.72) 100%),
    radial-gradient(circle at 50% 100%, rgba(126,217,87,.18), transparent 56%) !important;
}
html body .sr-wrap .sr-category-card .sr-cat-label,
html body .sr-wrap .sr-category-card span.sr-cat-label {
  position: absolute !important;
  z-index: 3 !important;
  left: 50% !important;
  bottom: 18px !important;
  transform: translateX(-50%) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: min(82%, 190px) !important;
  max-width: calc(100% - 28px) !important;
  min-height: 42px !important;
  padding: 10px 18px !important;
  border-radius: 999px !important;
  background: rgba(5, 10, 6, .88) !important;
  border: 1.5px solid rgba(126,217,87,.78) !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  font: 900 14px/1 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  letter-spacing: .04em !important;
  text-transform: uppercase !important;
  text-align: center !important;
  text-shadow: 0 1px 4px rgba(0,0,0,.85) !important;
  box-shadow: 0 14px 34px -18px rgba(126,217,87,.72) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
}
html body .sr-wrap .sr-category-card:hover,
html body .sr-wrap .sr-category-card:focus-visible {
  border-color: rgba(126,217,87,.72) !important;
  box-shadow: 0 24px 54px -28px rgba(0,0,0,.65), 0 0 0 1px rgba(126,217,87,.22) inset !important;
}
html body .sr-wrap .sr-category-card:focus-visible {
  outline: 3px solid rgba(126,217,87,.8) !important;
  outline-offset: 3px !important;
}
@media (max-width: 900px) {
  html body .sr-wrap .sr-categories-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}
@media (max-width: 520px) {
  html body .sr-wrap .sr-categories-grid {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
  }
  html body .sr-wrap .sr-category-card {
    min-height: 210px !important;
  }
  html body .sr-wrap .sr-category-card .sr-cat-label {
    font-size: 13px !important;
    min-height: 40px !important;
  }
}
/* ========== end v2.9.25.8 ========== */

/* ==========================================================================
   v2.9.25.9 — Shop by Category image visibility
   The 25.8 rescue fixed label contrast, but the global overlay made the cards
   read as black boxes. Keep the button contrast and reveal the product art.
   ========================================================================== */
html body .sr-wrap .sr-category-card {
  background: #07100B !important;
}
html body .sr-wrap .sr-category-card img {
  opacity: 1 !important;
  filter: saturate(1.12) contrast(1.06) brightness(1.04) !important;
  transform: scale(1.01) !important;
}
html body .sr-wrap .sr-category-card::before {
  background:
    linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,.03) 44%, rgba(0,0,0,.62) 100%),
    radial-gradient(circle at 50% 108%, rgba(126,217,87,.20), transparent 54%) !important;
}
html body .sr-wrap .sr-category-card .sr-cat-overlay {
  display: none !important;
}
html body .sr-wrap .sr-category-card .sr-cat-label,
html body .sr-wrap .sr-category-card span.sr-cat-label {
  background: rgba(4, 9, 5, .82) !important;
  border-color: rgba(126,217,87,.86) !important;
  box-shadow:
    0 14px 32px -18px rgba(0,0,0,.95),
    0 0 0 1px rgba(255,255,255,.08) inset !important;
}
/* ========== end v2.9.25.9 ========== */

/* ==========================================================================
   v2.9.25.13 — first-paint professionalism guard
   Hide the redundant under-nav status strip that makes the homepage look like
   an old WP layer plus the V2 storefront stacked together. The announcement
   rail, hero copy, header, and cart already carry open/delivery/phone signals.
   ========================================================================== */
html body .sr-wrap .sr-status-bar-top,
html body .sr-status-bar-top {
  display: none !important;
}

@media (max-width: 720px) {
  html body .sr-wrap .sr-announce,
  html body .sr-announce {
    min-height: 44px !important;
    max-height: 44px !important;
  }
  html body .sr-wrap .sr-announce .sr-announce-inner,
  html body .sr-announce .sr-announce-inner {
    min-height: 44px !important;
    height: 44px !important;
    display: flex !important;
    align-items: center !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: clip !important;
    padding: 0 14px !important;
    font-size: 11px !important;
    line-height: 44px !important;
  }
  html body .sr-wrap .sr-pills,
  html body .sr-pills {
    overflow-x: auto !important;
    overscroll-behavior-x: contain !important;
  }
  html body .sr-wrap .sr-pills::after,
  html body .sr-pills::after {
    content: "" !important;
    flex: 0 0 24px !important;
  }
}

/* ==========================================================================
   v2.9.25.14 — mobile chrome cleanup
   Reduce bottom-widget collisions and keep the first viewport commerce-focused.
   ========================================================================== */
@media (max-width: 720px) {
  html body #sr-ver-badge {
    display: none !important;
  }

  html body .sr-bud-fab {
    left: 14px !important;
    bottom: 18px !important;
    width: 52px !important;
    height: 52px !important;
    min-width: 52px !important;
    padding: 7px !important;
    border-radius: 999px !important;
    z-index: 1800 !important;
  }
  html body .sr-bud-fab-icon {
    width: 36px !important;
    height: 36px !important;
  }
  html body .sr-bud-fab-text {
    display: none !important;
  }

  html body .sr-float-cart-v23 {
    right: 16px !important;
    bottom: 86px !important;
    width: 58px !important;
    height: 58px !important;
    z-index: 1850 !important;
  }
  html body .sr-float-cart-v23 .sr-float-cart-core {
    width: 50px !important;
    height: 50px !important;
  }

  html body .sr-wrap .sr-pills-v291,
  html body .sr-pills-v291 {
    padding: 12px 0 13px !important;
    overflow: hidden !important;
  }
  html body .sr-pills-v291 .sr-pills-inner {
    padding: 0 16px 0 16px !important;
    gap: 8px !important;
    overflow-x: auto !important;
    scroll-padding: 16px !important;
    -webkit-overflow-scrolling: touch !important;
  }
  html body .sr-pills-v291 .sr-pill {
    min-height: 38px !important;
    padding: 10px 19px !important;
    font-size: 11px !important;
  }

  html body .sr-wrap .sr-announce .sr-announce-inner,
  html body .sr-announce .sr-announce-inner {
    justify-content: flex-start !important;
    text-align: left !important;
  }
}

/* v2.9.25.12 purge smoke 2026-05-01 */

/* ==========================================================================
   v2.9.25.15 — overnight first-viewport stability pass
   Keep the first visible mobile frame branded, readable, and free of widget
   collisions while preserving the working cart/checkout surface.
   ========================================================================== */
@media (max-width: 720px) {
  html body .sr-wrap .sr-announce,
  html body .sr-announce {
    min-height: 44px !important;
    max-height: 44px !important;
    height: 44px !important;
    padding: 0 !important;
    overflow: hidden !important;
    background: linear-gradient(90deg, #4EC33B 0%, #78DB54 52%, #38B85B 100%) !important;
  }

  html body .sr-wrap .sr-announce .sr-announce-inner,
  html body .sr-announce .sr-announce-inner {
    animation: none !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    min-height: 44px !important;
    height: 44px !important;
    margin: 0 !important;
    padding: 0 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    color: #ffffff !important;
    font: 900 11px/44px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
    letter-spacing: .04em !important;
    text-align: left !important;
  }

  html body .sr-pills-v291 .sr-pills-inner {
    padding: 0 12px !important;
    gap: 6px !important;
  }

  html body .sr-pills-v291 .sr-pill {
    min-height: 36px !important;
    padding: 9px 15px !important;
    font-size: 10.5px !important;
    letter-spacing: .04em !important;
    flex: 0 0 auto !important;
  }

  html body .sr-bud-fab {
    bottom: 76px !important;
  }

  html body .sr-float-cart-v23 {
    bottom: 76px !important;
  }
}

/* ==========================================================================
   v2.9.25.16 — announcement first-paint readability
   The legacy ticker can render mid-sentence before customers see the page.
   Keep the revenue banner static and readable until a safer ticker rebuild.
   ========================================================================== */
html body .sr-wrap .sr-announce .sr-announce-inner,
html body .sr-announce .sr-announce-inner {
  animation: none !important;
  transform: none !important;
  opacity: 1 !important;
  visibility: visible !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

@media (min-width: 721px) {
  html body .sr-wrap .sr-announce .sr-announce-inner,
  html body .sr-announce .sr-announce-inner {
    padding: 0 28px !important;
    min-height: 44px !important;
    line-height: 44px !important;
  }
}

/* ==========================================================================
   v2.9.25.17 — announcement left-edge fix
   Long banner text must clip on the right only. Centering made mobile/desktop
   first paint start mid-sentence, which looked like a stale ticker.
   ========================================================================== */
html body .sr-wrap .sr-announce .sr-announce-inner,
html body .sr-announce .sr-announce-inner {
  justify-content: flex-start !important;
  text-align: left !important;
}

/* ==========================================================================
   v2.9.25.19 — Phase 1c mobile chrome + blue-token cleanup
   Claude bridge work order: CSS-only visual safety pass. Preserve checkout,
   hero copy, product cards, AI Budtender behavior, category art, and About.
   ========================================================================== */
@media (max-width: 600px) {
  html body .sr-wrap .sr-announce,
  html body .sr-announce {
    z-index: 998 !important;
  }

  html body #sr-ver-badge,
  html body #sr-version-badge {
    display: none !important;
  }

  html body .trustedsite,
  html body [class*="TrustedSite"],
  html body [class*="trustedsite"],
  html body [id*="TrustedSite"],
  html body [id*="trustedsite"],
  html body iframe[src*="trustedsite"],
  html body img[src*="trustedsite"] {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  html body .sr-hero-v14 .sr-hero-motion-toggle {
    display: none !important;
  }

  html body.sr-dev-motion .sr-hero-v14 .sr-hero-motion-toggle {
    display: inline-flex !important;
  }

  html body .sr-bud-fab {
    left: 14px !important;
    right: auto !important;
    bottom: 14px !important;
    width: 56px !important;
    height: 56px !important;
    min-width: 56px !important;
    min-height: 56px !important;
    padding: 8px !important;
    z-index: 999 !important;
  }

  html body .sr-bud-fab-icon {
    width: 38px !important;
    height: 38px !important;
  }

  html body .sr-float-cart-v23 {
    right: 14px !important;
    bottom: 14px !important;
    width: 56px !important;
    height: 56px !important;
    z-index: 1000 !important;
  }

  html body .sr-float-cart-v23 .sr-float-cart-core {
    width: 50px !important;
    height: 50px !important;
  }

  html body .sr-drawer-overlay {
    z-index: 1090 !important;
  }

  html body .sr-drawer,
  html body .sr-bud-drawer,
  html body .sr-modal,
  html body [role="dialog"] {
    z-index: 1100 !important;
  }
}

/* ==========================================================================
   v2.9.25.20 — May banner + menu readability rescue
   Root cause: homepage still had April event language, and menu-v3 uses its own
   `.sr-menu-card-*` classes that did not receive the product-card readability
   overrides. Keep this late, scoped, and checkout-neutral.
   ========================================================================== */
html body .sr-wrap .sr-announce,
html body .sr-announce {
  background: #000000 !important;
  border-bottom: 1px solid rgba(255,255,255,.22) !important;
  color: #ffffff !important;
}

html body .sr-wrap .sr-announce .sr-announce-inner,
html body .sr-announce .sr-announce-inner,
html body .sr-wrap .sr-announce .sr-announce__inner,
html body .sr-announce .sr-announce__inner {
  background: #000000 !important;
  color: #ffffff !important;
  min-height: 44px !important;
  padding: 0 clamp(16px, 3vw, 34px) !important;
  font: 850 12px/44px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  letter-spacing: .09em !important;
  text-transform: uppercase !important;
}

html body .sr-announce a {
  color: #ffffff !important;
  text-decoration: underline !important;
  text-decoration-thickness: 1px !important;
  text-underline-offset: 3px !important;
}

/* ==========================================================================
   v2.9.25.21 — Ship A: canonical first-paint announcement contract
   Keep this late and boring. The live homepage emits `.sr-announce-inner`;
   older BEM/green/yellow generations above are no longer allowed to win.
   ========================================================================== */
html body .sr-wrap > .sr-announce,
html body #sr-homepage > .sr-announce,
html body .sr-announce {
  position: relative !important;
  z-index: 80 !important;
  display: block !important;
  min-height: 44px !important;
  max-height: 44px !important;
  overflow: hidden !important;
  background: #000000 !important;
  background-image: none !important;
  border-bottom: 1px solid rgba(255,255,255,.22) !important;
  color: #ffffff !important;
}

html body .sr-wrap > .sr-announce > .sr-announce-inner,
html body #sr-homepage > .sr-announce > .sr-announce-inner,
html body .sr-announce > .sr-announce-inner,
html body .sr-wrap > .sr-announce > .sr-announce__inner,
html body #sr-homepage > .sr-announce > .sr-announce__inner,
html body .sr-announce > .sr-announce__inner {
  display: block !important;
  min-height: 44px !important;
  height: 44px !important;
  max-height: 44px !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  text-overflow: clip !important;
  background: #000000 !important;
  color: #ffffff !important;
  padding: 0 clamp(16px, 3vw, 34px) !important;
  font: 850 12px/44px -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  letter-spacing: .09em !important;
  text-transform: uppercase !important;
}

html body .sr-announce > .sr-announce-inner *,
html body .sr-announce > .sr-announce__inner *,
html body .sr-announce > .sr-announce-inner a,
html body .sr-announce > .sr-announce__inner a {
  color: #ffffff !important;
}

html body .sr-announce > .sr-announce-inner a:hover,
html body .sr-announce > .sr-announce__inner a:hover {
  color: #7ED957 !important;
}

html body .sr-menu-wrap,
html body .sr-menu-main,
html body .sr-menu-grid {
  background: #ffffff !important;
  color: #0a0a0a !important;
}

html body .sr-menu-sidebar,
html body .sr-menu-topbar,
html body .sr-active-filters {
  background: #fbfbf7 !important;
  border-color: rgba(10,10,10,.12) !important;
}

html body .sr-menu-grid .sr-card,
html body .sr-menu-card {
  background: #ffffff !important;
  border: 1px solid rgba(10,10,10,.14) !important;
  color: #0a0a0a !important;
  box-shadow: 0 18px 44px -32px rgba(0,0,0,.5) !important;
}

html body .sr-menu-card-img,
html body .sr-menu-grid .sr-card-img,
html body .sr-menu-grid .sr-card-image {
  background:
    radial-gradient(circle at 50% 0%, rgba(126,217,87,.16), transparent 46%),
    #f6f6f2 !important;
}

html body .sr-menu-card-body,
html body .sr-menu-grid .sr-card-body {
  align-items: center !important;
  text-align: center !important;
  background: #ffffff !important;
  color: #0a0a0a !important;
}

html body .sr-menu-card-brand,
html body .sr-menu-grid .sr-card-brand,
html body .sr-menu-grid .sr-product-brand {
  color: #234b2b !important;
  -webkit-text-fill-color: #234b2b !important;
  opacity: 1 !important;
  font-size: clamp(12px, .9vw, 13px) !important;
  line-height: 1.2 !important;
  font-weight: 900 !important;
  letter-spacing: .12em !important;
  text-align: center !important;
  width: 100% !important;
}

html body .sr-wrap .sr-menu-grid .sr-card .sr-card-brand,
html body .sr-wrap .sr-menu-grid .sr-card .sr-product-brand {
  font: 900 clamp(12px, .9vw, 13px)/1.2 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  color: #234b2b !important;
  -webkit-text-fill-color: #234b2b !important;
  letter-spacing: .12em !important;
  text-align: center !important;
  width: 100% !important;
}

html body .sr-menu-card-name,
html body .sr-menu-grid .sr-card-name,
html body .sr-menu-grid .sr-product-name,
html body .sr-menu-grid h3 {
  color: #070707 !important;
  -webkit-text-fill-color: #070707 !important;
  font-size: clamp(16px, 1.18vw, 18px) !important;
  line-height: 1.24 !important;
  font-weight: 900 !important;
  letter-spacing: 0 !important;
  text-align: center !important;
  width: 100% !important;
  min-height: 2.45em !important;
}

html body .sr-wrap .sr-menu-grid .sr-card .sr-card-name,
html body .sr-wrap .sr-menu-grid .sr-card .sr-product-name,
html body .sr-wrap .sr-menu-grid .sr-card h3 {
  font: 900 clamp(16px, 1.18vw, 18px)/1.24 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif !important;
  color: #070707 !important;
  -webkit-text-fill-color: #070707 !important;
  text-align: center !important;
  width: 100% !important;
}

html body .sr-menu-card-price,
html body .sr-menu-grid .sr-card-price,
html body .sr-menu-grid .sr-price {
  color: #0a0a0a !important;
  font-size: clamp(19px, 1.3vw, 22px) !important;
  font-weight: 950 !important;
  text-align: center !important;
  width: 100% !important;
}

html body .sr-filter-btn,
html body .sr-active-filter-tag,
html body .sr-menu-load-more,
html body .sr-menu-sort select,
html body .sr-range-row input,
html body .sr-menu-search input {
  background: #ffffff !important;
  border-color: rgba(10,10,10,.16) !important;
  color: #0a0a0a !important;
}

html body .sr-filter-btn.sr-filter-active,
html body .sr-filter-btn:hover,
html body .sr-menu-load-more:hover {
  background: #0a0a0a !important;
  border-color: #0a0a0a !important;
  color: #ffffff !important;
}

/* ============================================================
   v2.9.25.33 — CANONICAL BEES PATTERN restored on hero per SR-DNA-RECIPE.html
   ============================================================
   Sohan flagged: "wrong Bs in background" on #srnyc-hero. Diagnosis:
     1. body bg used inline SVG with U+0E3F (THAI BAHT ฿) instead of U+20BF (BITCOIN ₿)
     2. #srnyc-hero::before had green stripes + radial gradient, NO bee pattern
     3. .sr-hero-wm watermark used SR-Logo-Footer.webp (footer logo, not bees)
   Canonical per SR-DNA-RECIPE.html:
     File: SR-Pattern-Bitcoin-Gradient.webp (1920×837 raster, NOT a tile)
     background-size: 75% auto · background-position: center right
     Dark variant: filter: none (native white-on-black bees)
     Opacity: 0.15
   Late-cascade override below wins via specificity + ordering. */
html body #srnyc-hero::before,
html body .sr-hero-cinematic::before,
html body .sr-hero-v14::before {
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  background-image: url('/wp-content/plugins/silk-road-nyc/assets/brand/v1-migrated/SR-Pattern-Bitcoin-Gradient.webp') !important;
  background-repeat: no-repeat !important;
  background-position: center right !important;
  background-size: 75% auto !important;
  background-color: transparent !important;
  opacity: 0.15 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
  mask-image: none !important;
  -webkit-mask-image: none !important;
  animation: none !important;
}

/* Also remove the body-level Thai-Baht inline SVG pattern. The canonical bee
   pattern lives on hero/footer/dark sections via ::before, not on body. */
html body {
  background-image:
    radial-gradient(ellipse 1000px 700px at 15% 10%, rgba(126,217,87,.14), transparent 60%),
    radial-gradient(ellipse 800px 800px at 85% 20%, rgba(130,50,220,.10), transparent 60%),
    radial-gradient(ellipse 700px 900px at 50% 75%, rgba(62,255,62,.08), transparent 60%) !important;
  background-repeat: no-repeat, no-repeat, no-repeat !important;
  background-attachment: fixed, fixed, fixed !important;
  background-size: auto, auto, auto !important;
}
html body .sr-menu-heading {
  margin: 0 0 18px;
  padding: 4px 0 16px;
  border-bottom: 1px solid rgba(255,255,255,.1);
}

html body .sr-menu-heading-kicker {
  margin: 0 0 8px;
  color: #7ED957;
  font: 800 11px/1.2 Poppins,-apple-system,sans-serif;
  letter-spacing: .08em;
  text-transform: uppercase;
}

html body .sr-menu-heading h1 {
  margin: 0;
  color: #fff;
  font: 800 clamp(30px,4.2vw,48px)/1.08 Poppins,-apple-system,sans-serif;
  letter-spacing: 0;
}

html body .sr-menu-heading-copy {
  margin: 10px 0 0;
  max-width: 760px;
  color: rgba(255,255,255,.68);
  font: 500 14.5px/1.55 Poppins,-apple-system,sans-serif;
}

@media (max-width: 720px) {
  html body .sr-menu-heading {
    margin-bottom: 14px;
    padding-bottom: 14px;
  }
  html body .sr-menu-heading h1 {
    font-size: clamp(26px,8vw,34px);
  }
}

/* ==========================================================================
   v2.9.25.38 — brand/a11y color discipline guard
   Source-only pass. Brand UI is green/white/black/neutral; no red, blue,
   yellow/gold, or purple accents on active controls.
   ========================================================================== */
html body {
  background-image:
    radial-gradient(ellipse 900px 620px at 16% 8%, rgba(126,217,87,.14), transparent 60%),
    radial-gradient(ellipse 760px 560px at 84% 18%, rgba(32,159,72,.10), transparent 62%),
    linear-gradient(180deg, #050806 0%, #0a0a0a 100%) !important;
  background-color: #050806 !important;
}

html body .sr-cart-badge,
html body .sr-header-cart-btn .sr-cart-badge,
html body .sr-float-cart-v23 .sr-cart-badge,
html body #sr-float-cart .sr-cart-badge,
html body .sr-kiosk-tray-count {
  background: #7ED957 !important;
  background-image: none !important;
  color: #0a0a0a !important;
  border-color: #ffffff !important;
  box-shadow: 0 4px 12px rgba(32,159,72,.38) !important;
}

html body .sr-mobile-filter-toggle,
html body .sr-sidebar-toggle {
  background: #209F48 !important;
  background-image: none !important;
  border-color: #209F48 !important;
  color: #ffffff !important;
}

html body .sr-mobile-filter-toggle:hover,
html body .sr-sidebar-toggle:hover,
html body .sr-mobile-filter-toggle:focus-visible,
html body .sr-sidebar-toggle:focus-visible {
  background: #0a0a0a !important;
  border-color: #7ED957 !important;
  color: #7ED957 !important;
}

html body .sr-rating-star,
html body .sr-ty-review-stars,
html body .sr-stat-num .sr-rating-star,
html body .sr-hero-trust .sr-rating-star,
html body .sr-compare-us .sr-rating-star {
  color: #7ED957 !important;
  -webkit-text-fill-color: #7ED957 !important;
}

html body .sr-card-deliv-chip {
  color: #ffffff !important;
  border-color: rgba(126,217,87,.65) !important;
}

html body .sr-card-deliv-chip.sr-card-deliv-free {
  background: #7ED957 !important;
  background-image: none !important;
  color: #0a0a0a !important;
  border-color: #209F48 !important;
}

/* ===== v2.9.25.120 — Featured product cards fix (ports the lost design-lab.css
   v2.9.24.62 rule that wasn't enqueued in prod). Two things Sohan flagged:
   1) WHITE BOX behind the 3 featured cards so the dark hero never shows through
      the gaps (the "beveled cut mark in the middle").
   2) The delivery / THC chip sits BELOW the image, never overlaying the photo. */
html body .sr-hero-featured-cards {
  background: #ffffff !important;
  padding: 14px !important;
  border-radius: 18px !important;
  box-shadow: 0 12px 38px rgba(0,0,0,.32) !important;
  max-width: 588px !important;
}
html body .sr-hero-featured-cards .sr-card {
  border: 1px solid #e7e7e7 !important;
  box-shadow: 0 2px 10px rgba(10,13,26,.08) !important;
}
/* The delivery/THC chip can't sit cleanly below a full-bleed square image on the
   small featured showcase cards (it overlays the photo and looks broken), so hide
   it HERE only. The dark slider cards keep their corner chip as designed. */
html body .sr-hero-featured-cards .sr-card .sr-card-deliv-chip.sr-card-deliv-chip,
html body .sr-hero-featured-cards .sr-card .sr-special-tag.sr-special-tag,
html body .sr-hero-featured-cards .sr-card .sr-delivery-pill.sr-delivery-pill {
  display: none !important;
}

html body .sr-card-weight,
html body .sr-menu-grid .sr-card-weight,
html body .sr-card .sr-card-weight,
html body .sr-menu-result-count,
html body .sr-menu-breadcrumb,
html body .sr-menu-heading-copy,
html body .sr-menu-empty p {
  color: #555555 !important;
  -webkit-text-fill-color: #555555 !important;
  opacity: 1 !important;
}

html body .sr-menu-search input::placeholder,
html body input#sr-search-input::placeholder {
  color: #555555 !important;
  opacity: 1 !important;
}

html body .sr-wrap .sr-pills .sr-pill,
html body .sr-wrap .sr-pills a.sr-pill,
html body .sr-pills > a,
html body .sr-pills > a.sr-pill,
html body .sr-pill,
html body .sr-pill.sr-pill-active,
html body .sr-pills > a.sr-pill-active,
html body .sr-wrap .sr-pills .sr-pill.sr-pill-active {
  background: #ffffff !important;
  background-image: none !important;
  color: #0a0a0a !important;
  border: 2px solid #209F48 !important;
  border-radius: 8px !important;
  box-shadow: inset 0 -3px 0 #209F48 !important;
}

html body .sr-wrap .sr-pills .sr-pill:hover,
html body .sr-pills > a:hover,
html body .sr-pill:hover,
html body .sr-pill.sr-pill-active:hover {
  background: #f2f8f0 !important;
  color: #0a0a0a !important;
  border-color: #209F48 !important;
}

html body .sr-events-section .sr-event-date,
html body .sr-events-section .sr-event-title,
html body .sr-cowork-banner h2 span,
html body .sr-lounge-title span,
html body .sr-special-overlay span {
  color: #7ED957 !important;
  -webkit-text-fill-color: #7ED957 !important;
}

/* ============================================================
   v2.9.25.62 — BUG FIXES + LANGUAGE SWITCHER
   (1) Menu sidebar clearance: AI Budtender FAB (fixed bottom-left,
       z-index 2000) was physically covering the last filter group
       (Accessories). Give the sidebar breathing room at the bottom.
   (2) Header language switcher (EN/ES/BN/HT) — white v1-parity header,
       dark text, green accents.
   (3) Hero trust-strip language chip links.
   ============================================================ */
html body .sr-menu-sidebar { padding-bottom: 160px !important; } /* v2.9.25.63 — was 120px = only 2px clearance over the Budtender FAB at full scroll */

.sr-lang-switch { position: relative; display: inline-flex; margin-right: 4px; }
.sr-header-v27 .sr-lang-btn {
  display: inline-flex; align-items: center; gap: 6px;
  background: transparent; border: 1px solid rgba(11,11,11,0.18);
  border-radius: 100px; padding: 7px 12px; cursor: pointer;
  color: #0b0b0b; font-family: inherit; font-weight: 700; font-size: 12px;
  letter-spacing: 0.04em; line-height: 1; transition: border-color .15s ease, background .15s ease;
}
.sr-header-v27 .sr-lang-btn:hover { border-color: #209f48; background: rgba(126,217,87,0.10); }
.sr-lang-menu {
  position: absolute; top: calc(100% + 8px); right: 0; min-width: 170px;
  background: #fff; border: 1px solid rgba(11,11,11,0.12); border-radius: 12px;
  box-shadow: 0 16px 40px rgba(0,0,0,0.16); padding: 6px; z-index: 4000;
}
.sr-lang-menu a {
  display: block; padding: 10px 14px; border-radius: 8px;
  color: #0b0b0b; text-decoration: none; font-weight: 600; font-size: 14px;
}
.sr-lang-menu a:hover { background: rgba(126,217,87,0.14); color: #209f48; }
@media (max-width: 720px) {
  .sr-header-v27 .sr-lang-btn { padding: 7px 9px; }
  .sr-header-v27 .sr-lang-btn-label { display: none; }
}

.sr-hero-trust .sr-trust-langs a { color: #7ED957; text-decoration: none; font-weight: 700; }
.sr-hero-trust .sr-trust-langs a:hover { text-decoration: underline; }

/* ============================================================
   v2.9.25.64 — IN-LANGUAGE PROMPT BANNER + bigger lang button
   ============================================================ */
.sr-lang-banner {
  display: flex; align-items: center; justify-content: center; flex-wrap: wrap;
  gap: 14px; padding: 11px 16px;
  background: linear-gradient(135deg, #209f48, #166534);
  color: #fff; font-size: 14.5px; font-weight: 600;
  position: relative; z-index: 5000;
}
.sr-lang-banner-msg { letter-spacing: .01em; }
.sr-lang-banner-yes {
  display: inline-block; background: #fff; color: #0a0a0a !important;
  padding: 7px 16px; border-radius: 100px; font-weight: 800;
  text-decoration: none; font-size: 13.5px;
}
.sr-lang-banner-yes:hover { background: #7ED957; }
.sr-lang-banner-undo {
  background: transparent; border: 1px solid rgba(255,255,255,.55);
  color: #fff; padding: 6px 14px; border-radius: 100px;
  font-weight: 700; font-size: 12.5px; cursor: pointer; font-family: inherit;
}
.sr-lang-banner-undo:hover { background: rgba(255,255,255,.15); }
.sr-lang-banner-x {
  background: transparent; border: none; color: rgba(255,255,255,.8);
  font-size: 16px; cursor: pointer; padding: 4px 8px; line-height: 1;
}
.sr-lang-banner-x:hover { color: #fff; }
/* Bigger, clearer header language button (Sohan: "make it bigger and more clear") */
.sr-header-v27 .sr-lang-btn { padding: 9px 15px; font-size: 13.5px; }

/* ============================================================
   v2.9.25.67 — STRIKE-2 SECTION A: DISCIPLINE PASS (approved)
   1. ₿ pattern pulled back to negative-space strength (was 0.15,
      Gemini: "background actively fights the foreground").
   2. Bebas Neue = THE display face for section titles sitewide.
      Pacifico survives only as the hero script logo-headline.
   3. Signup watermark loses its stray Pacifico.
   Palette collapse done in-place: #5fb43a→#209F48, #2E6416→#166534
   (dark text-green token), #0a0d1a (blue-black)→#0f1511.
   ============================================================ */
html body #srnyc-hero::before,
html body .sr-hero-cinematic::before,
html body .sr-hero-v14::before { opacity: 0.08 !important; }

html body .sr-section-title,
html body .sr-carousel-title,
html body .sr-program-title,
html body .sr-press-title,
html body .sr-lounge-title {
  font-family: 'Bebas Neue', 'Poppins', sans-serif !important;
  font-weight: 400 !important;
  letter-spacing: .045em !important;
}

html body .sr-signup-wm { font-family: 'Bebas Neue', sans-serif !important; font-style: normal !important; }

/* ============================================================
   v2.9.25.67 — STRIKE-2 B+C+D: heritage band + crypto band
   Dark bands on the white homepage (same dark-section DNA as
   newsletter). Locked palette only; gold = kicker/accent.
   ============================================================ */
.sr-btcband { background: linear-gradient(180deg,#0b0f0b,#070807); border-top:1px solid rgba(126,217,87,.25); border-bottom:1px solid rgba(126,217,87,.25); padding: 56px 20px; position:relative; overflow:hidden; }
.sr-btcband::after { content:'₿'; position:absolute; right:-28px; top:-70px; font-size:330px; font-weight:800; color:rgba(126,217,87,.05); pointer-events:none; }
.sr-btcband-inner { max-width:1180px; margin:0 auto; position:relative; z-index:1; }
.sr-btcband-kicker { color:#d4af37; font-size:12px; letter-spacing:.26em; font-weight:700; margin-bottom:12px; }
.sr-btcband-ticker { display:flex; align-items:baseline; gap:18px; flex-wrap:wrap; }
.sr-btcband-price { font-family:'Bebas Neue',sans-serif; font-size:clamp(42px,6.5vw,76px); color:#fff; letter-spacing:.02em; line-height:1; }
.sr-btcband-delta { font-size:17px; font-weight:700; }
.sr-btc-up { color:#7ED957; } .sr-btc-down { color:#ff7a7a; }
.sr-btcband-meta { font-size:11.5px; color:rgba(255,255,255,.5); letter-spacing:.14em; text-transform:uppercase; margin-top:8px; }
.sr-btcband-copy { color:rgba(255,255,255,.78); max-width:640px; font-size:15.5px; margin:16px 0 6px; }
.sr-btcband-ctas { display:flex; gap:12px; flex-wrap:wrap; margin-top:14px; }
.sr-btcband-cta { display:inline-block; background:linear-gradient(135deg,#7ED957,#209F48); color:#0a0a0a !important; padding:13px 26px; border-radius:10px; font-weight:800; text-decoration:none; text-transform:uppercase; letter-spacing:.05em; font-size:13.5px; }
.sr-btcband-cta:hover { transform:translateY(-2px); }
.sr-btcband-cta-ghost { display:inline-block; border:1px solid rgba(255,255,255,.25); color:#fff !important; padding:13px 24px; border-radius:10px; font-weight:700; text-decoration:none; text-transform:uppercase; letter-spacing:.05em; font-size:13.5px; }
.sr-btcband-cta-ghost:hover { border-color:#7ED957; color:#7ED957 !important; }

.sr-heritage { background: radial-gradient(1100px 480px at 72% -8%, rgba(126,217,87,.10), transparent), #070a07; padding: 64px 20px 58px; position:relative; overflow:hidden; }
.sr-heritage-inner { max-width:1180px; margin:0 auto; }
.sr-heritage-kicker { color:#d4af37; font-size:12px; letter-spacing:.26em; font-weight:700; margin-bottom:10px; }
.sr-heritage-title { font-family:'Bebas Neue',sans-serif; font-weight:400; color:#fff; font-size:clamp(34px,4.6vw,58px); line-height:1.04; letter-spacing:.03em; margin:0 0 8px; }
.sr-heritage-routeline { height:4px; margin:38px 0 30px; background:linear-gradient(90deg,#d4af37,#7ED957 55%,#fff); border-radius:2px; }
.sr-heritage-era { display:grid; grid-template-columns:repeat(3,1fr); gap:26px; }
@media (max-width:760px){ .sr-heritage-era { grid-template-columns:1fr; } }
.sr-heritage-node { position:relative; padding-top:6px; }
.sr-heritage-node::before { content:''; position:absolute; top:-49px; left:0; width:13px; height:13px; border-radius:50%; background:#7ED957; box-shadow:0 0 16px rgba(126,217,87,.9); }
@media (max-width:760px){ .sr-heritage-node::before { display:none; } }
.sr-heritage-node-gold::before { background:#d4af37; box-shadow:0 0 16px rgba(212,175,55,.9); }
.sr-heritage-node-white::before { background:#fff; box-shadow:0 0 16px rgba(255,255,255,.9); }
.sr-heritage-when { font-size:11px; letter-spacing:.22em; color:rgba(255,255,255,.55); }
.sr-heritage-node h3 { color:#7ED957; font-size:19px; margin:6px 0 8px; }
.sr-heritage-node p { color:rgba(255,255,255,.72); font-size:14px; line-height:1.6; margin:0; }
.sr-heritage-quote { font-family:'Bebas Neue',sans-serif; font-size:clamp(24px,3.2vw,38px); line-height:1.12; letter-spacing:.03em; color:#fff; margin:38px 0 14px; border:none; padding:0; }
.sr-heritage-quote em { color:#7ED957; font-style:normal; }
.sr-heritage-cta { color:#7ED957; font-weight:800; text-decoration:none; font-size:14.5px; }
.sr-heritage-cta:hover { text-decoration:underline; }

/* ============================================================
   v2.9.25.70 — FONT DISCIPLINE: FINAL CASCADE OVERRIDE.
   The file accumulated 6+ competing !important font rules on the
   same titles across past parity passes (".sr-wrap .sr-section-title"
   at (0,2,0)+!important was beating the v67 block). This block sits
   at END-OF-FILE in BOTH stylesheets with max specificity. The real
   fix (deleting the graveyard) is logged in the ledger.
   ============================================================ */
html body .sr-wrap .sr-section-title,
html body .sr-section-title,
html body .sr-wrap .sr-carousel-title,
html body .sr-carousel-title,
html body .sr-wrap .sr-carousel-section > h2,
html body .sr-program-title,
html body .sr-press-title,
html body .sr-lounge-title {
  font-family: 'Bebas Neue', 'Poppins', sans-serif !important;
  font-weight: 400 !important;
  letter-spacing: .05em !important;
}
html body .sr-wrap .sr-heritage-title,
html body .sr-heritage-title,
html body .sr-heritage-quote {
  font-family: 'Bebas Neue', 'Poppins', sans-serif !important;
  font-weight: 400 !important;
}
html body .sr-btcband-price { font-family: 'Bebas Neue', 'Poppins', sans-serif !important; }

/* v2.9.25.70b — typed-selector escalation: the graveyard includes
   "html body .sr-wrap h2.sr-section-title" (0,2,3) variants. These arms
   sit above that and last in file. */
html body .sr-wrap h2.sr-section-title,
html body .sr-wrap h2.sr-carousel-title,
html body .sr-specials-section h2.sr-section-title,
html body .sr-wrap .sr-specials-section > h2.sr-section-title,
html body .sr-wrap section h2.sr-section-title {
  font-family: 'Bebas Neue', 'Poppins', sans-serif !important;
  font-weight: 400 !important;
  letter-spacing: .05em !important;
}
/* v2.9.25.71b — social circle (footer builds from shared on non-home pages too) */
html body .sr-footer .sr-footer-social a, html body footer.sr-footer .sr-footer-social a { border-radius: 50% !important; width: 38px !important; height: 38px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; border: 1px solid rgba(126,217,87,.45) !important; color: #7ED957 !important; }

/* ============================================================
   v2.9.25.72 — SOHAN DIRECTIVE: kill the dead space around
   "Shop By Category" + "Explore By Moods" (legacy 48px paddings
   on title AND sub = 192px wasted per section) + replace flat
   white with a white → soft-green gradient so the light sections
   breathe into the dark bands instead of slamming into them.
   ============================================================ */
html body .sr-wrap .sr-section-title,
html body .sr-section-title,
html body .sr-wrap h2.sr-section-title,
html body .sr-wrap .sr-section-sub,
html body .sr-section-sub {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
html body .sr-wrap .sr-moods-section,
html body .sr-moods-section {
  background: linear-gradient(180deg, #ffffff 0%, #f5fbf2 55%, #e9f6e2 100%) !important;
  padding-top: 48px !important; padding-bottom: 52px !important;
}
html body .sr-wrap .sr-categories-section,
html body .sr-categories-section {
  background: linear-gradient(180deg, #ffffff 0%, #f3faf0 50%, #e2f3da 100%) !important;
  padding-top: 48px !important; padding-bottom: 56px !important;
}

/* ============================================================
   v2.9.25.74 — MOTION POLISH (sitewide, light look kept).
   CSS-only hover lift/spring (no markup change → card DNA intact).
   Scroll-reveal only activates under html.sr-motion-ready (set by
   JS); if JS never runs, NOTHING is hidden. Reduced-motion safe.
   ============================================================ */
/* card hover lift — applies to shared product/category cards on white */
html body .sr-card,
html body .sr-category-card,
html body .sr-mood-card { transition: transform .2s cubic-bezier(.22,.61,.36,1), box-shadow .2s ease, border-color .2s ease; }
html body .sr-card:hover,
html body .sr-category-card:hover,
html body .sr-mood-card:hover { transform: translateY(-5px); box-shadow: 0 18px 40px rgba(32,159,72,.16); }

/* button spring */
html body .sr-hero-cta-primary,
html body .sr-seo-cta,
html body .sr-spc-arrow,
html body .sr-hero-cta-secondary { transition: transform .15s ease, box-shadow .15s ease, background .15s ease; }
html body .sr-hero-cta-primary:hover,
html body .sr-seo-cta:hover { transform: translateY(-3px) scale(1.02); box-shadow: 0 14px 34px rgba(32,159,72,.3); }
html body .sr-hero-cta-primary:active,
html body .sr-seo-cta:active { transform: scale(.97); }

/* scroll reveal */
html.sr-motion-ready .sr-reveal { opacity: 0; transform: translateY(22px); transition: opacity .6s ease, transform .6s cubic-bezier(.22,.61,.36,1); will-change: opacity, transform; }
html.sr-motion-ready .sr-reveal.sr-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  html.sr-motion-ready .sr-reveal { opacity: 1 !important; transform: none !important; }
  html body .sr-card:hover, html body .sr-category-card:hover, html body .sr-mood-card:hover { transform: none; }
  html body .sr-hero-cta-primary:hover, html body .sr-seo-cta:hover { transform: none; }
}

/* ============================================================
   v2.9.25.75 — GALAXY backgrounds (dark sections become deep space)
   + IG GRID section. Light sections untouched.
   ============================================================ */
.sr-galaxy { position: relative; overflow: hidden;
  background:
    radial-gradient(1200px 700px at 78% 12%, rgba(126,217,87,.10), transparent 60%),
    radial-gradient(900px 800px at 18% 30%, rgba(60,120,200,.10), transparent 60%),
    radial-gradient(700px 600px at 60% 98%, rgba(150,90,200,.07), transparent 60%),
    linear-gradient(180deg,#05070d,#070912 45%,#04060a) !important;
}
.sr-galaxy > canvas.sr-galaxy-stars { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.sr-galaxy > *:not(canvas.sr-galaxy-stars) { position: relative; z-index: 1; }

/* footer becomes galaxy sitewide */
html body footer.sr-footer.sr-galaxy { background:
    radial-gradient(900px 600px at 80% 0%, rgba(126,217,87,.10), transparent 60%),
    linear-gradient(180deg,#04060a,#060910) !important; }

/* IG grid section */
.sr-igf-section { padding: 64px 0; }
.sr-igf-head { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px; margin: 6px 0 20px; }
.sr-igf-handle { display:flex; align-items:center; gap:12px; font-weight:700; color:#fff; }
.sr-igf-handle .sr-igf-dot { width:46px; height:46px; border-radius:50%; background:linear-gradient(135deg,#7ED957,#209F48); display:flex; align-items:center; justify-content:center; font-size:22px; }
.sr-igf-handle small { display:block; font-size:12px; color:rgba(234,242,232,.6); font-weight:500; }
.sr-igf-follow { background:linear-gradient(135deg,#7ED957,#209F48); color:#04130a; padding:11px 22px; border-radius:10px; font-weight:800; text-decoration:none; transition:transform .15s ease; }
.sr-igf-follow:hover { transform: translateY(-2px); }
.sr-igf-grid { display:grid; grid-template-columns:repeat(6,1fr); gap:10px; }
@media (max-width: 1000px){ .sr-igf-grid { grid-template-columns:repeat(4,1fr); } }
@media (max-width: 620px){ .sr-igf-grid { grid-template-columns:repeat(3,1fr); } }
.sr-igf-tile { position:relative; aspect-ratio:1; background-size:cover; background-position:center; border-radius:12px; overflow:hidden; border:1px solid rgba(126,217,87,.18); display:block; transition:transform .2s ease, box-shadow .2s ease; }
.sr-igf-tile:hover { transform: scale(1.05); box-shadow: 0 16px 40px rgba(126,217,87,.25); z-index:2; }
.sr-igf-tile::after { content:"⧉"; position:absolute; top:7px; right:8px; color:#fff; font-size:14px; opacity:0; transition:.2s; text-shadow:0 1px 4px #000; }
.sr-igf-tile:hover::after { opacity:1; }
.sr-igf-title { font-family:'Bebas Neue',sans-serif; font-size:clamp(28px,4vw,46px); color:#fff; letter-spacing:.03em; margin:0; }
.sr-igf-kicker { font-family:'JetBrains Mono',ui-monospace,monospace; font-size:12px; letter-spacing:.24em; color:#7ED957; text-transform:uppercase; }

/* culture photo strip */
.sr-culture-section { padding: 60px 0; }
.sr-culture-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:14px; margin-top:22px; }
@media (max-width: 900px){ .sr-culture-grid { grid-template-columns:repeat(2,1fr); } }
.sr-culture-shot { position:relative; border-radius:14px; overflow:hidden; border:1px solid rgba(126,217,87,.25); box-shadow:0 18px 50px rgba(0,0,0,.5); }
.sr-culture-shot img { width:100%; height:300px; object-fit:cover; display:block; transition: transform .3s ease; }
.sr-culture-shot:hover img { transform: scale(1.05); }
.sr-culture-shot .sr-culture-cap { position:absolute; left:0; right:0; bottom:0; padding:26px 12px 11px; background:linear-gradient(180deg,transparent,rgba(4,6,10,.92)); font-size:12.5px; color:#eaf2e8; }
.sr-culture-shot .sr-culture-cap b { display:block; font-family:'Bebas Neue',sans-serif; font-size:18px; color:#7ED957; letter-spacing:.03em; }
@media (prefers-reduced-motion: reduce){ .sr-igf-tile:hover, .sr-culture-shot:hover img { transform:none; } }

/* ============================================================
   v2.9.25.84 — Featured-brand / light card polish (Sohan: cards
   look off, awkward floating shape + dead white space). Soft
   gradient image area, anchored product w/ shadow, less void.
   ============================================================ */
/* v2.9.25.85 — Sohan: image area (white) sat on a DARK info area with a
   divider line = "two stacked boxes". Make the WHOLE featured card one clean
   white card: white image area (no divider, no gradient seam) merging into a
   white info area, dark text. */
html body .sr-hero-featured-cards .sr-card .sr-card-img-wrap,
html body .sr-card-light .sr-card-img-wrap {
  padding-top: 82% !important;
  background: #ffffff !important;
  border-bottom: none !important;
}
html body .sr-hero-featured-cards .sr-card .sr-card-img,
html body .sr-card-light .sr-card-img {
  object-fit: contain !important;
  padding: 16px !important;
  filter: drop-shadow(0 8px 14px rgba(20,60,30,.14)) !important;
}
/* the info area was dark (rgba(12,15,22,.6)) — force it white to merge cleanly */
html body .sr-hero-featured-cards .sr-card .sr-card-body,
html body .sr-card-light .sr-card-body {
  background: #ffffff !important;
}
html body .sr-hero-featured-cards .sr-card .sr-card-name,
html body .sr-hero-featured-cards .sr-card .sr-card-price {
  -webkit-text-fill-color: #111111 !important;
}
/* whole featured card: one unified white card, clean border + lift */
html body .sr-hero-featured-cards .sr-card {
  background: #ffffff !important;
  border: 1px solid #e6ece2 !important;
  border-radius: 16px !important;
  overflow: hidden !important;
  box-shadow: 0 8px 22px rgba(20,60,30,.08) !important;
  transition: transform .2s ease, box-shadow .2s ease !important;
}
html body .sr-hero-featured-cards .sr-card:hover {
  transform: translateY(-5px) !important;
  box-shadow: 0 20px 44px rgba(32,159,72,.18) !important;
}
/* FAQ contact line text-fill safety (in case a global fill rule hits it) */
html body .sr-wrap .sr-faq .sr-faq-contact { -webkit-text-fill-color: rgba(255,255,255,.82) !important; }
html body .sr-wrap .sr-faq .sr-faq-contact a { -webkit-text-fill-color: #7ED957 !important; }

/* ============================================================
   v2.9.25.134 — Live freshness badge + free-delivery counter
   Additive homepage components under the hero. Dark-section safe
   (explicit colors, no reliance on theme vars). */
.sr-fresh-wrap { display:flex; justify-content:center; margin:6px auto 20px; padding:0 16px; }
.sr-fresh {
  display:inline-flex; align-items:center; gap:9px; flex-wrap:wrap; justify-content:center;
  background:rgba(126,217,87,.07); border:1px solid rgba(126,217,87,.4);
  border-radius:999px; padding:9px 17px 9px 14px;
  font:600 13px/1.3 'Poppins',sans-serif; color:rgba(238,243,236,.92);
}
.sr-fresh-dot {
  width:9px; height:9px; border-radius:50%; background:#7ED957; flex:0 0 auto;
  box-shadow:0 0 0 0 rgba(126,217,87,.7); animation:srFreshPulse 1.9s infinite;
}
@keyframes srFreshPulse {
  0%{ box-shadow:0 0 0 0 rgba(126,217,87,.5); }
  70%{ box-shadow:0 0 0 8px rgba(126,217,87,0); }
  100%{ box-shadow:0 0 0 0 rgba(126,217,87,0); }
}
@media (prefers-reduced-motion: reduce){ .sr-fresh-dot{ animation:none; } }
.sr-fresh-loc { color:#7ED957; font-weight:700; }
.sr-fresh-count strong { color:#fff; font-weight:800; }
.sr-fresh-sep { color:rgba(255,255,255,.28); }
.sr-fresh-sync { color:rgba(200,220,205,.66); }
@media (max-width:440px){ .sr-fresh-sync-sep, .sr-fresh-sync{ display:none; } }

.sr-delval { padding:8px 16px 30px; }
.sr-delval-inner {
  max-width:1080px; margin:0 auto; background:linear-gradient(180deg,#0b160f,#07100b);
  border:1px solid rgba(126,217,87,.18); border-radius:18px; padding:26px clamp(18px,4vw,34px);
}
.sr-delval-eyebrow { font:700 11px/1 'Poppins',sans-serif; letter-spacing:.16em; text-transform:uppercase; color:#7ED957; }
.sr-delval-title { margin:10px 0 6px; font:800 clamp(22px,3vw,30px)/1.12 'Poppins',sans-serif; color:#fff; }
.sr-delval-title span { color:#7ED957; }
.sr-delval-sub { margin:0 0 18px; font:500 14.5px/1.5 'Poppins',sans-serif; color:rgba(220,231,222,.72); max-width:640px; }
.sr-delval-cards { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:18px; }
@media (max-width:600px){ .sr-delval-cards{ grid-template-columns:1fr; } }
.sr-delval-card { border-radius:14px; padding:17px 20px; border:1px solid; }
.sr-delval-us { background:rgba(126,217,87,.08); border-color:rgba(126,217,87,.45); }
.sr-delval-them { background:rgba(255,255,255,.02); border-color:rgba(255,255,255,.1); }
.sr-delval-c-eyebrow { font:700 11px/1 'Poppins',sans-serif; letter-spacing:.12em; text-transform:uppercase; margin-bottom:8px; }
.sr-delval-us .sr-delval-c-eyebrow { color:#7ED957; }
.sr-delval-them .sr-delval-c-eyebrow { color:rgba(255,255,255,.4); }
.sr-delval-c-big { font:800 21px/1.15 'Poppins',sans-serif; margin-bottom:4px; color:#fff; }
.sr-delval-them .sr-delval-c-big { color:rgba(255,255,255,.6); }
.sr-delval-c-sub { font:500 13px/1.4 'Poppins',sans-serif; color:rgba(220,231,222,.72); }
.sr-delval-them .sr-delval-c-sub { color:rgba(255,255,255,.42); }
.sr-delval-cta {
  display:inline-block; font:800 13px/1 'Poppins',sans-serif; letter-spacing:.03em;
  color:#04140a; background:linear-gradient(135deg,#7ED957,#209F48);
  padding:13px 24px; border-radius:11px; text-decoration:none;
  box-shadow:0 8px 26px rgba(32,159,72,.36); transition:transform .18s ease, box-shadow .18s ease;
}
.sr-delval-cta:hover { transform:translateY(-2px); box-shadow:0 14px 34px rgba(32,159,72,.5); color:#04140a; }

/* v2.9.25.135 — menu AI-help banner (freshness badge + inline AI Budtender entry) */
.sr-menu-aihelp {
  display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap;
  margin:4px 0 18px; padding:12px 16px;
  background:rgba(126,217,87,.06); border:1px solid rgba(126,217,87,.28); border-radius:14px;
}
.sr-menu-aihelp .sr-fresh { background:transparent; border:none; padding:0; }
.sr-menu-budcta {
  display:inline-flex; align-items:center; gap:11px; cursor:pointer;
  background:rgba(126,217,87,.1); border:1px solid rgba(126,217,87,.5); border-radius:12px;
  padding:9px 16px; font-family:'Poppins',sans-serif; color:#eef3ec; text-align:left;
  transition:transform .16s ease, background .16s ease, box-shadow .16s ease;
}
.sr-menu-budcta:hover { transform:translateY(-1px); background:rgba(126,217,87,.18); box-shadow:0 10px 26px rgba(126,217,87,.34); }
.sr-menu-budcta-spark { color:#7ED957; font-size:17px; line-height:1; }
.sr-menu-budcta-txt { display:flex; flex-direction:column; line-height:1.2; }
.sr-menu-budcta-txt strong { font:800 13.5px/1.2 'Poppins',sans-serif; }
.sr-menu-budcta-txt span { font:500 11.5px/1.25 'Poppins',sans-serif; color:rgba(200,220,205,.78); }
@media (max-width:560px){
  .sr-menu-aihelp { justify-content:center; text-align:center; }
  .sr-menu-budcta { width:100%; justify-content:center; }
}

/* ============================================================
   v2.9.25.136 — Mobile optimization pass (tap targets + legibility).
   Scoped to phone widths; desktop untouched. WCAG 2.5.8 / 1.4.4 aligned. */
@media (max-width:767px){
  /* P1 — "Add to cart" = comfortable 44px tap target (was ~32px) */
  html body .sr-card-add-btn { min-height:44px; padding-top:11px; padding-bottom:11px; }
  /* P2 — product-card legibility: nothing under 12px */
  html body .sr-card-brand { font-size:12px; }
  html body .sr-card-weight { font-size:12px; }
  html body .sr-card .sr-badge { font-size:12px; }
  /* P3 — header nav links get a taller touch area via padding (keeps inline row) */
  html body .sr-header-nav a, html body .sr-nav a {
    padding-top:11px; padding-bottom:11px; display:inline-flex; align-items:center;
  }
}

/* ============================================================
   v2.9.25.137 — hero card tightening + carousel sizing + link a11y.
   Sohan: hero add-to-cart alignment + "everything feels like it needs
   to be smaller, cards below the hero look big". */
/* Hero featured cards were stretching to the full hero height (big dead gaps) AND
   the add-to-cart row misaligned across cards because a card with an extra badge
   (e.g. CBD%) has a taller meta row. Fix: (a) don't stretch cards to hero height,
   (b) fix the meta/badge row to a constant height so every CTA lands on the same
   line regardless of badge count. */
html body .sr-hero-featured-cards { align-items: stretch !important; }
html body .sr-hero-featured-cards .sr-card { align-self: stretch !important; }
html body .sr-hero-featured-cards .sr-card .sr-card-body { height: 100% !important; display: flex !important; flex-direction: column !important; }
/* Pin the CTA row to the bottom of every (equal-height) card so the add-to-cart
   buttons line up regardless of how many badges (THC/CBD/strain) a card has. */
html body .sr-hero-featured-cards .sr-card .sr-card-price-row { margin-top: auto !important; align-items: center !important; }
/* Carousel cards below the hero: a touch smaller — 6 across on desktop (was 5). */
@media (min-width: 981px){
  html body .sr-carousel-track > * { flex: 0 0 calc((100% - 80px) / 6) !important; width: calc((100% - 80px) / 6) !important; }
}
/* a11y (WCAG 1.4.1) — inline content links get a non-color cue (underline). */
#sr-home-eeat p a, .sr-seo-fallback p a, #sr-about-v23 p a, .sr-faq p a { text-decoration: underline; }

/* ============================================================
   v2.9.25.145 — redesign pass (from full-site audit):
   #1 product-card width cap, #3 comparison contrast + header size.
   Design system unchanged (near-black + single green accent, no new colors). */

/* #1 — cap product-card width so wide desktops show 4-6 per row and cards stop
   rendering ~390px wide / ~610px tall. Image is already 1:1-capped, so bounding
   the width bounds the height too. Mobile keeps its own % width (set elsewhere). */
@media (min-width: 768px){
  html body .sr-carousel-track > * {
    flex: 0 0 240px !important; width: 240px !important; max-width: 240px !important;
  }
}
html body .sr-carousel-track > * { scroll-snap-align: start !important; }
html body .sr-carousel-track { scroll-snap-type: x proximity !important; scroll-behavior: smooth; }

/* #3 — comparison table ("Why Silk Road" vs "Typical Queens Dispensary"):
   header 11px -> 15px to match body; competitor column + × marks to a solid
   muted grey (#b8b8b8 ~= 8:1 on near-black) so they clear WCAG AA. */
html body .sr-whyus-section .sr-compare-head > div,
html body.sr-home-light .sr-compare-head > div { font-size: 15px !important; }
/* competitor column + × marks — solid muted grey. The homepage runs sr-home-light,
   so the whyus section sits on a WHITE background → needs a DARK grey (#6e6e6e = 5:1
   on white). Dark-themed contexts get the light grey. Must set -webkit-text-fill-color
   (it overrides plain color at render). The original × was white-on-white (invisible). */
/* The whyus/compare section is a fixed WHITE band (both theme states measured white),
   so competitor column + × = dark grey #6e6e6e (5:1 on white), unconditionally. */
html body .sr-compare-row > div.sr-compare-them,
html body .sr-compare-row > div.sr-compare-them .sr-compare-x,
html body.sr-home-light .sr-compare-them,
html body.sr-home-light .sr-compare-them .sr-compare-x {
  color: #6e6e6e !important;
  -webkit-text-fill-color: #6e6e6e !important;
  opacity: 1 !important;
}

/* ============================================================
   v2.9.25.155 — SECTION SEAM GRADIENTS (approved preview "B").
   The white .sr-carousel-section bands butt hard against the dark canvas
   (#08080b). Add a ~54px gradient fade at each band's top (dark->white) and
   bottom (white->dark) so the seams read intentional, not jarring. No new
   colors, no bands removed. Content sits above the fades. */
html body .sr-carousel-section { position: relative; }
html body .sr-carousel-section::before {
  content: ""; position: absolute; top: 0; left: 0; right: 0; height: 54px; z-index: 0;
  pointer-events: none;
  background: linear-gradient(180deg, #08080b 0%, rgba(8,8,11,.55) 36%, rgba(255,255,255,.72) 82%, #ffffff 100%);
}
html body .sr-carousel-section::after {
  content: ""; position: absolute; bottom: 0; left: 0; right: 0; height: 54px; z-index: 0;
  pointer-events: none;
  background: linear-gradient(180deg, #ffffff 0%, rgba(255,255,255,.7) 20%, rgba(8,8,11,.6) 76%, #08080b 100%);
}
html body .sr-carousel-section > * { position: relative; z-index: 1; }

/* v2.9.25.162 — FIX Instagram grid overlap. Rule #11 forced .sr-igf-tile to
   min-height:280px + aspect-ratio:1/1, making tiles 280px wide while the grid
   columns are ~189px — so every tile overflowed its cell and overlapped its
   neighbor (10 overlapping pairs measured). Make tiles fill their column and
   stay square at every breakpoint. */
html body .sr-igf-tile {
  width: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  aspect-ratio: 1 / 1 !important;
}
html body .sr-igf-grid { align-items: start !important; }