/* ══════════════════════════════════════════════════════════════
   رفيق — طبقة «البرهان» للصفحات الفرعية
   تُحمَّل بعد main.css و v2.css: تأخذ بنية main، وتفرض هوية v2
   (الطباعة العملاقة، العاجي/الداكن، الترقيم، السطح الزجاجي).
   ══════════════════════════════════════════════════════════════ */

body{
  font-family:Tajawal,system-ui,sans-serif;
  background:var(--paper);color:var(--ink);
  line-height:1.8;
}

/* ── الطباعة: عناوين الصفحات الفرعية بلغة v2 نفسها ── */
.h-xl,.h-lg,.h-md,.h-sm,.page-head h1,h1,h2{
  font-family:Thmanyah,Tajawal,sans-serif;letter-spacing:-.03em;
}
.page-head h1,.h-lg{
  font-weight:900;font-size:clamp(2.1rem,5.6vw,4.6rem);
  line-height:1.42;padding-block:.18em;   /* فسحة التشكيل والنازلات — لا قصّ */
}
/* main.css يعرّف h-xl بـline-height:1.13 بلا فسحة أمان فيقصّ التشكيل
   والحروف النازلة — نعيد تعريفه هنا بنفس منطق h-lg (كانت الوحيدة المنسية). */
.h-xl{font-weight:900;font-size:clamp(2.2rem,1.1rem + 4.6vw,4.6rem);
  line-height:1.42;padding-block:.18em}
.h-md{font-weight:900;font-size:clamp(1.6rem,3.4vw,2.9rem);line-height:1.45;padding-block:.12em}
.h-sm{font-weight:700;font-size:clamp(1.1rem,1.6vw,1.45rem);line-height:1.55}
h3,h4{line-height:1.5;padding-block:.06em}
h3,h4{font-family:Thmanyah,Tajawal,sans-serif;letter-spacing:-.02em}

/* ── رأس الصفحة: مشهد قصير بدل شريط باهت ── */
.page-head{
  background:var(--void);color:var(--paper);
  padding-block:calc(var(--z6) + 64px) calc(var(--z5) + 20px);
  position:relative;overflow:hidden;border:0;
  min-height:clamp(280px,34vh,420px);
  display:flex;align-items:flex-start;
}
/* شبكة تدرّجات متحرّكة خلف رأس الصفحة — تستبدل الخلفية الثابتة الباهتة
   بمشهد حيّ بطيء الحركة (لا يستهلك GPU كثيراً: تحريك background-position
   فقط، بلا JS). طبقة أولى خلف صورة المشهد (::before) بحكم ترتيب الدهن. */
