:root {
  --radius: 0.5rem;

  /* Brand — Industrial Prestige (نفس ألوان المصدر الأصلي بالحرف) */
  --brand-navy: oklch(0.24 0.055 253);
  --brand-navy-2: oklch(0.36 0.085 251);
  --brand-gold: oklch(0.68 0.16 143);
  --brand-slate: oklch(0.55 0.025 253);
  --brand-surface: oklch(0.985 0.004 250);

  --background: oklch(1 0 0);
  --foreground: var(--brand-navy);
  --card: oklch(1 0 0);
  --card-foreground: var(--brand-navy);
  --popover: oklch(1 0 0);
  --popover-foreground: var(--brand-navy);
  --primary: var(--brand-navy);
  --primary-foreground: oklch(0.99 0 0);
  --secondary: oklch(0.968 0.007 247.896);
  --secondary-foreground: var(--brand-navy);
  --muted: oklch(0.968 0.007 247.896);
  --muted-foreground: var(--brand-slate);
  --accent: var(--brand-gold);
  --accent-foreground: oklch(1 0 0);
  --destructive: oklch(0.577 0.245 27.325);
  --destructive-foreground: oklch(0.99 0 0);
  --border: oklch(0.19 0.04 265 / 0.08);
  --input: oklch(0.19 0.04 265 / 0.12);
  --ring: var(--brand-gold);
}

* {
  border-color: var(--border);
  box-sizing: border-box;
}
html {
  font-family: "Cairo", ui-sans-serif, system-ui, sans-serif;
  scroll-behavior: smooth;
}
body {
  background-color: var(--background);
  color: var(--foreground);
  font-feature-settings: "kern", "liga";
  -webkit-font-smoothing: antialiased;
  margin: 0;
}
img { max-width: 100%; display: block; }
button { font-family: inherit; cursor: pointer; }

/* ---------- Keyframes (نفس المصدر الأصلي بالحرف) ---------- */
@keyframes marquee {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}
/* تنسيق أساسي ثابت للشريط المتحرك لا يعتمد على تحميل Tailwind من الإنترنت،
   لضمان ظهوره صحيحاً من أول لحظة (بدون فراغات) بغض النظر عن سرعة الاتصال.
   سرعة الحركة الفعلية تُضبط ديناميكياً بالجافاسكريبت (main.js) بحيث تكون
   نفس السرعة بالبكسل/ثانية دائماً مهما اختلفت كمية المحتوى بين الأقسام،
   فلا يبان الشريط بطيئاً أو "فاضي" عند قلة العناصر. */
.animate-marquee {
  display: flex;
  align-items: center;
  white-space: nowrap;
  width: max-content;
  direction: ltr; /* أهم سطر: الصفحة كلها RTL، لكن حركة الشريط (translateX) مصممة بمنطق LTR،
                     وبدون هذا السطر يبدأ الشريط من نقطة محاذاة يمين (بسبب RTL) فتدفعه الحركة
                     بره حدود الشاشة تماماً في جزء من كل دورة — وهذا هو سبب ظهوره "فارغاً". */
  animation: marquee 26s linear infinite;
  will-change: transform;
}

@keyframes reveal-up {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: translateY(0); }
}
.reveal { opacity: 0; }
.reveal.is-visible { animation: reveal-up 0.7s cubic-bezier(.2,.7,.2,1) both; }

@keyframes float-slow {
  0%,100% { transform: translateY(0); }
  50%     { transform: translateY(-8px); }
}
.animate-float { animation: float-slow 3.5s ease-in-out infinite; }

/* ---------- Mobile menu hamburger animation ---------- */
.menu-bar-top.menu-open { transform: translateY(0.375rem) rotate(45deg); }
.menu-bar-mid.menu-open { opacity: 0; }
.menu-bar-bottom.menu-open { transform: translateY(-0.375rem) rotate(-45deg); }

/* ---------- Hero overlay (تدرّج اللون فوق صور Hero) — نفس ألوان المصدر الأصلي بالحرف،
   مكتوب كـCSS ثابت (وليس فئات Tailwind الديناميكية) حتى لا يتأثر بتأخر تحميل
   Tailwind من CDN ويبقى لون الخلفية مطابقاً دائماً بدون أي اختلاف. ---------- */
