/* ==========================================================================
   مصنع الفراعنة للبليسيه والكلوش  |  Pharaohs Pleating & Cloche Factory
   ملف التصميم الرئيسي - الأقسام مرتبة بنفس ترتيب الصفحة
   --------------------------------------------------------------------------
   1. المتغيرات (الألوان والخطوط)   2. أساسيات      3. أزرار وعناصر مشتركة
   4. الهيدر                        5. الهيرو       6. الخدمات
   7. قبل وبعد                      8. معرض الأعمال 9. المميزات
   10. المصنع                       11. الأسئلة     12. التواصل
   13. الفوتر                       14. زر واتساب العائم   15. العارض (Lightbox)
   16. شاشات كبيرة                  17. تقليل الحركة
   ========================================================================== */

/* 1. المتغيرات ------------------------------------------------------------ */
:root {
  /* ألوان من هوية اللوجو: كحلي + ذهبي */
  --navy-950: #071733;
  --navy-900: #0a1f44;
  --navy-800: #102b5c;
  --blue:     #14377b;
  --gold:     #c9a24b;
  --gold-soft:#e6cd8a;
  --gold-deep:#80611a;      /* ذهبي غامق للنصوص على خلفية فاتحة */
  --paper:    #f4f6fa;
  --paper-2:  #e8edf6;
  --white:    #ffffff;
  --ink:      #101827;
  --muted:    #4a566c;
  --line:     #d5dcea;
  --wa:       #25d366;
  --wa-deep:  #0f7a43;

  /* الخطوط (بتتغير في صفحة الإنجليزي من أسفل) */
  --font-brand: "Aref Ruqaa", "Reem Kufi", "Noto Naskh Arabic", serif;   /* خط الرقعة - اسم المصنع والعناوين */
  --font-tag:   "Reem Kufi", "Cairo", sans-serif;                        /* خط الشعار */
  --font-body:  "IBM Plex Sans Arabic", "Segoe UI", Tahoma, system-ui, sans-serif;

  --radius: 14px;
  --wrap: 1120px;
  --gap: clamp(0.6rem, 2.4vw, 1.1rem);
  --section-y: clamp(3rem, 8vw, 5.5rem);
}

html[lang="en"] {
  --font-brand: "Cinzel", "Times New Roman", serif;
  --font-tag:   "Cormorant Garamond", Georgia, serif;
  --font-body:  "IBM Plex Sans", "Segoe UI", system-ui, sans-serif;
}

