/* ═══════════════════════════════════════════════════════════════════
   پروفایلِ عمومیِ آرایشگر — «آتلیه» (۲۰۲۶-۱۰-۰۱)
   هیروی مخملی با کلاژِ نمونه‌کار · پرترهٔ قوسیِ طلایی · کارتِ ویزیتِ QR · سوابق · دیوارِ نمونه‌کار
   منو و هفتهٔ زنده از zmn.css و zsp2.css می‌آیند.
   ═══════════════════════════════════════════════════════════════════ */
.zsty{padding-top:0}
.zsty-hero{position:relative;overflow:hidden;isolation:isolate;color:#fff;padding:96px 0 56px;
  background:linear-gradient(180deg,#141A3A,color-mix(in srgb,var(--zb-accent-solid,var(--zb-accent)) 40%,#141A3A))}
.zsty-bg{position:absolute;inset:0;z-index:-2;display:grid;grid-template-columns:repeat(3,1fr)}
.zsty-bg img{width:100%;height:100%;object-fit:cover;filter:saturate(.85)}
.zsty-bg img:only-child{grid-column:1/-1}
.zsty-hero::before{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(20,26,58,.82) 0%,rgba(20,26,58,.72) 40%,rgba(14,16,40,.94) 100%),
             radial-gradient(70% 90% at 85% 10%,color-mix(in srgb,var(--zb-accent-solid,var(--zb-accent)) 45%,transparent),transparent 70%)}
.zsty-hero::after{content:"";position:absolute;inset:0;z-index:-1;opacity:.07;pointer-events:none;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='84'%3E%3Cpath d='M8 80V36a24 24 0 0 1 48 0v44' fill='none' stroke='%23C9A46C' stroke-width='.8'/%3E%3C/svg%3E")}
.zsty-crumbs{margin-bottom:26px;color:rgba(247,241,234,.7)!important}
.zsty-crumbs a{color:rgba(247,241,234,.85)!important}
.zsty-grid{display:grid;gap:30px;align-items:center;grid-template-columns:1fr}
@media(min-width:960px){.zsty-grid{grid-template-columns:1fr 300px}}
.zsty-id{display:flex;flex-wrap:wrap;align-items:center;gap:28px}
.zsty-av{position:relative;margin:0;flex:none;width:170px;aspect-ratio:200/240}
.zsty-arch{position:absolute;inset:0;width:100%;height:100%;overflow:visible;z-index:2;pointer-events:none}
.zsty-arch path{fill:none;stroke:#d9bd86;stroke-width:3;stroke-dasharray:900;stroke-dashoffset:900;animation:zstyDraw 2.2s cubic-bezier(.65,0,.35,1) .2s forwards}
@keyframes zstyDraw{to{stroke-dashoffset:0}}
.zsty-ph{position:absolute;inset:4% 5% 2.5%;overflow:hidden;border-radius:47% 47% 10px 10px/38% 38% 10px 10px;
  background:radial-gradient(120% 90% at 30% 10%,color-mix(in srgb,var(--zb-accent-solid,var(--zb-accent)) 70%,#fff 10%),color-mix(in srgb,var(--zb-accent-solid,var(--zb-accent)) 40%,#100a22) 75%)}
.zsty-ph img{width:100%;height:100%;object-fit:cover}
.zsty-ph b{display:grid;place-items:center;width:100%;height:100%;font-size:76px;font-weight:200;color:rgba(255,255,255,.95)}
.zsty-live{position:absolute;z-index:3;bottom:-10px;left:50%;translate:-50% 0;display:inline-flex;align-items:center;gap:6px;white-space:nowrap;
  padding:5px 12px;border-radius:99px;font-size:11.5px;font-weight:700;color:#0d5a3c;background:#e3f7ee;box-shadow:0 10px 20px -10px rgba(0,0,0,.5)}
.zsty-live i{width:7px;height:7px;border-radius:50%;background:#2fbf85;animation:zstPulse 2s infinite}
.zsty-txt{flex:1;min-width:260px}
.zsty-kick{display:inline-flex;align-items:center;gap:10px;font-size:12.5px;color:#e6cd9c}
.zsty-kick::before{content:"";width:26px;height:1px;background:currentColor}
.zsty h1{margin:8px 0 4px;font-size:clamp(32px,5vw,56px);font-weight:250;letter-spacing:-.6px;color:#fff;line-height:1.15}
.zsty-head{margin:0;font-size:16px;color:rgba(247,241,234,.86)}
.zsty-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
.zsty-tags span{font-size:12px;padding:4px 12px;border-radius:99px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);color:#fff}
.zsty-kpis{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.zsty-kpis div{display:flex;flex-direction:column;min-width:96px;padding:10px 14px;border-radius:16px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.zsty-kpis b{font-size:24px;font-weight:800;line-height:1.2;color:#fff}
.zsty-kpis small{font-size:11.5px;color:rgba(247,241,234,.72)}
.zsty-ctas{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.zsty-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 20px;border-radius:14px;font-weight:700;font-size:14.5px;text-decoration:none;transition:transform .2s,gap .3s,background .3s}
.zsty-btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.zsty-btn.gold{background:#c9a46c;color:#141A3A}
.zsty-btn.gold:hover{gap:12px;background:#dcbf8a;transform:translateY(-2px);color:#141A3A}
.zsty-btn.ghost{color:#fff;border:1px solid rgba(255,255,255,.3);background:rgba(255,255,255,.06)}
.zsty-btn.ghost:hover{background:rgba(255,255,255,.14);color:#fff}
.zsty-btn.ic{padding:12px}.zsty-btn.ic svg{width:18px;height:18px}

/* کارتِ ویزیتِ دیجیتال */
.zsty-card{position:relative;display:flex;flex-direction:column;align-items:center;gap:12px;padding:20px;border-radius:26px;color:#141A3A;
  background:linear-gradient(170deg,#fffdf8,#f6efe3);box-shadow:0 40px 70px -40px rgba(0,0,0,.8),inset 0 0 0 1px rgba(201,164,108,.5)}
.zsty-card::before{content:"";position:absolute;inset:8px;border-radius:20px;border:1px dashed rgba(201,164,108,.55);pointer-events:none}
.zsty-card-h{text-align:center}
.zsty-card-h b{display:block;font-size:14px}
.zsty-card-h small{font-size:11.5px;color:#6a6278}
.zsty-qr{padding:10px;border-radius:16px;background:#fff;box-shadow:0 10px 24px -14px rgba(20,26,58,.5)}
.zsty-qr img,.zsty-qr canvas{display:block;width:148px!important;height:148px!important}
.zsty-card-n{text-align:center}
.zsty-card-n b{display:block;font-size:15px}
.zsty-card-n small{font-size:12px;color:#8a6a36}
.zsty-card-a{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}
.zsty-card-a button{border:0;border-radius:10px;padding:7px 12px;font:inherit;font-size:12px;font-weight:700;cursor:pointer;background:#141A3A;color:#fff;transition:background .2s}
.zsty-card-a button:hover{background:var(--zb-accent-solid,var(--zb-accent))}
.zsty-card-a button+button{background:rgba(20,26,58,.08);color:#141A3A}
.zsty-card-a button+button:hover{background:rgba(20,26,58,.16)}

/* پیشنهاد */
.zsty-offer{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:-26px 0 0;position:relative;z-index:2;padding:16px 18px;border-radius:20px;
  background:var(--surface);border:1px solid color-mix(in srgb,var(--zb-gold,#C9A46C) 45%,transparent);box-shadow:0 24px 40px -30px rgba(20,16,40,.5)}
.zsty-offer-ic{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:linear-gradient(135deg,#e9cf98,#b88a47);color:#141A3A;font-size:18px}
.zsty-offer div{flex:1;min-width:200px}
.zsty-offer b{font-size:15px;color:var(--text)}
.zsty-offer p{margin:2px 0 0;font-size:13px;color:var(--text-2)}
.zsty-offer a{padding:9px 16px;border-radius:12px;font-weight:700;font-size:13px;text-decoration:none;background:var(--zb-navy,#141A3A);color:#fff}

/* درباره + سوابق */
.zsty-about-g{display:grid;gap:26px;grid-template-columns:1fr}
@media(min-width:900px){.zsty-about-g{grid-template-columns:1.3fr 1fr;align-items:start}}
.zsty-h2{margin:8px 0 12px;font-size:clamp(22px,2.6vw,30px);font-weight:300;color:var(--text)}
.zsty-bio{margin:0;font-size:15px;line-height:2.1;color:var(--text-2)}
.zsty-bio.muted{color:var(--muted)}
.zsty-rec{padding:20px;border-radius:24px;background:var(--surface);border:1px solid var(--border);box-shadow:0 24px 46px -36px rgba(40,30,50,.45)}
.zsty-rec-h{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:14px}
.zsty-rec-h b{font-size:15px;color:var(--text)}
.zsty-rec-h .ok{font-size:11.5px;font-weight:700;padding:3px 10px;border-radius:99px;color:var(--zb-ok);background:color-mix(in srgb,var(--zb-ok) 12%,var(--surface))}
.zsty-tl{list-style:none;margin:0;padding:0;position:relative}
.zsty-tl::before{content:"";position:absolute;top:8px;bottom:8px;inset-inline-start:6px;width:1px;background:linear-gradient(var(--zb-gold,#C9A46C),transparent)}
.zsty-tl li{position:relative;display:flex;gap:14px;padding:8px 0}
.zsty-tl li>i{flex:none;width:13px;height:13px;margin-top:5px;border-radius:50%;background:var(--surface);border:2px solid var(--zb-gold,#C9A46C);position:relative;z-index:1}
.zsty-tl li.now>i{background:#2fbf85;border-color:#2fbf85;animation:zstPulse 2s infinite}
.zsty-tl b{display:block;font-size:14px;color:var(--text)}
.zsty-tl small{font-size:12px;color:var(--muted)}

/* دیوارِ نمونه‌کار */
.zsty-wall{display:grid;gap:10px;grid-template-columns:repeat(4,1fr);grid-auto-rows:170px;grid-auto-flow:dense}
.zsty-w{position:relative;overflow:hidden;border-radius:18px;display:block;background:var(--surface-2)}
.zsty-w.big{grid-column:span 2;grid-row:span 2}
.zsty-w.tall{grid-row:span 2}
.zsty-w img{width:100%;height:100%;object-fit:cover;transition:transform .9s cubic-bezier(.16,1,.3,1)}
.zsty-w:hover img{transform:scale(1.06)}
.zsty-w span{position:absolute;inset-inline:10px;bottom:10px;padding:5px 10px;border-radius:10px;font-size:12px;font-weight:700;color:#fff;
  background:rgba(20,26,58,.55);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);opacity:0;transform:translateY(6px);transition:all .35s}
.zsty-w:hover span,.zsty-w:focus-visible span{opacity:1;transform:none}
@media(max-width:700px){.zsty-wall{grid-template-columns:repeat(2,1fr);grid-auto-rows:140px}.zsty-w span{opacity:1;transform:none}}

/* نظرات */
.zsty-more{font-size:13px;font-weight:700;color:var(--zb-accent);text-decoration:none}
.zsty-revs{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.zsty-rv{display:flex;flex-direction:column;gap:12px;padding:20px;border-radius:22px;background:var(--surface);border:1px solid var(--border)}
.zsty-stars{display:flex;gap:2px;color:var(--zb-gold,#C9A46C)}
.zsty-stars .ic{width:15px;height:15px}
.zsty-rv p{margin:0;font-size:14.5px;line-height:2;color:var(--text)}
.zsty-rv-f{display:flex;align-items:center;gap:10px;margin-top:auto}
.zsty-rv-f .r-av{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--zb-accent-solid,var(--zb-accent));color:#fff;font-size:13px}
.zsty-rv-f b{display:block;font-size:13.5px;color:var(--text)}.zsty-rv-f small{font-size:11.5px;color:var(--muted)}
@media(max-width:640px){.zsty-hero{padding:84px 0 48px}.zsty-av{width:132px}.zsty-id{gap:18px}}
@media(prefers-reduced-motion:reduce){.zsty-arch path{animation:none;stroke-dashoffset:0}}

/* تخصص‌ها، امتیازِ کاربران، نظرِ برگزیده */
.zsty-skills{margin-top:20px}
.zsty-skills>b{display:block;font-size:13px;margin-bottom:8px;color:var(--text)}
.zsty-skills>div{display:flex;flex-wrap:wrap;gap:6px}
.zsty-skills .sk{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:12px;font-size:12.5px;background:var(--surface);border:1px solid var(--border);color:var(--text-2)}
.zsty-skills .sk.main{background:color-mix(in srgb,var(--zb-accent) 9%,var(--surface));border-color:color-mix(in srgb,var(--zb-accent) 30%,transparent);color:var(--zb-accent);font-weight:700}
.zsty-skills .sk i{font-style:normal;font-size:11px;padding:0 6px;border-radius:99px;background:color-mix(in srgb,var(--text) 8%,transparent)}
.zsty-score{display:grid;gap:22px;align-items:center;margin-bottom:20px;padding:22px;border-radius:24px;background:var(--surface);border:1px solid var(--border);grid-template-columns:1fr}
@media(min-width:900px){.zsty-score{grid-template-columns:180px 1fr 1fr}}
.zsty-score-big{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center}
.zsty-score-big>b{font-size:54px;font-weight:200;line-height:1;color:var(--text)}
.zsty-score-big small{font-size:12px;color:var(--muted)}
.zsty-dist,.zsty-crit{display:flex;flex-direction:column;gap:8px}
.zsty-dist div,.zsty-crit div{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:10px;font-size:12.5px;color:var(--text-2)}
.zsty-crit div{grid-template-columns:110px 1fr 32px}
.zsty-dist i,.zsty-crit i{height:8px;border-radius:99px;background:color-mix(in srgb,var(--text) 8%,transparent);overflow:hidden}
.zsty-dist em,.zsty-crit em{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,#e9cf98,#c9a46c)}
.zsty-crit em{background:linear-gradient(90deg,var(--zb-accent),color-mix(in srgb,var(--zb-accent) 60%,var(--zb-gold,#C9A46C)))}
.zsty-crit b{font-size:13px;color:var(--text)}
.zsty-rv{position:relative}
.zsty-rv.feat{border-color:color-mix(in srgb,var(--zb-gold,#C9A46C) 60%,transparent);box-shadow:0 0 0 3px color-mix(in srgb,var(--zb-gold,#C9A46C) 14%,transparent),0 24px 40px -30px rgba(20,16,40,.5)}
.zsty-feat{align-self:flex-start;font-size:11px;font-weight:800;padding:3px 10px;border-radius:99px;color:#5b4520;background:linear-gradient(135deg,#f6e2b8,#d9bd86)}