.egyco-hero-scrim {
  /* front-page.php: from-brand-navy/40 via-brand-navy/75 to-brand-navy */
  background-image: linear-gradient(
    to left,
    oklch(0.24 0.055 253 / 0.40) 0%,
    oklch(0.24 0.055 253 / 0.75) 50%,
    oklch(0.24 0.055 253 / 1) 100%
  );
}
.egyco-hero-scrim-soft {
  /* PageHero.tsx (باقي الصفحات): from-brand-navy/60 via-brand-navy/85 to-brand-navy */
  background-image: linear-gradient(
    to left,
    oklch(0.24 0.055 253 / 0.60) 0%,
    oklch(0.24 0.055 253 / 0.85) 50%,
    oklch(0.24 0.055 253 / 1) 100%
  );
}
.egyco-hero-grid {
  /* شبكة الخطوط الذهبية الخفيفة فوق كل صور Hero */
  background-image:
    linear-gradient(oklch(0.68 0.16 143) 1px, transparent 1px),
    linear-gradient(90deg, oklch(0.68 0.16 143) 1px, transparent 1px);
  background-size: 60px 60px;
}
.egyco-dot-grid {
  /* شبكة النقاط الزخرفية (قسم الدعوة لاتخاذ إجراء) */
  background-image: radial-gradient(oklch(0.68 0.16 143) 1px, transparent 1px);
  background-size: 22px 22px;
}
/* ---------- تنسيق نموذج Contact Form 7 ليطابق تصميم الموقع ---------- */
.wpcf7 form {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.wpcf7-form p {
  margin: 0;
}
.wpcf7-form label {
  display: block;
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--brand-navy);
  margin-bottom: 0.375rem;
}
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form input[type="number"],
.wpcf7-form input[type="url"],
.wpcf7-form select,
.wpcf7-form textarea {
  width: 80%;
  background-color: var(--brand-surface);
  border: 1px solid oklch(0.19 0.04 265 / 0.12);
  border-radius: 0.5rem;
  padding: 0.75rem 1rem;
  font-family: inherit;
  font-size: 0.95rem;
  color: var(--brand-navy);
  outline: none;
  transition: border-color .2s ease, background-color .2s ease;
  box-sizing: border-box;
}
.wpcf7-form input:focus,
.wpcf7-form select:focus,
.wpcf7-form textarea:focus {
  border-color: var(--brand-gold);
  background-color: #fff;
}
.wpcf7-form textarea { resize: vertical; min-height: 120px; }
.wpcf7-form input[type="submit"] {
  width: 80%;
  background-color: var(--brand-gold);
  color: #fff;
  border: none;
  border-radius: 9999px;
  padding: 1rem 1.5rem;
  font-family: inherit;
  font-weight: 900;
  font-size: 1.125rem;
  cursor: pointer;
  box-shadow: 0 10px 25px -5px oklch(0.68 0.16 143 / 0.25);
  transition: background-color .2s ease;
}
.wpcf7-form input[type="submit"]:hover { background-color: var(--brand-navy); }
.wpcf7-form input[type="submit"]:disabled { opacity: .6; cursor: not-allowed; }
.wpcf7-spinner { margin-inline-start: 0.5rem; }
.wpcf7-not-valid-tip {
  color: oklch(0.577 0.245 27.325);
  font-size: 0.8rem;
  margin-top: 0.25rem;
  display: block;
}
.wpcf7-form-control-wrap { display: block; }
.wpcf7-response-output {
  margin: 0 !important;
  padding: 1rem 1.25rem !important;
  border-radius: 0.75rem !important;
  font-size: 0.9rem;
  font-weight: 700;
  text-align: center;
}
.wpcf7-form.sent .wpcf7-response-output {
  border: 2px solid var(--brand-gold) !important;
  color: var(--brand-navy);
  background: oklch(0.68 0.16 143 / 0.08);
}
.wpcf7-form.invalid .wpcf7-response-output,
.wpcf7-form.unaccepted .wpcf7-response-output,
.wpcf7-form.payment-required .wpcf7-response-output {
  border: 2px solid oklch(0.577 0.245 27.325) !important;
  color: oklch(0.577 0.245 27.325);
  background: oklch(0.577 0.245 27.325 / 0.06);
}
.egyco-cf7-row { display: grid; gap: 1rem; }
@media (min-width: 640px) {
  .egyco-cf7-row { grid-template-columns: 1fr 1fr; }
}
/* WordPress core alignment helpers (لتجنب تعارض ووردبريس الافتراضي) */
.alignleft { float: left; margin-right: 1em; }
.alignright { float: right; margin-left: 1em; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.screen-reader-text { position: absolute !important; clip: rect(1px,1px,1px,1px); overflow: hidden; height: 1px; width: 1px; }