/* 2. أساسيات -------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; scroll-padding-top: 4.5rem; }
body {
  margin: 0;
  font-family: var(--font-body);
  font-size: 1rem;
  line-height: 1.75;
  color: var(--ink);
  background: var(--paper);
  -webkit-font-smoothing: antialiased;
}
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
h1, h2, h3, p, ul, ol, figure { margin: 0; }
ul, ol { padding: 0; list-style: none; }
button { font: inherit; color: inherit; cursor: pointer; }
:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; border-radius: 6px; }

.wrap { width: min(100% - 2rem, var(--wrap)); margin-inline: auto; }
.section { padding-block: var(--section-y); }
.section--tint { background: var(--paper-2); }
.visually-hidden {
  position: absolute !important; width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap;
}
.skip-link {
  position: absolute; inset-inline-start: 1rem; top: -4rem; z-index: 100;
  background: var(--gold); color: var(--navy-950); padding: .5rem 1rem; border-radius: 8px; font-weight: 600;
}
.skip-link:focus { top: .75rem; }

/* أيقونات SVG (من الـ sprite داخل index.html) */
.i { width: 1.25em; height: 1.25em; flex: none; fill: none; stroke: currentColor;
     stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.i--fill { fill: currentColor; stroke: none; }

/* عنوان القسم: اسم بخط الرقعة + شكل بليسيه صغير تحته */
.section-head { text-align: center; margin-bottom: clamp(1.5rem, 4vw, 2.5rem); }
.section-head h2 {
  font-family: var(--font-brand);
  font-weight: 700;
  font-size: clamp(1.9rem, 5.2vw, 2.9rem);
  line-height: 1.35;
  color: var(--navy-900);
}
.section-head p { margin: .35rem auto 0; max-width: 34rem; color: var(--muted); }
.section-head::after {            /* خط البليسيه */
  content: ""; display: block; height: 10px; width: 96px; margin: .8rem auto 0;
  background: var(--gold);
  -webkit-mask: var(--pleat-mask) repeat-x center / 16px 10px;
          mask: var(--pleat-mask) repeat-x center / 16px 10px;
}
:root {
  /* شكل الزجزاج (بليسيه) - بيتستخدم كقناع (mask) فبياخد اللون من background */
  --pleat-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='10' viewBox='0 0 16 10'%3E%3Cpath d='M0 10 L8 1 L16 10 L14.4 10 L8 3.4 L1.6 10Z'/%3E%3C/svg%3E");
  --pleat-edge: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='14' viewBox='0 0 28 14'%3E%3Cpath d='M0 14 L14 0 L28 14Z'/%3E%3C/svg%3E");
}

/* 3. أزرار --------------------------------------------------------------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .55rem;
  min-height: 3.1rem; padding: .55rem 1.5rem; border-radius: 999px;
  font-weight: 600; font-size: 1.02rem; text-decoration: none; border: 2px solid transparent;
  transition: background-color .2s, color .2s, border-color .2s, transform .15s;
}
.btn:active { transform: translateY(1px); }
.btn--wa    { background: var(--wa-deep); color: #fff; }
.btn--wa:hover { background: #0b6537; }
.btn--ghost { border-color: var(--gold); color: var(--gold-soft); }
.btn--ghost:hover { background: var(--gold); color: var(--navy-950); }
.btn--navy  { background: var(--navy-900); color: #fff; }
.btn--navy:hover { background: var(--blue); }
.btn--line  { border-color: var(--navy-900); color: var(--navy-900); }
.btn--line:hover { background: var(--navy-900); color: #fff; }

/* 4. الهيدر -------------------------------------------------------------- */
.topbar { position: sticky; top: 0; z-index: 50; background: var(--navy-950); color: #fff;
          border-bottom: 1px solid rgba(201,162,75,.35); }
.topbar__in { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 3.5rem; }
.topbar__nav { display: none; gap: 1.5rem; font-size: .95rem; }
.topbar__nav a { text-decoration: none; color: #d6deef; padding: .25rem 0; border-bottom: 2px solid transparent; }
.topbar__nav a:hover { color: #fff; border-color: var(--gold); }
.topbar__actions { display: flex; align-items: center; gap: .6rem; margin-inline-start: auto; }
.lang-btn {
  display: inline-flex; align-items: center; gap: .4rem; min-height: 2.4rem; padding: .2rem .9rem;
  border: 1.5px solid var(--gold); border-radius: 999px; color: var(--gold-soft);
  text-decoration: none; font-weight: 600; font-size: .95rem; letter-spacing: .02em;
}
.lang-btn:hover { background: var(--gold); color: var(--navy-950); }
.call-btn {
  display: inline-flex; align-items: center; gap: .4rem; min-height: 2.4rem; padding: .2rem 1rem;
  background: var(--gold); color: var(--navy-950); border-radius: 999px; text-decoration: none; font-weight: 700; font-size: .95rem;
}
.call-btn:hover { background: var(--gold-soft); }

/* 5. الهيرو -------------------------------------------------------------- */
.hero {
  --fan-y: 7.5rem;                       /* ارتفاع مركز اللوجو (منه بتطلع خطوط البليسيه) */
  position: relative; isolation: isolate; overflow: hidden;
  background: radial-gradient(120% 90% at 50% 0%, var(--navy-800) 0%, var(--navy-900) 45%, var(--navy-950) 100%);
  color: #fff; text-align: center;
  padding: 2.25rem 0 clamp(6rem, 11vw, 7.5rem);
}
/* مروحة البليسيه: خطوط ذهبية رفيعة بتطلع من اللوجو زي قطعة كلوش مفرودة */
.hero::before {
  content: ""; position: absolute; inset: 0; z-index: -1;
  background: repeating-conic-gradient(from 0deg at 50% var(--fan-y),
      rgba(230,205,138,.30) 0 .35deg, rgba(255,255,255,.055) .35deg 3deg, rgba(0,0,0,.10) 3deg 6deg);
  -webkit-mask-image: radial-gradient(ellipse 95% 80% at 50% var(--fan-y), #000 0%, rgba(0,0,0,.55) 40%, transparent 78%);
          mask-image: radial-gradient(ellipse 95% 80% at 50% var(--fan-y), #000 0%, rgba(0,0,0,.55) 40%, transparent 78%);
  animation: fan-open 1.6s cubic-bezier(.2,.7,.2,1) both;
}
.hero::after {                           /* حافة زجزاج في آخر الهيرو */
  content: ""; position: absolute; inset-inline: 0; bottom: -1px; height: 14px; z-index: 1;
  background: var(--paper);
  -webkit-mask: var(--pleat-edge) repeat-x center bottom / 28px 14px;
          mask: var(--pleat-edge) repeat-x center bottom / 28px 14px;
}
.hero__logo {
  width: clamp(104px, 28vw, 136px); aspect-ratio: 1; margin: 0 auto 1rem; border-radius: 50%;
  box-shadow: 0 0 0 3px rgba(201,162,75,.55), 0 14px 38px rgba(0,0,0,.45);
  animation: rise .8s .1s both;
}
.hero h1 {
  font-family: var(--font-brand); font-weight: 700;
  font-size: clamp(2.2rem, 8.4vw, 4.4rem); line-height: 1.3; color: #fff;
  text-shadow: 0 2px 18px rgba(0,0,0,.45);
  animation: rise .8s .25s both;
}
html[lang="en"] .hero h1 { font-size: clamp(1.7rem, 6.4vw, 3.2rem); letter-spacing: .04em; line-height: 1.25; }
.hero__tag {
  margin-top: .35rem; font-family: var(--font-tag); font-weight: 500;
  font-size: clamp(1.05rem, 3.6vw, 1.6rem); color: var(--gold-soft);
  animation: rise .8s .4s both;
}
html[lang="en"] .hero__tag { font-size: clamp(1.25rem, 4.2vw, 1.9rem); font-style: italic; }
.hero__cta { display: flex; flex-wrap: wrap; justify-content: center; gap: .7rem; margin-top: 1.5rem; animation: rise .8s .55s both; }

/* الفيديو: مستطيل 16:9 بإطار ذهبي، بيتحمل بعد تحميل الصفحة عشان السرعة */
.video {
  position: relative; width: min(100%, 780px); margin: clamp(1.75rem, 5vw, 2.75rem) auto 0;
  aspect-ratio: 16 / 9; border-radius: var(--radius); overflow: hidden; background: #000;
  border: 2px solid rgba(201,162,75,.7); box-shadow: 0 18px 50px rgba(0,0,0,.5);
  animation: rise .8s .7s both;
}
.video img, .video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; object-fit: cover; }
.video__play {
  position: absolute; inset: 0; display: grid; place-items: center; width: 100%; border: 0; background: rgba(7,23,51,.25);
}
.video__play span {
  display: grid; place-items: center; width: 4.2rem; height: 4.2rem; border-radius: 50%;
  background: var(--gold); color: var(--navy-950); box-shadow: 0 6px 24px rgba(0,0,0,.45);
}
.video__play .i { width: 1.7rem; height: 1.7rem; fill: currentColor; stroke: none; margin-inline-start: .15rem; }

@keyframes rise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes fan-open { from { opacity: 0; transform: scale(.85); } to { opacity: 1; transform: none; } }

/* 6. الخدمات ------------------------------------------------------------- */
.services { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--gap); }
.service { padding: 1.1rem 1rem 1.2rem; background: var(--white); border-radius: var(--radius); border: 1px solid var(--line); border-top: 4px solid var(--gold); }
.service h3 { font-family: var(--font-brand); font-size: 1.55rem; line-height: 1.4; color: var(--navy-900); }
.service p { margin-top: .2rem; font-size: .95rem; color: var(--muted); line-height: 1.65; }
.about { max-width: 46rem; margin: 1.75rem auto 0; text-align: center; color: var(--muted); }

/* 7. قبل وبعد ------------------------------------------------------------ */
.ba { display: grid; gap: var(--gap); max-width: 900px; margin-inline: auto; }
.ba figure { background: var(--white); padding: .5rem; border-radius: var(--radius); border: 1px solid var(--line); box-shadow: 0 6px 22px rgba(16,24,39,.07); }
.ba img { width: 100%; border-radius: 9px; cursor: zoom-in; }

/* 8 + 10. المعارض (كل صورتين جنب بعض) ------------------------------------ */
.grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--gap); }
.grid figure { position: relative; overflow: hidden; border-radius: var(--radius); background: var(--paper-2); aspect-ratio: 4 / 5; }
.grid--square figure { aspect-ratio: 1; }
.grid figure.wide { grid-column: 1 / -1; aspect-ratio: 16 / 9; }
.grid img { width: 100%; height: 100%; object-fit: cover; cursor: zoom-in; transition: transform .45s ease; }
.grid figure:hover img { transform: scale(1.04); }
.group-title { font-family: var(--font-brand); font-size: clamp(1.4rem, 4vw, 1.9rem); color: var(--navy-900); margin: clamp(2.5rem, 6vw, 3.75rem) 0 1rem; text-align: center; }
.group-title:first-child { margin-top: 0; }

/* 9. المميزات ------------------------------------------------------------ */
.features { display: grid; gap: 0; }
.feature { display: flex; gap: 1rem; padding: 1.15rem .25rem; border-bottom: 1px solid var(--line); align-items: flex-start; }
.feature__ico { display: grid; place-items: center; flex: none; width: 3rem; height: 3rem; border-radius: 50%; background: var(--navy-900); color: var(--gold-soft); }
.feature__ico .i { width: 1.45rem; height: 1.45rem; }
.feature h3 { font-size: 1.12rem; font-weight: 700; line-height: 1.5; color: var(--navy-900); }
.feature p { margin-top: .1rem; color: var(--muted); font-size: .97rem; line-height: 1.65; }
.feature.is-key h3 { color: var(--gold-deep); font-size: 1.22rem; }

/* 11. الأسئلة + الخطوات --------------------------------------------------- */
.steps { display: grid; gap: var(--gap); counter-reset: step; margin-bottom: clamp(2rem, 6vw, 3.25rem); }
.step { position: relative; padding: 1rem 1rem 1rem 1rem; padding-inline-start: 4.1rem; background: var(--white); border-radius: var(--radius); border: 1px solid var(--line); counter-increment: step; }
.step::before { content: counter(step); position: absolute; inset-inline-start: 1rem; top: 50%; translate: 0 -50%; display: grid; place-items: center;
  width: 2.3rem; height: 2.3rem; border-radius: 50%; background: var(--gold); color: var(--navy-950); font-weight: 700; font-family: var(--font-body); }
.step strong { display: block; color: var(--navy-900); }
.step span { color: var(--muted); font-size: .96rem; }
.faq { max-width: 52rem; margin-inline: auto; display: grid; gap: .6rem; }
.faq details { background: var(--white); border: 1px solid var(--line); border-radius: 12px; }
.faq summary { cursor: pointer; padding: .9rem 1.1rem; font-weight: 600; color: var(--navy-900); list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; font-size: 1.5rem; line-height: 1; color: var(--gold-deep); transition: rotate .2s; }
.faq details[open] summary::after { rotate: 45deg; }
.faq details p { padding: 0 1.1rem 1rem; color: var(--muted); }

/* 12. التواصل ------------------------------------------------------------ */
.contact { position: relative; background: var(--navy-900); color: #fff; padding-block: var(--section-y); }
.contact::before { content: ""; position: absolute; inset-inline: 0; top: -1px; height: 14px; background: var(--paper-2);
  -webkit-mask: var(--pleat-edge) repeat-x center top / 28px 14px; mask: var(--pleat-edge) repeat-x center top / 28px 14px; transform: scaleY(-1); }
.contact .section-head h2 { color: #fff; }
.contact .section-head p { color: #c3cde2; }
.contact .section-head::after { background: var(--gold); }
.cover { max-width: 860px; margin: 0 auto clamp(1.5rem, 4vw, 2.25rem); border-radius: var(--radius); overflow: hidden; border: 2px solid rgba(201,162,75,.6); }
.phones { display: grid; gap: .7rem; max-width: 860px; margin-inline: auto; }
.phone { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .6rem 1rem; padding: .85rem 1rem; border-radius: var(--radius);
  background: rgba(255,255,255,.06); border: 1px solid rgba(201,162,75,.3); }
.phone.is-main { background: rgba(201,162,75,.14); border-color: var(--gold); }
.phone__who { display: grid; line-height: 1.5; }
.phone__who small { color: #b5c1da; font-size: .88rem; }
.phone__num { font-size: 1.3rem; font-weight: 700; letter-spacing: .03em; direction: ltr; unicode-bidi: isolate; text-align: start; color: #fff; text-decoration: none; }
.phone__act { display: flex; gap: .5rem; }
.icon-btn { display: inline-flex; align-items: center; gap: .4rem; min-height: 2.6rem; padding: .3rem 1rem; border-radius: 999px; text-decoration: none; font-weight: 600; font-size: .95rem; }
.icon-btn--call { background: var(--gold); color: var(--navy-950); }
.icon-btn--call:hover { background: var(--gold-soft); }
.icon-btn--wa { background: var(--wa-deep); color: #fff; }
.icon-btn--wa:hover { background: #0b6537; }
.place { max-width: 860px; margin: 1.5rem auto 0; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .8rem 1rem;
  padding: 1rem; border-radius: var(--radius); background: rgba(255,255,255,.06); border: 1px solid rgba(201,162,75,.3); }
.place address { font-style: normal; display: flex; gap: .6rem; align-items: center; }
.place address .i { color: var(--gold-soft); width: 1.6rem; height: 1.6rem; }
.place__btns { display: flex; flex-wrap: wrap; gap: .5rem; }
.social { display: flex; flex-wrap: wrap; justify-content: center; gap: .6rem; margin-top: 1.75rem; }
.social a { display: grid; place-items: center; width: 3rem; height: 3rem; border-radius: 50%; border: 1.5px solid rgba(201,162,75,.6); color: var(--gold-soft); transition: background-color .2s, color .2s; }
.social a:hover { background: var(--gold); color: var(--navy-950); }
.social .i { width: 1.35rem; height: 1.35rem; }
.mail { text-align: center; margin-top: 1rem; }
.mail a { color: var(--gold-soft); font-weight: 600; direction: ltr; unicode-bidi: isolate; word-break: break-all; }

/* 13. الفوتر -------------------------------------------------------------- */
.footer { background: var(--navy-950); color: #aebad3; text-align: center; padding: 1.75rem 0 7rem; font-size: .92rem; }
.footer img { margin: 0 auto .6rem; border-radius: 50%; }
.footer strong { color: #fff; font-family: var(--font-brand); font-size: 1.25rem; font-weight: 700; }
.footer p + p { margin-top: .2rem; }

/* 14. زر واتساب العائم (يمين/شمال الشاشة - على الشمال زي المطلوب) ------- */
.wa-float {
  position: fixed; left: 14px; bottom: 16px; z-index: 60;
  display: grid; place-items: center; width: 62px; height: 62px; border-radius: 16px;
  background: var(--wa); color: #fff; text-decoration: none;
  box-shadow: 0 8px 22px rgba(0,0,0,.35);
}
.wa-float .i { width: 36px; height: 36px; }
.wa-float::after {               /* نبضة خفيفة بتلفت النظر (transform/opacity بس = سريعة) */
  content: ""; position: absolute; inset: 0; border-radius: inherit; border: 2px solid var(--wa);
  animation: pulse 2.4s ease-out infinite; pointer-events: none;
}
@keyframes pulse { 0% { transform: scale(1); opacity: .8; } 70%, 100% { transform: scale(1.5); opacity: 0; } }

/* 15. عارض الصور (Lightbox) ----------------------------------------------- */
.lightbox { padding: 0; border: 0; background: transparent; max-width: 100vw; max-height: 100vh; width: 100%; height: 100%; }
.lightbox::backdrop { background: rgba(4,12,28,.92); }
.lightbox__in { display: grid; place-items: center; width: 100%; height: 100%; padding: 1rem; }
.lightbox img { max-width: 100%; max-height: 88vh; width: auto; border-radius: 10px; object-fit: contain; }
.lightbox__close { position: absolute; top: .8rem; inset-inline-end: .8rem; width: 2.8rem; height: 2.8rem; border-radius: 50%; border: 0; background: var(--gold); color: var(--navy-950); font-size: 1.6rem; line-height: 1; }

/* 16. شاشات أكبر ---------------------------------------------------------- */
@media (min-width: 720px) {
  .topbar__nav { display: flex; }
  .topbar__actions { margin-inline-start: 0; }
  .services { grid-template-columns: repeat(4, 1fr); }
  .grid--works { grid-template-columns: repeat(4, 1fr); }
  .grid--works figure.wide { aspect-ratio: 21 / 7; }
  .grid--factory { grid-template-columns: repeat(4, 1fr); }
  .grid--factory figure.wide { grid-column: span 2; aspect-ratio: 2 / 1; }
  .features { grid-template-columns: 1fr 1fr; column-gap: 3rem; }
  .steps { grid-template-columns: repeat(3, 1fr); }
  .phones { grid-template-columns: 1fr 1fr; }
  .phone.is-main { grid-column: 1 / -1; }
}
@media (min-width: 1000px) {
  .hero { --fan-y: 9rem; padding-top: 3rem; }
}

/* 17. تقليل الحركة --------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}

/* ==========================================================================
   إضافات: شريط العرض / سهم النزول / زر صوت الفيديو / بيانات المصنع / حقوق الموقع
   ========================================================================== */

/* شريط العرض: خط أحمر رفيع تحت الفيديو والكلام بيتحرك فيه */
.offer-strip {
  display: block; width: min(100%, 780px); margin: .7rem auto 0; overflow: hidden; direction: ltr;
  background: #d71f2b; color: #fff; border-radius: 8px; text-decoration: none;
  border: 1px solid rgba(255,255,255,.25); animation: rise .8s .85s both;
}
.offer-strip__track { display: flex; width: max-content; padding-block: .3rem; animation: marquee 22s linear infinite; }
.offer-strip__track span { display: inline-flex; align-items: center; white-space: nowrap; padding-inline: 1.6rem; font-size: .95rem; font-weight: 600; direction: rtl; }
html[lang="en"] .offer-strip__track span { direction: ltr; }
.offer-strip__track b { margin-inline: .35rem; padding: 0 .55rem; border-radius: 999px; background: #fff; color: #d71f2b; }
.offer-strip__dup { display: contents; font-style: normal; }
.offer-strip:hover .offer-strip__track { animation-play-state: paused; }
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .offer-strip__track { animation: none; } .offer-strip__dup { display: none; } .offer-strip { overflow-x: auto; } }

/* سهم "انزل تحت" في آخر الهيرو */
.scroll-hint {
  position: absolute; inset-inline: 0; bottom: 1.5rem; margin-inline: auto; width: 2.6rem; height: 2.6rem; z-index: 2;
  display: grid; place-items: center; border-radius: 50%; color: var(--gold-soft);
  border: 1.5px solid rgba(230,205,138,.7); animation: nudge 1.6s ease-in-out infinite;
}
.scroll-hint:hover { background: var(--gold); color: var(--navy-950); }
.scroll-hint .i { width: 1.5rem; height: 1.5rem; }
.scroll-hint.is-hidden { opacity: 0; pointer-events: none; transition: opacity .3s; }
@keyframes nudge { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(7px); } }

/* زر صوت الفيديو */
.video__sound {
  position: absolute; top: .6rem; inset-inline-start: .6rem; z-index: 3; min-height: 2.5rem; padding: .25rem 1rem;
  border: 0; border-radius: 999px; background: var(--gold); color: var(--navy-950); font-weight: 700; font-size: .95rem;
  box-shadow: 0 4px 16px rgba(0,0,0,.4);
}
.video__sound:hover { background: var(--gold-soft); }

/* بيانات المصنع (جدول معلومات واضح للبشر ولمحركات البحث والذكاء الاصطناعي) */
.facts { max-width: 52rem; margin: 0 auto; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.facts > div { display: grid; gap: .1rem 1.25rem; padding: .85rem 1.1rem; border-bottom: 1px solid var(--line); }
.facts > div:last-child { border-bottom: 0; }
.facts dt { font-weight: 700; color: var(--gold-deep); }
.facts dd { margin: 0; color: var(--ink); }
.facts a { color: var(--navy-900); font-weight: 600; direction: ltr; unicode-bidi: isolate; }
.facts__ph li { display: flex; flex-wrap: wrap; gap: .2rem .8rem; padding-block: .1rem; }
@media (min-width: 720px) { .facts > div { grid-template-columns: 11rem 1fr; } }

/* حقوق الموقع */
.footer .credit { margin-top: .6rem; padding-top: .6rem; border-top: 1px solid rgba(201,162,75,.25); color: var(--gold-soft); font-weight: 600; }

/* الرقم الرسمي: كلمة "رقم المصنع" جنب الرقم */
.phone.is-main .phone__who { display: flex; flex-wrap: wrap; align-items: center; gap: .3rem .8rem; }
.phone.is-main .phone__who > span { padding: .05rem .8rem; border-radius: 999px; background: var(--gold); color: var(--navy-950); font-weight: 700; font-size: .92rem; }