/* ── css/fonts.css ── */
/* مولّد من أدوات/تجهيز_الخطوط.py — El Messiri وTajawal، رخصة SIL Open Font License 1.1 */
@font-face {
  font-family: 'El Messiri';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../assets/fonts/el-messiri-600-arabic.woff2') format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC7, U+10EC9-10EEE, U+10EF0-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}
@font-face {
  font-family: 'El Messiri';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('../assets/fonts/el-messiri-600-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../assets/fonts/tajawal-400-arabic.woff2') format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC7, U+10EC9-10EEE, U+10EF0-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../assets/fonts/tajawal-400-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../assets/fonts/tajawal-500-arabic.woff2') format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC7, U+10EC9-10EEE, U+10EF0-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url('../assets/fonts/tajawal-500-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../assets/fonts/tajawal-700-arabic.woff2') format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC7, U+10EC9-10EEE, U+10EF0-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../assets/fonts/tajawal-700-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('../assets/fonts/tajawal-800-arabic.woff2') format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-0891, U+0897-08E1, U+08E3-08FF, U+200C-200E, U+2010-2011, U+204F, U+2E41, U+FB50-FDFF, U+FE70-FE74, U+FE76-FEFC, U+102E0-102FB, U+10E60-10E7E, U+10EC2-10EC7, U+10EC9-10EEE, U+10EF0-10EFF, U+1EE00-1EE03, U+1EE05-1EE1F, U+1EE21-1EE22, U+1EE24, U+1EE27, U+1EE29-1EE32, U+1EE34-1EE37, U+1EE39, U+1EE3B, U+1EE42, U+1EE47, U+1EE49, U+1EE4B, U+1EE4D-1EE4F, U+1EE51-1EE52, U+1EE54, U+1EE57, U+1EE59, U+1EE5B, U+1EE5D, U+1EE5F, U+1EE61-1EE62, U+1EE64, U+1EE67-1EE6A, U+1EE6C-1EE72, U+1EE74-1EE77, U+1EE79-1EE7C, U+1EE7E, U+1EE80-1EE89, U+1EE8B-1EE9B, U+1EEA1-1EEA3, U+1EEA5-1EEA9, U+1EEAB-1EEBB, U+1EEF0-1EEF1;
}
@font-face {
  font-family: 'Tajawal';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('../assets/fonts/tajawal-800-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ── css/tokens.css ── */
/* Design tokens — مصدرها UI_spec §1 (هوية v2 من offers_style.py).
   ألوان الفئات بـcats.css (مولّد من البيانات) — لا تكتب لون فئة هنا. */
:root {
  /* الألوان الثابتة — هوية «ورد مطفي» بالزجاج (اختيار حيدر 2026-10-15، تصميم/هوية_مميزة_2026-10-15/لون_ب_ورد_مطفي.html):
     خلفية وردية باهتة ونص خوخي غامق — مو أبيض بارد ولا بيج/ذهبي. التباينات يفحصها test_site.py (Contrast). */
  --bg: #F6EFEE;
  --bg-deep: #EEDFDE;
  --card: #FFFFFF;
  --card-2: #FBF6F5;
  --line: #EADCDB;          /* زخرفي فقط */
  --line-strong: #97808A;   /* حدود عناصر تفاعلية — تباين ≥3:1 على الخلفية */
  --txt: #3E2B32;
  --soft: #5A4048;
  --muted: #755F69;         /* تباين ≥4.5:1 على كل الأرضيات */
  --on-accent: #3E2B32;
  --white: #FFFFFF;
  --glass: rgba(251, 246, 245, .96);
  --glass-soft: rgba(251, 246, 245, .72);
  --c-brand: #E7C6CB;       /* الورد المطفي — لون الهوية الوحيد */
  --brand-ink: #7A4A5A;     /* نسخة غامقة من الورد للنصوص — تباين ≥5:1 */
  --wa: #5B3A49;            /* زر الحجز خوخي غامق بدل الفحمي — نص أبيض، تباين 9.8:1 */
  --wa-hover: #6E4859;
  --on-wa: #FFFFFF;
  --ok-bg: rgba(37, 211, 102, .14);  --ok-ink: #11683A;
  --no-bg: rgba(200, 60, 50, .1);    --no-ink: #A12A20;

  /* الزجاج (glass.css): سطوح نص شفافة فوق خلفية وردية متدرّجة، وحافة ضوء بدل الحد الرمادي.
     --glass-solid للأسعار والفورمات — شبه مصمت حتى يتقرا. */
  --glass-bg: rgba(255, 255, 255, .5);
  --glass-solid: rgba(255, 255, 255, .86);
  --glass-edge: rgba(255, 255, 255, .85);
  --glass-blur: blur(18px) saturate(170%);
  --glass-sh: 0 10px 30px rgba(62, 43, 50, .10), inset 0 1px 0 rgba(255, 255, 255, .95), inset 0 -1px 0 rgba(62, 43, 50, .05);
  --blob-1: #EBD3D3; --blob-2: #F3E4E2; --blob-3: #E3C7CB; --blob-4: #EEDDDC;

  /* ألوان الفئات فاتحة (خلفيات) — للنص والحدود نستعمل النسخة الغامقة ink/line */
  --accent: var(--c-brand);
  --accent-ink: var(--brand-ink);
  --accent-line: #C9A983;
  --accent-12: rgba(232, 201, 160, .18);
  --accent-24: rgba(232, 201, 160, .32);

  /* الخطوط */
  --f-display: 'El Messiri', 'Tajawal', serif;   /* وزن 600 بس — المتصفح ياخذه حتى لو الطلب 400 */
  --f-body: 'Tajawal', 'Segoe UI', Tahoma, sans-serif;

  --fs-h2: clamp(2rem, 1.6rem + 2vw, 3.25rem);
  --fs-h3: clamp(1.625rem, 1.45rem + .9vw, 2.125rem);
  --fs-price-xl: clamp(2.25rem, 2rem + 2.4vw, 3.5rem);
  --fs-price-md: clamp(1.625rem, 1.5rem + 1vw, 2.125rem);
  --fs-price-sm: clamp(1.25rem, 1.2rem + .4vw, 1.5rem);
  --fs-lead: clamp(1.125rem, 1.05rem + .4vw, 1.375rem);
  /* سلّم الخطوط (مراجعة الشكل 2026-10-14): 7 درجات بس — 13 · 15 · 17 · 20 · 26 · 34 · 48. ماكو حجم مكتوب باليد بالمكوّنات
     (test_site.py يمنعه)؛ العناوين والأسعار الكبيرة بـclamp فوق. */
  --fs-1: .8125rem; --fs-2: .9375rem; --fs-3: 1.0625rem; --fs-4: 1.25rem; --fs-5: 1.625rem; --fs-6: 2.125rem; --fs-7: 3rem;
  --fs-body: 1.0625rem;
  --fs-small: .9375rem;
  --fs-micro: .8125rem;

  --lh-tight: 1.15;
  --lh-snug: 1.35;
  --lh-body: 1.65;

  /* المسافات — شبكة 4px */
  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 20px;
  --sp-6: 24px; --sp-7: 32px; --sp-8: 40px; --sp-9: 56px; --sp-10: 72px;
  --gutter: clamp(16px, 4vw, 40px);
  --section-gap: clamp(56px, 8vw, 112px);
  --container: 1120px;

  /* الزوايا */
  --r-xs: 8px; --r-sm: 12px; --r-md: 16px; --r-lg: 20px; --r-xl: 28px; --r-pill: 999px;

  --bd: 1.5px solid var(--line);
  --bd-rec: 2px solid var(--accent-line);

  /* الظلال */
  --sh-1: 0 1px 2px rgba(62,43,50,.05), 0 2px 10px rgba(62,43,50,.06);
  --sh-glow: 0 0 0 1px var(--accent-line), 0 12px 36px -10px rgba(0,0,0,.18);
  --sh-float: 0 8px 28px rgba(0,0,0,.14), 0 2px 6px rgba(0,0,0,.08);

  /* الحركة */
  --ease-out: cubic-bezier(.22,.61,.36,1);
  --ease-spring: cubic-bezier(.34,1.4,.64,1);   /* تجاوز خفيف ويرجع — للظهور والرفع */
  --dur-1: 120ms; --dur-2: 220ms; --dur-3: 420ms;

  --z-header: 50; --z-float: 60; --z-toast: 70;
  --tap: 48px;
  --header-h: 160px; /* الهوية + التنقّل الرئيسي + شريط الفئات — للتمرير للمراسي */
}
@media (max-width: 767px) { :root { --header-h: 72px; } }   /* الموبايل: سطر اللوكو بس (layout.css) */

/* --accent-12/24 من الـaccent الفعّال (متصفحات حديثة). القديمة تبقى على قيم الرملي فوق.
   accent-ink = نسخة غامقة من لون الفئة للنص على الأبيض (تباين ≥4.5:1). */
@supports (color: color-mix(in srgb, red 10%, transparent)) {
  :root, [data-cat] {
    --accent-12: color-mix(in srgb, var(--accent) 18%, transparent);
    --accent-24: color-mix(in srgb, var(--accent) 32%, transparent);
    --accent-ink: color-mix(in srgb, var(--accent) 42%, #161616);
    --accent-line: color-mix(in srgb, var(--accent) 75%, #161616);
  }
}

/* ── css/cats.css ── */
/* مولّد تلقائياً من بناء/builder/page.py — لا تعدّله يدوياً */
:root {
  --c-wed: #E8C9A0;
  --c-katb: #EAAAAE;
  --c-grad: #B7C58F;
  --c-fam: #E4B290;
  --c-kids: #E4AAC4;
  --c-small: #83CEC8;
  --c-big: #95C3EB;
  --c-vip: #D7B672;
  --c-walk: #EAAD9D;
  --c-men: #ADC0D4;
  --c-garden: #9CCCA4;
  --c-outwed: #C9B2E5;
}
[data-cat="wed"] { --accent: var(--c-wed); }
[data-cat="katb"] { --accent: var(--c-katb); }
[data-cat="grad"] { --accent: var(--c-grad); }
[data-cat="fam"] { --accent: var(--c-fam); }
[data-cat="kids"] { --accent: var(--c-kids); }
[data-cat="small"] { --accent: var(--c-small); }
[data-cat="big"] { --accent: var(--c-big); }
[data-cat="vip"] { --accent: var(--c-vip); }
[data-cat="walk"] { --accent: var(--c-walk); }
[data-cat="men"] { --accent: var(--c-men); }
[data-cat="garden"] { --accent: var(--c-garden); }
[data-cat="outwed"] { --accent: var(--c-outwed); }
[data-cat="extra"] { --accent: var(--c-wed); }
[data-cat="addons"] { --accent: var(--c-vip); }

/* ── css/base.css ── */
/* أساسيات: إعادة ضبط، طباعة، أزرار، روابط، إتاحة، حركة. */
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; } /* أي display بالمكوّنات ما يغلب «مخفي» */
html {
  background: var(--bg); color-scheme: light; -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth; scroll-padding-top: var(--header-h);
}
body {
  margin: 0; min-height: 100vh; background: var(--bg); color: var(--txt);
  font: 400 var(--fs-body)/var(--lh-body) var(--f-body);
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; overflow-x: clip;
}
img, svg, picture { display: block; max-width: 100%; }
h1, h2, h3, .price, .amount {
  font-family: var(--f-display); font-weight: 600; line-height: var(--lh-tight); margin: 0; font-synthesis: none;
}
h1, h2, h3 { text-wrap: balance; }   /* العنوان ما يخلّي كلمة يتيمة بسطر وحدها */
p, ul, ol, dl, dd, figure { margin: 0; }
ul, ol { padding: 0; list-style: none; }
a { color: inherit; }
button { font: inherit; color: inherit; }
a, button, summary, label { touch-action: manipulation; }   /* بلا تأخير الضغطتين بالموبايل */
dialog { overscroll-behavior: contain; }   /* سحب النافذة ما يحرّك الصفحة وراها */
bdi, .ltr { unicode-bidi: isolate; }
b, strong { font-weight: 700; }
small { font-size: inherit; }

.container { width: min(100% - 2 * var(--gutter), var(--container)); margin-inline: auto; }
.muted { color: var(--muted); font: 500 var(--fs-small)/1.6 var(--f-body); }
.accent { color: var(--accent-ink); }
.sr-only {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* الأيقونات */
.i {
  width: 1.25em; height: 1.25em; flex: none; fill: none; stroke: currentColor;
  stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round;
}

/* الأزرار */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: var(--tap); padding: 0 22px; border-radius: var(--r-pill); border: 1.5px solid transparent;
  font: 700 var(--fs-3)/1.2 var(--f-body); text-decoration: none; cursor: pointer; text-align: center;
  transition: background var(--dur-1), border-color var(--dur-1), color var(--dur-1), transform var(--dur-1) var(--ease-out);
}
.btn .i { width: 20px; height: 20px; }
.btn:active { transform: scale(.97); }
.btn--accent { background: var(--accent); color: var(--on-accent); }
.btn--accent:hover { filter: brightness(1.08); }
.btn--wa { background: var(--wa); color: var(--on-wa); }
.btn--wa:hover { background: var(--wa-hover); }
.btn--ghost { background: transparent; color: var(--txt); border-color: var(--line-strong); }
.btn--ghost:hover { border-color: var(--accent-line); color: var(--accent-ink); }
.btn--block { width: 100%; }
.btn--lg { min-height: 56px; font-size: var(--fs-3); padding: 0 28px; }
.btn--sm { min-height: 44px; padding: 0 16px; font-size: var(--fs-2); }
.btn--icon { width: var(--tap); padding: 0; flex: none; }
.link {
  color: var(--accent-ink); text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 1.5px;
  display: inline-flex; align-items: center; gap: 6px;
}
.link:hover { color: var(--txt); }

/* التركيز */
:focus { outline: none; }
:focus-visible { outline: 2.5px solid var(--txt); outline-offset: 3px; border-radius: 6px; }
.btn--accent:focus-visible, .btn--wa:focus-visible { outline-color: var(--txt); box-shadow: 0 0 0 5px var(--bg); }
.skip-link {
  position: fixed; inset-inline-start: 12px; top: 12px; z-index: 100; transform: translateY(-160%);
}
.skip-link:focus { transform: none; }

/* الختم «كادر نسائي 100%» */
.seal { --d: 88px; display: inline-flex; flex-direction: column; align-items: center; gap: 4px; color: var(--accent-ink); flex: none; }
.seal__ring {
  position: relative; width: var(--d); height: var(--d); border-radius: 50%; border: 2px solid currentColor;
  display: grid; place-content: center; text-align: center; gap: 2px;
}
.seal__ring::before {
  content: ""; position: absolute; inset: 4px; border-radius: 50%; border: 1px dashed currentColor; opacity: .55;
}
.seal__pct { font: 600 calc(var(--d) * .3)/1 var(--f-display); }
.seal__lbl { font: 800 calc(var(--d) * .14)/1.1 var(--f-body); white-space: nowrap; }
.seal__cap { font: 700 var(--fs-1)/1.1 var(--f-body); white-space: nowrap; }
.seal--sm .seal__cap { display: none; }
.seal--sm { --d: 66px; }
.seal--sm .seal__lbl { font-size: calc(var(--d) * .12); }   /* «كادر نسائي» كانت تطفح برّا الدائرة (62px بدائرة 56) */

/* الحركة كلها بـmotion.css — وتنطفي هنا مع «تقليل الحركة». */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important; animation-iteration-count: 1 !important;
    transition-duration: .01ms !important; scroll-behavior: auto !important;
  }
  html.js .reveal { opacity: 1 !important; transform: none !important; }
}

@media (forced-colors: active) {
  .pkg__price, .badge--rec, .btn { border: 2px solid CanvasText; }
}
.sprite { position: absolute; width: 0; height: 0; overflow: hidden; }

/* ── css/layout.css ── */
/* هيكل الصفحة: الهيدر · الهيرو · الفهرس · الثقة · الخطوات · الأقسام · الفوتر · الزر العائم · التنبيه. */

/* ---------- الهيدر اللاصق ---------- */
.site-header {
  position: sticky; top: 0; z-index: var(--z-header);
  background: var(--glass); border-bottom: 1px solid transparent;
  transition: border-color var(--dur-2), background var(--dur-2), transform var(--dur-2) var(--ease-out);
}
.site-header.is-tucked { transform: translateY(-100%); }
@media (prefers-reduced-motion: reduce) { .site-header { transition: none; } }
@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .site-header { background: var(--glass-soft); -webkit-backdrop-filter: blur(14px) saturate(140%); backdrop-filter: blur(14px) saturate(140%); }
}
.site-header.is-scrolled { border-bottom-color: var(--line); }
.site-header__bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 56px; }
.brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: var(--soft); font: 700 var(--fs-2)/1.2 var(--f-body); min-height: var(--tap); }
.brand__logo { width: 36px; height: auto; }

