:root {
  --hy-sand: #fbf8f3;
  --hy-paper: #fffdf9;
  --hy-ink: #1f2523;
  --hy-muted: #66706b;
  --hy-copper: #b5652f;
  --hy-line: #ddcdb9;
}

html,
body {
  width: 100%;
  min-width: 0;
  margin: 0;
  background: var(--hy-sand);
  overflow-x: hidden;
}

body {
  font-family: "IBM Plex Sans Arabic", sans-serif;
}

.about-hybrid-main {
  background: var(--hy-sand);
  color: var(--hy-ink);
  font-family: "IBM Plex Sans Arabic", sans-serif;
  line-height: 1.7;
}

.about-hybrid-main *,
.about-hybrid-main *::before,
.about-hybrid-main *::after { box-sizing: border-box; }

.hybrid-shell { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.hybrid-intro { padding: 24px 0 62px; }
.hybrid-breadcrumb { display: flex; gap: 8px; align-items: center; margin-bottom: 34px; color: var(--hy-muted); font-size: 13px; }
.hybrid-breadcrumb a { color: inherit; }
.hybrid-founder-grid { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(240px, .7fr); gap: 48px; align-items: center; }
.hybrid-founder-copy h1,
.hybrid-heading h2 { margin: 0; font-family: "Noto Kufi Arabic", sans-serif; line-height: 1.45; }
.hybrid-founder-copy h1 { font-size: clamp(34px, 4.2vw, 54px); }
.hybrid-founder-copy em,
.hybrid-heading em,
.hybrid-feature em { color: var(--hy-copper); font-style: normal; }
.hybrid-eyebrow { margin: 0 0 10px; color: var(--hy-copper); font-size: 13px; font-weight: 700; letter-spacing: .04em; }
.hybrid-story { max-width: 720px; margin-top: 18px; color: #48524e; font-size: 16px; }
.hybrid-story p { margin: 0 0 11px; }
.hybrid-founder-media { justify-self: center; }
.hybrid-founder-media img { display: block; width: min(300px, 100%); aspect-ratio: 1; object-fit: cover; border: 7px solid rgba(181, 101, 47, .12); border-radius: 50%; box-shadow: 0 14px 30px rgba(31, 37, 35, .1); }
.hybrid-beliefs { display: grid; gap: 7px; margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--hy-line); color: var(--hy-muted); }
.hybrid-beliefs strong { margin-bottom: 3px; color: var(--hy-ink); font: 600 18px "Noto Kufi Arabic"; }
.hybrid-beliefs span { position: relative; padding-inline-start: 20px; }
.hybrid-beliefs span::before { content: "✓"; position: absolute; inset-inline-start: 0; color: var(--hy-copper); font-weight: 700; }

.hybrid-numbers { padding: 28px 0; background: var(--hy-ink); color: #fff; }
.hybrid-numbers-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; }
.hybrid-numbers-grid > div { padding: 7px 12px; border-inline-start: 1px solid rgba(255, 255, 255, .2); text-align: center; }
.hybrid-numbers-grid > div:first-child { border-inline-start: 0; }
.hybrid-numbers strong { display: block; color: #e0b15d; font: 600 clamp(25px, 3vw, 38px)/1.3 "Noto Kufi Arabic"; }
.hybrid-numbers span { display: block; margin-top: 4px; color: #f4eee6; font-size: 12px; }

/* Desktop: expertise and credentials are two distinct, compact experiences. */
.hybrid-two-column { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 36px; align-items: start; padding: 58px 0 56px; }
.hybrid-column { min-width: 0; }
.expertise-track { min-width: 0; width: 100%; }
.expertise-track .hybrid-cards { width: 100%; }
@media (min-width: 1100px) {
  .hybrid-two-column { grid-template-columns: minmax(0, 1.28fr) minmax(0, .92fr); gap: 48px; }
}

.hybrid-heading { margin-bottom: 18px; }
.hybrid-heading h2 { font-size: clamp(25px, 3vw, 38px); }
.hybrid-column .hybrid-heading::before { content: ""; display: block; width: 58px; height: 3px; margin: 0 0 18px auto; border-radius: 999px; background: var(--hy-copper); }
.hybrid-cards { display: grid; gap: 0; }
.expertise-track .hybrid-cards article { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 12px; align-items: start; padding: 13px 0; border-bottom: 1px solid rgba(221, 205, 185, .68); }
.expertise-track .hybrid-cards article > span { grid-column: 1; grid-row: 1 / span 2; }
.expertise-track .hybrid-cards article > h3,
.expertise-track .hybrid-cards article > p { grid-column: 2; min-width: 0; }
.expertise-track .hybrid-cards article:last-child { border-bottom: 0; }
.expertise-track .hybrid-cards article > span { display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid var(--hy-copper); border-radius: 50%; color: var(--hy-copper); font-size: 17px; line-height: 1; transition: transform .2s ease, background-color .2s ease, color .2s ease; }
.expertise-track .hybrid-cards article:hover > span,
.expertise-track .hybrid-cards article:focus-within > span { transform: scale(1.08); background: var(--hy-copper); color: #fff; }
.hybrid-cards h3 { margin: 0 0 3px; color: var(--hy-ink); font: 600 16px/1.5 "Noto Kufi Arabic"; }
.hybrid-cards p { margin: 0; color: var(--hy-muted); font-size: 12px; line-height: 1.65; }

/* ==========================================================================
   Enhanced Brand-Integrated Radial Cluster View (with Pulse & Glow)
   ========================================================================== */
#credential-cluster {
  position: relative;
  display: block;
  width: min(100%, 620px);
  height: 480px;
  margin: 40px auto 0;
  isolation: isolate;
}
#credential-cluster::before {
  content: "معرفة معتمدة";
  position: absolute;
  inset: 50% auto auto 50%;
  z-index: 3;
  display: grid;
  place-items: center;
  width: 104px;
  height: 104px;
  transform: translate(-50%, -50%);
  border: 2px solid var(--hy-copper);
  border-radius: 50%;
  background: #eadcc8;
  color: var(--hy-ink);
  font: 700 13px/1.45 "Noto Kufi Arabic", sans-serif;
  text-align: center;
  box-shadow: 0 8px 24px rgba(181, 101, 47, .2);
}
#credential-cluster .cluster-node {
  position: absolute;
  inset: 50% auto auto 50%;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: var(--node-size) !important;
  height: var(--node-size) !important;
  min-width: 0;
  margin: 0;
  padding: clamp(6px, calc(var(--node-size) * .08), 14px);
  --bubble-title-size: clamp(9.5px, calc(var(--node-size) * .095), 11.5px);
  --bubble-description-size: clamp(7.5px, calc(var(--node-size) * .072), 9.5px);
  --bubble-text-width: calc(var(--node-size) - 22px);
  transform: translate(-50%, -50%) translate(var(--node-x), var(--node-y)) !important;
  border: 1px solid rgba(181, 101, 47, .32);
  border-radius: 50%;
  background: var(--node-bg, var(--hy-paper));
  box-shadow: 0 6px 16px rgba(31, 37, 35, .06);
  text-align: center;
  opacity: 1;
  animation: radial-cluster-in .5s cubic-bezier(.175, .885, .32, 1.275) var(--node-delay) both;
  transition: transform .25s cubic-bezier(.25, .8, .25, 1), box-shadow .25s ease, background-color .25s ease, border-color .25s ease;
}
#credential-cluster .cluster-node::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: -1;
  width: var(--node-line-length);
  height: 1px;
  transform-origin: 0 50%;
  transform: rotate(var(--node-angle)) translateX(calc(var(--node-size) / 2)) translateY(-50%);
  background: rgba(181, 101, 47, .25);
  pointer-events: none;
  transition: background-color .25s ease;
}
#credential-cluster .cluster-node > * { position: relative; z-index: 1; }
#credential-cluster .cluster-node:hover,
#credential-cluster .cluster-node:focus-visible {
  transform: translate(-50%, -50%) translate(var(--node-x), var(--node-y)) scale(1.08) !important;
  background: #ffffff;
  border-color: var(--hy-copper);
  box-shadow: 0 0 0 4px rgba(181, 101, 47, 0.15), 0 16px 32px rgba(181, 101, 47, 0.18);
  z-index: 4;
}
#credential-cluster .cluster-node:hover::after,
#credential-cluster .cluster-node:focus-visible::after { background: var(--hy-copper); }
#credential-cluster .cluster-node > span { margin-bottom: 3px; color: var(--hy-copper); font-size: 15px; line-height: 1; }
#credential-cluster .cluster-node h3,
#credential-cluster .cluster-node p {
  display: -webkit-box;
  overflow: hidden;
  margin: 0;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
}
#credential-cluster .cluster-node h3 {
  -webkit-line-clamp: 2;
  max-width: var(--bubble-text-width);
  color: var(--hy-ink);
  font: 600 var(--bubble-title-size)/1.35 "Noto Kufi Arabic", sans-serif;
}
#credential-cluster .cluster-node p {
  -webkit-line-clamp: 2;
  max-width: var(--bubble-text-width);
  margin-top: 4px;
  color: var(--hy-muted);
  font-size: var(--bubble-description-size);
  line-height: 1.35;
}
#credential-cluster .cluster-node[data-bubble-size="large"] { --node-bg: var(--hy-paper); }
#credential-cluster .cluster-node[data-bubble-size="medium"] { --node-bg: var(--hy-sand); }
#credential-cluster .cluster-node[data-bubble-size="small"] { --node-bg: #f5ede2; }
.cluster-node--1 { --node-size: 128px; --node-x: -20px; --node-y: -155px; --node-line-length: 41px; --node-angle: 83deg; --node-delay: 50ms; }
.cluster-node--2 { --node-size: 106px; --node-x: 175px; --node-y: -125px; --node-line-length: 111px; --node-angle: 145deg; --node-delay: 100ms; }
.cluster-node--3 { --node-size: 92px; --node-x: 190px; --node-y: 15px; --node-line-length: 97px; --node-angle: 184deg; --node-delay: 150ms; }
.cluster-node--4 { --node-size: 106px; --node-x: 166px; --node-y: 140px; --node-line-length: 113px; --node-angle: -140deg; --node-delay: 200ms; }
.cluster-node--5 { --node-size: 128px; --node-x: -26px; --node-y: 164px; --node-line-length: 51px; --node-angle: -81deg; --node-delay: 250ms; }
.cluster-node--6 { --node-size: 92px; --node-x: -170px; --node-y: 120px; --node-line-length: 114px; --node-angle: -35deg; --node-delay: 300ms; }
.cluster-node--7 { --node-size: 92px; --node-x: -196px; --node-y: -15px; --node-line-length: 103px; --node-angle: 4deg; --node-delay: 350ms; }
.cluster-node--8 { --node-size: 106px; --node-x: -155px; --node-y: -145px; --node-line-length: 108px; --node-angle: 43deg; --node-delay: 400ms; }
.credential-detail-list { display: none; }
@keyframes radial-cluster-in {
  from { opacity: 0; transform: translate(-50%, -50%) translate(var(--node-x), calc(var(--node-y) + 20px)) scale(.92) !important; }
  to { opacity: 1; transform: translate(-50%, -50%) translate(var(--node-x), var(--node-y)) scale(1) !important; }
}

