/* Sanara Market and Sanara Marketplace — builds on site.css */
.sh-nav .nav-in { gap: .8rem; }
.sh-brand { font: 800 .82rem var(--f-label); letter-spacing: .2em; text-transform: uppercase; color: var(--ember); margin-right: auto; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.sh-home { display: none; color: var(--smoke); font-weight: 600; font-size: .92rem; }
@media (min-width: 720px) { .sh-home { display: inline-flex; align-items: center; min-height: 44px; } }
.sh-h1 { font-size: clamp(2.5rem, 7vw, 4.4rem); }
.sh-hero { padding-block: 3.2rem 1.6rem; background: radial-gradient(900px 380px at 80% 0%, rgba(245,158,11,.12), transparent 65%); }
.sh-badge-note { display: inline-block; margin-top: 1rem; padding: .5rem .9rem; border-radius: 999px; border: 1px solid rgba(245,158,11,.4); color: var(--cream); font-size: .9rem; font-weight: 600; }
.sh-tools { display: grid; gap: .9rem; margin: 1.4rem 0 1.2rem; }
@media (min-width: 900px) { .sh-tools { grid-template-columns: 1fr minmax(260px, 340px); align-items: center; } }
.sh-tools .tabs { margin: 0; }
.sh-tools .search input { padding-left: 1rem; }
.sh-grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 165px), 1fr)); padding-bottom: 3rem; }
@media (min-width: 700px) { .sh-grid { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); } }
@media (max-width: 699px) { .sh-body { padding: .8rem .8rem .9rem; } .sh-desc { display: none; } .sh-foot { flex-direction: column; align-items: flex-start; } .sh-foot > span:first-child { display: block; width: 100%; } .sh-add, .sh-foot .step { width: 100%; justify-content: center; } .sh-foot .step { justify-content: space-between; } }
@media (max-width: 420px) { .sh-brand { letter-spacing: .1em; font-size: .7rem; } }
.sh-card { display: grid; grid-template-rows: auto 1fr; border-radius: 20px; overflow: hidden; background: var(--coal); border: 1px solid var(--ash); min-width: 0; transition: border-color .2s, transform .2s; }
@media (hover: hover) { .sh-card:hover { border-color: rgba(245,158,11,.4); transform: translateY(-2px); } }
.sh-card.is-out { opacity: .55; }
.sh-media { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: #1E140C; }
.sh-media img { width: 100%; height: 100%; object-fit: cover; object-position: var(--fx, 50%) var(--fy, 50%); transform-origin: var(--fx, 50%) var(--fy, 50%); transform: scale(var(--fz, 1)); }
.sh-media .tag { position: absolute; top: .7rem; left: .7rem; }
.sh-noimg { position: absolute; inset: 0; display: grid; place-content: center; justify-items: center; gap: .5rem; background: radial-gradient(circle at 50% 40%, rgba(245,158,11,.16), transparent 65%), #1A130D; }
.sh-noimg img { width: 46%; max-width: 130px; height: auto; opacity: .55; }
.sh-noimg small { font: 800 .62rem var(--f-label); letter-spacing: .16em; text-transform: uppercase; color: var(--dim); }
.sh-body { padding: 1rem 1.05rem 1.1rem; display: grid; gap: .35rem; align-content: start; }
.sh-body h3 { font-weight: 700; font-size: 1.05rem; line-height: 1.3; }
.sh-vendor { font: 800 .68rem var(--f-label); letter-spacing: .16em; text-transform: uppercase; color: var(--ember); }
.sh-desc { color: var(--smoke); font-size: .88rem; line-height: 1.5; }
.sh-foot { display: flex; align-items: center; justify-content: space-between; gap: .6rem; margin-top: .45rem; flex-wrap: wrap; }
.sh-foot .price { font-size: 1.15rem; }
.sh-unit { display: block; color: var(--smoke); font-size: .8rem; margin-top: .1rem; }
.sh-add { min-height: 40px; padding-inline: .9rem; gap: .3rem; }

/* Coming soon */
.sh-soon { padding-block: 4rem 5rem; background: radial-gradient(900px 420px at 85% 10%, rgba(220,38,38,.12), transparent 60%), radial-gradient(800px 400px at 0% 100%, rgba(245,158,11,.10), transparent 60%); min-height: 70vh; }
.sh-soon-card { margin-top: 2.2rem; max-width: 640px; border-radius: 24px; border: 1px solid var(--ash); background: var(--coal); padding: 1.4rem; display: grid; gap: .8rem; }
@media (min-width: 640px) { .sh-soon-card { padding: 2rem; } }
.sh-soon-card h2 { font: 400 1.7rem/1.15 var(--f-display); }

/* Sellers (Marketplace) */
.sh-sellers { margin-top: .4rem; }
.sh-h2 { font: 800 .8rem var(--f-label); letter-spacing: .2em; text-transform: uppercase; color: var(--smoke); margin-bottom: .7rem; }
.sh-vrow { display: flex; gap: .6rem; overflow-x: auto; padding-bottom: .4rem; scrollbar-width: thin; }
.sh-v { flex: none; display: flex; align-items: center; gap: .6rem; min-height: 56px; padding: .45rem .9rem .45rem .5rem; border-radius: 16px; border: 1px solid var(--ash); background: var(--coal); text-align: left; color: var(--cream); }
.sh-v:first-child { padding-left: .9rem; }
.sh-v.on { border-color: var(--ember); box-shadow: 0 0 0 1px var(--ember); }
.sh-v b { display: block; font-size: .92rem; }
.sh-v small { display: block; color: var(--dim); font-size: .76rem; }
.sh-vlogo { width: 40px; height: 40px; border-radius: 12px; overflow: hidden; background: #1E140C; flex: none; }
.sh-vlogo img { width: 100%; height: 100%; object-fit: cover; object-position: var(--fx, 50%) var(--fy, 50%); transform-origin: var(--fx, 50%) var(--fy, 50%); transform: scale(var(--fz, 1)); }
.sh-note { font-size: .82rem; margin-top: .5rem; }
@media (hover: hover) { .sh-v { cursor: pointer; } }
.sh-sell { border-top: 1px solid var(--ash); }
.sh-sell-in { display: grid; gap: 2rem; }
@media (min-width: 1024px) { .sh-sell-in { grid-template-columns: 1fr 1.2fr; gap: 3.5rem; } }
.sh-sell form { border-radius: 24px; border: 1px solid var(--ash); background: var(--coal); padding: 1.4rem; }
.sh-footer .foot-bottom { border-top: 0; }
.sheet .cart-line small { display: block; margin-top: .1rem; }
/* Weekly boxes */
.sh-weekly { display: grid; gap: 1.2rem; align-items: center; margin: 0 0 3rem; padding: 1.4rem; border-radius: 24px; border: 1px solid rgba(245,158,11,.4); background: radial-gradient(600px 240px at 90% 0%, rgba(245,158,11,.14), transparent 70%), var(--coal); }
.sh-weekly .h2 { font-size: clamp(1.6rem, 4vw, 2.3rem); margin: .2rem 0 .4rem; }
.sh-weekly .muted { margin: 0; max-width: 56ch; }
.sh-weekly .btn { justify-self: start; }
@media (min-width: 800px) { .sh-weekly { grid-template-columns: 1fr auto; padding: 2rem; } }