.chips-bar { overflow: hidden; }
html.js .site-header:not(.show-chips) .chips-bar { display: none; }
.chips-row {
  display: flex; gap: 8px; overflow-x: auto; padding: 4px var(--gutter) 8px;
  scroll-snap-type: x proximity; scrollbar-width: none; overscroll-behavior-x: contain;
}
.chips-row::-webkit-scrollbar { display: none; }
.chips-bar .chips-row {
  -webkit-mask-image: linear-gradient(to left, transparent 0, #000 20px, #000 calc(100% - 20px), transparent 100%);
  mask-image: linear-gradient(to left, transparent 0, #000 20px, #000 calc(100% - 20px), transparent 100%);
}
.chip {
  flex: 0 0 auto; scroll-snap-align: center; min-height: 40px; padding: 0 16px; border-radius: var(--r-pill);
  border: 1.5px solid var(--line-strong); color: var(--soft); background: transparent; text-decoration: none;
  font: 700 var(--fs-2)/1 var(--f-body); display: inline-flex; align-items: center; gap: 8px; white-space: nowrap;
  transition: color var(--dur-1), border-color var(--dur-1), background var(--dur-1);
}
.chip::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--accent); }
.chip--home::before { display: none; }
.chip[aria-current="true"] { border-color: var(--accent-line); color: var(--accent-ink); background: var(--accent-12); }
.chip:hover { border-color: var(--accent-line); }

/* الموبايل: الهيدر سطر واحد (اللوكو) — شريط الفئات انشال: «→ كل المناسبات» بكل قسم والشريط اللي تحت يكفون
   (مراجعة الشكل 2026-10-14: الهيدر كان 125px + البانر 145px قبل ما تبين الصورة). */
@media (max-width: 767px) { .chips-bar { display: none; } }
@media (min-width: 768px) {
  .site-header__bar { min-height: 64px; }
  .brand { font-size: var(--fs-3); }
  .brand__logo { width: 44px; }
}

/* ---------- العروض (views) ---------- */
.view { padding-block: var(--sp-8) var(--section-gap); }
.view--home { padding: 0; }
.not-found { padding-top: var(--sp-6); color: var(--accent-ink); font-weight: 700; }
.noscript { padding: var(--sp-4) var(--gutter); color: var(--soft); }
html:not(.js) .view.cat, html:not(.js) .view.extra { border-top: var(--bd); }

/* ---------- الهيرو ----------
   مراجعة 2026-10-14: الصورة نظيفة فوق (بلا ضباب أبيض) والكلام تحتها على العاجي، وسؤال واحد بثلاث أزرار كبيرة.
   هوية 2026-10-15: الصورة تنقص من تحت بقوس الطرحة (#veil بالـsprite)، والعنوان والأزرار بلوح زجاج نازل عليها.
   بالحاسبة: اللوح يمين والصورة يسار. */
