/* Suhavi Store brand pages (modules/brand-pages.php). Black + gold like the header. Only loaded on brand pages that have a record. */
.sbp{--g:#d4a017;--k:#111;--line:#e5e5e0;margin:0 0 18px;color:#1b1b1b}
.sbp *{box-sizing:border-box}
.sbp-h{font-size:20px;line-height:1.25;margin:26px 0 12px;padding-left:10px;border-left:4px solid var(--g)}
/* header */
.sbp-head{display:flex;align-items:center;gap:20px;padding:26px;border-radius:14px;background:var(--k);color:#fff}
.sbp-head h1{margin:0;font-size:30px;line-height:1.15;color:#fff}
.sbp-logo{height:64px;width:auto;max-width:150px;object-fit:contain;background:#fff;border-radius:8px;padding:6px;flex:none}
.sbp-tag{margin:6px 0 0;color:#cfcfcf;font-size:16px}
.sbp-stats{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:10px;font-size:13px;color:#cfcfcf}
.sbp-stats b{color:var(--g);font-size:16px}
.sbp-slim{padding:14px 18px;gap:14px}
.sbp-slim h1{font-size:22px}
.sbp-slim .sbp-logo{height:44px;max-width:110px}
.sbp-slim .sbp-ht{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.sbp-slim .sbp-stats{margin:0}
.sbp-compact .sbp-head{background:#fff;color:#111;border:1px solid var(--line)}
.sbp-compact .sbp-head h1{color:#111}
.sbp-compact .sbp-stats{color:#666}
/* chips + why strip */
.sbp-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.sbp-chips a{background:#fff;border:1px solid #cfcfca;border-radius:20px;padding:6px 14px;font-size:13px;color:#222;text-decoration:none}
.sbp-chips a:hover{border-color:var(--g);color:#000}
.sbp-why{display:flex;flex-wrap:wrap;gap:6px 22px;margin:18px 0;padding:10px 14px;background:#fffbea;border:1px solid #f0d98a;border-radius:10px;font-size:13px}
/* product cards: the theme's own cards, laid out here */
.sbp-list ul.products{margin:0!important;padding:0;list-style:none}
.sbp-row ul.products{display:flex!important;flex-wrap:nowrap!important;gap:14px;overflow-x:auto;padding-bottom:8px;scroll-snap-type:x proximity}
.sbp-row ul.products>li{flex:0 0 clamp(190px,23%,260px)!important;max-width:none!important;scroll-snap-align:start;width:auto!important;margin:0!important}
.sbp-spot ul.products{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:14px}
.sbp-spot ul.products>li{width:auto!important;margin:0!important}
.sbp-spot ul.products>li:first-child{grid-column:span 1}
.sbp-one ul.products{display:block!important}
.sbp-one ul.products>li{width:100%!important;margin:0!important}
/* story */
.sbp-hero{display:grid;grid-template-columns:1.1fr 1fr;background:var(--k);color:#fff;border-radius:14px;overflow:hidden}
.sbp-hero-t{padding:30px}
.sbp-hero h1{font-size:34px;line-height:1.15;margin:14px 0 8px;color:#fff}
.sbp-hero-i{background:#1d1d1d;display:flex;align-items:center;justify-content:center;padding:20px}
.sbp-hero-i img{max-width:100%;max-height:300px;object-fit:contain}
.sbp-btn{display:inline-block;margin-top:14px;background:var(--g);color:#000!important;padding:10px 22px;border-radius:24px;font-weight:700;text-decoration:none}
.sbp-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.sbp-step-l{margin:0 0 8px;font-weight:700}
.sbp-step-l em{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;margin-right:6px;border-radius:50%;background:var(--g);color:#000;font-style:normal}
.sbp-tiles{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.sbp-tile{display:block;background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;text-align:center;text-decoration:none;color:#fff}
.sbp-tile img{display:block;width:100%;height:110px;object-fit:contain;padding:8px;background:#fff}
.sbp-tile span{display:block;padding:8px;font-size:13px;font-weight:600;background:var(--k)}
/* about + questions (after the grid) */
.sbp-after{margin-top:26px}
.sbp-box{background:#fff;border:1px solid var(--line);border-radius:12px;padding:6px 18px}
.sbp-box p{margin:12px 0;line-height:1.6}
.sbp-faq details{border-bottom:1px solid #eee;padding:10px 0}
.sbp-faq details:last-child{border-bottom:0}
.sbp-faq summary{cursor:pointer;font-weight:600}
.sbp-faq details p{margin:8px 0 2px}
/* phone */
@media (max-width:768px){
 .sbp-head{flex-direction:column;align-items:flex-start;padding:16px;gap:12px}
 .sbp-head h1{font-size:24px}
 .sbp-slim{flex-direction:row;align-items:center}
 .sbp-spot ul.products{grid-template-columns:repeat(2,1fr)}
 .sbp-row ul.products>li{flex-basis:62%!important}
 .sbp-hero{grid-template-columns:1fr}
 .sbp-hero-t{padding:20px}
 .sbp-hero h1{font-size:25px}
 .sbp-hero-i{padding:10px}
 .sbp-hero-i img{max-height:200px}
 .sbp-steps{grid-template-columns:1fr}
 .sbp-tiles{grid-template-columns:repeat(2,1fr)}
 .sbp-h{font-size:18px}
 .sbp-why{flex-direction:column;gap:4px}
}
/* the theme's own brand banner (content block above the page) is replaced by the brand header */
body.sbp-page .ct-container-full>article{display:none}

.sbp-bc{font-size:12px;color:#666;margin:0 0 10px}.sbp-bc a{color:#444;text-decoration:none}.sbp-bc a:hover{text-decoration:underline}
.sbp-spotwrap.sbp-one-up{display:grid;grid-template-columns:minmax(220px,300px) 1fr;gap:16px;align-items:start}
.sbp-spotwrap.sbp-one-up .sbp-spot ul.products{grid-template-columns:1fr!important}
.sbp-whybox{flex-direction:column;margin:0;gap:8px;font-size:14px;padding:16px}
@media (max-width:768px){.sbp-spotwrap.sbp-one-up{grid-template-columns:1fr}.sbp-spot ul.products>li:only-child{grid-column:1/-1}}
/* full width block above / below the shop area, same width as the theme's own container */
.sbp-wrap{width:var(--theme-container-width,92%);max-width:var(--theme-normal-container-max-width,1290px);margin:22px auto 6px}
.sbp-after.sbp-wrap{margin:10px auto 30px}
.sbp-side{background:#fff;border:1px solid var(--line);border-radius:12px;padding:18px 20px;display:flex;flex-direction:column;gap:10px;justify-content:center}
.sbp-side h3{margin:0;font-size:18px}
.sbp-side p{margin:0;line-height:1.6;color:#333}
.sbp-side p a{color:#8a6500;font-weight:600}
.sbp-side .sbp-why{margin:2px 0;padding:10px 12px;font-size:13px;flex-direction:row;flex-wrap:wrap;gap:6px 16px}
.sbp-side .sbp-btn{align-self:flex-start;margin-top:4px}
#sbp-grid{scroll-margin-top:90px}
.sbp-list .ct-media-container img{max-height:300px;width:100%;object-fit:contain}
.sbp-spotwrap.sbp-one-up{align-items:stretch}
.sbp-spotwrap.sbp-one-up{align-items:start}
.sbp-side{justify-content:flex-start}