/* ============================================================
   OMA — Liquid Glass identity overlay
   Applies the new video-hero identity to all inner pages.
   Load AFTER oma2.css. Theme-aware (light/dark).
   ============================================================ */

:root {
  --radius: 12px;
  --glass-bg: rgba(251, 249, 244, 0.55);
  --glass-line: rgba(28, 24, 18, 0.14);
  --glass-inset: inset 0 1px 1px rgba(255, 255, 255, 0.5);
}
html[data-theme="dark"] {
  --glass-bg: rgba(0, 0, 0, 0.4);
  --glass-line: rgba(255, 255, 255, 0.18);
  --glass-inset: inset 0 1px 1px rgba(255, 255, 255, 0.1);
}

/* ---- floating liquid-glass topbar ---- */
.topbar {
  top: 16px;
  inset-inline: clamp(16px, 4vw, 56px);
  height: auto;
  padding: 9px 14px;
  background: var(--glass-bg);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border: 1px solid var(--glass-line);
  border-radius: 14px;
  box-shadow: var(--glass-inset);
  transition: background .5s var(--ease), border-color .5s var(--ease);
}
.topbar .brand img { height: 38px; }

/* ---- inline nav links in the topbar (all pages) ---- */
.bar-nav {
  display: flex;
  align-items: center;
  gap: clamp(12px, 1.6vw, 26px);
  white-space: nowrap;
  font-size: 14px;
  margin-inline: 16px;
  overflow: hidden;
}
.bar-nav a {
  color: inherit;
  text-decoration: none;
  display: inline-block;
  transition: color .2s ease, transform .2s ease;
}
.bar-nav a:hover { color: #F2843A; transform: scale(1.12); }
.bar-nav a.active { color: #F2843A; }
@media (max-width: 1180px) { .bar-nav { display: none; } }
.topbar { justify-content: space-between; }

/* overlay side info: align address + company name to the left like phone/email (Arabic) */
html[dir="rtl"] .overlay__side .ov-block h5,
html[dir="rtl"] .overlay__side .ov-block p,
html[dir="rtl"] .overlay__side .ov-block a { text-align: left; display: block; }

.icon-btn, .menu-trigger {
  background: transparent;
  border-color: var(--glass-line);
  border-radius: 10px;
}
.topbar.on-dark .icon-btn,
.topbar.on-dark .menu-trigger {
  background: transparent;
  border-color: rgba(255, 255, 255, 0.25);
  backdrop-filter: none;
}

/* ---- rounded, softened surfaces site-wide ---- */
.kpi, .chairman-portrait, .phero__bg img,
.panel__list li, .svc-card, .proj-card, .card,
.form-field input, .form-field textarea, .form-field select,
.acc-card, .partner-card, .org-card {
  border-radius: var(--radius);
}
.phero__bg, .chairman-portrait { overflow: hidden; border-radius: var(--radius); }

/* glass buttons keep the new hero language */
.btn--light {
  background: rgba(0, 0, 0, 0.4);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.2);
}

/* overlay menu — soften */
.overlay__close { border-radius: 10px; }

/* WhatsApp float — align with glass identity */
.wa-float { border-radius: 14px; }