.page-head{
  background:
    radial-gradient(circle at 15% 20%,rgba(45,154,95,.22),transparent 45%),
    radial-gradient(circle at 85% 15%,rgba(201,168,76,.16),transparent 40%),
    radial-gradient(circle at 50% 90%,rgba(45,154,95,.14),transparent 50%),
    var(--void);
  background-size:180% 180%,160% 160%,200% 200%,auto;
  animation:meshDrift 22s ease-in-out infinite alternate;
}
@keyframes meshDrift{
  0%{background-position:0% 0%,100% 0%,50% 100%,0 0}
  100%{background-position:20% 30%,70% 25%,40% 70%,0 0}
}
@media(prefers-reduced-motion:reduce){.page-head{animation:none}}
/* صورة مشهد خافتة خلف رأس الصفحة — تُحوّله من شريط إلى مشهد */
.page-head::before{
  content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
  background-image:var(--hero-img,var(--a1));background-size:cover;background-position:center var(--hero-pos,38%);
  opacity:var(--hero-opacity,.26);filter:var(--hero-filter,grayscale(.35) contrast(1.05));
  mask-image:linear-gradient(to top,transparent 4%,#000 68%);
  -webkit-mask-image:linear-gradient(to top,transparent 4%,#000 68%);
}
/* صفحات لها صورة مشهد خاصة (--hero-img مضبوطة inline) تُعرَض أوضح وبألوانها الحقيقية */
.page-head.has-hero{
  height:clamp(440px,56vh,620px);min-height:0;
  align-items:center;text-align:start;
  padding-block:var(--hdr-h,64px) 0;
}
.page-head.has-hero h1{
  max-width:20ch;text-wrap:balance;
}
/* الفرنسية أطول من العربية بنفس المعنى — نفس ارتفاع البانر يبقى ثابتاً،
   فنقلّص حجم الخط فقط كي لا يفيض النص خارج المساحة المحجوزة */
html[lang="fr"] .page-head.has-hero h1{
  font-size:clamp(1.7rem,3.6vw,3rem);max-width:16ch;
}
/* كان -webkit-line-clamp:2 يقصّ نصّ المقدّمة بثلاث نقاط في صفحات مثل
   /visas و/agencies حيث الجملة أطول من سطرين — والنصّ المقصوص كان يخفي
   معلومات مهمة (مثل تعليم الوكالات غير الموثّقة). أُزيل القصّ ليظهر
   النصّ كاملاً؛ ارتفاع الرأس مرن أصلاً فلا يكسر التخطيط. */
.page-head.has-hero .lede{
  max-width:56ch;text-wrap:balance;
}
.page-head.has-hero::before{
  opacity:.6;filter:contrast(1.05) saturate(1.05);
  mix-blend-mode:normal;z-index:0;
}
/* صورة صفحة التحقق تُثبّت بمسار نسبي حتى تبقى ظاهرة عند تقديم الصفحة
   من /verify أو من verify.html، ولا تعتمد على متغيرات CSS المولّدة. */
.page-head.verify-hero::before{
  background-image:url("../img/hero-verify.webp");
  /* تكبير بسيط وقصّ الحافة السوداء الواسعة في الصورة الأصلية،
     حتى لا تبدو الجهة اليسرى كمساحة فارغة على الشاشات العريضة. */
  background-size:340% auto;
  background-position:right 48%;
  background-repeat:no-repeat;
}
@media (max-width:700px){
  .page-head.verify-hero::before{
    background-size:auto 160%;
    background-position:72% center;
  }
}
.page-head > *{position:relative;z-index:2}
.page-head::after{                       /* توهّج أخضر خافت في الزاوية */
  content:'';position:absolute;inset-block-start:-40%;inset-inline-end:-10%;
  width:60vw;height:60vw;border-radius:50%;
  background:radial-gradient(circle,rgba(45,154,95,.16),transparent 62%);  /* primaryLight */
  pointer-events:none;
}
.page-head .lede{color:rgba(255,255,255,.68);margin-top:var(--z2)}
/* ⚠️ فتات المسار عربية — لا PlexMono (بلا حروف عربية) ولا تباعد حرفي يكسر الاتصال */
.page-head .crumbs{
  font-family:Tajawal,sans-serif;font-size:.8rem;letter-spacing:normal;
  text-transform:none;color:rgba(255,255,255,.5);margin-bottom:var(--z3);
}
.page-head .crumbs a{color:rgba(255,255,255,.62)}
.page-head .crumbs a:hover{color:var(--glow-soft)}
.page-head .crumbs b{color:var(--glow-soft);font-weight:500}

/* ── الأقسام: إيقاع v2، وتناوب عاجي/داكن ── */
.sec{padding-block:clamp(64px,9vw,var(--z6))}
.sec-sm{padding-block:clamp(48px,6vw,var(--z5))}
.sec + .sec{border-top:0}

/* ── السطح الزجاجي (الأثر الذي أعجبك في الرئيسية) ── */
.card,.notice{
  position:relative;
  background:
    linear-gradient(155deg,rgba(255,255,255,.78),rgba(255,255,255,.5) 40%,rgba(255,255,255,.62)),
    rgba(255,255,255,.55);
  backdrop-filter:blur(28px) saturate(1.5);
  -webkit-backdrop-filter:blur(28px) saturate(1.5);
  border:1px solid rgba(201,168,76,.25);
  border-radius:18px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.9),
    inset 0 0 0 1px rgba(201,168,76,.08),
    0 1px 2px rgba(15,23,42,.04),0 16px 44px -20px rgba(15,23,42,.26);
  transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color .4s var(--ease);
}
.card.hoverable:hover{
  transform:translateY(-4px);
  border-color:rgba(201,168,76,.35);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.9),
    inset 0 0 0 1px rgba(201,168,76,.1),
    0 1px 2px rgba(15,23,42,.05),0 26px 64px -22px rgba(15,23,42,.36);
}
/* خط ذهبي علوي رفيع يظهر تدريجياً — لمسة "بطاقة مميّزة" شائعة في تصاميم
   2025 الحديثة (uiverse/reactbits)، بلا أي مكتبة JS أو تكلفة أداء. */
