/* ═══════════════════════════════════════════════════════════
   The Barber Club — «ذا بربر» v1.0
   نادي حلاقة رجالي فاخر: فحمي عميق × نحاس مصقول.
   توقيع بصري: خطوط عمود الحلاقة المائلة، قوائم أسعار بنقاط قائد،
   إطارات نحاسية رفيعة، ظلال دافئة.
   ═══════════════════════════════════════════════════════════ */

:root, [data-skin="services"]{
  --accent:#c47a3d; --accent-2:#e0995a; --on-accent:#161210;
  --ink:#0b0908; --surface-d:#141110; --surface-d2:#1d1815;
  --surface-l:#100d0c; --surface-l2:#191411;
  --on-light:#efe5da; --on-light-mut:#a8988a;
  --on-dark:#efe5da; --on-dark-mut:#a8988a;
  --tint:rgba(196,122,61,.12);
  --line-l:rgba(196,122,61,.22); --line-d:rgba(196,122,61,.25);
  --r-sm:4px; --r-md:8px; --r-lg:12px;
  --sh-md:0 16px 44px rgba(0,0,0,.5);
  --sh-lg:0 30px 80px rgba(0,0,0,.65);
  --stripe:repeating-linear-gradient(-45deg,var(--accent) 0 12px,transparent 12px 24px,#8c5427 24px 36px,transparent 36px 48px);
}
h1,h2,h3,h4{font-family:'Almarai','Tajawal',sans-serif}
body{background:var(--surface-l);
  background-image:radial-gradient(900px 500px at 50% -10%, rgba(196,122,61,.08), transparent 60%)}
::selection{background:var(--accent);color:#161210}

/* توقيع: خط البربر المائل */
.st-sec{position:relative}
.st-head{margin-bottom:56px}
.st-head h2{font-size:clamp(28px,4.4vw,48px);letter-spacing:-.5px}
.st-eyebrow{color:var(--accent-2);letter-spacing:.34em;font-size:11px}
.st-line{width:90px;height:6px;border-radius:0;background:var(--stripe);margin-top:18px}

/* أزرار: نحاس مطروق */
.st-btn{background:linear-gradient(180deg,var(--accent-2),var(--accent));color:#161210;
  border-radius:var(--r-sm);padding:15px 34px;font-weight:900;letter-spacing:.02em;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.35), 0 12px 30px rgba(196,122,61,.3)}
.st-btn:hover{filter:brightness(1.08);box-shadow:inset 0 1px 0 rgba(255,255,255,.4), 0 16px 40px rgba(196,122,61,.45)}
.st-btn-ghost,.st-btn-line{background:transparent;border:1px solid var(--line-d);color:var(--on-dark);border-radius:var(--r-sm)}
.st-btn-ghost:hover,.st-btn-line:hover{border-color:var(--accent);color:var(--accent-2)}

/* هيدر: صالة داكنة بشعار محفور */
.st-nav{background:rgba(16,13,12,.92);backdrop-filter:blur(14px);color:var(--on-dark);
  border-bottom:1px solid var(--line-d)}
.st-nav::after{content:'';display:block;height:3px;background:var(--stripe);opacity:.8}
.st-nav-bd{font-size:19px;letter-spacing:.06em}
.st-nav-lk a{font-size:13px;letter-spacing:.1em;color:var(--on-dark-mut)}
.st-nav-lk a:hover{color:var(--accent-2)}
@media (max-width:900px){.st-nav-lk{background:var(--surface-d)}.st-nav-lk a{border-color:var(--line-d)}}

/* هيرو منقسم: بورتريه بإطار نحاسي */
.st-hsp{background:transparent;padding:100px 0 80px;position:relative}
.st-hsp::before{content:'✂';position:absolute;top:60px;inset-inline-end:6%;font-size:200px;
  color:rgba(196,122,61,.05);transform:rotate(-20deg);pointer-events:none}
.st-hsp-tx h1{font-size:clamp(34px,5.4vw,64px);line-height:1.12;color:var(--on-light)}
.st-hsp-tx h1 em{font-style:normal;color:var(--accent-2)}
.st-hsp-tx p{color:var(--on-light-mut);font-size:17px}
.st-hsp-im{position:relative;padding:14px}
.st-hsp-im::before{content:'';position:absolute;inset:0;border:1px solid var(--accent);
  transform:translate(14px,14px);z-index:0}
.st-hsp-im .blob{display:none}
.st-hsp-im img{position:relative;z-index:1;border-radius:0;filter:contrast(1.05) saturate(.9)}
.st-hero-bdg{background:var(--tint);border:1px solid var(--line-d);color:var(--accent-2);
  border-radius:var(--r-sm);letter-spacing:.14em;font-size:11px}
.st-hero-bdg .dot{background:var(--accent-2)}

/* شريط الثقة: رفوف الصالة */
.st-trust{background:var(--surface-d);border-block:1px solid var(--line-d)}
.st-tr>i{background:transparent;border:1px solid var(--line-d);color:var(--accent-2);border-radius:var(--r-sm)}
.st-tr b{color:var(--on-dark)}
.st-tr span{color:var(--on-dark-mut)}

/* الخدمات (st-feat): بطاقات محفورة */
.st-feat{background:linear-gradient(180deg,var(--surface-l2),var(--surface-l));
  border:1px solid var(--line-l);border-radius:var(--r-md);text-align:start;padding:28px 24px;
  position:relative;overflow:hidden}
.st-feat::after{content:'';position:absolute;top:0;inset-inline-start:0;width:3px;height:0;
  background:var(--accent);transition:height .35s var(--ease)}
.st-feat:hover::after{height:100%}
.st-feat:hover{border-color:rgba(196,122,61,.5);transform:none;box-shadow:var(--sh-md)}
.st-feat .ic{margin:0 0 16px;border-radius:var(--r-sm);background:var(--tint);
  border:1px solid var(--line-l);color:var(--accent-2)}
.st-feat h3{color:var(--on-light)}
.st-feat p{color:var(--on-light-mut)}

/* الأسعار (st-plan): قائمة أسعار الصالون بنقاط قائد */
.st-plans{grid-template-columns:1fr;max-width:720px;margin:0 auto;gap:0;
  background:var(--surface-l2);border:1px solid var(--line-l);border-radius:var(--r-lg);
  padding:14px 10px;box-shadow:var(--sh-md)}
.st-plan{background:transparent;border:0;border-radius:0;box-shadow:none!important;
  transform:none!important;padding:20px 22px;text-align:start;
  display:grid;grid-template-columns:1fr auto;grid-template-areas:"t p" "d p" "b b";
  align-items:center;gap:4px 20px;border-bottom:1px dashed var(--line-l)}
.st-plan:last-child{border-bottom:0}
.st-plan.hot{border:0;background:var(--tint);border-radius:var(--r-md)}
.st-plan .hot-tag{position:static;transform:none;grid-area:b;justify-self:start;
  margin-top:8px;background:var(--accent);color:#161210;border-radius:var(--r-sm)}
.st-plan h3{grid-area:t;font-size:17px;position:relative;color:var(--on-light)}
.st-plan h3::after{content:'';position:absolute;bottom:6px;inset-inline-start:calc(100% + 12px);
  width:120px;border-bottom:2px dotted rgba(196,122,61,.35)}
.st-plan p{grid-area:d;margin:0;font-size:13px;color:var(--on-light-mut)}
.st-plan .prc{grid-area:p;font-size:26px;color:var(--accent-2);font-family:'Almarai'}
.st-plan .prc small{display:block;text-align:center}
.st-plan .st-btn{display:none}
@media (max-width:560px){.st-plan h3::after{display:none}}

/* الخطوات: جلسة الكرسي */
.st-step .no{background:transparent;border:1px solid var(--accent);color:var(--accent-2);
  border-radius:var(--r-sm);font-family:'Almarai'}
.st-step h3{color:var(--on-light)}
.st-step p{color:var(--on-light-mut)}

/* المعرض: قصّات بإطار */
.st-gal{gap:14px}
.st-gal img{border-radius:0;border:1px solid var(--line-l);filter:grayscale(.25) contrast(1.05);
  transition:all .35s var(--ease)}
.st-gal img:hover{filter:none;border-color:var(--accent);transform:scale(1.02);box-shadow:var(--sh-md)}

/* عدادات */
.st-cnt .ic{border-radius:var(--r-sm);background:var(--tint);border:1px solid var(--line-l);color:var(--accent-2)}
.st-cnt-num{color:var(--on-light);font-family:'Almarai'}
.st-cnt-num::after{content:'+';color:var(--accent-2);font-size:.55em;vertical-align:top}
.st-cnt-lbl{color:var(--on-light-mut)}

/* آراء الرواد */
.st-tst{background:var(--surface-l2);border:1px solid var(--line-l);border-radius:var(--r-md)}
.st-tst .strs{color:var(--accent-2)}
.st-tst p{color:var(--on-light)}
.st-tst .who{border-top-color:var(--line-l)}
.st-tst .who img{border-radius:var(--r-sm);border:1px solid var(--accent)}
.st-tsl-big .st-tst p{font-family:'Almarai';font-size:clamp(18px,2.6vw,24px)}

/* أسئلة */
.st-q{background:var(--surface-l2);border-color:var(--line-l);border-radius:var(--r-md)}
.st-q.open{border-color:var(--accent)}
.st-q-h{color:var(--on-light)}
.st-q-h i{color:var(--accent-2)}
.st-q-b p{color:var(--on-light-mut)}

/* CTA: كرسي الحجز */
.st-cta{background:var(--surface-d);position:relative;overflow:hidden}
.st-cta::before{content:'';position:absolute;top:0;left:0;right:0;height:6px;background:var(--stripe)}
.st-cta::after{content:'';position:absolute;bottom:0;left:0;right:0;height:6px;background:var(--stripe)}
.st-cta h2{color:var(--on-dark)}
.st-cta p{color:var(--on-dark-mut)}
.st-cta .st-btn-inv{background:var(--on-dark);color:#161210;border-radius:var(--r-sm)}

/* تواصل وفوتر */
.st-cinfo a,.st-cinfo>span{background:var(--surface-l2);border-color:var(--line-l);
  border-radius:var(--r-md);color:var(--on-light)}
.st-cinfo a:hover{border-color:var(--accent)}
.st-cinfo i{background:var(--tint);color:var(--accent-2);border-radius:var(--r-sm)}
.st-socials a{background:var(--surface-d2);border-radius:var(--r-sm)}
.st-socials a:hover{background:var(--accent);color:#161210}
.st-map iframe{border-radius:var(--r-md);border-color:var(--line-l);filter:grayscale(.6) invert(.92) contrast(.9)}
.st-foot{background:var(--ink);border-top:3px solid transparent;
  border-image:var(--stripe) 1}
.st-foot h4{color:var(--accent-2);letter-spacing:.14em;font-size:13px}
.st-foot ul a:hover{color:var(--accent-2)}
.st-foot-soc a{border-radius:var(--r-sm)}
.st-foot-soc a:hover{background:var(--accent);border-color:var(--accent);color:#161210}
.st-footer{background:#080605}

/* نشرة */
.st-news-band{background:var(--surface-d);border-block:1px solid var(--line-d)}
.st-nb-in input{border-radius:var(--r-sm);background:rgba(0,0,0,.3);border-color:var(--line-d);color:var(--on-dark)}
.st-nb-in input:focus{border-color:var(--accent)}

/* صفحات داخلية */
.st-page-head h1{color:var(--on-light)}
.st-back{background:var(--surface-l2);border-color:var(--line-l);color:var(--on-light);border-radius:var(--r-sm)}
.st-back:hover{border-color:var(--accent);color:var(--accent-2)}
.st-empty{color:var(--on-light-mut)}

/* ═══ v2: سكن البلوكات المعمارية ═══ */
.bi{background:linear-gradient(180deg,var(--surface-l2),var(--surface-l));border-color:var(--line-l);border-radius:var(--r-md)}
.bi.b-stat b{color:var(--accent-2);font-family:'Almarai'}
.bi.b-text i{border-radius:var(--r-sm);background:var(--tint);border:1px solid var(--line-l);color:var(--accent-2)}
.st-split-media .fc{background:rgba(25,20,17,.92);border-color:var(--line-l);color:var(--on-light)}
.st-split-media .fc1 b{color:var(--accent-2)}
.st-split-media .fc2 .strs{color:var(--accent-2)}
.st-checks i{color:var(--accent-2)}
.st-band{background-attachment:scroll}
.st-band-ov{background:rgba(11,9,8,.82)}
.st-band .bs b{color:var(--accent-2);font-family:'Almarai'}
.st-band .bs+.bs{border-color:rgba(196,122,61,.25)}
.st-twall-hd .score{background:var(--surface-l2);border-color:var(--line-l)}
.st-twall-hd .score>b{color:var(--accent-2)}
.st-twall .tw{background:var(--surface-l2);border-color:var(--line-l);border-radius:var(--r-md)}
.st-twall .tw:hover{border-color:var(--accent)}
.st-twall .strs,.st-twall-hd .strs{color:var(--accent-2)}
.st-twall p{color:var(--on-light)}
.st-ctap{background:var(--surface-d);border:0}
.st-ctap::before{content:'';position:absolute;top:0;left:0;right:0;height:6px;background:var(--stripe)}
.st-ctap .glow{background:radial-gradient(45% 60% at 50% 0%, rgba(196,122,61,.3), transparent 70%)}
.st-cmos .cm,.st-rail .rl{border-radius:var(--r-md)}

/* v2.1: هيرو مائل */
.st-hang{background:var(--surface-l)}
.st-hang-im{clip-path:polygon(0 0,100% 0,88% 100%,0 100%)!important;filter:contrast(1.05) saturate(.88)}
.st-hang-im::before{content:'';position:absolute;top:0;bottom:0;inset-inline-end:calc(88% - 6px);width:6px;background:var(--stripe)}
.st-hang-im .chip{background:rgba(25,20,17,.94);border-color:var(--line-l);border-radius:var(--r-sm)}
.st-hang-im .chip b{color:var(--accent-2);font-family:'Almarai'}
.st-hang h1{color:var(--on-light)}
@media (max-width:860px){.st-hang-im::before{display:none}}
