/* بخش‌های صفحهٔ سالن (زیرِ هیرو) — ZB × beUI. فقط ظاهر؛ ساختار/JSِ صفحه دست‌نخورده. رنگ = شخصیتِ سالن + سرمه‌ای + طلایی. */
html .sp-sec{padding-block:56px;scroll-margin-top:130px}
html .sp-sec.alt{background:linear-gradient(180deg,var(--surface-2),var(--bg))}
html .sp-sec-head{margin-bottom:22px}
html .sp-sec-head h2{font-size:clamp(20px,4vw,28px);font-weight:600;gap:10px}
html .sp-sec-head h2 .ic{width:34px;height:34px;padding:8px;border-radius:12px;color:#fff;background:linear-gradient(145deg,var(--zb-accent),var(--zb-navy))}
html .sp-sec-head .more{font-weight:500;color:var(--zb-accent)}

/* ── نوارِ زنده ── */
html .sp-live{margin-top:-30px}
html .sp-live-in{border-radius:20px;padding:12px 16px}

/* ── ناوبریِ بخش‌ها: قرصِ شیشه‌ای ── */
html .sp-nav .container{gap:6px}
html .sp-nav a{padding:7px 14px;font-size:13.5px}
html .sp-nav .sp-book .btn-primary{border-radius:12px}

/* ── منوی خدمات: فهرستِ قیمتِ ادیتوریال ── */
html .svc-menu-chips{position:sticky;top:120px;z-index:4;padding:8px 0;margin-bottom:10px;background:color-mix(in srgb,var(--bg) 88%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
    display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;flex-wrap:nowrap}
html .svc-menu-chips::-webkit-scrollbar{display:none}
html .svc-menu-chips .chip{white-space:nowrap;flex:none}
html .svc-list{display:grid;gap:8px}
@media(min-width:900px){html .svc-list{grid-template-columns:repeat(2,1fr);column-gap:24px}}
html .svc-item{animation:zbcIn .4s var(--zb-ease-out) backwards}
html .svc-item .si-ic{width:46px;height:50px;border-radius:24px 24px 12px 12px!important;color:#fff!important;
    background:linear-gradient(150deg,var(--zb-accent),color-mix(in srgb,var(--zb-accent) 45%,var(--zb-navy)))!important;box-shadow:0 10px 18px -12px color-mix(in srgb,var(--zb-accent) 70%,transparent)}
html .svc-item .si-ic svg{width:22px;height:22px}
html .svc-item .si-go{background:var(--zb-accent-solid,var(--zb-accent));color:#fff;font-weight:500;padding:8px 14px;border-radius:12px;text-decoration:none;transition:transform .14s,background .2s}
html .svc-item .si-go:hover{background:var(--zb-accent-ink)}
html .svc-item .si-go:active{transform:scale(.95)}
@media(min-width:761px){html .svc-item .si-line{border-bottom:2px dotted color-mix(in srgb,var(--zb-accent) 30%,var(--border))}}
.zsp-more{display:flex;margin:14px auto 0;align-items:center;gap:8px;border:1px solid var(--zb-accent-line);background:var(--zb-accent-soft);color:var(--zb-accent-ink,var(--zb-accent));
    border-radius:14px;padding:10px 20px;font-weight:500;transition:transform .14s}
.zsp-more:active{transform:scale(.97)}.zsp-more[hidden]{display:none}

/* ── تیم: کاروسلِ کشیدنی با پرترهٔ قوسی ── */
html .team-grid{display:flex!important;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 16px 16px;margin-inline:-16px;scrollbar-width:none}
html .team-grid::-webkit-scrollbar{display:none}
html #team .st-card{flex:0 0 min(62%,220px);scroll-snap-align:center;display:flex;flex-direction:column;align-items:center;gap:6px;padding:18px 14px;border-radius:22px;
    background:var(--surface);border:1px solid var(--border);text-decoration:none;color:var(--text);box-shadow:none;transition:border-color .2s,transform .2s var(--zb-ease-out)}
html #team .st-card:hover{border-color:var(--zb-accent-line);transform:translateY(-3px)}
html #team .st-av{width:96px;height:108px;border-radius:48px 48px 20px 20px;overflow:hidden;display:grid;place-items:center;font-size:2rem;font-weight:600;color:#fff;
    background:linear-gradient(150deg,var(--zb-accent),var(--zb-navy));box-shadow:0 18px 30px -18px color-mix(in srgb,var(--zb-accent) 80%,transparent)}
html #team .st-av img{width:100%;height:100%;object-fit:cover}
html #team .st-card b{font-weight:600;margin-top:6px}
html #team .st-card small{color:var(--muted)}
html #team .st-rate{color:var(--zb-gold);font-weight:600}
html #team .st-card::after{content:"رزرو با او ←";font-size:12px;color:var(--zb-accent);margin-top:4px}

/* ── تایم‌لاین ── */
html .tlz{padding-inline-start:28px}
html .tlz::before{background:linear-gradient(to bottom,var(--zb-accent),color-mix(in srgb,var(--zb-accent) 10%,transparent))!important;width:2px!important}
html .tlz-it{border-radius:16px!important;border:1px solid var(--border)!important;background:var(--surface)!important;box-shadow:none!important}
html .tlz-ic{background:linear-gradient(145deg,var(--zb-accent),var(--zb-navy))!important;color:#fff!important;box-shadow:0 0 0 4px var(--bg)!important}
html .t-star .tlz-ic{background:linear-gradient(145deg,var(--zb-gold),color-mix(in srgb,var(--zb-gold) 60%,var(--zb-navy)))!important}

/* ── گالری: بنتو ── */
html .gal{display:grid!important;grid-template-columns:repeat(2,1fr);grid-auto-rows:150px;gap:10px;columns:auto!important}
@media(min-width:900px){html .gal{grid-template-columns:repeat(4,1fr);grid-auto-rows:190px}}
html .gal figure{margin:0!important;border-radius:20px;overflow:hidden;position:relative;cursor:zoom-in;break-inside:auto}
html .gal figure:first-child{grid-column:span 2;grid-row:span 2}
html .gal figure:nth-child(4n+4){grid-row:span 2}
html .gal img{width:100%;height:100%!important;object-fit:cover;transition:transform .8s var(--zb-ease-out)}
html .gal figure:hover img{transform:scale(1.06)}
html .gal figcaption{position:absolute;inset-inline:10px;bottom:10px;padding:6px 12px;border-radius:12px;color:#fff;font-size:12.5px;width:max-content;max-width:calc(100% - 20px);
    background:rgba(20,26,58,.45);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2)}

/* ── نظرات: کارتِ امتیازِ سرمه‌ای + طلایی ── */
html .rev-layout{display:grid;gap:16px}
@media(min-width:900px){html .rev-layout{grid-template-columns:320px 1fr;align-items:start}}
html .rev-score{position:relative;overflow:hidden;border-radius:24px!important;padding:22px!important;color:#fff!important;border:0!important;
    background:radial-gradient(90% 90% at 100% 0%,color-mix(in srgb,var(--zb-gold) 40%,transparent),transparent 55%),linear-gradient(160deg,color-mix(in srgb,var(--zb-accent) 45%,var(--zb-navy)),var(--zb-navy))!important}
@media(min-width:900px){html .rev-score{position:sticky;top:130px}}
html .rev-score .big{font-size:64px!important;font-weight:600!important;line-height:1;color:color-mix(in srgb,var(--zb-gold) 70%,#fff)!important;background:none!important;-webkit-text-fill-color:currentColor!important}
html .rev-score .stars .ic{color:var(--zb-gold)!important}
html .rev-score small{color:rgba(255,255,255,.75)!important}
html .rev-bar span{color:rgba(255,255,255,.85)!important}
html .rev-bar .track{background:rgba(255,255,255,.14)!important;border-radius:99px;overflow:hidden}
html .rev-bar .fill{background:linear-gradient(90deg,var(--zb-gold),color-mix(in srgb,var(--zb-gold) 60%,#fff))!important;transform-origin:right;animation:zspBar 1.1s var(--zb-ease-out) backwards}
@keyframes zspBar{from{transform:scaleX(0)}}
html .rev-card{border-radius:18px!important;border:1px solid var(--border)!important;background:var(--surface)!important;box-shadow:none!important;padding:14px!important;margin-bottom:10px}
html .rev-card .r-av{background:linear-gradient(145deg,var(--zb-accent),var(--zb-navy))!important;color:#fff!important}
html .rev-card .stars .ic{color:var(--zb-gold)!important}
html .rv-reply{border-radius:12px;background:var(--zb-accent-soft)!important;border-inline-start:3px solid var(--zb-accent)!important}

/* ── ساعاتِ کاری: نوارِ ۲۴ساعته ── */
html .hours-card{border-radius:22px!important;border:1px solid var(--border)!important;background:var(--surface)!important;box-shadow:none!important;padding:14px!important}
html .hours-row2{display:grid!important;grid-template-columns:92px 1fr auto;gap:10px;align-items:center;padding:9px 6px!important;border-radius:12px}
html .hours-row2.today{background:var(--zb-accent-soft)!important}
html .hours-row2 .d{font-weight:500}
html .hours-row2 .t{font-size:12.5px;color:var(--muted);white-space:nowrap}
.zsp-hb{position:relative;height:10px;border-radius:99px;background:color-mix(in srgb,var(--text) 6%,transparent);overflow:visible}
.zsp-hb i{position:absolute;top:0;bottom:0;border-radius:99px;background:linear-gradient(90deg,color-mix(in srgb,var(--zb-accent) 55%,var(--zb-navy)),var(--zb-accent));
    transform-origin:right;animation:zspBar .9s var(--zb-ease-out) backwards}
.zsp-hb b{position:absolute;top:-4px;bottom:-4px;width:2px;border-radius:2px;background:var(--zb-bad);box-shadow:0 0 0 3px var(--surface)}
.zsp-hb b::after{content:"اکنون";position:absolute;top:-18px;left:50%;transform:translateX(-50%);font-size:9.5px;color:var(--zb-bad);white-space:nowrap}
html .contact-card{border-radius:22px!important;border:1px solid var(--border)!important;background:var(--surface)!important;box-shadow:none!important}
html .qr-wrap{border-radius:18px;padding:12px;color:#fff;background:linear-gradient(150deg,color-mix(in srgb,var(--zb-accent) 55%,var(--zb-navy)),var(--zb-navy))!important}
html .qr-wrap small{color:rgba(255,255,255,.8)!important}
html .qr-box{background:#fff;border-radius:14px;padding:8px}
html .mini-map{border-radius:18px!important;overflow:hidden}

/* نوارِ شناورِ رزرو فقط بعد از عبور از هیرو */
html .sp-float:not(.is-up){transform:translateY(160%)}
@media(prefers-reduced-motion:reduce){html .svc-item,html .rev-bar .fill,.zsp-hb i{animation:none}}