.hero { background: transparent; }
.hero__media { position: relative; overflow: hidden; height: 44svh; width: 100%; clip-path: url(#veil); background: var(--bg-deep); }
.hero__media picture, .hero__img { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero__img { object-fit: cover; object-position: 50% 30%; }
.hero__inner {
  position: relative; margin-top: -14svh; margin-bottom: var(--sp-7); display: flex; flex-direction: column; align-items: flex-start; gap: var(--sp-3);
  padding: var(--sp-5) var(--sp-4) var(--sp-4); border-radius: var(--r-xl);
}
.hero h1 { font-size: clamp(2.125rem, 1.6rem + 3.4vw, 4.25rem); max-width: 16ch; }
.hero__whisper { position: relative; padding-inline-start: 24px; color: var(--soft); font: 600 var(--fs-3)/1.35 var(--f-display); }
.hero__whisper::before {   /* قوس الطرحة الصغير — نفس قوس اللوكو */
  content: ""; position: absolute; inset-inline-start: 0; top: .5em; width: 16px; height: 8px;
  border: 1.6px solid var(--brand-ink); border-top: 0; border-radius: 0 0 16px 16px;
}
.hero__seal { display: flex; align-items: center; gap: 12px; color: var(--accent-ink); font: 700 var(--fs-small)/1.5 var(--f-body); }
.hero__seal .seal { --d: 52px; }
.hero__seal .seal__lbl { display: none; }   /* كان 6.2px ما ينقرا، والسطر جنبه يگول نفس الشي بخط واضح */
.hero__seal .seal__pct { font-size: calc(var(--d) * .34); }
/* «وين تريد التصوير؟» — ٣ بطاقات أماكن: صورة + اسم + شرح بسيط + كم مناسبة وتبدي من (طلب حيدر 2026-10-27، places.py) */
.places { display: grid; gap: var(--sp-2); width: 100%; margin-top: var(--sp-2); scroll-margin-top: 72px; }
.places__q { font: 600 var(--fs-5)/1.25 var(--f-display); }
.places__intro { margin: 0; color: var(--soft); font: 500 var(--fs-small)/1.6 var(--f-body); }
.places__list { display: grid; gap: 10px; margin-top: var(--sp-2); }
.place {
  display: grid; grid-template-columns: 72px minmax(0, 1fr) 16px; align-items: center; gap: 12px; min-height: 92px;
  padding: 10px 12px 10px 10px; border-radius: var(--r-lg); color: var(--txt); text-decoration: none;
  transition: border-color var(--dur-1), transform var(--dur-1) var(--ease-out);
}
.place:hover { border-color: var(--txt); }
.place:active { transform: scale(.985); }
.place__media {
  display: grid; place-items: center; width: 72px; height: 72px; border-radius: var(--r-md);
  background: linear-gradient(160deg, var(--card), var(--bg-deep)); border: 1px solid var(--line);
}
/* رسمة المكان (places.py ILLUSTRATIONS): أشكال معبّاية بدرجات الهوية، خط هادي، ولمسة بلون الهوية الغامق */
.place__ill { width: 60px; height: 60px; }
.place__ill .ill-line { fill: none; stroke: var(--brand-ink); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.place__ill .ill-thin { stroke-width: 1.5; }
.place__ill .ill-fill { fill: color-mix(in srgb, var(--brand-ink) 28%, var(--card)); stroke: none; }
.place__ill .ill-soft { fill: color-mix(in srgb, var(--brand-ink) 14%, var(--card)); stroke: none; }
.place__ill .ill-light { fill: var(--card); stroke: none; }
.place__ill .ill-accent { fill: var(--brand-ink); stroke: none; }
.place__body { display: grid; gap: 3px; min-width: 0; }
.place__name { font: 600 var(--fs-4)/1.2 var(--f-display); }
.place__text { color: var(--soft); font: 500 var(--fs-2)/1.5 var(--f-body); }
.place__meta { color: var(--accent-ink); font: 700 var(--fs-1)/1.4 var(--f-body); }
.place__meta .price { display: inline-flex; align-items: baseline; gap: 3px; }
.place > .i { width: 18px; height: 18px; color: var(--muted); }
.hero__proof { display: inline-flex; flex-wrap: wrap; gap: 4px 10px; align-items: baseline; color: var(--txt); text-decoration: none; font: 500 var(--fs-small)/1.4 var(--f-body); padding: 6px 0; }
.hero__proof b { font-weight: 800; }
.hero__proof span { text-decoration: underline; text-underline-offset: 3px; }
.eyebrow { color: var(--accent-ink); font: 500 var(--fs-small)/1.4 var(--f-body); display: inline-flex; align-items: center; gap: 10px; }
.eyebrow--line::before { content: ""; width: 48px; height: 3px; border-radius: 2px; background: var(--accent); }
.address { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; color: var(--soft); font: 500 var(--fs-small)/1.5 var(--f-body); }
.address .i { color: var(--accent-ink); }
.phones { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.phones li { display: flex; align-items: center; gap: 10px; }
.phones .i { color: var(--accent-ink); }
.phones__num { font: 700 var(--fs-3)/1.4 var(--f-body); letter-spacing: .02em; user-select: all; min-height: 44px; display: inline-flex; align-items: center; }
/* الموبايل: السؤال والأزرار الثلاثة بأول شاشة حتى ويّا بانر العرض — الختم والمتابعين ينزلون تحتهم */
@media (max-width: 767px) {
  .hero .eyebrow { display: none; }
  .hero__seal, .hero__proof { order: 1; }
}
/* ويّا بانر العرض: الصورة أقصر حتى الأزرار الثلاثة تبقى بأول شاشة (قاعدة 2026-10-14) */
@media (max-width: 767px) { body:has(.promo:not([hidden])) .hero__media { height: 34svh; } body:has(.promo:not([hidden])) .hero__inner { margin-top: -10svh; } }
@media (max-width: 767px) and (max-height: 760px) { .hero__media { height: 38svh; } .hero__inner { margin-top: -11svh; } .hero h1 { font-size: var(--fs-6); } }   /* تلفونات قصيرة */
@media (max-width: 767px) and (max-height: 760px) { body:has(.promo:not([hidden])) .hero__media { height: 22svh; } body:has(.promo:not([hidden])) .hero__inner { margin-top: -5svh; } }
@media (min-width: 768px) {
  .hero { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; }
  .hero { grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); }
  .hero__media { grid-column: 1 / -1; grid-row: 1; height: 100%; min-height: 620px; }
  .hero__inner { grid-column: 1; grid-row: 1; width: auto; margin: var(--sp-8) var(--gutter); padding: var(--sp-8) var(--sp-7); }
}

/* ---------- الفهرس «شنو مناسبتك؟» ---------- */
.why h2, .steps h2 { font-size: var(--fs-h2); margin-bottom: var(--sp-6); }

/* ---------- صفحة المكان (#g-studio …): رجوع + أزرار الأماكن + مناسباته بس ---------- */
.place-view { padding-block: var(--sp-5) var(--sp-8); }
.place-view__head { display: grid; gap: var(--sp-3); margin-bottom: var(--sp-6); }
.place-view__head h2 { font-size: var(--fs-h2); }
.place-view__text { margin: 0; color: var(--soft); font: 500 var(--fs-3)/1.6 var(--f-body); }
/* سطر واحد دايماً (المجلس الثاني 2026-10-27: كانت تنكسر لسطرين) — بالشاشة الضيقة الأيقونات تنشال حتى تكفي */
.place-tabs { display: flex; flex-wrap: nowrap; gap: 6px; overflow-x: auto; scrollbar-width: none; }
.place-tabs::-webkit-scrollbar { display: none; }
.place-tabs__btn { min-height: 44px; flex: 0 0 auto; white-space: nowrap; }
@media (max-width: 430px) { .place-tabs { gap: 4px; } .place-tabs__btn { padding-inline: 9px; } .place-tabs__btn .i { display: none; } }
.place-tabs__btn .i { width: 18px; height: 18px; }
.place-tabs__btn[aria-current="true"] { border-color: var(--txt); background: var(--txt); color: var(--card); }
.place-view__more { margin-top: var(--sp-7); }
.section-label { font: 700 var(--fs-3)/1.4 var(--f-body); color: var(--soft); margin: 0 0 var(--sp-3); }
.cat-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
@media (min-width: 768px) { .cat-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { .cat-grid { grid-template-columns: repeat(4, 1fr); } }
.extra-links { display: grid; gap: 10px; }
@media (min-width: 768px) { .extra-links { grid-template-columns: repeat(3, 1fr); } }
.extra-link {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 56px; padding: 0 18px;
  background: var(--card); border: var(--bd); border-radius: var(--r-md); text-decoration: none; font-weight: 700;
}
.extra-link:hover { border-color: var(--accent-line); }
.extra-link .i { color: var(--accent-ink); }

/* ---------- الثقة + الخطوات ---------- */
.why, .steps { padding-block: var(--sp-8); }
.trust { display: grid; gap: 1px; background: var(--line); border: var(--bd); border-radius: var(--r-lg); overflow: hidden; }
.trust__item { background: var(--card); padding: 18px 16px; display: grid; grid-template-columns: 66px 1fr; gap: 14px; align-items: center; }
.trust__item b { display: block; font: 700 var(--fs-3)/1.35 var(--f-body); }
.trust__item span span { font: 500 var(--fs-2)/1.5 var(--f-body); color: var(--muted); }
.trust__ico { width: 28px; height: 28px; color: var(--soft); justify-self: center; }
@media (min-width: 768px) { .trust { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .trust { grid-template-columns: repeat(4, 1fr); } }
.steps__list { display: grid; gap: 12px; counter-reset: step; }
.steps__list li {
  counter-increment: step; display: grid; grid-template-columns: 36px 1fr; gap: 2px 14px; align-items: center; padding: 16px;
  background: var(--card); border: var(--bd); border-radius: var(--r-md);
}
.steps__list b { font: 700 var(--fs-body)/1.35 var(--f-body); }
.steps__list span { grid-column: 2; font: 500 var(--fs-small)/1.55 var(--f-body); color: var(--muted); }
.steps__list li::before { grid-row: span 2; }
.cat-steps { margin-bottom: var(--sp-7); }
.steps__list--mini { gap: 8px; }
.steps__list--mini li { padding: 12px 14px; background: var(--card-2); }
.steps__list li::before {
  content: counter(step); flex: none; width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center;
  background: var(--accent); color: var(--on-accent); font: 600 var(--fs-4)/1 var(--f-display);
}
@media (min-width: 768px) { .steps__list { grid-template-columns: repeat(3, 1fr); } }

/* ---------- الفوتر ---------- */
.site-footer { background: var(--bg-deep); border-top: var(--bd); padding: var(--sp-9) 0 calc(var(--sp-9) + 88px); }
.site-footer__inner { display: grid; gap: var(--sp-5); }
.site-footer__brand { display: flex; align-items: center; gap: 14px; font: 600 var(--fs-5)/1.2 var(--f-display); }
.footer__logo { width: 56px; height: auto; }
.site-footer__cta { display: grid; gap: 10px; max-width: 560px; }
@media (min-width: 768px) { .site-footer__cta { grid-template-columns: 1fr 1fr; } }
.validity { color: var(--muted); font: 500 var(--fs-micro)/1.5 var(--f-body); }

/* ---------- شريط التنقّل الثابت تحت (مراجعة التصفح 2026-10-14) ----------
   أربع خانات بكلمات بدل الزر العائم الأسود — الأسود صار بس لـ«احجز هذي الباقة». بالحاسبة: كبسولة عائمة بالزاوية. */
.tab-bar {
  position: fixed; inset-inline: 0; bottom: 0; z-index: var(--z-float);
  display: grid; grid-auto-flow: column; grid-auto-columns: minmax(0, 1fr); gap: 2px;
  padding: 5px; margin: 0 10px calc(10px + env(safe-area-inset-bottom)); border-radius: var(--r-pill);
}   /* كبسولة زجاج عايمة (هوية 2026-10-15) — السطح والـblur بـglass.css */
.tab {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-height: 56px; padding: 4px 2px;
  border: 0; border-radius: var(--r-pill); background: none; color: var(--soft); text-decoration: none; cursor: pointer; list-style: none;
  font: 700 var(--fs-1)/1.15 var(--f-body); -webkit-tap-highlight-color: transparent;
}
.tab .i { width: 22px; height: 22px; }
.tab::-webkit-details-marker { display: none; }
.tab[aria-current="true"], .tab-more[aria-current="true"] > .tab, .tab-more[open] > .tab { color: var(--on-wa); background: var(--wa); }
.tab-more { position: relative; display: grid; }
.tab-more__menu {
  position: absolute; bottom: calc(100% + 10px); inset-inline-end: 0; min-width: 230px; display: grid; gap: 2px; padding: 6px;
  background: var(--card); border: var(--bd); border-radius: var(--r-lg); box-shadow: var(--sh-float);
}
.tab-more__link {
  display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 0 14px; border: 0; border-radius: var(--r-sm);
  background: none; color: var(--txt); text-decoration: none; cursor: pointer; text-align: start; font: 700 var(--fs-small)/1.2 var(--f-body);
}
.tab-more__link .i { color: var(--muted); }
.tab-more__link:hover, .tab-more__link[aria-current="true"] { background: var(--bg); }
@media (min-width: 1024px) {
  .tab-bar { inset-inline: auto 24px; bottom: 24px; width: 440px; margin: 0; padding: 4px 8px; }
  .tab { min-height: 52px; border-radius: var(--r-pill); }
}

/* ---------- التنبيه ---------- */
.toast {
  position: fixed; inset-inline: 16px; bottom: calc(88px + env(safe-area-inset-bottom)); z-index: var(--z-toast);
  margin-inline: auto; max-width: 420px; padding: 14px 18px; border-radius: var(--r-md);
  background: var(--txt); color: var(--bg); font-weight: 700; text-align: center; box-shadow: var(--sh-float);
}

/* الموبايل: زر الهيدر أيقونة بس — النص يبقى مقروء لقارئ الشاشة (مو display:none). */
@media (max-width: 559px) {
  .site-header__bar .btn { width: var(--tap); padding: 0; }
  .site-header__bar .btn span {
    position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
  }
}
/* «مساعدنا الذكي» فوق بالحاسبة بس — بالموبايل صار خانة «اسألنا» ثابتة بالشريط اللي تحت (أبرز وما تختفي). */
.header-wa[hidden] { display: none; }
@media (max-width: 767px) { .site-header__bar .chat-top { display: none; } }

/* ---------- «شوف شغلنا وآراء الزباين» — الآراء والشغل و«ليش احنا» منطوية (اختيار حيدر 2026-10-27) ---------- */
.more-about { border-block: var(--bd); background: var(--card); }
.more-about__toggle {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 72px; padding-block: 12px;
  cursor: pointer; list-style: none;
}
.more-about__toggle::-webkit-details-marker { display: none; }
.more-about__toggle > span { display: grid; gap: 2px; }
.more-about__toggle b { font: 600 var(--fs-4)/1.3 var(--f-display); color: var(--txt); }
.more-about__toggle small { font: 500 var(--fs-small)/1.5 var(--f-body); color: var(--muted); }
.more-about__toggle .i { flex: none; transition: transform var(--dur-2); }
.more-about[open] > .more-about__toggle .i { transform: rotate(180deg); }
.more-about[open] > .more-about__toggle { border-bottom: var(--bd); }

/* ---------- مبدّل اللغة مقابل الشعار (طلب حيدر 2026-10-29) — كل رمز بلغته وخطّه ---------- */
.site-header__end { display: flex; align-items: center; gap: 8px; }
.lang-switch { display: flex; align-items: center; border: var(--bd); border-radius: 999px; padding: 2px; background: var(--card); }
.lang-switch__a {
  display: inline-flex; align-items: center; justify-content: center; min-width: 40px; min-height: 36px; padding: 0 10px;
  border-radius: 999px; text-decoration: none; color: var(--soft); font: 600 var(--fs-1)/1 var(--f-body);
}
.lang-switch__a.is-current { background: var(--brand-ink); color: var(--card); }
.lang-switch__a:focus-visible { outline: 2px solid var(--brand-ink); outline-offset: 2px; }
@media (max-width: 359px) { .lang-switch__a { min-width: 34px; padding: 0 7px; } }
/* الأسهم مرسومة للعربي: بالانكليزي (LTR) «لقدّام» و«لورا» ينقلبون */
[dir="ltr"] .i--dir { transform: scaleX(-1); }
[dir="ltr"] .work-dialog__nav [data-go="-1"] .i { transform: none; }

/* ── css/components.css ── */
/* المكوّنات: بطاقة الفئة · رأس الفئة · بطاقة الباقة · المقارنة · الإضافات · الألبومات. (UI_spec §2) */

/* ---------- بطاقة الفئة بالفهرس ---------- */
/* هوية 2026-10-15: الصورة تملي البطاقة وتنقص من تحت بقوس الطرحة، والاسم والسعر بلوح زجاج نازل على طرفها —
   بلا صندوق ولا حد. اللوح بعد الصورة بالترتيب (اختبار «الصورة أول»). */
.cat-card {
  position: relative; display: flex; flex-direction: column; height: 100%;
  color: var(--txt); text-decoration: none; transition: transform var(--dur-1) var(--ease-out);
}
.cat-card__media { position: relative; display: block; overflow: hidden; aspect-ratio: 4 / 5; border-radius: var(--r-xl) var(--r-xl) 0 0; clip-path: url(#veil-card); background: var(--bg-deep); }
.cat-card__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
/* صور طولية الوجوه بثلثها الفوكاني — القص الأفقي ياخذ الوجه مو النص (صور حيدر 2026-10-14) */
.cat-card[data-cat="kids"] .cat-card__img, .cat-card[data-cat="fam"] .cat-card__img { object-position: 50% 22%; }
.cat-card[data-cat="small"] .cat-card__img { object-position: 50% 12%; }
.cat-card__body {
  position: relative; display: flex; flex-direction: column; gap: 4px; flex: 1; margin: -72px 6px 0; padding: 10px 12px 12px;
  border-radius: var(--r-lg);
}
.cat-card:hover, .cat-card:focus-visible { transform: translateY(-2px); }
.cat-card__name { font: 600 var(--fs-4)/1.15 var(--f-display); }
.cat-card__sub { color: var(--soft); font: 600 var(--fs-micro)/1.4 var(--f-body); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cat-card__from { display: flex; align-items: baseline; flex-wrap: wrap; gap: 6px; margin-top: auto; padding-top: 4px; }
.cat-card__from small { color: var(--muted); font: 700 var(--fs-micro)/1 var(--f-body); }
.cat-card__from .price { color: var(--accent-ink); display: inline-flex; align-items: baseline; gap: 4px; }
.cat-card__from .amount { font-size: var(--fs-4); }
.cat-card__from .cur { font: 700 var(--fs-1)/1 var(--f-body); }
.cat-card__women {
  position: absolute; top: 10px; inset-inline-start: 10px; font: 700 var(--fs-1)/1 var(--f-body); color: var(--txt);
  padding: 6px 9px; border-radius: var(--r-pill);
}
.cat-grid__wide { grid-column: span 2; }
.cat-card--wide .cat-card__media { aspect-ratio: 16 / 9; }
/* بطاقة يتيمة آخر المجموعة (عدد فردي بعمودين) تاخذ العرض كله بدل فراغ جنبها */
@media (max-width: 767px) {
  .cat-grid > li:last-child:nth-child(odd) { grid-column: span 2; }
  .cat-grid > li:last-child:nth-child(odd) .cat-card__media { aspect-ratio: 16 / 9; }
}
@media (min-width: 768px) { .cat-card__name { font-size: var(--fs-5); } }

/* ---------- رأس الفئة ---------- */
.cat-head { display: grid; grid-template-columns: 1fr auto; gap: var(--sp-4) var(--sp-4); align-items: start; margin-bottom: var(--sp-7); }
.cat-head__text { display: grid; gap: 6px; }
.cat-head h2 { font-size: var(--fs-h2); }
.cat-head__sub { font: 600 clamp(1.125rem, 1rem + .8vw, 1.5rem)/1.35 var(--f-display); color: var(--soft); }
.cat-head .eyebrow::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--accent); }
.cat-head > .seal { --d: 76px; }
.cat-head > .seal .seal__cap { display: none; }
.cat-head__meta, .cat-note, .share, .back-link { grid-column: 1 / -1; }
/* «→ كل المناسبات › بالاستوديو» — أول سطر بكل قسم (اختبار الزبون 2026-10-14) */
.back-link {
  justify-self: start; display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 14px 0 16px;
  margin-bottom: var(--sp-1); border-radius: var(--r-pill); background: var(--card); border: 1.5px solid var(--line-strong);
  color: var(--txt); font: 700 var(--fs-small)/1.2 var(--f-body); text-decoration: none;
}
.back-link::before { content: "→"; font-size: var(--fs-4); line-height: 1; }
.back-link:hover { border-color: var(--accent-line); }
.back-link__here { color: var(--muted); font-weight: 500; }
.cat-head__meta { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 6px; color: var(--soft); font: 700 var(--fs-small)/1.5 var(--f-body); }
.cat-head__meta .price { color: var(--accent-ink); display: inline-flex; align-items: baseline; gap: 4px; }
.cat-head__meta .amount { font-size: var(--fs-4); }
.cat-head__meta .cur { font: 700 var(--fs-1)/1 var(--f-body); }
.cat-note { display: flex; gap: 8px; align-items: center; color: var(--accent-ink); font: 700 var(--fs-small)/1.5 var(--f-body); }
.share { justify-self: start; }

/* ---------- بطاقات الباقات ---------- */
.pkgs { display: grid; gap: var(--sp-5); align-items: stretch; }   /* بطاقات الصف الواحد بنفس الطول */
@media (min-width: 768px) { .pkgs { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) {
  .pkgs { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .pkgs--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.pkg {
  position: relative; display: flex; flex-direction: column; gap: 12px; padding: 18px 16px 14px; min-width: 0;
  background: var(--card); border: var(--bd); border-radius: var(--r-lg); box-shadow: var(--sh-1); scroll-margin-top: var(--header-h);
}
.pkg--rec { background: var(--card-2); border: var(--bd-rec); box-shadow: var(--sh-glow); }
.pkg.is-flash { animation: flash 1.2s var(--ease-out); }
@keyframes flash { 0%, 40% { box-shadow: 0 0 0 4px var(--accent); } 100% { box-shadow: var(--sh-1); } }
.pkg__head { display: grid; gap: 8px; justify-items: start; }
.pkg h3 { font-size: var(--fs-h3); }
.pkg__dur { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; font: 500 var(--fs-small)/1.5 var(--f-body); color: var(--soft); }
.pkg__dur .i { color: var(--accent-ink); }
.pkg__dur strong { color: var(--txt); }

.badge {
  display: inline-flex; align-items: center; gap: 6px; min-height: 30px; padding: 4px 12px;
  border-radius: var(--r-pill); font: 700 var(--fs-2)/1.2 var(--f-body); white-space: nowrap;
}
.badge .i { width: 15px; height: 15px; stroke-width: 2; }
.badge--rec { background: var(--accent); color: var(--on-accent); }
.badge--rec .i { fill: currentColor; }
.badge--top { border: 1.5px solid var(--accent-line); color: var(--accent-ink); }

/* البنود سطور على نفس سطح البطاقة (بلا صندوق ثاني) — مراجعة الشكل 2026-10-14 */
.items { display: flex; flex-direction: column; border-top: 1px solid var(--line); }
.item { display: grid; grid-template-columns: 28px 1fr auto; gap: 12px; align-items: start; padding: 10px 2px; }
.item + .item { border-top: 1px solid var(--line); }
.item__ico { width: 28px; height: 28px; display: grid; place-items: center; color: var(--accent-ink); }
.item__ico .i { width: 22px; height: 22px; }
.item__body { display: grid; gap: 2px; min-width: 0; }
.item__title { font: 700 var(--fs-body)/var(--lh-snug) var(--f-body); }
.item__size { color: var(--accent-ink); }
.item__sub { font: 500 var(--fs-small)/1.5 var(--f-body); color: var(--muted); }
.item__info { display: grid; place-items: center; width: 44px; height: 44px; margin: -2px -8px -2px -6px; color: var(--muted); border-radius: 50%; }
.item__info { background: none; border: 0; cursor: pointer; }
.item__info:hover, .item__info[aria-expanded="true"] { color: var(--accent-ink); }
.item__explain { display: grid; gap: 4px; margin-top: 6px; padding: 10px 12px; border-radius: var(--r-sm); background: var(--accent-12); color: var(--soft); font: 500 var(--fs-small)/1.55 var(--f-body); }
.item__explain .link { justify-self: start; font-weight: 700; }
html.js .pkg.is-collapsed .item:nth-child(n+4) { display: none; }   /* أول 3 بنود ظاهرة (PREVIEW_ITEMS) */

.more {
  display: flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; width: 100%;
  background: none; border: 0; color: var(--accent-ink); font: 700 var(--fs-small)/1.3 var(--f-body); cursor: pointer;
}
.more .i { transition: transform var(--dur-2); }
.more[aria-expanded="true"] .i { transform: rotate(180deg); }

.pkg__delivery { display: grid; grid-template-columns: auto 1fr; gap: 10px; align-items: start; margin: auto 0 0; font: 500 var(--fs-2)/1.6 var(--f-body); color: var(--soft); }
.pkg__delivery > .i { color: var(--accent-ink); margin-top: 2px; width: 18px; height: 18px; }

.pkg__price {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 18px;
  border-radius: var(--r-lg); background: var(--accent); color: var(--on-accent);
}
.pkg__price .price { display: inline-flex; align-items: baseline; gap: 8px; }
.pkg__price .amount { font-size: var(--fs-price-xl); line-height: 1; letter-spacing: -.01em; }
.pkg__price .cur { font: 700 var(--fs-3)/1 var(--f-body); }
.pkgs--4 .pkg__price .amount { font-size: clamp(2rem, 1.6rem + 2vw, 3rem); }
.pkg__cta { display: grid; gap: 4px; justify-items: center; }
/* «اترك رقمك» مرة وحدة تحت البطاقات (مو بكل بطاقة — تبسيط 2026-10-27) */
.cat-lead { margin: var(--sp-5) 0 0; text-align: center; font: 500 var(--fs-small)/1.6 var(--f-body); color: var(--soft); }
.cat-lead .book-link { display: inline-flex; align-items: center; min-height: 44px; }

/* ---------- الجدول التفصيلي ---------- */
.details { margin-top: var(--sp-7); border: var(--bd); border-radius: var(--r-lg); background: var(--card); }
.details summary {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 56px; padding: 0 18px;
  cursor: pointer; font-weight: 700; list-style: none;
}
.details summary::-webkit-details-marker { display: none; }
.details[open] summary .i { transform: rotate(180deg); }
.table-scroll { overflow-x: auto; border-top: var(--bd); }
.compare-table { width: 100%; min-width: 560px; border-collapse: separate; border-spacing: 0; font: 500 var(--fs-2)/1.5 var(--f-body); }
.compare-table th, .compare-table td { padding: 12px 14px; text-align: start; vertical-align: top; border-top: 1px solid var(--line); }
.compare-table thead th { border-top: 0; font: 600 var(--fs-4)/1.3 var(--f-display); }
.compare-table thead .price { display: flex; align-items: baseline; gap: 4px; color: var(--accent-ink); }
.compare-table thead .amount { font-size: var(--fs-4); }
.compare-table thead .cur { font: 700 var(--fs-1)/1 var(--f-body); }
.compare-table tbody th { color: var(--soft); font-weight: 700; position: sticky; inset-inline-start: 0; background: var(--card); }
.compare-table .is-rec { background: var(--card-2); background: color-mix(in srgb, var(--accent) 8%, var(--card)); }
.compare-table .is-none { color: var(--muted); }

/* ---------- الملاحظات + روابط ختامية ---------- */
.cat-notes { margin-top: var(--sp-6); display: grid; gap: 6px; }
.cat-notes li { color: var(--soft); font: 500 var(--fs-small)/1.6 var(--f-body); padding-inline-start: 18px; position: relative; }
.cat-notes li::before { content: ""; position: absolute; inset-inline-start: 0; top: .7em; width: 6px; height: 6px; border-radius: 50%; background: var(--accent); }
.related { margin-top: var(--sp-7); }
.related .chips-row { flex-wrap: wrap; padding-inline: 0; overflow: visible; }
.cat-ask { margin-top: var(--sp-7); }
.band { margin-top: var(--sp-4); padding: 14px 16px; border-radius: var(--r-md); background: var(--accent); color: var(--on-accent); font: 700 var(--fs-small)/1.6 var(--f-body); }

/* ---------- إضافات القاعات ---------- */
.hall-addons { margin-top: var(--sp-7); }
.hall-addons__list { display: grid; gap: 10px; margin-top: var(--sp-3); }
.hall-addon {
  display: grid; grid-template-columns: 48px 1fr auto; gap: 8px 14px; align-items: center; padding: 14px 16px;
  background: var(--card); border: var(--bd); border-radius: var(--r-md);
}
.hall-addon__ico { width: 48px; height: 48px; border-radius: var(--r-sm); display: grid; place-items: center; background: var(--accent-12); color: var(--accent-ink); }
.hall-addon__body b { display: block; font: 700 var(--fs-body)/1.35 var(--f-body); }
.hall-addon__body span { color: var(--muted); font: 500 var(--fs-2)/1.5 var(--f-body); }
.hall-addon .btn { grid-column: 1 / -1; }
.addon__price { font: 600 var(--fs-price-sm)/1 var(--f-display); color: var(--accent-ink); white-space: nowrap; }
.addon__price small { font: 700 var(--fs-1)/1 var(--f-body); }
.addon__price--text { font: 700 var(--fs-small)/1.3 var(--f-body); white-space: normal; }
@media (min-width: 768px) { .hall-addon { grid-template-columns: 48px 1fr auto auto; } .hall-addon .btn { grid-column: auto; } }

/* ---------- ضيف على باقتك ---------- */
.addons { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: var(--sp-4); }
@media (min-width: 768px) { .addons { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { .addons { grid-template-columns: repeat(4, 1fr); } }
.addon {
  display: flex; flex-direction: column; gap: 10px; padding: 14px; min-width: 0;
  background: var(--card); border: var(--bd); border-radius: var(--r-sm);
}
.addon__ico { color: var(--accent-ink); }
.addon__ico .i { width: 26px; height: 26px; }
.addon__name { font: 700 var(--fs-2)/1.4 var(--f-body); flex: 1; }
.addon .btn { margin-top: auto; }

/* ---------- الألبومات ---------- */
.banner { position: relative; margin-bottom: var(--sp-6); border-radius: var(--r-xl); overflow: hidden; aspect-ratio: 16 / 9; background: var(--card); }
.banner::after { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, var(--bg) 0%, rgba(246,239,238,.4) 45%, transparent 100%); }
.banner__img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.8); }
@media (min-width: 1024px) { .banner { aspect-ratio: 21 / 9; } }
.albums { display: grid; gap: 12px; }
@media (min-width: 768px) { .albums { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1024px) { .albums { grid-template-columns: repeat(3, 1fr); } }
.album-card { display: grid; grid-template-columns: 44px 1fr; gap: 14px; padding: 18px; background: var(--card); border: var(--bd); border-radius: var(--r-md); }
.album-card__ico { color: var(--accent-ink); }
.album-card__ico .i { width: 30px; height: 30px; }
.album-card__title { display: block; font: 600 var(--fs-4)/1.25 var(--f-display); margin-bottom: 4px; }
.album-card__sub { display: block; font: 500 var(--fs-small)/1.65 var(--f-body); color: var(--muted); }

/* صورة من شغلنا فوق عنوان الفئة (2026-10-11) */
.cat-head__photo { grid-column: 1 / -1; position: relative; margin: 0 0 var(--sp-2); overflow: hidden; border-radius: var(--r-xl) var(--r-xl) 0 0; clip-path: url(#veil-card); background: var(--bg-deep); }
.cat-head__photo img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; object-position: 50% 30%; }
@media (min-width: 768px) { .cat-head__photo img { aspect-ratio: 21 / 9; } }
.cat-head__photo figcaption { position: absolute; inset: 12px 12px auto auto; }
.cat-head__work {
  display: inline-flex; align-items: center; gap: 5px; min-height: 36px; padding: 0 14px; border-radius: var(--r-pill);
  background: var(--glass); color: var(--txt); font: 700 var(--fs-micro)/1 var(--f-body); text-decoration: none;
}

/* ── css/booking.css ── */
/* تحسينات الحجز (قرار حيدر 2026-10-10): الباقة المنصوح بيها بارزة · شريط المقارنة · توفير خصم الموقع ·
   الشروط بصندوق واحد · «شنو يصير بعد ما تحجز» · الجدول التفصيلي كصفوف بالموبايل · نافذة «شوكت مناسبتك؟». */

/* ---------- البطاقة: السعر وزر الحجز بالرأس ---------- */
.pkg__head > .pkg__price, .pkg__head > .pkg__cta, .pkg__head > .pkg__save { justify-self: stretch; }
.pkg__head > .pkg__price { margin-top: 4px; }

/* المنصوح بيها بس: لوح سعر معبّى + زر أسود معبّى + حد أعرض وخلفية ملوّنة خفيفة */
.pkg--rec { border-width: 2.5px; background: var(--card-2); background: color-mix(in srgb, var(--accent) 12%, var(--card)); }
/* الباقي: لوح بحد بس، والزر شفاف بحد (نفس النص) */
.pkg__price--outline { background: transparent; color: var(--txt); padding: 0; }   /* الرقم بلا لوح — اللوح للمنصوح بيها بس */
.pkg__price--outline .price { color: var(--accent-ink); }
.pkg__price--outline .amount, .pkgs--4 .pkg__price--outline .amount { font-size: var(--fs-price-md); }

.pkg__calm { text-align: center; color: var(--muted); font: 500 var(--fs-small)/1.55 var(--f-body); }   /* كان 13px: جملة كاملة تحتاج 15 حتى تنقرا */

/* موبايل: المنصوح بيها أول بطاقة — الحاسبة تبقى بنفس الترتيب */
/* «قارن بسرعة» صار من الأرخص للأغلى بكل الشاشات (المجلس الثاني 2026-10-27) — المنصوح بيها تبقى أول بالبطاقات بس */
@media (max-width: 767px) { .pkg--rec { order: -1; } }

/* توفير خصم الموقع (savings.js يعبّيه) */
/* السعر القديم مشطوب يمّ سعر الموقع (js/savings.js — بس لو العرض بيه نسبة) */
.price .was { order: 2; color: var(--muted); font: 600 var(--fs-small)/1 var(--f-body); text-decoration-thickness: 1.5px; }
.pkg__save { display: flex; align-items: center; gap: 6px; color: var(--ok-ink); font: 700 var(--fs-small)/1.4 var(--f-body); }   /* سطر نص — مو صندوق */

/* ---------- ① اختار ← ② التاريخ ← ③ أرسل (مراجعة التصفح 2026-10-14): الزبون يعرف وين هو وشكد باقي ---------- */
.bsteps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; margin: 0 0 var(--sp-6); counter-reset: none; }
.bsteps__item {
  position: relative; display: grid; justify-items: center; gap: 4px; text-align: center;
  color: var(--muted); font: 700 var(--fs-micro)/1.3 var(--f-body);
}
.bsteps__item + .bsteps__item::before {   /* خط يربط الخطوات (RTL: من اليمين لليسار) */
  content: ""; position: absolute; top: 15px; inset-inline-end: calc(50% + 20px); width: calc(100% - 34px); height: 2px; background: var(--line);
}
.bsteps__n {
  width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center;
  border: 2px solid var(--line-strong); background: var(--card); color: var(--soft); font: 600 var(--fs-3)/1 var(--f-display);
}
.bsteps__item.is-now { color: var(--txt); }
.bsteps__item.is-now .bsteps__n { background: var(--txt); border-color: var(--txt); color: var(--card); }
.bsteps__item.is-done .bsteps__n { background: var(--accent); border-color: var(--accent-line); color: var(--on-accent); }
.date-sheet .bsteps { margin: 2px 0 4px; }
.date-sheet__calm { font: 500 var(--fs-small)/1.6 var(--f-body); color: var(--soft); text-align: center; }

/* ---------- شريط المقارنة السريعة ---------- */
.strip { margin-bottom: var(--sp-6); }
.strip__list { display: grid; gap: 8px; }
/* «.strip__list >» لأن info.css عنده .strip__item ثاني (شريط الدوام والموقع) يقلبه flex */
.strip__list > .strip__item { display: block; }
.strip__row {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 12px; align-items: center; min-height: var(--tap);
  padding: 10px 14px; background: var(--card); border: var(--bd); border-radius: var(--r-md); color: inherit; text-decoration: none;
}
.strip__row:hover { border-color: var(--accent-line); }
.strip__row.is-rec { background: var(--accent-12); border: var(--bd-rec); }
.strip__name { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; font: 700 var(--fs-body)/1.35 var(--f-body); }
.strip__tag { padding: 2px 8px; border-radius: var(--r-pill); background: var(--accent); color: var(--on-accent); font: 700 var(--fs-1)/1.4 var(--f-body); }
.strip__keys { grid-column: 1 / -1; grid-row: 2; color: var(--muted); font: 500 var(--fs-small)/1.5 var(--f-body); }
.strip__price { grid-column: 2; grid-row: 1; display: inline-flex; flex-wrap: wrap; justify-content: flex-end; align-items: baseline; gap: 0 4px; color: var(--accent-ink); white-space: nowrap; }
.strip__price .was { flex-basis: 100%; text-align: end; }   /* المشطوب تحت السعر — بالموبايل ما يزحم الاسم */
.strip__price .amount { font-size: var(--fs-4); }
.strip__price .cur { font: 700 var(--fs-1)/1 var(--f-body); }
@media (min-width: 768px) {
  .strip__row { grid-template-columns: minmax(10rem, 14rem) minmax(0, 1fr) auto; }
  .strip__keys, .strip__price { grid-row: 1; }
  .strip__keys { grid-column: 2; font-size: var(--fs-small); }
  .strip__price { grid-column: 3; }
}

/* ---------- صندوق الشروط ---------- */
.terms { margin-top: var(--sp-7); padding: 18px 16px; background: var(--card); border: var(--bd); border-radius: var(--r-lg); }
.terms h3 { font-size: var(--fs-4); margin-bottom: var(--sp-3); }
.terms__list { display: grid; }
.terms__row { display: grid; grid-template-columns: 6.5rem minmax(0, 1fr); gap: 4px 12px; padding: 10px 0; }
.terms__row + .terms__row { border-top: 1px solid var(--line); }
.terms dt { font: 700 var(--fs-small)/1.6 var(--f-body); color: var(--accent-ink); }
.terms dd { font: 500 var(--fs-small)/1.6 var(--f-body); color: var(--soft); }
@media (max-width: 359px) { .terms__row { grid-template-columns: 1fr; } }

/* ---------- شنو يصير بعد ما تحجز ---------- */
.after { margin-top: var(--sp-7); }
.after__list { display: grid; gap: 8px; counter-reset: after; }
.after__list li {
  counter-increment: after; display: grid; grid-template-columns: 32px 1fr; gap: 0 12px; align-items: center;
  padding: 12px 14px; background: var(--card-2); border: var(--bd); border-radius: var(--r-md);
}
.after__list li::before {
  content: counter(after); grid-row: span 2; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center;
  background: var(--accent); color: var(--on-accent); font: 600 var(--fs-4)/1 var(--f-display);
}
.after__list b { font: 700 var(--fs-body)/1.35 var(--f-body); }
.after__list span { grid-column: 2; font: 500 var(--fs-small)/1.5 var(--f-body); color: var(--muted); }
@media (min-width: 1024px) {
  .after__list { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .after__list li { grid-template-columns: 1fr; align-content: start; gap: 8px; }
  .after__list li::before, .after__list span { grid-row: auto; grid-column: auto; }
}

/* ---------- الجدول التفصيلي بالموبايل: صفوف تحت بعض بدل تمرير جانبي ---------- */
@media (max-width: 599px) {
  .compare-table { min-width: 0; }
  .compare-table thead { display: none; }   /* اسم الباقة يطلع جنب كل قيمة (data-pkg) */
  .compare-table, .compare-table tbody, .compare-table tr, .compare-table th, .compare-table td { display: block; }
  .compare-table tbody tr { padding: 12px 16px; border-top: 1px solid var(--line); }
  .compare-table tbody tr:first-child { border-top: 0; }
  .compare-table tbody th { position: static; padding: 0 0 6px; border: 0; color: var(--txt); }
  .compare-table td { display: grid; grid-template-columns: 7.5rem minmax(0, 1fr); gap: 10px; padding: 6px 8px; border: 0; border-radius: var(--r-xs); }
  .compare-table td::before { content: attr(data-pkg); font-weight: 700; color: var(--soft); }
}

/* ---------- نافذة «شوكت مناسبتك؟» (datestep.js) ---------- */
.date-sheet {
  width: min(440px, calc(100vw - 24px)); padding: 0; border: 0; border-radius: var(--r-xl);
  background: var(--card); color: var(--txt); box-shadow: var(--sh-float);
}
.date-sheet[open] { animation: dialog-in .35s var(--ease-spring); }
.date-sheet__body { position: relative; display: grid; gap: 12px; padding: 22px 18px 18px; }
.date-sheet::backdrop { background: rgba(22, 22, 22, .6); }
.date-sheet h3 { font-size: var(--fs-h3); padding-inline-end: 48px; }
.date-sheet__pkg { font: 700 var(--fs-body)/1.45 var(--f-body); color: var(--accent-ink); }
.date-sheet__close { position: absolute; top: 12px; inset-inline-end: 12px; }
.date-sheet .field input { width: 100%; min-height: var(--tap); }
.date-sheet__skip { justify-self: center; min-height: 44px; font-weight: 700; }
@media (max-width: 599px) {
  .date-sheet { width: 100%; max-width: 100%; margin: auto 0 0; border-radius: var(--r-xl) var(--r-xl) 0 0; }
  .date-sheet__body { padding-bottom: calc(18px + env(safe-area-inset-bottom)); }
  .date-sheet[open] { animation: sheet-up .35s var(--ease-out); }
}
@keyframes sheet-up { from { transform: translateY(40px); opacity: 0; } to { transform: none; opacity: 1; } }
.glossary { margin-top: var(--sp-4); }
.glossary__list { margin: 0; padding: 0 16px 16px; }

/* ---------- «1 اسأل · 2 نثبّت الموعد · 3 عربون النص» جنب زر الحجز (المجلس الثالث 2026-10-29) ---------- */
.book-steps { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 12px; margin: 0; padding: 0; list-style: none; counter-reset: bs; }
.book-steps li { counter-increment: bs; display: inline-flex; align-items: center; gap: 6px; color: var(--soft); font: 700 var(--fs-micro)/1.5 var(--f-body); }
.book-steps li::before {
  content: counter(bs); width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; flex: none;
  background: var(--wa); color: var(--on-wa); font: 700 var(--fs-1)/1 var(--f-body);
}
.book-steps--strip { margin-top: var(--sp-3); }

/* الشروط و«بعد ما تحجز» داخل طيّة وحدة (المجلس الثالث 2026-10-29) — بلا صندوق داخل صندوق */
.details--terms > .terms { margin: 0; border: 0; background: none; box-shadow: none; padding: 4px 16px 8px; }
.details--terms > .after { margin: 0; padding: 0 16px 16px; }

/* ── css/info.css ── */
/* التنقّل الرئيسي + صفحات المعلومات: من نحن · الأسئلة · الدوام والموقع. */

/* ---------- التنقّل الرئيسي (ظاهر دايماً) ---------- */
.main-nav { border-top: 1px solid var(--line); }
@media (max-width: 767px) { .main-nav { display: none; } }   /* بالموبايل نفس الروابط بالشريط اللي تحت (الباقات · المزيد) */
.main-nav__row { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 2px; padding-block: 4px; }
.nav-link {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
  min-height: var(--tap); padding: 4px 2px; border-radius: var(--r-sm); text-decoration: none;
  color: var(--muted); font: 700 var(--fs-1)/1.15 var(--f-body); text-align: center;
  transition: color var(--dur-1), background var(--dur-1);
}
.nav-link .i { width: 20px; height: 20px; }
.nav-link:hover { color: var(--txt); }
.nav-link[aria-current="true"] { color: var(--txt); background: var(--bg-deep); }
@media (min-width: 768px) {
  .main-nav__row { display: flex; justify-content: center; gap: 8px; }
  .nav-link { flex-direction: row; gap: 8px; padding: 0 16px; font-size: var(--fs-2); }
}

/* ---------- شريط الدوام والموقع بالرئيسية ---------- */
.visit-strip { background: var(--card); border-block: var(--bd); }
.visit-strip__inner { display: grid; gap: 10px; padding-block: var(--sp-5); }
.strip__item { display: flex; align-items: center; gap: 10px; font: 700 var(--fs-small)/1.5 var(--f-body); }
.strip__item .i { color: var(--brand-ink); }
@media (min-width: 1024px) { .visit-strip__inner { grid-template-columns: auto auto 1fr; align-items: center; gap: var(--sp-7); } .visit-strip .strip__cta { justify-self: end; } }

/* ---------- الأسئلة ---------- */
.home-faq { padding-block: var(--sp-8) var(--sp-9); }
.home-faq h2 { font-size: var(--fs-h2); margin-bottom: var(--sp-5); }
.home-faq .btn { margin-top: var(--sp-4); }
.faq-group + .faq-group { margin-top: var(--sp-7); }
.faq { background: var(--card); border: var(--bd); border-radius: var(--r-md); }
.faq + .faq { margin-top: 8px; }
.faq summary {
  display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 56px; padding: 12px 16px;
  cursor: pointer; list-style: none; font: 700 var(--fs-body)/1.45 var(--f-body);
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after {
  content: "+"; flex: none; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center;
  border: 1.5px solid var(--line-strong); color: var(--brand-ink); font: 700 var(--fs-4)/1 var(--f-body);
}
.faq[open] summary::after { content: "−"; }
.faq[open] { border-color: var(--line-strong); }
.faq__a { padding: 0 16px 16px; display: grid; gap: 10px; justify-items: start; color: var(--soft); font: 500 var(--fs-body)/1.75 var(--f-body); }
.faq-search { margin-bottom: var(--sp-6); display: grid; gap: 8px; }
.faq-search input {
  width: 100%; min-height: 52px; padding: 0 18px; border-radius: var(--r-pill); border: 1.5px solid var(--line-strong);
  background: var(--card); color: var(--txt); font: 500 var(--fs-3)/1.4 var(--f-body);
}
.faq-search input::placeholder { color: var(--muted); }
.faq-search input:focus-visible { border-color: var(--txt); outline-offset: 2px; }

/* ---------- صندوق «اسألنا» ---------- */
.ask-box {
  margin-top: var(--sp-8); padding: var(--sp-6); border-radius: var(--r-lg); background: var(--card-2); border: var(--bd);
  display: grid; gap: 8px; text-align: center; justify-items: center;
}
.ask-box b { font: 600 var(--fs-5)/1.3 var(--f-display); }
.ask-box__cta { display: grid; gap: 8px; width: 100%; max-width: 420px; margin-top: 8px; }

/* ---------- من نحن ---------- */
.lead { font: 500 var(--fs-lead)/1.8 var(--f-body); color: var(--soft); max-width: 60ch; margin-bottom: var(--sp-6); }
.about-points { display: grid; gap: 10px; margin-bottom: var(--sp-7); }
@media (min-width: 768px) { .about-points { grid-template-columns: repeat(2, 1fr); } }
.about-point {
  display: grid; grid-template-columns: 66px 1fr; gap: 14px; align-items: center; padding: 16px;
  background: var(--card); border: var(--bd); border-radius: var(--r-md);
}
.about-point b { display: block; font: 700 var(--fs-3)/1.4 var(--f-body); }
.about-point span span { color: var(--muted); font: 500 var(--fs-small)/1.6 var(--f-body); }
.about-point__ico { width: 48px; height: 48px; border-radius: var(--r-sm); display: grid; place-items: center; background: var(--accent-12); color: var(--accent-ink); justify-self: center; }
.about-point__ico .i { width: 24px; height: 24px; }
.about-point .seal { justify-self: center; }
.chips-row--wrap { flex-wrap: wrap; overflow: visible; padding-inline: 0; }
.about-ig { margin-top: var(--sp-5); }

/* ---------- الدوام والموقع ---------- */
.visit-card { padding: var(--sp-6); border-radius: var(--r-lg); background: var(--card); border: var(--bd); display: grid; gap: 10px; margin-bottom: var(--sp-7); }
.address--big { font: 700 var(--fs-lead)/1.5 var(--f-body); color: var(--txt); }
.visit-card__cta { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.hours { display: grid; gap: 12px; }
.hours__now { justify-self: start; padding: 8px 14px; border-radius: var(--r-pill); font: 700 var(--fs-small)/1.3 var(--f-body); background: var(--no-bg); color: var(--no-ink); }
.hours__now.is-open { background: var(--ok-bg); color: var(--ok-ink); }
.hours__table { width: 100%; max-width: 480px; border-collapse: separate; border-spacing: 0; background: var(--card); border: var(--bd); border-radius: var(--r-md); overflow: hidden; }
.hours__table th, .hours__table td { padding: 12px 16px; text-align: start; border-top: 1px solid var(--line); font: 500 var(--fs-3)/1.4 var(--f-body); }
.hours__table tr:first-child th, .hours__table tr:first-child td { border-top: 0; }
.hours__table th { font-weight: 700; }
.hours__table .is-closed td { color: var(--muted); }
.hours__table .is-today { background: var(--accent-12); }
.hours__table .is-today th::after { content: " (اليوم)"; color: var(--brand-ink); font-weight: 500; }

/* ---------- الفوتر ---------- */
.footer-nav { display: flex; flex-wrap: wrap; gap: 8px 18px; }

/* ---------- الخريطة ---------- */
.map-alt { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 16px; font: 500 var(--fs-small)/1.5 var(--f-body); }
.strip__cta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; }

/* «بعد ما تحجز شيصير؟» — خط زمني بسيط بصفحة الحجز (book.py after_booking) */
.after-book { display: grid; gap: var(--sp-4); margin-top: var(--sp-6); }
.after-book h3 { font: 600 var(--fs-5)/1.3 var(--f-display); }
.after-book__list { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; counter-reset: after; }
.after-book__list li {
  counter-increment: after; display: grid; grid-template-columns: 32px 1fr; gap: 4px 12px; padding: 14px 16px;
  border-radius: var(--r-sm); border: 1px solid var(--line); background: var(--card);
}
.after-book__list li::before {
  content: counter(after); grid-row: span 2; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%;
  background: var(--accent); color: var(--on-accent); font: 700 var(--fs-small)/1 var(--f-body);
}
.after-book__list b { font: 700 var(--fs-3)/1.4 var(--f-body); }
.after-book__list p { margin: 0; color: var(--soft); font: 500 var(--fs-small)/1.7 var(--f-body); }

/* ── css/forms.css ── */
/* فورم «اترك رقمك» + مساعد الأسئلة (الشات). */

/* ---------- الفورم ---------- */
.book { max-width: 640px; }
html.js .book-nojs { display: none; }
.book-nojs { display: grid; gap: 12px; justify-items: start; color: var(--soft); }
.lead-form { display: grid; gap: var(--sp-5); padding: var(--sp-6); background: var(--card); border: var(--bd); border-radius: var(--r-lg); }
.field { display: grid; gap: 6px; }
.field label { font: 700 var(--fs-body)/1.4 var(--f-body); }
.field input, .field select, .field textarea {
  width: 100%; min-height: 52px; padding: 12px 16px; border-radius: var(--r-sm); border: 1.5px solid var(--line-strong);
  background: var(--card); color: var(--txt); font: 500 var(--fs-3)/1.4 var(--f-body);
}
.field textarea { resize: vertical; min-height: 96px; }
.field input:focus-visible, .field select:focus-visible, .field textarea:focus-visible { border-color: var(--txt); outline-offset: 2px; }
.field [aria-invalid="true"], .consent:has([aria-invalid="true"]) { border-color: var(--no-ink); }
.field input[dir="ltr"] { text-align: right; }
.lead-pkg { padding: 12px 16px; border-radius: var(--r-sm); background: var(--bg); font: 500 var(--fs-small)/1.5 var(--f-body); }
.consent {
  display: grid; grid-template-columns: 24px 1fr; gap: 12px; align-items: start; padding: 14px; border-radius: var(--r-sm);
  border: 1.5px solid var(--line); font: 500 var(--fs-small)/1.6 var(--f-body); cursor: pointer;
}
.consent { min-height: 48px; }   /* المربع وكل النص ينضغطون (label) */
.consent input { width: 24px; height: 24px; margin: 1px 0 0; accent-color: var(--txt); cursor: pointer; }
.hp { position: absolute; inset-inline-start: -10000px; width: 1px; height: 1px; overflow: hidden; }
.form-error { padding: 12px 16px; border-radius: var(--r-sm); background: var(--no-bg); color: var(--no-ink); font: 700 var(--fs-small)/1.6 var(--f-body); }
.lead-done {
  display: grid; gap: 10px; justify-items: start; padding: var(--sp-6); border-radius: var(--r-lg);
  background: var(--ok-bg); color: var(--ok-ink);
}
.lead-done b { font: 600 var(--fs-5)/1.2 var(--f-display); }
.lead-done p { color: var(--txt); }
.book-privacy { margin-top: var(--sp-4); }
.book-link { margin-top: 2px; justify-self: center; font: 700 var(--fs-small)/1.5 var(--f-body); color: var(--soft); }
.ask-box .book-link { margin-top: 6px; }

/* ---------- المساعد ---------- */
.chat {
  /* فوق رسالة الكوكيز: المحادثة المفتوحة تبقى قابلة للكتابة (والموافقة تنطلب بلطف داخلها) */
  position: fixed; z-index: calc(var(--z-toast) + 2); inset: auto 8px calc(8px + env(safe-area-inset-bottom)) 8px;
  display: grid; grid-template-rows: auto 1fr auto auto; max-height: min(78svh, 640px);
  background: var(--card); border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: var(--sh-float); overflow: hidden;
}
@media (min-width: 768px) { .chat { inset: auto 24px 24px auto; width: 400px; } }
.chat__head { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 0 8px; padding: 10px 12px 10px 16px; border-bottom: 1px solid var(--line); }
.chat__head b { font: 600 var(--fs-4)/1.2 var(--f-display); }
.chat__head small { grid-row: 2; }
.chat__head .btn { grid-row: 1 / span 2; grid-column: 2; }
.chat__log { overflow-y: auto; padding: 14px; display: flex; flex-direction: column; gap: 10px; overscroll-behavior: contain; min-height: 160px; }
.msg { max-width: 88%; padding: 10px 14px; border-radius: 16px; display: grid; gap: 8px; justify-items: start; font: 500 var(--fs-small)/1.65 var(--f-body); }
.msg--bot { align-self: flex-start; background: var(--bg); border-end-start-radius: 4px; }
.msg--user { align-self: flex-end; background: var(--txt); color: var(--card); border-end-end-radius: 4px; }
.chat__chips { display: flex; gap: 6px; overflow-x: auto; padding: 0 12px 8px; scrollbar-width: none; }
.chat__chips:empty { display: none; }
.chat__chips .chip { min-height: 36px; font-size: var(--fs-2); cursor: pointer; }
.chat__form { display: flex; gap: 8px; padding: 10px 12px; border-top: 1px solid var(--line); }
.chat__form input {
  flex: 1; min-width: 0; min-height: var(--tap); padding: 0 16px; border-radius: var(--r-pill); border: 1.5px solid var(--line-strong);
  background: var(--card); color: var(--txt); font: 500 var(--fs-3)/1.4 var(--f-body);
}
.chat__form input:focus-visible { border-color: var(--txt); outline-offset: 2px; }

/* بوابة الموافقة (قرار حيدر 2026-10-23): ناعمة جداً — بطاقة صغيرة بنص الشاشة (طلب حيدر)، وورا الصفحة غشاوة ورد خفيفة (مو سواد).
   الصفحة وراها inert (consent.js)، والشريط اللي تحت ينخفي وهي ظاهرة. زر واحد هادئ بلون الهوية. */
.cookie-banner {
  position: fixed; inset-inline: 16px; top: 50%; translate: 0 -50%; z-index: calc(var(--z-toast) + 1);
  display: grid; gap: 12px; padding: 24px 22px 20px; max-width: 340px; text-align: center; margin-inline: auto;
  border-radius: 28px; animation: consent-in .6s var(--ease-out) both;
}
.cookie-banner__title { margin: 0; color: var(--txt); font: 500 var(--fs-4)/1.35 var(--f-display); }
.cookie-banner p { margin: 0; font: 400 var(--fs-small)/1.8 var(--f-body); color: var(--muted); }
/* زر «تمام» وحده — البوابة إلزامية (قرار حيدر 2026-10-27). */
.cookie-banner__btn {
  min-height: 48px; width: 100%; border: 1.5px solid var(--c-brand); border-radius: 999px; font: 600 var(--fs-body)/1 var(--f-body);
  background: var(--c-brand); color: var(--brand-ink); box-shadow: none;
}
.cookie-banner__btn:hover { background: color-mix(in srgb, var(--c-brand) 82%, var(--brand-ink)); color: var(--brand-ink); }
.cookie-banner__more { display: inline-flex; align-items: center; min-height: 44px; padding-inline: 4px; }
body.is-asking-consent .tab-bar { display: none; }
body.is-asking-consent::after {
  content: ""; position: fixed; inset: 0; z-index: var(--z-toast); pointer-events: auto;   /* يمنع اللمس ورا البوابة قبل ما consent.js يحط inert */
  background: rgba(246, 239, 238, .3); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px);
  animation: consent-fade .6s ease both;
}
@keyframes consent-in { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes consent-fade { from { opacity: 0; } to { opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .cookie-banner, body.is-asking-consent::after { animation: none; } }
.lead-more { display: grid; gap: 12px; }
.lead-more summary { cursor: pointer; font: 700 var(--fs-small)/1.5 var(--f-body); color: var(--soft); min-height: 40px; display: flex; align-items: center; }
.lead-more[open] { gap: 16px; }

/* «رجعت؟ 🌷» — للزائر الراجع الموافق (js/returning.js): أول الصفحة تحت الهيدر، يتسكّر بزر. */
.welcome-back {
  display: grid; grid-template-columns: 1fr auto; gap: 8px 10px; align-items: start;
  margin: var(--sp-3) var(--gutter) 0; padding: 12px 14px; border-radius: var(--r-lg);
  background: var(--card); border: var(--bd); box-shadow: var(--sh-float); animation: rise .35s var(--ease-out);
}
.welcome-back[hidden] { display: none; }
.welcome-back__body { display: grid; gap: 8px; min-width: 0; }
.welcome-back b { font: 600 var(--fs-4)/1.3 var(--f-display); }
.welcome-back p { margin: 0; font: 500 var(--fs-small)/1.6 var(--f-body); color: var(--soft); }
.welcome-back__pkgs { display: flex; flex-wrap: wrap; gap: 6px; }
.welcome-back__pkgs .chip { min-height: 36px; font-size: var(--fs-2); }
.welcome-back .btn--icon { min-height: 36px; min-width: 36px; }
@media (min-width: 768px) { .welcome-back { max-width: 720px; margin-inline: auto; } }
@media (prefers-reduced-motion: reduce) { .welcome-back { animation: none; } }

/* ── css/gallery.css ── */
/* معرض موديلات الألبومات + نافذة التكبير (gallery.js). */
.album-gallery { display: grid; gap: var(--sp-4); margin-bottom: var(--sp-8); }
.album-filters { padding-inline: 0; }
.album-filters .chip[aria-pressed="true"] { background: var(--txt); color: var(--white); border-color: var(--txt); }
.album-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
@media (min-width: 768px) { .album-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1024px) { .album-grid { grid-template-columns: repeat(4, 1fr); gap: 16px; } }
.album-model__link {
  display: grid; text-decoration: none; color: inherit; overflow: hidden;
  background: var(--card); border: var(--bd); border-radius: var(--r-md); box-shadow: var(--sh-1);
}
.album-model img { width: 100%; height: auto; aspect-ratio: 3 / 4; object-fit: cover; background: var(--bg-deep); transition: transform .5s var(--ease-out); }
.album-model__cap { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; padding: 10px 12px; }
.album-model__cap b { font: 600 var(--fs-4)/1 var(--f-display); }
.album-model__cap span { font: 500 var(--fs-1)/1.3 var(--f-body); color: var(--muted); }
@media (hover: hover) {
  .album-model__link { transition: transform var(--dur-2) var(--ease-out), box-shadow var(--dur-2) var(--ease-out); }
  .album-model__link:hover { transform: translateY(-4px); box-shadow: var(--sh-float); }
  .album-model__link:hover img { transform: scale(1.05); }
}
.album-types__title { margin-top: var(--sp-4); }

/* نافذة التكبير */
.album-dialog {
  width: min(560px, calc(100vw - 24px)); max-height: calc(100dvh - 24px); padding: 0; overflow: auto;
  border: 0; border-radius: var(--r-xl); background: var(--card); color: var(--txt); box-shadow: var(--sh-float);
}
.album-dialog::backdrop { background: rgba(22, 22, 22, .6); }
.album-dialog[open] { animation: dialog-in .35s var(--ease-spring); }
.album-dialog__img { display: block; width: 100%; height: auto; max-height: 62dvh; object-fit: contain; background: var(--bg); }
.album-dialog__body { display: grid; gap: 10px; padding: 18px; }
.album-dialog__body h3 { font-size: var(--fs-h3); margin: 0; }
.album-dialog__body p { margin: 0; }
.album-dialog__close { position: sticky; top: 10px; float: left; margin: 10px; z-index: 1; background: var(--glass); }
.size-pills { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 6px; }
.size-pills .chip { direction: ltr; }
.size-pills .chip[aria-checked="true"] { background: var(--txt); color: var(--white); border-color: var(--txt); }
.album-dialog__note { font-size: var(--fs-micro); text-align: center; }
@keyframes dialog-in { from { opacity: 0; transform: translateY(16px) scale(.97); } to { opacity: 1; transform: none; } }
.album-model__3d { margin-inline-start: auto; font: 600 var(--fs-1)/1 var(--f-body); color: var(--white); background: var(--txt); border-radius: 999px; padding: 4px 8px; }
.album-dialog__3d { margin-block-end: 8px; }

/* ── css/work.css ── */
/* معرض «من شغلنا»: شبكة صور حقيقية + شريط ريلات يتمرّر للجانب + نافذة تكبير (work.js). */
.work { padding-block: var(--section-gap) 0; }
.work h2 { font-size: var(--fs-h2); margin: var(--sp-2) 0 var(--sp-6); }
.work__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
@media (min-width: 768px) { .work__grid { gap: 12px; } }
.work__link { display: block; overflow: hidden; border-radius: var(--r-sm); background: var(--bg-deep); }
.work__link img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; transition: transform .5s var(--ease-out); }
.work__link:hover img, .work__link:focus-visible img { transform: scale(1.04); }
.work__more { margin: var(--sp-4) auto 0; display: flex; }
.work .section-label { margin-top: var(--sp-8); }
.reels {
  display: grid; grid-auto-flow: column; grid-auto-columns: minmax(132px, 30%); gap: 10px;
  overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 8px; overscroll-behavior-x: contain;
}
@media (min-width: 768px) { .reels { grid-auto-columns: minmax(160px, 1fr); } }
.reel { scroll-snap-align: start; }
.reel__link { position: relative; display: block; overflow: hidden; border-radius: var(--r-md); background: var(--txt); }
.reel__link img { display: block; width: 100%; height: auto; aspect-ratio: 9 / 16; object-fit: cover; opacity: .92; }
.reel__play {
  position: absolute; inset: auto auto 10px 10px; display: grid; place-items: center; width: 40px; height: 40px;
  border-radius: 50%; background: rgba(22, 22, 22, .7); color: var(--white);
}
.reel__play .i { width: 20px; height: 20px; }
.work__ig { margin-top: var(--sp-4); }
.work-dialog {
  width: min(720px, calc(100vw - 16px)); max-height: calc(100dvh - 16px); padding: 0; overflow: hidden;
  border: 0; border-radius: var(--r-lg); background: #111; box-shadow: var(--sh-float);
}
.work-dialog::backdrop { background: rgba(10, 10, 10, .85); }
.work-dialog[open] { animation: dialog-in .35s var(--ease-spring); }
.work-dialog__img { display: block; width: 100%; height: auto; max-height: 86dvh; object-fit: contain; }
.work-dialog__close { position: absolute; top: 10px; left: 10px; z-index: 1; background: var(--glass); }
.work-dialog__nav { position: absolute; inset: auto 10px 10px; display: flex; justify-content: space-between; pointer-events: none; }
.work-dialog__nav .btn { pointer-events: auto; background: var(--glass); }
.work-dialog__nav [data-go="-1"] .i { transform: scaleX(-1); }

/* ── css/promo.css ── */
/* بانر «العرض الحالي» — شريط متحرك (اختيار حيدر 2026-10-10 من تصميم/معاينة_موشن_العرض.html، القالب ٢).
   عنابي + ذهبي فاتح (اختيار حيدر من تصميم/معاينة_الوان_البانر.html، رقم ٤). العنوان يمشي مثل شريط الأخبار،
   ونسبة الخصم بارزة بكبسولة ذهبية. بلا زخارف ويّا النص.
   يظهر بس لما اللوحة مشغّلة عرض (js/promo.js). «تقليل الحركة» بالجهاز = العنوان ثابت ومكتوب كامل. */
.promo {
  --promo-bg: #8E1B2E;     /* عنابي — نص أبيض عليه تباين 8.6:1 */
  --promo-gold: #F4D9A6;   /* ذهبي فاتح للكبسولات */
  --promo-ink: #5A0F1C;    /* عنابي غامق لنص الكبسولات — تباين ≥9:1 */
  background: var(--promo-bg);
  color: var(--white);
  border-bottom: 1px solid var(--promo-ink);
}
.promo[hidden] { display: none; }

/* أقصر (قرار حيدر 2026-10-14: يبقى متحرك بس أقصر) — كان 145px يدفع الصورة والعنوان لتحت. */
.promo__row {
  display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px;
  padding-top: var(--sp-2);
}
.promo__tag {
  background: var(--promo-gold); color: var(--promo-ink);
  border-radius: var(--r-pill); padding: 1px 12px;
  font: 700 var(--fs-1)/1.5 var(--f-body);
}
.promo__body { font: 600 var(--fs-small)/1.5 var(--f-body); color: var(--white); }

.promo__marquee { overflow: hidden; padding-block: var(--sp-1) var(--sp-2); }
.promo__track {
  display: flex; align-items: center; width: max-content;
  animation: promo-run var(--promo-dur, 16s) linear infinite;
}
.promo__item {
  display: inline-flex; align-items: center; gap: .35em;
  padding-inline: 1.4em;
  font: 600 clamp(1.25rem, 1rem + 1.2vw, 1.75rem)/1.3 var(--f-display);
  white-space: nowrap;
}
/* نسبة الخصم: أكبر، ذهبية، بكبسولة — أول شي تلتقطه العين */
.promo__off {
  display: inline-block;
  background: var(--promo-gold); color: var(--promo-ink);
  border-radius: var(--r-sm);
  padding: 0 .3em;
  font-size: 1.35em; line-height: 1.15;
  direction: ltr; unicode-bidi: isolate;
}
.promo:hover .promo__track { animation-play-state: paused; }   /* بالحاسبة: توقف لما الماوس فوكها حتى تنقرا */

@keyframes promo-run { to { transform: translateX(50%); } }   /* RTL: نص الشريط = نسخة كاملة، فالرجعة ما تبيّن */

@media (prefers-reduced-motion: reduce) {
  .promo__track { animation: none; width: auto; }
  .promo__item { display: block; white-space: normal; padding-inline: var(--gutter); }
  .promo__item ~ .promo__item { display: none; }
}

/* ── css/reviews.css ── */
/* شريط الثقة تحت الواجهة + قسم «شنو گالوا عنّا» (تصميم/آراء_الزباين_2026-10-23.md). أرقام نثبتها بس. */
.proof { padding-block: var(--sp-4) var(--sp-5); }   /* مسافة تحت حتى ما تلتصق بشريط الدوام (كانت تبين مقصوصة) */
.proof__facts {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 0; list-style: none;
}
@media (min-width: 768px) { .proof__facts { grid-template-columns: repeat(auto-fit, minmax(0, 1fr)); grid-auto-flow: column; } }
.proof__fact {
  display: grid; gap: 2px; padding: 12px 8px; text-align: center; border-radius: var(--r-lg);
  background: var(--glass-bg); border: 1px solid var(--glass-edge);
}
.proof__fact b { font: 600 var(--fs-4)/1.2 var(--f-display); color: var(--brand-ink); }
.proof__fact span { font: 400 var(--fs-1)/1.4 var(--f-body); color: var(--soft); }
.proof__quote {
  display: grid; gap: 4px; margin-top: 10px; padding: 12px 16px; border-radius: var(--r-lg); color: var(--txt);
  text-decoration: none; background: var(--glass-bg); border: 1px solid var(--glass-edge);
}
.proof__quote q { font: 500 var(--fs-2)/1.6 var(--f-body); }
.proof__who { font: 400 var(--fs-1)/1.4 var(--f-body); color: var(--muted); }
.proof__more { display: inline-flex; align-items: center; gap: 4px; font: 600 var(--fs-1)/1.4 var(--f-body); color: var(--brand-ink); }
.proof__more .i { width: 14px; height: 14px; }

.reviews { padding-block: var(--section-gap) 0; }
.reviews h2 { font-size: var(--fs-h2); margin: var(--sp-2) 0 var(--sp-6); }
.reviews__list {
  display: grid; grid-auto-flow: column; grid-auto-columns: minmax(240px, 78%); gap: 12px; margin: 0; padding: 0 0 8px;
  list-style: none; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain;
}
@media (min-width: 768px) { .reviews__list { grid-auto-columns: minmax(260px, 1fr); } }
.review {
  scroll-snap-align: start; display: grid; align-content: start; gap: 10px; padding: 10px; border-radius: var(--r-lg);
  background: var(--glass-bg); border: 1px solid var(--glass-edge); box-shadow: var(--glass-sh);
}
.review__shot { display: block; overflow: hidden; border-radius: var(--r-md); background: var(--bg-deep); }
.review__shot img { display: block; width: 100%; height: auto; max-height: 360px; object-fit: cover; object-position: top; }
.review__body { margin: 0; padding: 0 4px 4px; }
.review__body p { margin: 0 0 8px; font: 500 var(--fs-2)/1.6 var(--f-body); color: var(--txt); }
.review__body footer { display: grid; gap: 2px; }
.review__body footer b { font: 600 var(--fs-2)/1.4 var(--f-body); color: var(--brand-ink); }
.review__body footer span { font: 400 var(--fs-1)/1.4 var(--f-body); color: var(--muted); }
.reviews__note { margin-top: var(--sp-4); }
.proof__fact:last-child:nth-child(odd) { grid-column: 1 / -1; }   /* عدد فردي على الموبايل = الأخير بعرض كامل */
@media (min-width: 768px) { .proof__fact:last-child:nth-child(odd) { grid-column: auto; } }

/* ── css/glass.css ── */
/* طبقة الزجاج — هوية حيدر 2026-10-15 (تصميم/هوية_مميزة_2026-10-15/اتجاه_زجاج.html بلون «ورد مطفي»).
   - السطوح اللي بمسار الصفحة: أبيض نص شفاف + حافة ضوء، بلا blur (وراها بس الخلفية الناعمة — الضباب ما يضيف شي ويثقّل).
   - العناصر اللي تطوف فوق الصور أو المحتوى: blur حقيقي (الهيدر، الشريط اللي تحت، لوح البطاقة، لوح الهيرو).
   - الأسعار والفورمات والنوافذ: --glass-solid شبه مصمت حتى تتقرا.
   - المتصفح اللي ما يدعم backdrop-filter، أو الجهاز اللي طالب «تقليل الشفافية»: نفس الشكل بأرضية مصمتة. */

/* الخلفية: بقع ورد ناعمة ثابتة — الزجاج يحتاج شي وراه */
body { background: transparent; }
body::before {
  content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none;
  background:
    radial-gradient(55vmax 55vmax at 92% 12%, var(--blob-1) 0%, transparent 62%),
    radial-gradient(60vmax 60vmax at 0% 55%, var(--blob-2) 0%, transparent 62%),
    radial-gradient(50vmax 50vmax at 75% 95%, var(--blob-3) 0%, transparent 62%),
    var(--bg);
}

/* لون واحد للهوية — ألوان الفئات الـ١٢ (cats.css) كانت ضوضاء ويّا الورد */
[data-cat] { --accent: var(--c-brand); }

/* ---------- سطوح بمسار الصفحة ---------- */
.pkg, .details, .terms, .strip__row, .hall-addon, .addon, .album-card, .trust__item, .steps__list li,
.extra-link, .faq, .visit-card, .about-point, .back-link, .visit-strip, .place, .btn--ghost, .chip, .related .chip {
  background: var(--glass-bg); border: 1px solid var(--glass-edge); box-shadow: var(--glass-sh);
}
.pkg--rec { background: var(--glass-solid); border: 2px solid var(--accent-line); box-shadow: var(--glass-sh), var(--sh-glow); }
.strip__row.is-rec { background: var(--glass-solid); border: 2px solid var(--accent-line); }
.trust { gap: 8px; background: none; border: 0; border-radius: 0; overflow: visible; }
.trust__item { border-radius: var(--r-lg); }
.steps__list--mini li { background: var(--glass-bg); }
.compare-table tbody th { background: var(--card-2); }
.hours__table { background: var(--glass-solid); border: 1px solid var(--glass-edge); }

/* أشياء لازم تتقرا زين: الفورمات والمدخلات والنوافذ */
.lead-form, .field input, .field select, .field textarea, .faq-search input, .chat__form input {
  background: var(--glass-solid); border-color: var(--line-strong);
}
.lead-form { border: 1px solid var(--glass-edge); box-shadow: var(--glass-sh); }

/* ---------- عناصر تطوف (blur حقيقي) ---------- */
/* قائمة «المزيد» مو هنا (المجلس الثالث 2026-10-29): جوّه الشريط اللي هو أصلاً مضبّب، فالـblur ما يشتغل والنص يبين من وراها —
   تبقى بأرضية الكارت الصلبة من layout.css (.tab-more__menu). */
.site-header, .tab-bar, .cat-card__body, .cat-card__women, .cat-head__work, .hero__inner,
.cookie-banner, .chat, .date-sheet {
  background: var(--glass-solid); border: 1px solid var(--glass-edge); box-shadow: var(--glass-sh);
}
.site-header { border-width: 0 0 1px; box-shadow: none; }
@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
  .site-header, .tab-bar, .cat-card__body, .cat-card__women, .cat-head__work, .hero__inner {
    background: rgba(255, 255, 255, .5); -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur);
  }
  .cookie-banner, .chat, .date-sheet { -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur); }
}
@media (prefers-reduced-transparency: reduce) {
  .site-header, .tab-bar, .cat-card__body, .cat-card__women, .cat-head__work, .hero__inner,
  .cookie-banner, .chat, .date-sheet { background: var(--card-2); -webkit-backdrop-filter: none; backdrop-filter: none; }
}

/* ---------- المحطة الثانية: الألبومات · «من شغلنا» · النوافذ · الفوتر ---------- */
.album-model__link { background: var(--glass-bg); border: 1px solid var(--glass-edge); box-shadow: var(--glass-sh); border-radius: var(--r-lg); }
.album-dialog, .date-sheet { background: var(--glass-solid); }
/* ورا النوافذ: الصفحة تتضبّب بلون الورد بدل السواد */
.date-sheet::backdrop, .album-dialog::backdrop { background: rgba(62, 43, 50, .42); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
/* صور «من شغلنا» والريلات: زوايا ناعمة بدل مربعات مقصوصة */
.work__grid { gap: 8px; }
.work__link { border-radius: var(--r-md); }
.reel__link { border-radius: var(--r-lg); }
.reel__play { background: rgba(255, 255, 255, .28); border: 1px solid rgba(255, 255, 255, .5); -webkit-backdrop-filter: var(--glass-blur); backdrop-filter: var(--glass-blur); }
.site-footer { background: var(--glass-bg); border-top: 1px solid var(--glass-edge); }
@media (prefers-reduced-transparency: reduce) {
  .date-sheet::backdrop, .album-dialog::backdrop { -webkit-backdrop-filter: none; backdrop-filter: none; }
  .album-dialog, .date-sheet { background: var(--card-2); }
}

/* ── css/motion.css ── */
/* الحركة — خفيفة وهادئة، وكلها تنطفي مع «تقليل الحركة» (base.css).
   الحالة الافتراضية «ظاهر»: الإخفاء الأولي بس لما JS يشتغل (initReveal يحط .reveal و --i للترتيب). */

/* ظهور متدرّج عند التمرير: البطاقات تطلع وحدة ورا الثانية */
html.js .reveal:not(.is-in) { opacity: 0; transform: translateY(28px) scale(.97); }
html.js .reveal {
  transition: opacity .55s var(--ease-out), transform .7s var(--ease-spring);
  transition-delay: calc(var(--i, 0) * 90ms);
}

/* رفعة عند المرور بالماوس (الحاسبة بس — باللمس ما تفيد) */
@media (hover: hover) {
  .pkg, .addon, .album-card, .hall-addon, .cat-card {
    transition: transform var(--dur-2) var(--ease-out), box-shadow var(--dur-2) var(--ease-out), border-color var(--dur-2);
  }
  .pkg:hover { transform: translateY(-6px); box-shadow: var(--sh-float); }
  .pkg--rec:hover { box-shadow: var(--sh-glow), var(--sh-float); }
  .addon:hover, .album-card:hover, .hall-addon:hover { transform: translateY(-3px); box-shadow: var(--sh-float); }
  .item__ico { transition: transform var(--dur-2) var(--ease-spring); }
  .pkg:hover .item__ico { transform: scale(1.08) rotate(-5deg); }
  .btn--wa:hover .i { animation: nudge .5s var(--ease-out); }
}
/* ضغطة باللمس: البطاقة تنضغط شوية */
.pkg:active { transform: scale(.995); }

/* الباقة المنصوح بيها: لمعة تمر على السعر كل كم ثانية + نبضة خفيفة للشارة */
.pkg--rec .pkg__price { position: relative; overflow: hidden; }
.pkg--rec .pkg__price::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(110deg, transparent 30%, rgba(255, 255, 255, .6) 50%, transparent 70%);
  transform: translateX(110%); animation: shine 5s var(--ease-out) 1.5s infinite;
}
.pkg--rec .badge--rec { animation: pulse 2.8s ease-in-out infinite; }

/* البنود اللي تنفتح بـ«شوف كل التفاصيل» تنزل بنعومة */
html.js .pkg--collapsible:not(.is-collapsed) .item:nth-child(n+4) { animation: rise .4s var(--ease-out) both; }

/* أرقام خطوات الحجز تنطّ لما تظهر */
html.js .steps__list li.is-in::before { animation: pop .5s var(--ease-spring) both; animation-delay: calc(var(--i, 0) * 90ms + .2s); }

@keyframes shine { 0% { transform: translateX(110%); } 35%, 100% { transform: translateX(-110%); } }
@keyframes pulse { 0%, 100% { box-shadow: 0 0 0 0 var(--accent-24); } 50% { box-shadow: 0 0 0 6px transparent; } }
@keyframes rise { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: none; } }
@keyframes pop { from { transform: scale(.4); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes nudge { 0%, 100% { transform: none; } 30% { transform: rotate(-12deg) scale(1.1); } 60% { transform: rotate(8deg); } }