/* Compact lower-page composition: publications and regional reach side by side. */
.about-lower-grid { width: min(1180px, calc(100% - 40px)); margin-inline: auto; display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(300px, .85fr); gap: 34px; align-items: start; padding: 42px 0 70px; }
.about-lower-grid > .hybrid-shell { width: auto; margin: 0; min-width: 0; }
.hybrid-publications-section, .hybrid-reach { padding: 0; }
.hybrid-publications-section { border: 0; }
.hybrid-publications-section .hybrid-heading, .hybrid-reach .hybrid-heading { margin-bottom: 16px; }
.hybrid-publications-list { display: grid; gap: 9px; margin-top: 18px; }
.hybrid-publication-row { display: grid; grid-template-columns: 82px minmax(0, 1fr); gap: 12px; align-items: center; min-width: 0; padding: 9px 11px; border: 1px solid var(--hy-line); border-radius: 10px; background: linear-gradient(145deg, #fffdf9, #f3eadf); box-shadow: 0 5px 14px rgba(40, 35, 28, .04); }
.hybrid-publication-row-media { width: 82px; height: 82px; display: grid; place-items: center; padding: 4px; border-radius: 8px; background: #f0e6d8; }
.hybrid-publication-row-media img { display: block; width: 100%; height: 100%; object-fit: contain; border-radius: 6px; }
.hybrid-publication-row-copy { min-width: 0; display: flex; flex-direction: column; align-items: flex-start; }
.hybrid-publication-kicker { margin: 0 0 2px; color: var(--hy-copper); font-size: 10px; font-weight: 700; }
.hybrid-publication-row-copy h3 { margin: 0; color: var(--hy-ink); font: 600 16px/1.45 "Noto Kufi Arabic"; }
.hybrid-publication-row-copy > p:not(.hybrid-publication-kicker) { margin: 4px 0 8px; color: var(--hy-muted); font-size: 12px; line-height: 1.6; }
.hybrid-publication-btn { display: inline-flex; align-items: center; justify-content: center; width: 108px; min-height: 32px; border: 1px solid var(--hy-copper); border-radius: 999px; background: var(--hy-copper); color: #fffaf3; text-decoration: none; font-size: 10px; font-weight: 700; line-height: 1.2; }
.hybrid-publication-btn.is-disabled { border-color: #d8cec1; background: #d8cec1; color: #776d63; cursor: not-allowed; }
.hybrid-country-line { margin: 0 0 18px; padding: 11px 14px; border-inline-start: 3px solid var(--hy-copper); background: #f1e8d9; font-size: 15px; }
.hybrid-organizations h3 { margin: 0 0 10px; font: 600 17px "Noto Kufi Arabic"; }
.hybrid-org-list { display: flex; flex-wrap: wrap; gap: 5px; }
.hybrid-org-list span { padding: 5px 8px; border: 1px solid var(--hy-line); border-radius: 6px; background: var(--hy-paper); color: #4e5752; font-size: 11px; }
.hybrid-closing { padding: 64px 0 82px; background: var(--hy-ink); color: #fff; text-align: center; }
.hybrid-closing p { max-width: 820px; margin: 0 auto; font: 600 clamp(23px, 3vw, 36px)/1.7 "Noto Kufi Arabic"; }
.hybrid-closing a { display: inline-flex; align-items: center; gap: 10px; margin-top: 24px; padding: 10px 18px; border-radius: 999px; background: #e0b15d; color: var(--hy-ink); font-weight: 700; text-decoration: none; }
.hybrid-closing a:focus-visible, .hybrid-cards article:focus-within { outline: 3px solid rgba(181, 101, 47, .3); outline-offset: 3px; }

@media (max-width: 767px) {
  .about-hybrid-main .hybrid-shell {
    width: 100%;
    padding-inline: 20px;
    box-sizing: border-box;
  }
  .hybrid-intro { padding: 16px 0 50px; }
  .hybrid-breadcrumb { margin-bottom: 24px; }
  .hybrid-founder-grid { grid-template-columns: 1fr; gap: 24px; }
  .hybrid-founder-media { grid-row: 1; }
  .hybrid-founder-media img { width: 190px; }
  .hybrid-founder-copy h1 { font-size: 36px; }
  .hybrid-story { font-size: 16px; }
  .hybrid-numbers { padding: 22px 0; }
  .hybrid-numbers-grid { grid-template-columns: repeat(2, 1fr); }
  .hybrid-numbers-grid > div { border-inline-start: 0; border-bottom: 1px solid rgba(255, 255, 255, .18); padding: 12px 5px; }
  .hybrid-numbers-grid > div:last-child { grid-column: 1 / -1; border-bottom: 0; }
  .hybrid-numbers strong { font-size: 27px; }
  .hybrid-two-column { display: block; padding: 52px 0 62px; }
  .expertise-track, .expertise-track .hybrid-cards { width: 100%; }
  .expertise-track .hybrid-cards article { width: 100%; }
  .credentials-orbit { margin-top: 54px; }
  .about-lower-grid {
    width: 100%;
    display: block;
    padding: 36px 20px 60px;
    box-sizing: border-box;
  }
  .about-lower-grid .hybrid-reach { margin-top: 42px; padding-top: 38px; border-top: 1px solid var(--hy-line); }
  .hybrid-publication-row { grid-template-columns: 82px minmax(0, 1fr); gap: 10px; padding: 9px; }
  .hybrid-publication-row-media { width: 82px; height: 82px; }
  .hybrid-publication-row-copy h3 { font-size: 15px; }
  .hybrid-publication-row-copy > p:not(.hybrid-publication-kicker) { font-size: 11px; line-height: 1.55; }
  .hybrid-publication-btn { width: 104px; min-height: 31px; font-size: 10px; }
  .hybrid-closing { padding: 58px 0 76px; }
  .hybrid-closing p { font-size: 25px; }

  /* Mobile fallback list: the radial canvas is intentionally replaced by readable details. */
  #credential-cluster { display: none; }
  .credential-detail-list {
    display: grid;
    gap: 10px;
    margin: 24px 0 0;
    padding: 0;
    list-style: none;
  }
  .credential-detail-list li {
    position: relative;
    padding: 14px 16px;
    padding-inline-start: 36px;
    border: 1px solid var(--hy-line);
    border-radius: 12px;
    background: #fffdf9;
    box-shadow: 0 4px 10px rgba(31, 37, 35, .02);
  }
  .credential-detail-list li::before {
    content: "✦";
    position: absolute;
    inset-inline-start: 14px;
    top: 14px;
    color: var(--hy-copper);
    font-size: 14px;
    line-height: 1;
  }
  .credential-detail-list strong {
    display: block;
    color: var(--hy-ink);
    font: 600 14px/1.4 "Noto Kufi Arabic", sans-serif;
    margin-bottom: 4px;
  }
  .credential-detail-list span {
    display: block;
    color: var(--hy-muted);
    font-size: 12px;
    line-height: 1.5;
  }
}