.card::after{
  content:'';position:absolute;inset:0 0 auto 0;height:2px;border-radius:18px 18px 0 0;
  background:linear-gradient(90deg,transparent,var(--gold) 50%,transparent);
  opacity:0;transition:opacity .4s var(--ease);pointer-events:none;
}
.card.hoverable:hover::after{opacity:.85}
/* توهّج يتبع الفأرة (spotlight) — نمط uiverse.io الشائع في بطاقات 2025.
   main.js يكتب --mx/--my% عند mousemove فوق .hoverable؛ بلا JS يبقى
   المتغيّر على قيمته الافتراضية (50%) فلا يظهر شيء خاطئ. طبقة إضافية
   مستقلة عن ::after (الخط العلوي) كي لا تتعارضا. */
.card.hoverable{--mx:50%;--my:50%}
.card.hoverable::before{
  content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:radial-gradient(360px circle at var(--mx) var(--my),rgba(201,168,76,.14),transparent 68%);
  opacity:0;transition:opacity .35s var(--ease);z-index:0;
}
.card.hoverable:hover::before{opacity:1}
.card.hoverable>*{position:relative;z-index:1}
@media(hover:none){.card.hoverable::before{display:none}}
.notice{border-inline-start:2px solid var(--gold)}
.dark .card,.dark .notice,.page-head .card{
  background:
    linear-gradient(155deg,rgba(255,255,255,.1),rgba(255,255,255,.02) 45%,rgba(255,255,255,.06)),
    rgba(255,255,255,.04);
  backdrop-filter:blur(22px) saturate(1.3);
  -webkit-backdrop-filter:blur(22px) saturate(1.3);
  border-color:rgba(255,255,255,.12);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 16px 44px -20px rgba(0,0,0,.5);
  color:var(--paper);
}

/* ── شارة الأيقونة داخل .card ──
   main.css يعرّف .card .ic كمربّع نعناعي مسطّح (var(--mint)) بلا أي عمق —
   هذا بالضبط ما جعل بطاقات الصفحات الفرعية (مثل for-agencies) تبدو كقالب
   SaaS عام رغم أن .card نفسها زجاجية متقنة. نكتب فوقها هنا بلغة الهوية:
   تدرّج أخضر↔ذهبي وتوهّج خافت، بدل لون تعبئة واحد مسطّح. */
.card .ic{
  width:46px;height:46px;border-radius:13px;
  background:linear-gradient(155deg,var(--green-light),var(--green) 70%);
  color:var(--paper);
  box-shadow:0 8px 20px -8px rgba(35,122,75,.55),inset 0 1px 0 rgba(255,255,255,.25);
  display:grid;place-items:center;margin-bottom:var(--s5);
  transition:transform .35s var(--ease),box-shadow .35s var(--ease);
}
.card.hoverable:hover .ic{
  transform:translateY(-2px) scale(1.04);
  box-shadow:0 12px 28px -10px rgba(201,168,76,.5),inset 0 1px 0 rgba(255,255,255,.3);
  background:linear-gradient(155deg,var(--gold-light),var(--gold) 70%);
}
.dark .card .ic,.page-head .card .ic{
  background:linear-gradient(155deg,var(--gold-light),var(--gold) 75%);
  color:var(--void);
  box-shadow:0 8px 20px -8px rgba(201,168,76,.45),inset 0 1px 0 rgba(255,255,255,.35);
}

