    :root {
      --bg-deep: #0A1628;
      --bg-base: #0F1E36;
      --bg-elevated: #16294A;
      --bg-soft: #1E3460;
      --blue-primary: #2563EB;
      --blue-bright: #3B82F6;
      --blue-glow: #60A5FA;
      --blue-soft: #93C5FD;
      --blue-mist: #DBEAFE;
      --text-primary: #F1F5F9;
      --text-muted: #94A3B8;
      --text-dim: #64748B;
      --border-subtle: rgba(96, 165, 250, 0.12);
      --border-glow: rgba(96, 165, 250, 0.25);
      --shadow-soft: 0 24px 80px rgba(2, 8, 23, 0.35);
      --shadow-glow: 0 20px 70px rgba(37, 99, 235, 0.24);
      --radius-large: 28px;
      --radius-medium: 16px;
      --radius-small: 12px;
      --nav-height: 76px;
      --max-width: 1200px;
      --font-sans: "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    }

    html[lang="ar"] {
      --font-sans: "Noto Sans Arabic", "Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    }

    * {
      box-sizing: border-box;
      letter-spacing: 0;
    }

    html {
      scroll-behavior: smooth;
      background: var(--bg-base);
    }

    body {
      margin: 0;
      color: var(--text-primary);
      font-family: var(--font-sans);
      background:
        radial-gradient(circle at 14% 8%, rgba(37, 99, 235, 0.20), transparent 32rem),
        radial-gradient(circle at 92% 20%, rgba(96, 165, 250, 0.13), transparent 28rem),
        linear-gradient(180deg, var(--bg-deep) 0%, var(--bg-base) 46%, #0B172A 100%);
      min-height: 100vh;
      overflow-x: hidden;
    }

    body.nav-open {
      overflow: hidden;
    }

    body::before {
      content: "";
      position: fixed;
      inset: 0;
      pointer-events: none;
      background-image:
        linear-gradient(rgba(96, 165, 250, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(96, 165, 250, 0.035) 1px, transparent 1px);
      background-size: 56px 56px;
      mask-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.75), transparent 72%);
      z-index: -2;
    }

    a {
      color: inherit;
      text-decoration: none;
    }

    button,
    input,
    textarea {
      font: inherit;
    }

    button {
      cursor: pointer;
    }

    :focus-visible {
      outline: 3px solid rgba(96, 165, 250, 0.85);
      outline-offset: 4px;
    }

    .skip-link {
      position: fixed;
      top: 16px;
      left: 16px;
      transform: translateY(-140%);
      z-index: 2000;
      padding: 12px 16px;
      border-radius: 999px;
      background: var(--blue-mist);
      color: var(--bg-deep);
      font-weight: 700;
      transition: transform 220ms ease;
    }

    .skip-link:focus {
      transform: translateY(0);
    }

    .container {
      width: min(100% - 48px, var(--max-width));
      margin: 0 auto;
    }

    .section {
      padding: 120px 0;
      position: relative;
      scroll-margin-top: calc(var(--nav-height) + 18px);
    }

    .section-header {
      max-width: 780px;
      margin-bottom: 44px;
    }

    .eyebrow {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 14px;
      color: var(--blue-soft);
      font-family: "JetBrains Mono", monospace;
      font-size: 13px;
      font-weight: 600;
      text-transform: uppercase;
    }

    .eyebrow::before {
      content: "";
      width: 9px;
      height: 9px;
      border-radius: 999px;
      background: linear-gradient(135deg, var(--blue-primary), var(--blue-glow));
      box-shadow: 0 0 24px rgba(96, 165, 250, 0.65);
    }

    h1,
    h2,
    h3,
    p {
      margin-top: 0;
    }

    h1,
    h2,
    h3 {
      font-weight: 800;
      line-height: 1.02;
    }

    h2 {
      margin-bottom: 18px;
      font-size: 46px;
    }

    h3 {
      font-size: 26px;
    }

    p {
      color: var(--text-muted);
      font-size: 16px;
      line-height: 1.72;
    }

    .lead {
      font-size: 18px;
      line-height: 1.7;
      color: #B7C6DD;
    }

    .gradient-text {
      color: transparent;
      background: linear-gradient(135deg, var(--blue-mist), var(--blue-glow), var(--blue-primary), var(--blue-mist));
      background-size: 220% 220%;
      -webkit-background-clip: text;
      background-clip: text;
      animation: textFlow 9s ease-in-out infinite;
    }

    @keyframes textFlow {
      0%, 100% { background-position: 0% 50%; }
      50% { background-position: 100% 50%; }
    }

    .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      min-height: 46px;
      padding: 0 20px;
      border: 1px solid transparent;
      border-radius: 999px;
      color: var(--text-primary);
      font-weight: 700;
      transition: transform 180ms ease, border-color 180ms ease, box-shadow 180ms ease, background 180ms ease;
      white-space: nowrap;
    }

    .btn:hover {
      transform: translateY(-2px) scale(1.02);
    }

    .btn-primary {
      background: linear-gradient(135deg, var(--blue-primary), var(--blue-glow));
      box-shadow: 0 16px 46px rgba(37, 99, 235, 0.28);
    }

    .btn-primary:hover {
      box-shadow: 0 20px 60px rgba(37, 99, 235, 0.38);
    }

    .btn-secondary {
      border-color: var(--border-glow);
      background: rgba(22, 41, 74, 0.62);
      backdrop-filter: blur(12px);
    }

    .btn-secondary:hover {
      border-color: rgba(147, 197, 253, 0.52);
      background: rgba(30, 52, 96, 0.78);
      box-shadow: 0 18px 54px rgba(96, 165, 250, 0.14);
    }

    .btn-small {
      min-height: 40px;
      padding: 0 16px;
      font-size: 14px;
    }

    .icon {
      width: 18px;
      height: 18px;
      flex: 0 0 auto;
    }

    .reveal {
      opacity: 0;
      transform: translateY(18px);
      transition: opacity 520ms ease, transform 520ms ease;
      transition-delay: var(--delay, 0ms);
    }

    .reveal.is-visible {
      opacity: 1;
      transform: translateY(0);
    }

    /* Header */
    .site-header {
      position: sticky;
      top: 0;
      z-index: 1000;
      border-bottom: 1px solid rgba(96, 165, 250, 0.10);
      background: rgba(10, 22, 40, 0.70);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
    }

    .nav-shell {
      display: flex;
      align-items: center;
      justify-content: space-between;
      width: min(100% - 48px, var(--max-width));
      height: var(--nav-height);
      margin: 0 auto;
    }

    .brand {
      display: inline-flex;
      align-items: center;
      gap: 12px;
      font-weight: 800;
      font-size: 20px;
    }

    .brand-mark {
      width: 34px;
      height: 34px;
      border: 1px solid rgba(147, 197, 253, 0.38);
      border-radius: 12px;
      background:
        radial-gradient(circle at 68% 26%, rgba(219, 234, 254, 0.86), transparent 16%),
        linear-gradient(135deg, rgba(37, 99, 235, 0.92), rgba(96, 165, 250, 0.52));
      box-shadow: 0 14px 38px rgba(37, 99, 235, 0.32);
    }

    .nav-links {
      display: flex;
      align-items: center;
      gap: 4px;
    }

    .nav-link {
      padding: 10px 12px;
      border-radius: 999px;
      color: var(--text-muted);
      font-size: 14px;
      font-weight: 600;
      transition: color 180ms ease, background 180ms ease;
    }

    .nav-link:hover,
    .nav-link.is-active {
      color: var(--text-primary);
      background: rgba(96, 165, 250, 0.10);
    }

    .nav-cta {
      margin-left: 10px;
    }

    .language-switcher {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      padding: 4px;
      border: 1px solid var(--border-subtle);
      border-radius: 999px;
      background: rgba(10, 22, 40, 0.42);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
    }

    .desktop-language {
      margin-left: auto;
    }

    .mobile-language {
      display: none;
    }

    .language-option {
      display: inline-grid;
      place-items: center;
      min-width: 42px;
      height: 32px;
      border: 0;
      border-radius: 999px;
      color: var(--text-muted);
      background: transparent;
      font-family: "JetBrains Mono", monospace;
      font-size: 12px;
      font-weight: 800;
      transition: color 180ms ease, background 180ms ease, box-shadow 180ms ease;
    }

    .language-option:hover,
    .language-option.is-active {
      color: var(--text-primary);
      background: rgba(37, 99, 235, 0.58);
      box-shadow: 0 8px 24px rgba(37, 99, 235, 0.20);
    }

    .menu-toggle,
    .mobile-close {
      display: none;
      align-items: center;
      justify-content: center;
      width: 42px;
      height: 42px;
      border: 1px solid var(--border-subtle);
      border-radius: 999px;
      color: var(--text-primary);
      background: rgba(22, 41, 74, 0.78);
    }

    .mobile-backdrop {
      position: fixed;
      inset: 0;
      z-index: 1100;
      pointer-events: none;
      background: rgba(2, 6, 23, 0.46);
      opacity: 0;
      transition: opacity 260ms ease;
    }

    .mobile-menu {
      position: fixed;
      top: 0;
      right: 0;
      z-index: 1200;
      display: flex;
      flex-direction: column;
      gap: 20px;
      width: min(360px, 86vw);
      height: 100vh;
      padding: 24px;
      border-left: 1px solid var(--border-glow);
      background: rgba(10, 22, 40, 0.96);
      backdrop-filter: blur(18px);
      box-shadow: -28px 0 90px rgba(2, 8, 23, 0.55);
      transform: translateX(100%);
      transition: transform 320ms ease;
    }

    .mobile-menu-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
    }

    .mobile-menu nav {
      display: grid;
      gap: 8px;
      margin-top: 10px;
    }

    .mobile-menu .nav-link {
      padding: 15px 14px;
      border: 1px solid rgba(96, 165, 250, 0.10);
      border-radius: 14px;
      background: rgba(22, 41, 74, 0.45);
      font-size: 16px;
    }

    body.nav-open .mobile-backdrop {
      pointer-events: auto;
      opacity: 1;
    }

    body.nav-open .mobile-menu {
      transform: translateX(0);
    }

    /* Hero */
    .hero {
      position: relative;
      display: flex;
      align-items: center;
      min-height: calc(100vh - var(--nav-height));
      overflow: hidden;
      padding: 86px 0 92px;
      scroll-margin-top: var(--nav-height);
    }

    .hero::before,
    .hero::after {
      content: "";
      position: absolute;
      pointer-events: none;
    }

    .hero::before {
      inset: -24%;
      background:
        radial-gradient(circle at 24% 28%, rgba(37, 99, 235, 0.46), transparent 24%),
        radial-gradient(circle at 68% 22%, rgba(96, 165, 250, 0.34), transparent 22%),
        radial-gradient(circle at 56% 82%, rgba(59, 130, 246, 0.20), transparent 26%),
        linear-gradient(135deg, rgba(10, 22, 40, 0.25), rgba(30, 52, 96, 0.20));
      filter: blur(8px);
      animation: meshDrift 18s ease-in-out infinite alternate;
      z-index: -4;
    }

    .hero::after {
      inset: 0;
      background-image: radial-gradient(rgba(147, 197, 253, 0.28) 1px, transparent 1px);
      background-size: 30px 30px;
      opacity: 0.18;
      mask-image: radial-gradient(circle at 50% 44%, black, transparent 70%);
      z-index: -3;
    }

    @keyframes meshDrift {
      from { transform: translate3d(-1.5%, -1%, 0) scale(1); }
      to { transform: translate3d(1.5%, 1%, 0) scale(1.04); }
    }

    .hero-cursor {
      position: absolute;
      inset: 0;
      pointer-events: none;
      background: radial-gradient(circle 280px at var(--mouse-x, 50%) var(--mouse-y, 46%), rgba(96, 165, 250, 0.20), transparent 72%);
      opacity: 0;
      transition: opacity 220ms ease;
      z-index: -1;
    }

    .hero:hover .hero-cursor {
      opacity: 1;
    }

    .hero-content {
      width: min(100% - 48px, var(--max-width));
      margin: 0 auto;
      position: relative;
      z-index: 2;
    }

    .hero-badge {
      display: inline-flex;
      align-items: center;
      gap: 10px;
      margin-bottom: 24px;
      padding: 10px 14px;
      border: 1px solid var(--border-glow);
      border-radius: 999px;
      color: var(--blue-soft);
      background: rgba(22, 41, 74, 0.48);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
      font-size: 14px;
      font-weight: 700;
    }

    .hero h1 {
      max-width: 960px;
      margin-bottom: 24px;
      font-size: 72px;
    }

    .hero .lead {
      max-width: 760px;
      margin-bottom: 34px;
      font-size: 20px;
    }

    .hero-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 14px;
    }

    .hero-proof {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 14px;
      max-width: 780px;
      margin-top: 50px;
    }

    .proof-pill {
      min-height: 82px;
      padding: 18px;
      border: 1px solid var(--border-subtle);
      border-radius: 18px;
      background: linear-gradient(180deg, rgba(22, 41, 74, 0.60), rgba(15, 30, 54, 0.34));
      backdrop-filter: blur(12px);
    }

    .proof-pill strong {
      display: block;
      margin-bottom: 4px;
      font-size: 15px;
    }

    .proof-pill span {
      color: var(--text-muted);
      font-size: 13px;
      line-height: 1.5;
    }

    .scroll-indicator {
      position: absolute;
      left: 50%;
      bottom: 26px;
      display: grid;
      place-items: center;
      width: 32px;
      height: 52px;
      border: 1px solid rgba(147, 197, 253, 0.38);
      border-radius: 999px;
      transform: translateX(-50%);
    }

    .scroll-indicator span {
      width: 5px;
      height: 9px;
      border-radius: 999px;
      background: var(--blue-soft);
      animation: bounceDot 900ms ease-in-out infinite;
    }

    @keyframes bounceDot {
      0%, 100% { transform: translateY(-8px); opacity: 0.55; }
      50% { transform: translateY(9px); opacity: 1; }
    }

    /* About */
    .about-grid {
      display: grid;
      grid-template-columns: minmax(0, 1.05fr) minmax(320px, 0.95fr);
      gap: 46px;
      align-items: start;
    }

    .about-copy p:last-child {
      margin-bottom: 0;
    }

    .stat-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 16px;
    }

    .stat-card,
    .service-card,
    .work-card,
    .group-entity,
    .contact-panel {
      border: 1px solid var(--border-subtle);
      background: linear-gradient(180deg, rgba(22, 41, 74, 0.86), rgba(15, 30, 54, 0.78));
      box-shadow: var(--shadow-soft);
    }

    .stat-card {
      min-height: 150px;
      padding: 24px;
      border-radius: 18px;
    }

    .stat-number {
      display: block;
      margin-bottom: 10px;
      color: var(--text-primary);
      font-size: 42px;
      font-weight: 800;
      line-height: 1;
    }

    .stat-card span:last-child {
      color: var(--text-muted);
      line-height: 1.55;
    }

    /* Companies */
    .companies-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 24px;
    }

    .company-card {
      position: relative;
      overflow: hidden;
      min-height: 470px;
      padding: 30px;
      border: 1px solid var(--border-subtle);
      border-radius: var(--radius-large);
      background:
        radial-gradient(circle at 16% 0%, rgba(96, 165, 250, 0.18), transparent 28%),
        linear-gradient(180deg, rgba(22, 41, 74, 0.92), rgba(10, 22, 40, 0.88));
      box-shadow: var(--shadow-soft);
      transition: transform 220ms ease, border-color 220ms ease, box-shadow 220ms ease;
    }

    .company-card:hover {
      transform: translateY(-4px);
      border-color: var(--border-glow);
      box-shadow: var(--shadow-glow);
    }

    .company-top {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 18px;
      margin-bottom: 34px;
    }

    .logo-placeholder {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-width: 150px;
      min-height: 58px;
      padding: 0 18px;
      border: 1px dashed rgba(147, 197, 253, 0.34);
      border-radius: 18px;
      color: var(--text-primary);
      background: rgba(15, 30, 54, 0.58);
      font-size: 20px;
      font-weight: 800;
    }

    .ownership-pill {
      display: inline-flex;
      align-items: center;
      min-height: 34px;
      padding: 0 12px;
      border: 1px solid rgba(96, 165, 250, 0.22);
      border-radius: 999px;
      color: var(--blue-soft);
      background: rgba(37, 99, 235, 0.10);
      font-size: 12px;
      font-weight: 800;
      text-align: center;
      white-space: nowrap;
    }

    .company-card h3 {
      margin-bottom: 8px;
      font-size: 30px;
    }

    .company-role {
      margin-bottom: 18px;
      color: var(--blue-soft);
      font-weight: 800;
    }

    .tech-list {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      margin: 28px 0 32px;
      padding: 0;
      list-style: none;
    }

    .tech-list li {
      padding: 9px 11px;
      border: 1px solid rgba(96, 165, 250, 0.16);
      border-radius: 999px;
      color: var(--blue-mist);
      background: rgba(10, 22, 40, 0.52);
      font-family: "JetBrains Mono", monospace;
      font-size: 12px;
      font-weight: 600;
    }

    .ownership-map {
      margin-top: 26px;
      padding: 28px;
      border: 1px solid var(--border-subtle);
      border-radius: 22px;
      background: linear-gradient(180deg, rgba(15, 30, 54, 0.74), rgba(10, 22, 40, 0.66));
    }

    .ownership-map h3 {
      margin-bottom: 22px;
      font-size: 22px;
    }

    .org-tree {
      display: grid;
      justify-items: center;
      gap: 18px;
    }

    .tree-node {
      display: inline-flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      min-width: 176px;
      min-height: 50px;
      padding: 12px 16px;
      border: 1px solid rgba(96, 165, 250, 0.22);
      border-radius: 16px;
      background: rgba(22, 41, 74, 0.74);
      color: var(--text-primary);
      font-weight: 800;
      text-align: center;
    }

    .tree-node small {
      display: block;
      margin-top: 3px;
      color: var(--text-muted);
      font-size: 12px;
      font-weight: 600;
    }

    .tree-parent {
      background: linear-gradient(135deg, rgba(37, 99, 235, 0.78), rgba(96, 165, 250, 0.38));
      box-shadow: 0 18px 48px rgba(37, 99, 235, 0.22);
    }

    .tree-branches {
      position: relative;
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 16px;
      width: 100%;
      padding-top: 28px;
    }

    .tree-branches::before {
      content: "";
      position: absolute;
      top: 0;
      left: 50%;
      width: 1px;
      height: 28px;
      background: rgba(96, 165, 250, 0.32);
    }

    .tree-branches::after {
      content: "";
      position: absolute;
      top: 28px;
      left: 16.5%;
      right: 16.5%;
      height: 1px;
      background: rgba(96, 165, 250, 0.32);
    }

    .tree-branches .tree-node {
      position: relative;
      width: 100%;
    }

    .tree-branches .tree-node::before {
      content: "";
      position: absolute;
      top: -28px;
      left: 50%;
      width: 1px;
      height: 28px;
      background: rgba(96, 165, 250, 0.32);
    }

    /* Services */
    .services-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 18px;
    }

    .service-card {
      min-height: 220px;
      padding: 26px;
      border-radius: var(--radius-medium);
      transition: transform 220ms ease, border-color 220ms ease, box-shadow 220ms ease;
    }

    .service-card:hover {
      transform: translateY(-4px);
      border-color: var(--border-glow);
      box-shadow: var(--shadow-glow);
    }

    .service-icon {
      display: grid;
      place-items: center;
      width: 48px;
      height: 48px;
      margin-bottom: 24px;
      border: 1px solid rgba(96, 165, 250, 0.20);
      border-radius: 14px;
      color: var(--blue-soft);
      background: rgba(37, 99, 235, 0.12);
      transition: color 220ms ease, background 220ms ease, transform 220ms ease;
    }

    .service-card:hover .service-icon {
      color: var(--blue-mist);
      background: rgba(37, 99, 235, 0.24);
      transform: scale(1.04);
    }

    .service-card h3 {
      margin-bottom: 10px;
      font-size: 22px;
    }

    .service-card p {
      margin-bottom: 0;
    }

    /* Work */
    .featured-work {
      display: grid;
      grid-template-columns: minmax(0, 1.4fr) minmax(280px, 0.6fr);
      gap: 30px;
      align-items: center;
      margin-bottom: 22px;
      padding: 34px;
      border: 1px solid var(--border-glow);
      border-radius: 24px;
      background:
        radial-gradient(circle at 85% 24%, rgba(96, 165, 250, 0.20), transparent 32%),
        linear-gradient(135deg, rgba(22, 41, 74, 0.96), rgba(10, 22, 40, 0.92));
      box-shadow: var(--shadow-soft);
    }

    .featured-badge {
      display: inline-flex;
      margin-bottom: 18px;
      padding: 8px 11px;
      border-radius: 999px;
      color: var(--blue-mist);
      background: rgba(37, 99, 235, 0.18);
      font-family: "JetBrains Mono", monospace;
      font-size: 12px;
      font-weight: 600;
    }

    .work-visual {
      position: relative;
      min-height: 230px;
      border: 1px solid rgba(147, 197, 253, 0.20);
      border-radius: 20px;
      background:
        linear-gradient(135deg, rgba(37, 99, 235, 0.20), rgba(96, 165, 250, 0.08)),
        radial-gradient(circle at 34% 26%, rgba(219, 234, 254, 0.15), transparent 26%),
        rgba(15, 30, 54, 0.64);
      overflow: hidden;
    }

    .work-visual::before,
    .work-visual::after {
      content: "";
      position: absolute;
      border: 1px solid rgba(147, 197, 253, 0.18);
      border-radius: 999px;
    }

    .work-visual::before {
      width: 220px;
      height: 220px;
      right: -58px;
      top: -48px;
    }

    .work-visual::after {
      width: 138px;
      height: 138px;
      left: 34px;
      bottom: -48px;
      background: rgba(96, 165, 250, 0.08);
    }

    .work-visual span {
      position: absolute;
      left: 24px;
      right: 24px;
      bottom: 24px;
      color: var(--blue-mist);
      font-size: 28px;
      font-weight: 800;
      line-height: 1.12;
    }

    .work-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 18px;
    }

    .work-card {
      min-height: 190px;
      padding: 24px;
      border-radius: var(--radius-medium);
      transition: transform 220ms ease, border-color 220ms ease, box-shadow 220ms ease;
    }

    .work-card:hover {
      transform: translateY(-4px);
      border-color: var(--border-glow);
      box-shadow: var(--shadow-glow);
    }

    .work-card h3 {
      margin-bottom: 10px;
      font-size: 21px;
    }

    .work-card p {
      margin-bottom: 0;
    }

    /* Group */
    .group-board {
      display: grid;
      grid-template-columns: 0.9fr 1.1fr;
      gap: 30px;
      align-items: stretch;
    }

    .group-summary {
      padding: 32px;
      border: 1px solid var(--border-glow);
      border-radius: 24px;
      background:
        radial-gradient(circle at 0% 0%, rgba(96, 165, 250, 0.16), transparent 34%),
        rgba(10, 22, 40, 0.62);
    }

    .group-summary h3 {
      margin-bottom: 16px;
      font-size: 28px;
    }

    .group-list {
      display: grid;
      gap: 14px;
    }

    .group-entity {
      display: grid;
      grid-template-columns: 54px 1fr;
      gap: 18px;
      align-items: center;
      min-height: 112px;
      padding: 20px;
      border-radius: 18px;
    }

    .entity-index {
      display: grid;
      place-items: center;
      width: 54px;
      height: 54px;
      border: 1px solid rgba(96, 165, 250, 0.20);
      border-radius: 16px;
      color: var(--blue-mist);
      background: rgba(37, 99, 235, 0.16);
      font-family: "JetBrains Mono", monospace;
      font-weight: 700;
    }

    .group-entity h3 {
      margin-bottom: 5px;
      font-size: 20px;
    }

    .group-entity p {
      margin-bottom: 0;
      line-height: 1.55;
    }

    /* Contact */
    .contact-grid {
      display: grid;
      grid-template-columns: minmax(0, 0.86fr) minmax(340px, 1.14fr);
      gap: 28px;
      align-items: start;
    }

    .contact-panel {
      padding: 30px;
      border-radius: 22px;
    }

    .contact-list {
      display: grid;
      gap: 16px;
      margin: 24px 0 26px;
      padding: 0;
      list-style: none;
    }

    .contact-list li {
      display: grid;
      grid-template-columns: 42px 1fr;
      gap: 14px;
      align-items: start;
      color: var(--text-muted);
      line-height: 1.5;
    }

    .contact-list .contact-icon {
      display: grid;
      place-items: center;
      width: 42px;
      height: 42px;
      border-radius: 14px;
      color: var(--blue-soft);
      background: rgba(37, 99, 235, 0.13);
    }

    .contact-list strong {
      display: block;
      margin-bottom: 2px;
      color: var(--text-primary);
    }

    .social-row {
      display: flex;
      gap: 10px;
    }

    .social-link {
      display: grid;
      place-items: center;
      width: 42px;
      height: 42px;
      border: 1px solid var(--border-subtle);
      border-radius: 999px;
      color: var(--blue-soft);
      background: rgba(10, 22, 40, 0.45);
      transition: transform 180ms ease, color 180ms ease, border-color 180ms ease, background 180ms ease;
    }

    .social-link:hover {
      transform: translateY(-2px);
      color: var(--blue-mist);
      border-color: var(--border-glow);
      background: rgba(37, 99, 235, 0.16);
    }

    .contact-form {
      display: grid;
      gap: 16px;
    }

    .field-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 16px;
    }

    .field {
      display: grid;
      gap: 8px;
    }

    label {
      color: var(--blue-mist);
      font-size: 14px;
      font-weight: 700;
    }

    input,
    textarea {
      width: 100%;
      border: 1px solid rgba(96, 165, 250, 0.16);
      border-radius: 14px;
      color: var(--text-primary);
      background: rgba(10, 22, 40, 0.52);
      transition: border-color 180ms ease, box-shadow 180ms ease, background 180ms ease;
    }

    input {
      height: 48px;
      padding: 0 14px;
    }

    textarea {
      min-height: 150px;
      resize: vertical;
      padding: 14px;
    }

    input::placeholder,
    textarea::placeholder {
      color: var(--text-dim);
    }

    input:focus,
    textarea:focus {
      border-color: rgba(96, 165, 250, 0.62);
      background: rgba(15, 30, 54, 0.72);
      box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.14);
      outline: none;
    }

    .toast {
      position: fixed;
      right: 24px;
      bottom: 24px;
      z-index: 1500;
      max-width: 360px;
      padding: 15px 18px;
      border: 1px solid var(--border-glow);
      border-radius: 16px;
      color: var(--text-primary);
      background: rgba(10, 22, 40, 0.94);
      box-shadow: var(--shadow-glow);
      opacity: 0;
      transform: translateY(14px);
      pointer-events: none;
      transition: opacity 220ms ease, transform 220ms ease;
    }

    .toast.is-visible {
      opacity: 1;
      transform: translateY(0);
    }

    /* Footer */
    .site-footer {
      border-top: 1px solid var(--border-subtle);
      background: rgba(10, 22, 40, 0.76);
    }

    .footer-main {
      display: grid;
      grid-template-columns: 1.3fr 0.7fr 0.8fr;
      gap: 34px;
      padding: 56px 0 40px;
    }

    .footer-main h3 {
      margin-bottom: 16px;
      font-size: 16px;
    }

    .footer-main p {
      max-width: 380px;
      margin: 14px 0 0;
      font-size: 14px;
    }

    .footer-links {
      display: grid;
      gap: 10px;
      padding: 0;
      margin: 0;
      list-style: none;
    }

    .footer-links a {
      color: var(--text-muted);
      font-size: 14px;
      transition: color 180ms ease;
    }

    .footer-links a:hover {
      color: var(--blue-soft);
    }

    .footer-bottom {
      padding: 18px 0 28px;
      border-top: 1px solid rgba(96, 165, 250, 0.10);
      color: var(--text-dim);
      font-size: 13px;
      line-height: 1.6;
    }

    html[dir="rtl"] body {
      text-align: right;
    }

    html[dir="rtl"] .desktop-language {
      margin-right: auto;
      margin-left: 0;
    }

    html[dir="rtl"] .nav-cta {
      margin-right: 10px;
      margin-left: 0;
    }

    html[dir="rtl"] .toast {
      right: auto;
      left: 24px;
    }

    html[lang="ar"] h1,
    html[lang="ar"] h2,
    html[lang="ar"] h3 {
      line-height: 1.16;
    }

    @media (max-width: 960px) {
      .desktop-nav,
      .desktop-cta,
      .desktop-language { display: none; }
      .menu-toggle,
      .mobile-close { display: inline-flex; }
      .mobile-language {
        display: inline-flex;
        width: 100%;
        justify-content: center;
      }
    }

    @media (max-width: 1024px) {
      h2 { font-size: 38px; }
      .hero h1 { font-size: 58px; }
      .services-grid,
      .work-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .about-grid,
      .group-board,
      .featured-work { grid-template-columns: 1fr; }
      .group-summary { min-height: auto; }
    }

    @media (max-width: 768px) {
      :root { --nav-height: 68px; }
      .container,
      .nav-shell,
      .hero-content { width: min(100% - 32px, var(--max-width)); }
      .section { padding: 64px 0; }
      .desktop-nav,
      .desktop-cta,
      .desktop-language { display: none; }
      .menu-toggle,
      .mobile-close { display: inline-flex; }
      .mobile-language {
        display: inline-flex;
        width: 100%;
        justify-content: center;
      }
      .hero {
        min-height: calc(100vh - var(--nav-height));
        padding: 64px 0 82px;
      }
      .hero h1 { font-size: 44px; }
      .hero .lead { font-size: 17px; }
      .hero-actions,
      .hero-actions .btn { width: 100%; }
      .hero-proof,
      .companies-grid,
      .services-grid,
      .work-grid,
      .stat-grid,
      .field-grid,
      .contact-grid,
      .footer-main { grid-template-columns: 1fr; }
      h2 { font-size: 32px; }
      h3 { font-size: 23px; }
      .company-card { min-height: auto; padding: 24px; border-radius: 24px; }
      .company-top { flex-direction: column; }
      .ownership-pill { white-space: normal; }
      .tree-branches {
        grid-template-columns: 1fr;
        padding-top: 16px;
      }
      .tree-branches::before,
      .tree-branches::after,
      .tree-branches .tree-node::before { display: none; }
      .featured-work { padding: 24px; }
      .work-visual { min-height: 190px; }
      .contact-grid { gap: 18px; }
      .footer-main { padding-top: 42px; }
      .toast {
        right: 16px;
        left: 16px;
        max-width: none;
      }
    }

    @media (prefers-reduced-motion: reduce) {
      *, *::before, *::after {
        animation-duration: 1ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 1ms !important;
      }
    }