/* ============================================================
   VendorsHub "Royal Midnight" (2026-10-29) — loaded LAST on the website
   (index.html, explore.html, vendor.html). Deep midnight surfaces, real-gold
   accents, gold story rings, serif display headings. Pop-ups and forms stay
   light (white sheets with gold accents) so long forms stay easy to read.
   Only looks change here: ids and handlers stay the same.
   ============================================================ */
:root{
  --r-bg:#07070D; --r-bg2:#0D0D17; --r-card:#13131F; --r-card2:#1A1A29; --r-line:rgba(226,194,106,.16); --r-line2:rgba(255,255,255,.08);
  --r-ink:#F4EFE1; --r-ink2:#B9B4C9; --r-ink3:#8C88A0;
  --r-gold:#E2C26A; --r-gold2:#F6DE8E; --r-gold-deep:#A8842A;
  --r-grad:linear-gradient(135deg,#F9E9A6 0%,#E2C26A 38%,#B98E2E 70%,#F2D886 100%);
  --r-ring:conic-gradient(from 210deg,#F9E9A6,#E2C26A,#9C7420,#F6DE8E,#E2C26A,#F9E9A6);
  --r-shadow:0 18px 40px -22px rgba(0,0,0,.9),0 0 0 1px var(--r-line2);
  --r-glow:0 0 0 1px rgba(226,194,106,.35),0 12px 40px -12px rgba(226,194,106,.35);
  --r-serif:'Playfair Display',Georgia,'Times New Roman',serif;
  /* re-point the website tokens */
  --s-bg:var(--r-bg); --s-card:var(--r-card); --s-line:var(--r-line2); --s-ink:var(--r-ink); --s-ink2:var(--r-ink2); --s-brand:var(--r-ink); --s-accent:var(--r-gold); --s-soft:var(--r-card2);
  --s-shadow:var(--r-shadow); --s-shadow-lg:0 26px 60px -24px rgba(0,0,0,.95),0 0 0 1px var(--r-line);
}
html{background:var(--r-bg);scrollbar-color:#3A3550 var(--r-bg)}
body{background:radial-gradient(1200px 600px at 50% -200px,rgba(226,194,106,.10),transparent 60%),var(--r-bg);color:var(--r-ink)}
::selection{background:var(--r-gold);color:#120E05}
::-webkit-scrollbar-track{background:var(--r-bg)}
::-webkit-scrollbar-thumb{background:#3A3550;border-color:var(--r-bg)}
.page-loader{background:var(--r-bg)}

/* ---------- header ---------- */
header.site{background:rgba(7,7,13,.82);border-bottom:1px solid var(--r-line);color:var(--r-ink)}
header.site.scrolled{box-shadow:0 10px 30px -18px #000}
.brand-text .name{font:800 23px/1 var(--r-serif);letter-spacing:.01em;background:var(--r-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.brand-text .tag{color:var(--r-ink3)}
.vh-tabs{background:var(--r-card);border:1px solid var(--r-line2)}
.vh-tab{color:var(--r-ink2)}
.vh-tab:hover{color:var(--r-gold2)}
.vh-tab.on{background:var(--r-grad);color:#1A1405;box-shadow:0 6px 18px -8px rgba(226,194,106,.7)}
header.site .city-pill-mini,header.site .btn-ghost{background:var(--r-card);border-color:var(--r-line2);color:var(--r-ink)}
header.site .city-pill-mini:hover,header.site .btn-ghost:hover{border-color:var(--r-gold)}
.btn-primary,header.site .hdr-list{background:var(--r-grad);color:#1A1405;box-shadow:0 10px 24px -12px rgba(226,194,106,.85)}
.btn-primary:hover{filter:brightness(1.06);background:var(--r-grad)}

/* ---------- social home ---------- */
.hero.hero-v4.rh{background:none;padding:22px 0 10px;color:var(--r-ink)}
.rh-wrap{max-width:1040px;margin:0 auto;padding:0 16px;display:grid;grid-template-columns:minmax(0,620px) 320px;gap:36px;justify-content:center}
.rh-main{min-width:0}
.rh-top{text-align:left;padding:6px 0 4px;position:relative;z-index:20}   /* search suggestions open above the stories + feed */
.rh h1{font:800 clamp(30px,4.2vw,46px)/1.08 var(--r-serif);letter-spacing:-.01em;color:var(--r-ink);margin:0 0 10px;text-wrap:balance}
.rh h1 span{background:var(--r-grad);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.rh h1 span::after{display:none}
.rh h1 .hero-gu{display:block;margin-top:8px;font:600 clamp(15px,1.8vw,19px)/1.35 var(--vh-font);color:var(--r-gold)}
.rh p.lead{color:var(--r-ink2);font-size:15px;margin:0 0 14px;max-width:none}
.rh p.lead em{color:var(--r-ink)}
.rh .city-toggle{background:var(--r-card);border:1px solid var(--r-line2);margin:0 0 12px;box-shadow:none;display:inline-flex}
.rh .city-toggle button{color:var(--r-ink2)}
.rh .city-toggle button.active{background:var(--r-grad);color:#1A1405}
.rh .search-box{max-width:none;background:var(--r-card);border:1px solid var(--r-line);box-shadow:var(--r-shadow);color:var(--r-ink)}
.rh .search-box:focus-within{border-color:var(--r-gold);box-shadow:var(--r-glow)}
.rh .search-box input{color:var(--r-ink);background:transparent}
.rh .search-box input::placeholder{color:var(--r-ink3)}
.rh .search-box svg{color:var(--r-gold)}
.rh .search-box .btn{background:var(--r-grad);color:#1A1405}
.rh .vh-voice-lang{background:var(--r-card2);color:var(--r-ink);border-color:var(--r-line2)}
.rh .vh-mic{background:var(--r-card2);color:var(--r-gold);border-color:var(--r-line2)}
.rh .vh-examples{justify-content:flex-start}
.vh-examples.on-light .vh-example,.rh .vh-example{background:var(--r-card);border-color:var(--r-line2);color:var(--r-ink2)}
.vh-examples.on-light .vh-example:hover,.rh .vh-example:hover{border-color:var(--r-gold);color:var(--r-gold2);background:var(--r-card)}

/* stories */
.rs-row{display:flex;gap:14px;overflow-x:auto;padding:16px 2px 12px;margin:10px 0 6px;scrollbar-width:none;border-bottom:1px solid var(--r-line2)}
.rs-row::-webkit-scrollbar{display:none}
.rs-story{flex:none;width:74px;display:flex;flex-direction:column;align-items:center;gap:6px;background:none;border:0;padding:0;cursor:pointer;text-decoration:none;color:var(--r-ink2);font:600 11.5px var(--vh-font)}
.rs-story small{max-width:74px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:11.5px}
.rs-ring{width:68px;height:68px;border-radius:50%;padding:3px;background:var(--r-ring);display:flex;align-items:center;justify-content:center;transition:transform .2s}
.rs-ring.hot{background:conic-gradient(from 0deg,#FF6B6B,#E2C26A,#FF9F43,#E2C26A,#FF6B6B)}
.rs-ring.soft{background:linear-gradient(135deg,rgba(226,194,106,.55),rgba(226,194,106,.15))}
.rs-ring.plus{background:none;border:2px dashed var(--r-gold);color:var(--r-gold);font-size:26px}
.rs-story:hover .rs-ring{transform:scale(1.06)}
.rs-ring > .rs-av{width:100%;height:100%;border:3px solid var(--r-bg)}
.rs-av{width:40px;height:40px;border-radius:50%;flex:none;overflow:hidden;display:flex;align-items:center;justify-content:center;background:#221F33;color:var(--r-gold2);font:800 14px var(--vh-font);border:2px solid var(--r-gold-deep)}
.rs-av.lg{width:58px;height:58px;font-size:18px}
.rs-av img{width:100%;height:100%;object-fit:cover}
.rs-cat-ic{width:30px;height:30px;color:var(--r-gold)}
.rs-cat-ic svg{width:100%;height:100%}
.rs-tick{width:15px;height:15px;color:var(--r-gold);vertical-align:-2px;margin-left:4px}

/* feed */
.rf-feed{display:flex;flex-direction:column;gap:18px;padding:14px 0 6px}
.rf-card{background:var(--r-card);border:1px solid var(--r-line2);border-radius:20px;overflow:hidden;box-shadow:var(--r-shadow)}
.rf-h{display:flex;align-items:center;gap:10px;padding:12px 14px}
.rf-h-link{display:flex;text-decoration:none}
.rf-h-tx{min-width:0;flex:1;display:flex;flex-direction:column;gap:2px}
.rf-h-tx b{color:var(--r-ink);font:700 14.5px var(--vh-font);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rf-h-tx small{color:var(--r-ink3);font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rf-type{flex:none;border:1px solid var(--r-line);color:var(--r-gold);border-radius:999px;padding:4px 10px;font:700 11px var(--vh-font)}
.rf-demo{flex:none;background:#FFD25E;color:#3D2A00;border-radius:999px;padding:4px 9px;font:800 10.5px var(--vh-font);letter-spacing:.02em}
.rf-media{position:relative;display:flex;overflow-x:auto;scroll-snap-type:x mandatory;aspect-ratio:4/5;background:#0A0A12;cursor:pointer;scrollbar-width:none}
.rf-media::-webkit-scrollbar{display:none}
.rf-media img{flex:0 0 100%;width:100%;height:100%;object-fit:cover;scroll-snap-align:center}
.rf-n{position:absolute;right:12px;top:12px;background:rgba(0,0,0,.6);color:#fff;border-radius:999px;padding:4px 9px;font:700 12px var(--vh-font);pointer-events:none}
.rf-acts{display:flex;gap:6px;padding:8px 10px 0}
.rf-act{width:42px;height:42px;border-radius:50%;border:0;background:none;color:var(--r-ink);font-size:21px;display:flex;align-items:center;justify-content:center;cursor:pointer;text-decoration:none;transition:transform .15s,background .15s}
.rf-act:hover{background:var(--r-card2);transform:scale(1.08)}
.rf-save{margin-left:auto}
.rf-save[aria-pressed="true"]{color:#FF4D6D}
.rf-cap{padding:4px 16px 16px;color:var(--r-ink2);font-size:14px;line-height:1.5}
.rf-cap b{color:var(--r-ink);font:700 15.5px var(--vh-font)}
.rf-price{color:var(--r-gold2);font-weight:800}
.rf-cap p{margin:4px 0 0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rf-more{border:0;background:none;color:var(--r-gold);font:700 13px var(--vh-font);padding:6px 0 0;cursor:pointer}
.rf-card.is-demo .rf-media{filter:saturate(.85)}
/* business card in the feed */
.rf-label{padding:10px 14px 8px;font:800 11px var(--vh-font);letter-spacing:.12em;text-transform:uppercase;color:var(--r-gold)}
.rf-biz.is-demo .rf-label{color:#FFD25E}
.rf-biz-cover{display:block;aspect-ratio:16/9;background:linear-gradient(135deg,#1C1830,#2A2340);overflow:hidden}
.rf-biz-cover img{width:100%;height:100%;object-fit:cover}
.rf-biz-ph{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:var(--r-gold)}
.rf-biz-ph svg{width:64px;height:64px}
.rf-biz-row{display:flex;gap:12px;align-items:center;padding:0 14px;margin-top:-28px;position:relative}
.rf-biz-row .rs-av{border:3px solid var(--r-card);box-shadow:0 0 0 2px var(--r-gold)}
.rf-biz-row .rf-h-tx{padding-top:26px}
.rf-pills{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px}
.rf-biz-desc{margin:10px 14px 0;color:var(--r-ink2);font-size:13.5px;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rf-biz-acts{display:flex;flex-wrap:wrap;gap:8px;padding:12px 14px 14px}
.rf-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:42px;padding:9px 14px;border-radius:12px;border:1px solid var(--r-line2);
  background:var(--r-card2);color:var(--r-ink);font:700 13.5px var(--vh-font);text-decoration:none;cursor:pointer;transition:filter .15s,border-color .15s}
.rf-btn:hover{border-color:var(--r-gold)}
.rf-btn.gold{background:var(--r-grad);color:#1A1405;border:0}
.rf-btn.wa{background:#1F9D55;color:#fff;border:0}
.rf-biz-acts .rf-btn.gold,.rf-biz-acts .rf-btn.wa{flex:1}
.rf-note{flex:1;font-size:12.5px;color:var(--r-ink3);background:var(--r-card2);border-radius:12px;padding:10px;text-align:center}
/* offer card */
.rf-offer{display:flex;align-items:center;gap:14px;padding:14px 16px;text-decoration:none;color:var(--r-ink);background:linear-gradient(110deg,#1B1626,#13131F 60%);border-color:var(--r-line)}
.rf-offer-badge{flex:none;min-width:74px;text-align:center;background:var(--r-grad);color:#1A1405;border-radius:14px;padding:12px 8px;font:800 15px/1.1 var(--vh-font)}
.rf-offer-tx{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1}
.rf-offer-tx small{color:var(--r-gold);font:800 10.5px var(--vh-font);letter-spacing:.1em}
.rf-offer-tx b{font:700 15px var(--vh-font)}
.rf-offer-tx span{color:var(--r-ink2);font-size:13px}
.rf-offer-tx em{color:var(--r-ink3);font-size:12px;font-style:normal}
.rf-offer-go{color:var(--r-gold);font-size:28px}
.rf-divider{display:flex;flex-direction:column;gap:3px;padding:14px 16px;border:1px dashed rgba(255,210,94,.45);border-radius:16px;color:var(--r-ink2);font-size:13px;background:rgba(255,210,94,.05)}
.rf-divider b{color:#FFD25E}
.rf-empty{padding:30px;text-align:center;color:var(--r-ink2)}
.rf-skel{height:420px;background:linear-gradient(90deg,var(--r-card),var(--r-card2),var(--r-card));background-size:200% 100%;animation:vxsk 1.3s infinite}
.rf-foot{display:flex;gap:10px;justify-content:center;padding:10px 0 20px;flex-wrap:wrap}
.rf-loadmore{min-height:46px;padding:10px 22px;border-radius:999px;border:0;background:var(--r-grad);color:#1A1405;font:800 14px var(--vh-font);cursor:pointer;text-decoration:none;display:inline-flex;align-items:center}
.rf-loadmore.ghost{background:none;border:1px solid var(--r-line);color:var(--r-gold2)}
/* sidebar */
.rh-side{position:sticky;top:84px;align-self:start;display:flex;flex-direction:column;gap:14px;padding-top:8px}
.rh-card{background:var(--r-card);border:1px solid var(--r-line2);border-radius:18px;padding:16px;display:flex;flex-direction:column;gap:10px;color:var(--r-ink2);font-size:13.5px}
.rh-card > b{color:var(--r-ink);font:700 17px var(--r-serif)}
.rh-card p{margin:0}
.rh-card .eyebrow{align-self:flex-start;background:rgba(46,180,120,.12);border:1px solid rgba(46,180,120,.35);color:#7EE2B0;margin:0}
.rh-gold{background:linear-gradient(150deg,#221B0C,#13131F 70%);border-color:var(--r-line)}
.rh-gold .rf-btn{width:100%}
.rh-side .vh-nums{justify-content:flex-start;margin:0;gap:6px 14px;color:var(--r-ink2)}
.rh-side .vh-nums b{color:var(--r-gold2)}
.rh-steps{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:6px}
.rh-small{color:var(--r-ink3);font-size:12px;margin:0 4px}
@media (max-width:980px){
  .rh-wrap{grid-template-columns:minmax(0,620px)}
  .rh-side{display:none}
}
@media (max-width:760px){
  .hero.hero-v4.rh{padding:14px 0 4px}
  .rh h1{font-size:28px}
  .rh p.lead{font-size:14px}
  .rf-feed{gap:14px}
  .rf-card{border-radius:16px}
  .rh .city-toggle{display:flex}
}

/* story viewer */
body.rs-lock{overflow:hidden}
.rs-viewer{position:fixed;inset:0;z-index:300;background:rgba(0,0,0,.92);display:flex;align-items:center;justify-content:center;animation:rsIn .2s ease}
@keyframes rsIn{from{opacity:0}to{opacity:1}}
.rs-v-box{position:relative;width:min(440px,100vw);height:min(92dvh,100dvh);background:#000;border-radius:18px;overflow:hidden;display:flex;flex-direction:column;box-shadow:var(--r-glow)}
.rs-v-bars{position:absolute;left:10px;right:10px;top:10px;z-index:4;display:flex;gap:4px}
.rs-v-bars i{flex:1;height:3px;border-radius:3px;background:rgba(255,255,255,.3);overflow:hidden}
.rs-v-bars b{display:block;height:100%;background:#fff}
.rs-v-top{position:absolute;left:0;right:0;top:20px;z-index:4;display:flex;align-items:center;gap:10px;padding:8px 12px;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.6)}
.rs-v-top b{display:block;font:700 15px var(--vh-font)}
.rs-v-top small{color:rgba(255,255,255,.8);font-size:12px}
.rs-v-x{margin-left:auto;width:40px;height:40px;border-radius:50%;border:0;background:rgba(0,0,0,.45);color:#fff;font-size:18px;cursor:pointer}
.rs-v-media{flex:1;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 30%,#2A2340,#000)}
.rs-v-media img{width:100%;height:100%;object-fit:cover}
.rs-v-nav{position:absolute;top:80px;bottom:200px;width:40%;z-index:3;border:0;background:none;cursor:pointer}
.rs-v-nav.prev{left:0}.rs-v-nav.next{right:0}
.rs-v-foot{position:absolute;left:0;right:0;bottom:0;z-index:4;padding:60px 14px 16px;background:linear-gradient(transparent,rgba(0,0,0,.88));color:#fff}
.rs-v-foot p{margin:0 0 10px;font-size:13.5px;line-height:1.45;color:rgba(255,255,255,.9);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.rs-v-offer{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.rs-v-offer span{background:var(--r-grad);color:#1A1405;border-radius:10px;padding:6px 10px;font:800 13px var(--vh-font)}
.rs-v-acts{display:flex;gap:8px}
.rs-v-acts .rf-btn{flex:1}
@media (max-width:520px){.rs-v-box{width:100vw;height:100dvh;border-radius:0}}

/* ---------- directory section (categories, offers, vendor grid) ---------- */
.filters{background:none}
.vh-sec-head h2,.results-bar h2,#resultsTitle{color:var(--r-ink);font-family:var(--r-serif)}
.vh-sec-head p,.results-bar .sub{color:var(--r-ink2)}
.select-field,.dropdown-btn,.chip-btn,.vh-fchip,#filterBar select{background:var(--r-card);color:var(--r-ink);border-color:var(--r-line2)}
.chip-btn.active,.vh-fchip[aria-pressed="true"]{background:var(--r-grad);color:#1A1405;border-color:transparent}
.cat-tile{color:var(--r-ink)}
.cat-tile-label{color:var(--r-ink)}
.vh-seg{background:var(--r-card);border-color:var(--r-line2)}
.vh-seg button{color:var(--r-ink2)}
.vh-seg button[aria-pressed="true"]{background:var(--r-grad);color:#1A1405}
.vh-hsec{background:var(--r-card);border-color:var(--r-line2)}
.vh-hsec .vh-sec-h h2{color:var(--r-ink)}
.vh-sec-h small{color:var(--r-ink3)}
.vh-mini{background:var(--r-card2);border-color:var(--r-line2);color:var(--r-ink)}
.vh-mini-tx b{color:var(--r-ink)}
.vh-mini-tx small{color:var(--r-ink2)}
.vh-pulse-tile{background:var(--r-card2);border-color:var(--r-line2);color:var(--r-ink)}
.vh-pulse-tile b{color:var(--r-gold2)}
.vh-offer-card{background:var(--r-card);border-color:var(--r-line2);color:var(--r-ink)}
.vh-offer-card::before{background:var(--r-grad)}
.vh-offer-title,.vh-offer-biz{color:var(--r-ink)}
.vh-offer-meta,.vh-offer-valid{color:var(--r-ink2)}
.vh-offer-head h2{color:var(--r-ink)}
.vh-intent{background:var(--r-card);border-color:var(--r-line);color:var(--r-ink)}
.vh-intent .vh-intent-label,.vh-intent-summary{color:var(--r-ink2)}
.vh-chip{background:var(--r-card2);color:var(--r-ink);border-color:var(--r-line)}
.demo-banner{background:rgba(255,210,94,.07);border-color:rgba(255,210,94,.4);color:var(--r-ink2)}
.demo-banner b,.demo-banner strong{color:#FFD25E}
.vh-sample-divider,.sample-divider{background:rgba(255,210,94,.07)!important;border-color:rgba(255,210,94,.4)!important;color:var(--r-ink2)!important}
.vh-why{background:rgba(46,180,120,.1);color:#9BE7C2}
.vh-miss{background:rgba(255,210,94,.08);color:#FFD98A}
.vcard.vc4{background:var(--r-card);border-color:var(--r-line2)}
.vcard.vc4:hover{box-shadow:var(--s-shadow-lg);border-color:var(--r-line)}
.vcard.vc4 .vcard-title{color:var(--r-ink)}
.vc-sub,.vcard.vc4 .vcard-desc{color:var(--r-ink2)}
.vc-cat{background:rgba(7,7,13,.78);color:var(--r-gold2);box-shadow:none;border:1px solid var(--r-line)}
.vcard.vc4 .icon-btn.call{background:var(--r-grad);color:#1A1405}
.vcard.vc4 .icon-btn.map{background:var(--r-card2);color:var(--r-gold)}
.vcard.vc4 .sample-contact-note{background:var(--r-card2);color:var(--r-ink3)}
.vcard.vc4 .vh-heart{background:rgba(7,7,13,.7);color:#fff;border-color:transparent}
.vh-empty h3{color:var(--r-ink)}
.vh-empty p{color:var(--r-ink2)}
.vh-map-note{color:var(--r-ink2)}

/* ---------- lower page ---------- */
.vh-how{background:none}
.vh-how-step{background:var(--r-card);border-color:var(--r-line2)}
.vh-how-step h3{color:var(--r-ink);font-family:var(--r-serif)}
.vh-how-step p{color:var(--r-ink2)}
.vh-how-n{background:var(--r-grad);color:#1A1405}
.cta-band{background:linear-gradient(110deg,#1D170A,#0D0D17 55%,#120F1E);color:var(--r-ink);border-top:1px solid var(--r-line);border-bottom:1px solid var(--r-line)}
.cta-band h2{color:var(--r-ink);font-family:var(--r-serif)}
.cta-band p{color:var(--r-ink2)}
.cta-band .section-eyebrow{color:var(--r-gold)!important}
.cta-band .btn-outline{border-color:var(--r-gold);color:var(--r-gold2);background:none}
footer.site{background:#050509;border-top:1px solid var(--r-line);border-image:none}
.vh-ann{background:var(--r-grad);color:#1A1405}

/* ---------- phone tab bar ---------- */
@media (max-width:760px){
  .vh-bnav{background:rgba(7,7,13,.94);border-top:1px solid var(--r-line);box-shadow:0 -10px 30px -18px #000}
  .vh-bnav a{color:var(--r-ink3)}
  .vh-bnav a span{filter:grayscale(1) brightness(1.6);opacity:.7}
  .vh-bnav a.on{color:var(--r-gold2)}
  .vh-bnav a.on span{filter:none;opacity:1}
}

/* ---------- light pop-ups on the dark site: gold accents ---------- */
.modal,.vh-modal-box{color:#16122E}
.modal-head{box-shadow:0 3px 0 0 var(--r-gold)}
.vh-modal .vh-btn-primary,.modal .btn-primary{background:var(--r-grad);color:#1A1405}

@media (prefers-reduced-motion:reduce){.rs-ring,.rf-act,.rs-viewer{transition:none;animation:none}.rf-skel{animation:none}}

/* category tiles: midnight cards with gold icons */
.cat-tile-row .cat-tile{--t:var(--r-card);background:linear-gradient(160deg,var(--r-card2),var(--r-card))!important;border:1px solid var(--r-line2)!important}
.cat-tile-row .cat-tile::after{border-color:rgba(226,194,106,.10)}
.cat-tile-row .cat-tile:hover{border-color:var(--r-gold)!important;box-shadow:var(--r-glow)}
.cat-tile-row .cat-tile-logo,.cat-tile-row .cat-tile-logo[class*="tile-"]{background:rgba(226,194,106,.12);color:var(--r-gold)}
.cat-tile-row .cat-tile-label,.cat-tile-row .cat-tile.active .cat-tile-label{color:var(--r-ink)}
.cat-tile-row .cat-tile.active{border-color:var(--r-gold)!important;box-shadow:var(--r-glow)}
.vh-ic-h{color:var(--r-gold)}
.vh-mini-tx .vh-pill{border-radius:8px;line-height:1.35}
.vh-offer-strip .vh-offer-head h2,.vh-hsec h2{font-family:var(--r-serif)}

/* ---------- Explore page header ---------- */
header.ex-top{background:rgba(7,7,13,.92);border-bottom:1px solid var(--r-line);color:var(--r-ink)}
header.ex-top .ex-brand{font:800 21px var(--r-serif);background:var(--r-grad);-webkit-background-clip:text;background-clip:text;color:transparent}
header.ex-top .ex-nav a{background:var(--r-card);border-color:var(--r-line2);color:var(--r-ink)}
header.ex-top .ex-nav a.ex-post{background:var(--r-grad);color:#1A1405;border:0}

/* ---------- vendor profile: Instagram-style, royal ---------- */
.vp-top{background:rgba(7,7,13,.9);border-bottom:1px solid var(--r-line);color:var(--r-ink)}
.vp-top a,.vp-top button{color:var(--r-ink)}
.vp-top .vp-iconbtn{background:var(--r-card);border-color:var(--r-line2)}
.vp-brand{font-family:var(--r-serif)!important;background:var(--r-grad);-webkit-background-clip:text;background-clip:text;color:transparent!important}
.vp-cover{background:linear-gradient(135deg,#1C1830,#0D0D17)}
.vp-cover::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,var(--r-bg));z-index:1}
.vp-head,.vp-card{background:var(--r-card);border:1px solid var(--r-line2);color:var(--r-ink);box-shadow:var(--r-shadow)}
.vp-card h2,.vp-head h1,.vp-title{color:var(--r-ink)!important}
.vp-card h2{font-family:var(--r-serif)}
.vp-muted,.vp-tagline,.vp-meta{color:var(--r-ink2)!important}
.vp-card p,.vp-card li,.vp-card td,.vp-card summary{color:var(--r-ink2)}
.vp-svc,.vp-hours tr,.vp-card hr{border-color:var(--r-line2)!important}
.vp-svc b{color:var(--r-ink)!important}
.vp-price{color:var(--r-gold2)!important}
.vp-faq{border-color:var(--r-line2)}
.vp-faq summary{color:var(--r-ink)}
.vp-linkbtn,.vp-about + .vp-linkbtn{color:var(--r-gold)!important}
.vp-svc-more summary{background:var(--r-card2);color:var(--r-gold2)}
.vp-head.ig{padding:18px}
.ig-top{display:flex;align-items:center;gap:22px;margin-top:-60px;margin-bottom:10px}
.ig-ring{flex:none;width:112px;height:112px;border-radius:50%;padding:4px;background:var(--r-ring);box-shadow:0 10px 30px -10px rgba(226,194,106,.6)}
.ig-ring .vp-avatar{width:100%;height:100%;margin:0;border-radius:50%;border:4px solid var(--r-card);background:#221F33;color:var(--r-gold2)}
.ig-stats{flex:1;display:flex;justify-content:space-around;gap:6px;padding-top:56px}
.ig-stats a{display:flex;flex-direction:column;align-items:center;text-decoration:none;color:var(--r-ink)}
.ig-stats b{font:800 22px var(--vh-font-display);color:var(--r-ink)}
.ig-stats small{color:var(--r-ink3);font-size:12.5px}
.ig-tick{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;margin-left:8px;border-radius:50%;background:var(--r-grad);color:#1A1405;font:900 13px var(--vh-font);vertical-align:4px}
.ig-acts{display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:8px;margin-top:14px}
.ig-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:42px;padding:8px 14px;border-radius:12px;border:1px solid var(--r-line2);background:var(--r-card2);
  color:var(--r-ink);font:700 13.5px var(--vh-font);text-decoration:none;cursor:pointer}
.ig-btn:hover{border-color:var(--r-gold)}
.ig-btn.gold{background:var(--r-grad);color:#1A1405;border:0}
.ig-btn.wa{background:#1F9D55;color:#fff;border:0}
.ig-tabs{display:flex;gap:4px;margin:16px -18px -18px;border-top:1px solid var(--r-line2);overflow-x:auto;scrollbar-width:none}
.ig-tabs a{flex:1;text-align:center;padding:12px 10px;color:var(--r-ink2);text-decoration:none;font:700 13px var(--vh-font);letter-spacing:.04em;white-space:nowrap;border-top:2px solid transparent;margin-top:-1px}
.ig-tabs a:hover,.ig-tabs a:focus-visible{color:var(--r-gold2);border-top-color:var(--r-gold)}
.vp-photos{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:4px!important}
.vp-photos button{aspect-ratio:1;border-radius:6px;overflow:hidden;padding:0;border:0;background:var(--r-card2)}
.vp-photos img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.vp-photos button:hover img{transform:scale(1.05)}
.vp-actionbar{background:rgba(7,7,13,.95);border-top:1px solid var(--r-line)}
.vp-actionbar .vp-act{background:var(--r-card2);color:var(--r-ink);border-color:var(--r-line2)}
.vp-actionbar .vp-act.call{background:var(--r-grad);color:#1A1405;border:0}
.vp-actionbar .vp-act.wa{background:#1F9D55;color:#fff;border:0}
.vp-sample{background:rgba(255,210,94,.08)!important;border:1px dashed rgba(255,210,94,.45);color:var(--r-ink2)!important}
.vp-foot{color:var(--r-ink3)}
@media (max-width:600px){
  .ig-top{gap:12px}
  .ig-ring{width:92px;height:92px}
  .ig-stats{padding-top:50px}
  .ig-stats b{font-size:19px}
  .ig-acts{grid-template-columns:1fr 1fr auto}
  .ig-acts [data-save]{display:none}
}
.vp-head{z-index:2}
.vp-aside .vp-act,.vp-card .vp-act{background:var(--r-card2);color:var(--r-ink);border-color:var(--r-line2)}
.vp-aside .vp-act:hover,.vp-card .vp-act:hover{border-color:var(--r-gold)}
.vp-aside .vp-act.call,.vp-card .vp-act.call{background:var(--r-grad);color:#1A1405;border:0}
.vp-aside .vp-act.wa,.vp-card .vp-act.wa{background:#1F9D55;color:#fff;border:0}
.vp-hours td,.vp-hours th{color:var(--r-ink2)}
.vp-hours tr.today td{color:var(--r-gold2)}
.vp-trust li,.vp-check{color:var(--r-ink2)}
.vp-card table td,.vp-card table th,.vp-card table tr{border-color:var(--r-line2)!important}
.rf-btn,.ig-btn{white-space:nowrap}
:focus-visible,.vh-btn:focus-visible,.vh-heart:focus-visible,.vh-seg button:focus-visible{outline-color:var(--r-gold)}
/* long names end with "…" instead of running under the next item */
.rs-story small{display:block;width:100%}
.rf-h-tx > *,.rf-offer-tx > *{min-width:0;max-width:100%;display:block}
.rf-media > .rf-demo{position:absolute;left:12px;top:12px;z-index:2;box-shadow:0 4px 14px rgba(0,0,0,.4);pointer-events:none}
/* jumping to a section (tabs, links, focus) never hides it under the sticky top bar or the bottom contact / tab bar */
html{scroll-padding-top:84px;scroll-padding-bottom:96px}

/* ---------- Follow + Like (js/vh-follow.js) — hidden until supabase/social.sql is installed ---------- */
html:not(.vf-on) .vf-follow,html:not(.vf-on) .vf-like,html:not(.vf-on) .ig-fstat,html:not(.vf-on) #rTabs,html:not(.vf-on) .vf-count{display:none!important}
.vf-follow{display:inline-flex;align-items:center;justify-content:center;gap:4px;min-height:34px;padding:6px 14px;border-radius:10px;border:0;cursor:pointer;
  background:var(--r-grad);color:#1A1405;font:800 12.5px var(--vh-font);white-space:nowrap;transition:filter .15s,transform .15s}
.vf-follow:hover{filter:brightness(1.07)}
.vf-follow:active{transform:scale(.96)}
.vf-follow.on{background:var(--r-card2);color:var(--r-ink);border:1px solid var(--r-line)}
.vf-follow.sm{min-height:30px;padding:5px 11px;font-size:12px;flex:none}
.rf-biz-acts .vf-follow{flex:1;min-height:42px;border-radius:12px;font-size:13.5px}
.vf-like{display:inline-flex;align-items:center;gap:5px;border:0;background:none;color:var(--r-ink);cursor:pointer;font:700 13px var(--vh-font)}
.vf-like .vf-heart{font-size:22px;line-height:1;transition:transform .2s}
.vf-like.on .vf-heart{color:#FF4D6D;animation:vfPop .35s ease}
@keyframes vfPop{40%{transform:scale(1.35)}100%{transform:scale(1)}}
.rf-acts .vf-like{width:auto;min-width:42px;padding:0 8px;border-radius:21px}
.vf-count{color:var(--r-gold)}
.vf-burst{position:absolute;left:50%;top:50%;z-index:5;transform:translate(-50%,-50%) scale(.4);font-size:96px;color:#fff;text-shadow:0 6px 24px rgba(0,0,0,.5);
  pointer-events:none;animation:vfBurst .9s ease forwards}
@keyframes vfBurst{30%{transform:translate(-50%,-50%) scale(1.1);opacity:1}100%{transform:translate(-50%,-50%) scale(1);opacity:0}}
/* Explore reels: like on the side rail, follow next to the name */
.vx-rail .vf-like{flex-direction:column;gap:3px;min-width:58px;color:#fff;font:700 11px var(--vh-font);text-shadow:0 1px 3px rgba(0,0,0,.7)}
.vx-rail .vf-like .vf-heart{width:46px;height:46px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.4);backdrop-filter:blur(6px);font-size:22px}
.vx-rail .vf-like.on .vf-heart{background:#E0245E;color:#fff}
.vx-rail .vf-like .vf-n:empty::before{content:"Like"}
.vx-follow{min-height:26px;padding:3px 10px;font-size:11.5px;margin-left:6px;vertical-align:1px}
.vx-act[aria-pressed="true"] .vx-ic{background:var(--r-grad);color:#1A1405}
/* home feed: For you | Following */
.rf-tabs{display:flex;gap:6px;margin:12px 0 0}
.rf-tabs button{flex:1;min-height:42px;border-radius:12px;border:1px solid var(--r-line2);background:var(--r-card);color:var(--r-ink2);font:700 14px var(--vh-font);cursor:pointer}
.rf-tabs button[aria-pressed="true"]{background:var(--r-grad);color:#1A1405;border-color:transparent}
.rf-empty b{display:block;color:var(--r-ink);font:700 17px var(--r-serif);margin-bottom:6px}
.rf-empty p{margin:0 0 12px;color:var(--r-ink2)}
.rf-save[aria-pressed="true"]{background:var(--r-grad)}
/* vendor profile: followers count + follow button */
.ig-fstat{display:flex;flex-direction:column;align-items:center;color:var(--r-ink)}
.ig-fstat b{font:800 22px var(--vh-font-display)}
.ig-fstat small{color:var(--r-ink3);font-size:12.5px}
.ig-acts{display:flex!important;flex-wrap:wrap}
.ig-acts .ig-btn{flex:1 1 0}
.ig-acts .ig-btn[aria-label="Share"]{flex:0 0 46px}
.ig-follow{border-radius:12px;min-height:42px;font-size:13.5px}
.vd-social{color:var(--s-ink2,#55516F);font-size:13px}
.vd-social b{color:var(--s-brand,#1A1446)}
@media (max-width:600px){.ig-stats b,.ig-fstat b{font-size:18px}.ig-acts .ig-follow{flex:1 1 calc(100% - 56px)}}
@media (prefers-reduced-motion:reduce){.vf-like.on .vf-heart,.vf-burst{animation:none}}
.vp-card .vh-btn-primary,.vp-sheet .vh-btn-primary{background:var(--r-grad);color:#1A1405}
.rf-media.no-img::after,.vx-strip.no-img::after{content:"📷";position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:42px;opacity:.35}
.rf-h-tx > .vf-count{font:700 12.5px var(--vh-font)}
.rf-h-tx > .vf-count:empty{display:none}
#resultsTitle{line-height:1.2}
#resultsSub{margin-top:4px}
/* long joined-up words a business types ("Bridal/engagement/haldi/…") wrap instead of pushing the page sideways */
.vp-card{min-width:0}
.vp-card,.vp-head,.rf-biz-desc,.rf-cap,.rs-v-foot p{overflow-wrap:anywhere}
/* share picture preview (js/vh-share.js) */
.vh-share-prev{display:block;width:100%;max-height:50vh;object-fit:contain;border-radius:14px;background:#07070D;margin:4px 0 12px}
.vh-modal .vh-share-wa,.vh-modal .vh-share-wa ~ .vh-btn{display:flex;width:100%;justify-content:center;margin:6px 0;text-decoration:none}
.vh-share-wa{background:#1F9D55;color:#fff;border:0}

/* ---------- home: Today's deals + festival specials (js/vh-social.js) ---------- */
.rd{margin:14px 0 4px;min-width:0}
.rd-head{display:flex;flex-direction:column;gap:2px;margin:0 0 10px}
.rd-head h2{margin:0;font:800 21px var(--r-serif);color:var(--r-ink)}
.rd-head small{color:var(--r-ink3);font-size:12.5px}
.rd-row{display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;padding:2px 2px 6px;scroll-snap-type:x mandatory}
.rd-row::-webkit-scrollbar{display:none}
.rd-card{flex:0 0 min(230px,72vw);scroll-snap-align:start;display:flex;flex-direction:column;gap:4px;min-width:0;padding:14px;border-radius:16px;text-decoration:none;
  background:linear-gradient(150deg,#221B0C,var(--r-card) 65%);border:1px solid var(--r-line);color:var(--r-ink)}
.rd-card.hot{border-color:#FF9F43;box-shadow:0 0 0 1px rgba(255,159,67,.35)}
.rd-card > *{min-width:0;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rd-badge{align-self:flex-start;background:var(--r-grad);color:#1A1405;border-radius:10px;padding:5px 10px;font:800 14px var(--vh-font)}
.rd-card b{font:700 15px var(--vh-font);color:var(--r-ink)}
.rd-biz{color:var(--r-ink2);font-size:12.5px}
.rd-card em{font-style:normal;font:700 12.5px var(--vh-font);color:var(--r-gold2)}
.rd-card.hot em{color:#FFB46B}
.rfe-card{flex:0 0 132px;scroll-snap-align:start;display:flex;flex-direction:column;align-items:center;gap:6px;min-width:0;padding:14px 10px;border-radius:16px;
  background:var(--r-card);border:1px solid var(--r-line2);text-decoration:none;color:var(--r-ink);text-align:center}
.rfe-card .rs-av{box-shadow:0 0 0 2px var(--r-gold)}
.rfe-card b,.rfe-card small{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}
.rfe-card b{font:700 13.5px var(--vh-font)}
.rfe-card small{color:var(--r-ink3);font-size:11.5px}
.rfe-cats{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.rfe-cats button{border:1px solid var(--r-line);background:var(--r-card);color:var(--r-ink2);border-radius:999px;padding:7px 12px;font:600 12.5px var(--vh-font);cursor:pointer;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rfe-cats button:hover{border-color:var(--r-gold);color:var(--r-gold2)}
.vh-grow{background:linear-gradient(150deg,#FFF6DC,#fff 70%);border:1px solid #F2DFA6}
.vh-grow-acts{display:flex;flex-wrap:wrap;gap:8px}
.vh-grow-acts .vh-btn{flex:1 1 200px}
.vh-grow .vh-btn-primary{background:var(--r-grad);color:#1A1405}
/* vendor dashboard (index.html #vendorProfileOverlay) is a light sheet like the other forms: it keeps the light
   colour set, so text on its white panels stays dark and readable (gold accents from the royal look) */
#vendorProfileOverlay{--s-bg:#FAFAFD;--s-card:#fff;--s-line:#ECEAF4;--s-ink:#16122E;--s-ink2:#55516F;--s-brand:#1A1446;--s-accent:#A8842A;--s-soft:#F3F1FB;
  --s-shadow:0 1px 2px rgba(22,18,46,.05),0 6px 20px -10px rgba(22,18,46,.18);color:#16122E}
#vendorProfileOverlay .vh-intent{background:#fff;border-color:#ECEAF4;color:#16122E}
#vendorProfileOverlay .vh-intent .vh-intent-label,#vendorProfileOverlay .vh-intent-summary{color:#55516F}
#vendorProfileOverlay .vh-chip{background:#F3F1FB;color:#16122E;border-color:#ECEAF4}
#vendorProfileOverlay .vh-seg{background:#F3F1FB;border-color:#ECEAF4}
#vendorProfileOverlay .vh-seg button{color:#55516F}
#vendorProfileOverlay .vh-seg button[aria-pressed="true"]{background:var(--r-grad);color:#1A1405}
#vendorProfileOverlay .vh-empty h3{color:#16122E}
#vendorProfileOverlay .vh-empty p{color:#55516F}
/* readable small print on the dark theme (found by qa/browser/contrast.js) */
.vh-pulse-tile small,.vh-hsec .vh-acct-sub,.vh-example small{color:var(--r-ink2)}
.vh-offer-card .vh-offer-valid.soon{color:#FFB46B}
.vh-seg button:not([aria-pressed="true"]){background:transparent}
.vcard.vc4 .vc-veg{background:rgba(46,180,120,.14);color:#7EE2B0}
.vp-offer{background:linear-gradient(150deg,#221B0C,var(--r-card2) 70%)!important;border-color:var(--r-line)!important;color:var(--r-ink)}
.vp-offer b{color:var(--r-ink)}
.vp-offer .vh-offer-valid.soon{color:#FFB46B}
.vp-card b:not([class]),.vp-head b:not([class]){color:var(--r-ink)}
/* light sheets (app profile + vendor area, website vendor dashboard): small print stays dark */
#savedPanel .vh-intent-label,#accountContent .vh-intent-label{color:#55516F}
#savedPanel .vh-seg,#accountContent .vh-seg{background:#F3F1FB;border-color:#ECEAF4}
#savedPanel .vh-seg button:not([aria-pressed="true"]),#accountContent .vh-seg button:not([aria-pressed="true"]),#vendorProfileOverlay .vh-seg button:not([aria-pressed="true"]){color:#55516F}
#accountContent button[onclick^="loggedVendor=null"]{color:#8A6100!important}
.vp-trust li span:not(.ic),.vp-trust li div > span{color:var(--r-ink2)}
/* light pop-ups (account, requests …): boxes inside stay light */
.vh-modal .vh-intent{background:#fff;border-color:#ECEAF4;color:#16122E}
.vh-modal .vh-intent .vh-intent-label,.vh-modal .vh-intent-summary{color:#55516F}
.vh-modal .vh-chip{background:#F3F1FB;color:#16122E;border-color:#ECEAF4}
#accountOverlay .vh-intent{background:#fff;border-color:#ECEAF4;color:#16122E}
#accountOverlay .vh-intent .vh-intent-label,#accountOverlay .vh-intent-summary{color:#55516F}
#accountOverlay .vh-chip{background:#F3F1FB;color:#16122E;border-color:#ECEAF4}