/* ── الحقول ── */
.input{
  background:rgba(255,255,255,.7);
  border:1px solid rgba(15,23,42,.12);border-radius:12px;
  font-family:Tajawal,sans-serif;transition:border-color .3s,box-shadow .3s;
}
.input:focus{
  border-color:var(--green);
  box-shadow:0 0 0 3px rgba(35,122,75,.13);outline:none;
}

/* ── الشارات والرقائق ── */
.badge,.chip{border-radius:999px;font-family:Tajawal,sans-serif;letter-spacing:normal}
.badge.verified{background:var(--mint);color:var(--green-deep);border:0}
.badge.solid{background:var(--void);color:var(--paper)}
.chip{background:rgba(15,23,42,.05);border:0}

/* ── الأزرار: شكل v2 وحيد على كل الموقع ── */
.btn{border-radius:999px;font-weight:700}
.btn.ghost{background:transparent;color:var(--ink);border:1px solid rgba(15,23,42,.2)}
.btn.ghost:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.btn.gold{background:var(--gold);border-color:var(--gold);color:var(--void)}
.btn.sm{padding:9px 18px;font-size:.85rem}
.btn.lg{padding:16px 32px}
.btn.block{display:flex;width:100%;justify-content:center}

/* ── الترقيم المونوسبيس الظاهر (توقيع «البرهان») ── */
.step .n,.notes .n,.num-badge{
  font-family:PlexMono,monospace;font-weight:500;letter-spacing:.06em;
  color:var(--green);
}

/* ── التذييل: داكن دائماً ── */
.ftr{background:var(--void);color:rgba(255,255,255,.72);border:0}
.ftr h5{font-family:Thmanyah,Tajawal;color:var(--paper);letter-spacing:-.02em}
.ftr a{color:rgba(255,255,255,.66);transition:color .3s}
.ftr a:hover{color:var(--glow-soft)}
.ftr .brand img{filter:brightness(0) invert(1)}
.ftr-legal{border-top:1px solid rgba(255,255,255,.08)}

/* ── الشريط العلوي في الصفحات الفرعية: داكن ثابت (لا mix-blend) ── */
/* ‼️ الشريط العلوي والقائمة يُعرَّفان بالكامل في v2.css (مصدر وحيد للصفحات كلها).
   هنا نُلغي فقط ما يفرضه main.css ويخالفه (اللون) — الارتفاع وposition والحدود
   والخلفية تبقى من v2.css حصراً؛ كانت هذه الطبقة تكتب فوقها بقيم مختلفة
   (64px مقابل 68px، وحدّ سفلي يقطع شكل الكبسولة المدوّرة) فيقفز الهيدر
   بصرياً بين الرئيسية والصفحات الداخلية. */
.hdr,.hdr.solid{mix-blend-mode:normal;color:var(--paper)}
.hdr .btn{background:var(--green);border-color:var(--green);color:#fff}
.hdr .btn:hover{background:var(--glow);border-color:var(--glow);color:var(--void)}
.hdr .brand img{filter:brightness(0) invert(1)}
/* main.css يُخفي القائمة عند 1000px والرئيسية عند 1180px — نوحّد على 1180px */
@media(min-width:1001px) and (max-width:1180px){
  .hdr .mainnav{display:none}
  .burger{display:grid}
}
/* زرّ القائمة الجوّالة: شكل واحد في كل الصفحات (main.css يجعله فاتحاً ومستديراً) */
.hdr .burger{width:40px;height:40px;border:1px solid rgba(255,255,255,.35);
  background:none;color:var(--paper);border-radius:999px}

/* ── الظهور التدريجي (نفس منحنى الرئيسية) ── */
.rv{opacity:0;transform:translateY(24px);
    transition:opacity .8s var(--ease-out),transform .8s var(--ease-out)}
.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  .rv{opacity:1;transform:none;transition:none}
}

/* ══════════════════════════════════════════════════════════════
   لوحة الفلاتر — مطابقة لبصمة التطبيق (FilterBottomSheet)
   أقسام قابلة للطيّ · رقاقات دائرية · مفاتيح خدمات · منزلق سعر
   ══════════════════════════════════════════════════════════════ */
.fsheet{padding:0;overflow:hidden}
.fsheet-head{display:flex;align-items:center;justify-content:space-between;
  gap:12px;padding:18px 18px 14px;border-bottom:1px solid rgba(15,23,42,.08)}
.fsheet-head h3{display:flex;align-items:center;gap:8px;margin:0}
.fcount{display:inline-grid;place-items:center;min-width:22px;height:22px;
  padding:0 7px;border-radius:999px;background:var(--green);color:#fff;
  font-family:Tajawal,sans-serif;font-size:.72rem;font-weight:700}
.freset{background:none;border:0;cursor:pointer;font-family:Tajawal,sans-serif;
  font-size:.82rem;color:#EF4444;padding:4px}
.freset:hover{text-decoration:underline}

/* حقل البحث يرث padding:13px 16px من .input (main.css)، مضبوط لحقول نموذج
   عادية — داخل لوحة الفلاتر المضغوطة (رقاقات ~7px، عناوين صغيرة) يبدو مربّعاً
   ضخماً غير متّسق مع بقية العناصر. نُصغّره هنا خاصةً بلا المساس بـ.input
   في بقية الموقع (نماذج الاتصال وغيرها ما زالت تحتاج الحجم الأكبر). */
.fsheet .field{margin-bottom:12px!important}
.fsheet .field .input{padding:5px 9px!important;font-size:.74rem!important;
  border-radius:8px!important;height:auto!important;
  width:88%!important;max-width:100%!important;
  display:block!important;margin-inline:auto!important}
.fsheet .field .hint{font-size:.72rem!important;margin-top:2px}

.fsec{border-bottom:1px solid rgba(15,23,42,.08)}
.fsec > summary{list-style:none;cursor:pointer;padding:14px 18px;
  font-family:Tajawal,sans-serif;font-size:.94rem;font-weight:700;
  color:var(--ink);display:flex;align-items:center;justify-content:space-between}
.fsec > summary::-webkit-details-marker{display:none}
.fsec > summary::after{content:'';width:8px;height:8px;flex:none;
  border-inline-start:2px solid var(--ink-2);border-block-end:2px solid var(--ink-2);
  transform:rotate(-45deg);transition:transform .25s var(--ease)}
.fsec[open] > summary::after{transform:rotate(135deg)}
.fbody{padding:2px 18px 18px;display:flex;flex-direction:column;gap:10px}
.flabel{font-family:Tajawal,sans-serif;font-size:.8rem;font-weight:600;
  color:var(--ink-2);margin-top:6px}

/* الرقاقات — نفس شكل التطبيق: كبسولة، الفعّالة خضراء ممتلئة */
.chipset{display:flex;flex-wrap:wrap;gap:8px}
.chipset.col{flex-direction:column;align-items:stretch}
.fchip{cursor:pointer;font-family:Tajawal,sans-serif;font-size:.8rem;font-weight:600;
  padding:7px 14px;border-radius:999px;background:#fff;color:var(--ink-2);
  border:1px solid rgba(15,23,42,.14);transition:all .15s var(--ease)}
.chipset.col .fchip{border-radius:14px;text-align:start;padding:13px 16px;font-size:.88rem}
.fchip:hover{border-color:var(--green)}
.fchip.on{background:var(--green);border-color:var(--green);color:#fff}
.fchip.star.on{background:#FFC107;border-color:#FFC107;color:#fff}

/* مفاتيح الخدمات — نفس ترتيب التطبيق: عنوان + وصف صغير تحته */
.ftoggle{display:flex;align-items:center;gap:12px;cursor:pointer;
  padding:9px 0;border-block-end:1px solid rgba(15,23,42,.05)}
.ftoggle:last-child{border-block-end:0}
.ftoggle input{appearance:none;flex:none;width:42px;height:24px;border-radius:999px;
  background:rgba(15,23,42,.16);position:relative;cursor:pointer;
  transition:background .25s var(--ease)}
.ftoggle input::after{content:'';position:absolute;inset-block-start:3px;
  inset-inline-start:3px;width:18px;height:18px;border-radius:50%;background:#fff;
  transition:transform .25s var(--ease);box-shadow:0 1px 3px rgba(0,0,0,.2)}
.ftoggle input:checked{background:var(--green)}
.ftoggle input:checked::after{transform:translateX(-18px)}
.ftoggle span{display:flex;flex-direction:column;gap:1px;min-width:0}
.ftoggle b{font-family:Tajawal,sans-serif;font-size:.88rem;font-weight:700;color:var(--ink)}
.ftoggle i{font-style:normal;font-size:.74rem;color:var(--ink-2);line-height:1.5}

/* منزلق السعر */
.prow{display:flex;align-items:center;justify-content:space-between;gap:10px}
.prow.tiny{font-size:.72rem;color:var(--ink-2)}
.ptag{font-family:Tajawal,sans-serif;font-size:.84rem;font-weight:700;
  color:var(--green);background:var(--mint);padding:4px 12px;border-radius:8px}
.frange{width:100%;appearance:none;height:4px;border-radius:999px;
  background:rgba(15,23,42,.14);outline:none;padding:0;border:0;margin:10px 0}
.frange::-webkit-slider-thumb{appearance:none;width:20px;height:20px;border-radius:50%;
  background:var(--green);cursor:pointer;border:3px solid #fff;
  box-shadow:0 1px 5px rgba(0,0,0,.25)}
.frange::-moz-range-thumb{width:20px;height:20px;border-radius:50%;
  background:var(--green);cursor:pointer;border:3px solid #fff}

/* ══ بطاقة العرض — تخطيط التطبيق الأفقي (نص يمين · صورة يسار) ══ */
.offer.applike{display:grid;grid-template-columns:1fr 96px;gap:12px;
  background:#fff;border:0;border-radius:18px;padding:12px;align-items:start;
  box-shadow:0 4px 16px rgba(0,0,0,.07);overflow:hidden}
.offer.applike:hover{transform:translateY(-3px);
  box-shadow:0 10px 28px rgba(0,0,0,.11)}
.offer.applike .ac-media{grid-column:2;grid-row:1/-1;border-radius:12px;overflow:hidden;
  aspect-ratio:96/120;align-self:start;background:var(--mint);position:relative}
.offer.applike .ac-media img{width:100%;height:100%;object-fit:cover}
.offer.applike .ac-body{grid-column:1;display:flex;flex-direction:column;gap:6px;min-width:0}
.offer.applike .ac-ag{display:flex;align-items:center;gap:6px;font-size:.78rem;
  color:var(--ink-2);font-weight:600;min-width:0}
.offer.applike .ac-ag .avatar{width:24px;height:24px;font-size:.72rem;flex:none}
.offer.applike .ac-ag span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.offer.applike h3{font-family:Tajawal,sans-serif;font-size:1rem;font-weight:900;
  line-height:1.45;color:var(--ink);margin:0}
.offer.applike .ac-hotel{font-size:.79rem;color:var(--ink-2);line-height:1.6}
.offer.applike .ac-price{display:flex;align-items:baseline;gap:5px;margin-top:2px}
.offer.applike .ac-price b{font-family:Tajawal,sans-serif;font-size:1.35rem;
  font-weight:900;color:var(--green-deep);letter-spacing:-.01em}
.offer.applike .ac-price small{font-size:.72rem;color:var(--ink-2);font-weight:600}
.offer.applike .ac-chips{display:flex;flex-wrap:wrap;gap:5px}
.offer.applike .ac-chips span{font-size:.71rem;padding:3px 9px;border-radius:999px;
  background:rgba(15,23,42,.05);color:var(--ink-2)}
.offer.applike .ac-inst{font-size:.72rem;color:#9A7A2A;background:#FFF8E1;
  border:1px solid rgba(201,168,76,.35);padding:3px 10px;border-radius:999px;
  align-self:flex-start}
/* المميّز — نفس ذهبي التطبيق */
.offer.applike.featured{background:linear-gradient(135deg,#FFFDF5,#FFF7E0);
  border:2px solid var(--gold);box-shadow:0 6px 22px rgba(201,168,76,.28)}
.offer.applike .ac-badge{position:absolute;inset-block-start:8px;inset-inline-end:8px;
  background:linear-gradient(90deg,#E0A800,var(--gold));color:#fff;
  font-size:.72rem;font-weight:700;padding:3px 9px;border-radius:999px}

/* زر المفضّلة فوق صورة البطاقة — نفس زاوية القلب في ListingCard بالتطبيق */
.offer.applike .ac-fav{position:absolute;inset-block-start:6px;inset-inline-start:6px;
  width:26px;height:26px;border-radius:50%;background:rgba(255,255,255,.92);
  border:0;display:flex;align-items:center;justify-content:center;color:var(--ink-2);
  cursor:pointer;box-shadow:0 2px 6px rgba(0,0,0,.15);transition:color var(--t-fast) var(--ease)}
.offer.applike .ac-fav:hover{color:#e11d48}
.offer.applike .ac-fav.on{color:#e11d48}
.offer.applike .ac-fav.on svg{fill:currentColor}

/* زر "قارن" — أسفل زر المفضّلة على نفس الزاوية، نفس أسلوب البطاقة.
   حجم/تباين أوضح كي لا يُهمَل (شكوى مستخدم): إطار أخضر خفيف + أيقونة + نص. */
.offer.applike .ac-cmp{position:absolute;inset-block-start:40px;inset-inline-start:6px;
  display:flex;align-items:center;gap:3px;
  border-radius:999px;background:rgba(255,255,255,.96);border:1.5px solid var(--green,#0D3B2E);
  font-size:.72rem;font-weight:800;padding:4px 10px;color:var(--green,#0D3B2E);
  cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.18);transition:color var(--t-fast) var(--ease),background var(--t-fast) var(--ease)}
.offer.applike .ac-cmp::before{content:'';width:11px;height:11px;flex:none;
  background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6'%3E%3Cpath d='M7 3 3 7l4 4'/%3E%3Cpath d='M3 7h13'/%3E%3Cpath d='M17 21l4-4-4-4'/%3E%3Cpath d='M21 17H8'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6'%3E%3Cpath d='M7 3 3 7l4 4'/%3E%3Cpath d='M3 7h13'/%3E%3Cpath d='M17 21l4-4-4-4'/%3E%3Cpath d='M21 17H8'/%3E%3C/svg%3E") center/contain no-repeat}
.offer.applike .ac-cmp.on{color:#fff;background:var(--brand,#0D3B2E);border-color:var(--brand,#0D3B2E)}
@media(max-width:520px){
  .offer.applike{grid-template-columns:1fr 96px;gap:11px}
}

/* ولاية بلا عروض اليوم — تبقى ظاهرة (فهرس كامل) لكن أهدأ بصرياً */
.card.empty-w{opacity:.58}
.card.empty-w:hover{opacity:1}
.card.empty-w .badge{background:rgba(15,23,42,.06);color:var(--ink-2)}

/* ══════════════════════════════════════════════════════════════
   الوثائق القانونية — نص طويل مقروء (عمود ضيّق، تباعد مريح)
   ══════════════════════════════════════════════════════════════ */
.doc{max-width:74ch;margin-inline:auto;font-size:1.02rem;line-height:1.95;color:var(--ink)}
.doc h2{font-family:Thmanyah,Tajawal,sans-serif;font-weight:900;
  font-size:clamp(1.35rem,2.4vw,1.9rem);line-height:1.5;padding-block:.1em;
  margin-block:var(--s12) var(--s4);letter-spacing:-.02em}
.doc h2:first-child{margin-block-start:0}
.doc h3{font-family:Thmanyah,Tajawal,sans-serif;font-weight:700;
  font-size:clamp(1.1rem,1.7vw,1.35rem);line-height:1.55;
  margin-block:var(--s8) var(--s3)}
.doc h4{font-weight:700;font-size:1.02rem;margin-block:var(--s6) var(--s2)}
.doc p{margin-block:var(--s4)}
.doc ul,.doc ol{margin-block:var(--s4);padding-inline-start:var(--s6)}
.doc ul li{list-style:none;position:relative;padding-inline-start:18px;margin-block:10px}
.doc ul li::before{content:'';position:absolute;inset-inline-start:0;inset-block-start:14px;
  width:6px;height:6px;border-radius:50%;background:var(--green)}
.doc ol{list-style:decimal;padding-inline-start:var(--s8)}
.doc ol li{margin-block:10px;padding-inline-start:6px}
.doc ol li::marker{color:var(--green);font-weight:700}
.doc strong{font-weight:700;color:var(--ink)}
.doc a{color:var(--green);font-weight:500;text-decoration:underline;
  text-underline-offset:3px;text-decoration-thickness:1px}
.doc a:hover{color:var(--green-deep)}
.doc hr{border:0;border-block-start:1px solid rgba(15,23,42,.1);margin-block:var(--s10)}
.doc blockquote{border-inline-start:2px solid var(--gold);
  padding:var(--s3) var(--s5);margin-block:var(--s5);
  background:rgba(201,168,76,.06);color:var(--ink-2);font-size:.96rem}
.doc code{font-family:PlexMono,monospace;font-size:.86em;
  background:rgba(15,23,42,.06);padding:2px 6px;border-radius:5px}
/* الجداول تُمرَّر أفقياً على الهاتف بدل أن تكسر التخطيط */
.doc .tbl-wrap{overflow-x:auto;margin-block:var(--s5);
  border:1px solid rgba(15,23,42,.1);border-radius:12px}
.doc .tbl{width:100%;border-collapse:collapse;font-size:.94rem;min-width:460px}
.doc .tbl th{background:var(--mint);color:var(--green-deep);font-weight:700;
  text-align:start;padding:12px 14px;white-space:nowrap}
.doc .tbl td{padding:12px 14px;border-block-start:1px solid rgba(15,23,42,.08);
  vertical-align:top;line-height:1.7}
.doc .tbl tr:hover td{background:rgba(15,23,42,.02)}
/* تنقّل بين الوثائق */
.doc-nav{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;
  max-width:74ch;margin:var(--s10) auto 0;padding-block-start:var(--s6);
  border-block-start:1px solid rgba(15,23,42,.1)}

/* ── نصوص مساعدة ── */
.muted{color:var(--ink-2)}
.tiny{font-size:.8rem;color:var(--ink-2)}
.g{color:var(--green);font-weight:500}
.dark .muted,.page-head .muted{color:rgba(255,255,255,.6)}

/* ── نافذة "تسجيل الدخول مطلوب" (l.html: احجز الآن / تواصل مع الوكالة) ── */
.auth-gate{position:fixed;inset:0;z-index:200;display:flex;align-items:flex-end;justify-content:center}
@media(min-width:640px){.auth-gate{align-items:center}}
.auth-gate-bg{position:absolute;inset:0;background:rgba(15,23,42,.55);backdrop-filter:blur(2px)}
.auth-gate-card{position:relative;width:100%;max-width:400px;background:#fff;border-radius:var(--r-lg,20px) var(--r-lg,20px) 0 0;
  padding:24px 20px calc(20px + env(safe-area-inset-bottom,0px));box-shadow:0 -8px 30px rgba(15,23,42,.2)}
@media(min-width:640px){.auth-gate-card{border-radius:var(--r-lg,20px);margin:0 16px;padding:28px 24px}}
.auth-gate-card h3{margin:0 0 8px;font-size:1.05rem;font-weight:800;color:var(--ink)}
.auth-gate-card p{margin:0 0 18px;font-size:.9rem;line-height:1.6}
.auth-gate-actions{display:flex;flex-direction:column;gap:10px}