/* ============================================================
   Amr Nais — Personal Brand Site
   Design system derived from amrnais.com brand assets
   ============================================================ */

:root{
  /* Brand palette */
  --ink:#04161f;
  --navy-1:#06243a;
  --navy-2:#0a3354;
  --navy-3:#0e4673;
  --accent:#1d96c6;        /* tweakable */
  --accent-deep:#1d80b6;
  --accent-2:#27cfc3;
  --steel:#5d8fc2;
  --gold:#c9a24b;

  --paper:#eef4f8;
  --paper-soft:#f6fafc;
  --royal-tint:#d7e3f7;    /* deeper royal-blue section band */
  --card:#ffffff;
  --text:#0d2230;
  --text-soft:#46647a;
  --text-faint:#7e95a6;
  --line:rgba(13,40,64,.10);
  --line-strong:rgba(13,40,64,.16);

  --hero-from:#013a6b;
  --hero-to:#00214a;

  /* lighter card gradient (white text stays readable) */
  --card-from:#1d6aa6;
  --card-to:#0c3f6e;

  /* type */
  --font:"Plus Jakarta Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --font-ar:"Cairo",var(--font);

  --maxw:1240px;
  --pad:clamp(20px,5vw,72px);
  --r-lg:26px;
  --r-md:18px;
  --r-sm:12px;
  --shadow-sm:0 2px 10px rgba(8,30,48,.06);
  --shadow-md:0 18px 50px -22px rgba(8,30,48,.35);
  --shadow-lg:0 40px 90px -40px rgba(6,24,42,.55);

  --ease:cubic-bezier(.22,.61,.36,1);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:var(--font);
  color:var(--text);
  background:var(--paper-soft);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
body[dir="rtl"]{font-family:var(--font-ar)}
body[dir="rtl"] .hero__name,
body[dir="rtl"] h1,body[dir="rtl"] h2,body[dir="rtl"] h3{font-family:var(--font-ar)}

img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none}
::selection{background:var(--accent);color:#fff}

.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--pad)}

/* ---------- typographic helpers ---------- */
.eyebrow{
  display:inline-flex;align-items:center;gap:9px;
  font-size:12.5px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--accent-deep);
}
.eyebrow::before{content:"";width:26px;height:2px;background:var(--accent);border-radius:2px}
.eyebrow.on-dark{color:var(--accent-2)}
.eyebrow.on-dark::before{background:var(--accent-2)}
body[dir="rtl"] .eyebrow{letter-spacing:0}
/* Per-section icon replaces the plain dash before the eyebrow label */
.eyebrow[class*="eyebrow--"]::before{
  width:19px;height:19px;border-radius:0;background:var(--eic,var(--accent));
  -webkit-mask:var(--ico) center/contain no-repeat;mask:var(--ico) center/contain no-repeat;
}
.eyebrow.on-dark[class*="eyebrow--"]::before{background:var(--eic,var(--accent-2))}
/* per-section icon colors (from the 4-row icon reference) */
.eyebrow--bio{--eic:#5b649b}
.eyebrow--exp{--eic:#559495}
.eyebrow--partners{--eic:#1d80b6}
.eyebrow--star{--eic:#c5a159}
.eyebrow--pen{--eic:#8f93a7}
.eyebrow--cap{--eic:#7a8a7c}
.eyebrow--medal{--eic:#d4af38}
.eyebrow--crown{--eic:#718197}
.eyebrow--mic{--eic:#9a5673}
.eyebrow--laptop{--eic:#2f5fbf}
.eyebrow--book{--eic:#8a5a2b}
.eyebrow--bio{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 5a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V5zm5 3.5a2 2 0 1 0 0 4 2 2 0 0 0 0-4zM5.8 16.5h6.4c0-1.8-1.4-3-3.2-3s-3.2 1.2-3.2 3zM14 8h4v1.6h-4V8zm0 3.2h4v1.6h-4v-1.6zm0 3.2h4V16h-4v-1.6z'/%3E%3C/svg%3E")}
.eyebrow--exp{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 4h6a2 2 0 0 1 2 2v1h3a2 2 0 0 1 2 2v9a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V9a2 2 0 0 1 2-2h3V6a2 2 0 0 1 2-2zm0 3h6V6H9v1z'/%3E%3C/svg%3E")}
.eyebrow--partners{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l8 3v6c0 5-3.4 8.5-8 11-4.6-2.5-8-6-8-11V5l8-3zm-1.2 13.4 5-5-1.4-1.4-3.6 3.6-1.8-1.8-1.4 1.4 3.2 3.2z'/%3E%3C/svg%3E")}
.eyebrow--star{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l2.9 6.3 6.9.8-5.1 4.7 1.4 6.8L12 17.8 5.9 21.4l1.4-6.8L2.2 9.9l6.9-.8L12 2z'/%3E%3C/svg%3E")}
.eyebrow--pen{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 17.2V21h3.8L18 9.8 14.2 6 3 17.2zM20.7 7.3a1 1 0 0 0 0-1.4l-2.6-2.6a1 1 0 0 0-1.4 0l-1.8 1.8L18.9 9l1.8-1.7z'/%3E%3C/svg%3E")}
.eyebrow--cap{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3 1 9l11 6 9-4.9V17h2V9L12 3zM5 13.2V17c0 1.7 3.1 3 7 3s7-1.3 7-3v-3.8l-7 3.8-7-3.8z'/%3E%3C/svg%3E")}
.eyebrow--medal{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 1a8 8 0 0 0-3 15.4V23l3-2 3 2v-6.6A8 8 0 0 0 12 1zm0 3a5 5 0 1 1 0 10 5 5 0 0 1 0-10z'/%3E%3C/svg%3E")}
.eyebrow--crown{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 16h14l1.2-8-4.7 3L12 4 8.5 11 3.8 8 5 16zm-.5 2h15a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-15a.5.5 0 0 1-.5-.5v-1a.5.5 0 0 1 .5-.5z'/%3E%3C/svg%3E")}
.eyebrow--laptop{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 4h14a1 1 0 0 1 1 1v9H4V5a1 1 0 0 1 1-1zm7 2.5a2 2 0 1 0 0 4 2 2 0 0 0 0-4zM8.5 13h7c0-2-1.6-3-3.5-3s-3.5 1-3.5 3zM2 16h20l-1.5 3.5a1 1 0 0 1-.9.5H4.4a1 1 0 0 1-.9-.5L2 16z'/%3E%3C/svg%3E")}
.eyebrow--mic{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 14a3 3 0 0 0 3-3V6a3 3 0 1 0-6 0v5a3 3 0 0 0 3 3zm5-3a5 5 0 0 1-4 4.9V19h3v2H8v-2h3v-3.1A5 5 0 0 1 7 11h2a3 3 0 0 0 6 0h2z'/%3E%3C/svg%3E")}
.eyebrow--users{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9 12a4 4 0 1 0 0-8 4 4 0 0 0 0 8zm0 2c-3.3 0-7 1.7-7 5v1h14v-1c0-3.3-3.7-5-7-5zm8.8.1c1.9.7 3.2 2.2 3.2 4.9v1h-2.5v-1c0-1.9-.7-3.5-1.8-4.6l1.1-.3zM16 12a4 4 0 0 0 0-8c-.5 0-1 .1-1.4.3a6 6 0 0 1 0 7.4c.4.2.9.3 1.4.3z'/%3E%3C/svg%3E")}
.eyebrow--book{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 5h18v3H3V5zm1 5h16v3H4v-3zm-1 5h18v3H3v-3z'/%3E%3C/svg%3E")}
.eyebrow--chat{--ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 4h16a1 1 0 0 1 1 1v12a1 1 0 0 1-1 1H8l-4 4V5a1 1 0 0 1 1-1z'/%3E%3C/svg%3E")}

h2.section-title{
  font-size:clamp(30px,4.4vw,52px);
  font-weight:800;line-height:1.05;letter-spacing:-.02em;
  color:var(--text);text-wrap:balance;
}
.on-dark h2.section-title,section.dark h2.section-title{color:#fff}
.lead{font-size:clamp(16px,1.5vw,19px);color:var(--text-soft);max-width:60ch;text-wrap:pretty}
section.dark .lead{color:#a9c2d4}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:15px 28px;border-radius:100px;font-weight:700;font-size:15px;letter-spacing:.01em;
  transition:transform .35s var(--ease),box-shadow .35s var(--ease),background .3s,color .3s;
  white-space:nowrap;max-width:100%;
}
.btn svg{width:18px;height:18px}
.btn--primary{background:linear-gradient(135deg,var(--accent),var(--accent-deep));color:#fff;box-shadow:0 14px 30px -12px color-mix(in srgb,var(--accent) 70%,transparent)}
.btn--primary:hover{transform:translateY(-3px);box-shadow:0 22px 44px -14px color-mix(in srgb,var(--accent) 75%,transparent)}
.btn--ghost{background:transparent;color:var(--text);border:1.5px solid var(--line-strong)}
.btn--ghost:hover{border-color:var(--accent);color:var(--accent-deep);transform:translateY(-3px)}
.btn--light{background:#fff;color:var(--navy-1)}
.btn--light:hover{transform:translateY(-3px);box-shadow:var(--shadow-md)}
.btn--on-dark{background:rgba(255,255,255,.08);color:#fff;border:1.5px solid rgba(255,255,255,.22);backdrop-filter:blur(6px)}
.btn--on-dark:hover{background:rgba(255,255,255,.16);transform:translateY(-3px)}
.btn--text{padding:0;background:none;color:var(--accent-deep);font-weight:700;display:inline-flex;align-items:center;gap:8px}
.btn--text .arw{transition:transform .3s var(--ease)}
.btn--text:hover .arw{transform:translateX(5px)}
body[dir="rtl"] .btn--text:hover .arw{transform:translateX(-5px)}
body[dir="rtl"] .btn--text .arw{transform:scaleX(-1)}

/* ============================================================
   NAV
   ============================================================ */
.nav{
  position:fixed;inset:0 0 auto 0;z-index:80;
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding:18px var(--pad);
  transition:background .4s var(--ease),padding .4s var(--ease),box-shadow .4s,border-color .4s;
  border-bottom:1px solid transparent;
}
.nav.scrolled{
  background:rgba(255,255,255,.85);
  backdrop-filter:blur(16px) saturate(1.4);
  box-shadow:0 1px 0 var(--line);
  padding-block:12px;
}
.nav__brand{display:flex;align-items:center;gap:13px;flex-shrink:0}
.nav__brand img{width:38px;height:38px}
/* small signature quote under the hero portrait */
/* hero signature flourish (white ink on the dark hero) */
.hero__sign{display:block;height:clamp(38px,4.6vw,56px);width:auto;margin:4px 0 22px;opacity:.96;
  filter:drop-shadow(0 4px 14px rgba(0,0,0,.35))}

/* hero quote — big "badge" / hype callout floating over the portrait */
.hero__quote{
  position:relative;z-index:5;
  width:min(100%,420px);margin:0 auto;text-align:center;box-sizing:border-box;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  font-style:normal;font-weight:800;letter-spacing:-.012em;
  font-size:clamp(15px,1.7vw,19px);line-height:1.5;color:#fff;text-wrap:balance;
  padding:26px 26px 22px;border-radius:22px;
  background:linear-gradient(165deg,color-mix(in srgb,var(--accent) 26%,transparent),rgba(6,22,31,.62));
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.20);
  box-shadow:0 26px 64px -22px rgba(0,0,0,.65),0 0 0 6px color-mix(in srgb,var(--accent) 10%,transparent),inset 0 1px 0 rgba(255,255,255,.14);
  animation:floaty 6s ease-in-out infinite;
}
.hero__quote::before{
  content:"\201C";position:absolute;top:-30px;inset-inline-start:16px;
  font-family:Georgia,serif;font-size:96px;line-height:1;color:var(--accent);opacity:.92;
  text-shadow:0 6px 30px color-mix(in srgb,var(--accent) 65%,transparent);pointer-events:none;
}
.hero__quote::after{
  content:"";display:block;width:54px;height:4px;margin:16px auto 0;border-radius:4px;
  background:linear-gradient(90deg,var(--accent),var(--accent-2));
  box-shadow:0 0 18px color-mix(in srgb,var(--accent) 70%,transparent);
}
[dir="ar"] .hero__quote{font-family:'Cairo',sans-serif}
[dir="ar"] .hero__quote::before{content:"\201D"}
@media(prefers-reduced-motion:reduce){.hero__quote{animation:none}}

/* signature quote block (replaces home biography teaser) */
.bioquote{padding:clamp(48px,7vw,92px) 0 clamp(40px,5vw,68px)}
.bioquote .wrap{display:flex;flex-direction:column;align-items:center}
.bioquote__block{max-width:880px;margin:0 auto;text-align:center;position:relative}
.bioquote__mark{display:block;font-family:Georgia,serif;font-size:clamp(70px,10vw,120px);line-height:.6;color:var(--accent);opacity:.5;margin-bottom:6px}
.bioquote__block p{font-size:clamp(22px,3.4vw,38px);font-weight:700;letter-spacing:-.02em;line-height:1.35;color:var(--text);margin:0 auto;text-wrap:balance}
.bioquote__block cite{display:block;margin-top:26px;font-style:normal;font-size:15px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-deep)}
[dir="ar"] .bioquote__block p,[dir="ar"] .bioquote__block cite{font-family:'Cairo',sans-serif}
/* floating card variant */
.bioquote__block--float{
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg,22px);
  padding:clamp(34px,5vw,58px) clamp(28px,5vw,64px);
  box-shadow:0 32px 70px -28px rgba(13,38,63,.34);
  animation:bqfloat 6s ease-in-out infinite;will-change:transform;
}
@keyframes bqfloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
@media(prefers-reduced-motion:reduce){.bioquote__block--float{animation:none}}
/* scroll-down cue under the floating quote */
.bioquote__scroll{display:inline-flex;flex-direction:column;align-items:center;gap:6px;margin-top:clamp(26px,4vw,44px);
  font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--text-faint);transition:color .3s}
.bioquote__scroll:hover{color:var(--accent-deep)}
.bioquote__scroll svg{width:22px;height:22px;animation:bqbounce 1.8s ease-in-out infinite}
@keyframes bqbounce{0%,100%{transform:translateY(0);opacity:.7}50%{transform:translateY(6px);opacity:1}}
@media(prefers-reduced-motion:reduce){.bioquote__scroll svg{animation:none}}
[dir="ar"] .bioquote__scroll{font-family:'Cairo',sans-serif}

.nav__brand--wordmark img{width:auto;height:30px;display:block;transition:filter .4s}
/* dark hero nav: render wordmark white so it's visible; after scroll show full-colour */
.nav:not(.scrolled) .nav__brand--wordmark img{filter:brightness(0) invert(1)}
.nav.scrolled .nav__brand--wordmark img{filter:none}
.nav__brand-text{display:flex;flex-direction:column;line-height:1.05}
.nav__brand-name{font-weight:800;font-size:17px;letter-spacing:-.01em;color:#fff;transition:color .4s}
.nav__brand-role{font-size:10.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.62);transition:color .4s}
.nav.scrolled .nav__brand-name{color:var(--text)}
.nav.scrolled .nav__brand-role{color:var(--text-faint)}

.nav__links{display:flex;align-items:center;gap:4px}
.nav__links a{
  padding:9px 15px;border-radius:100px;font-size:14.5px;font-weight:600;
  color:rgba(255,255,255,.82);transition:color .3s,background .3s;
}
.nav__links a:hover{color:#fff;background:rgba(255,255,255,.1)}
.nav.scrolled .nav__links a{color:var(--text-soft)}
.nav.scrolled .nav__links a:hover{color:var(--accent-deep);background:color-mix(in srgb,var(--accent) 10%,transparent)}

.nav__right{display:flex;align-items:center;gap:14px}
.nav__socials{display:flex;align-items:center;gap:6px}
.nav__socials a{
  width:34px;height:34px;display:grid;place-items:center;border-radius:50%;
  color:rgba(255,255,255,.78);border:1px solid rgba(255,255,255,.16);transition:all .3s;
}
.nav__socials a:hover{background:#fff;color:var(--navy-1);border-color:#fff;transform:translateY(-2px)}
.nav.scrolled .nav__socials a{color:var(--text-soft);border-color:var(--line-strong)}
.nav.scrolled .nav__socials a:hover{background:var(--accent);color:#fff;border-color:var(--accent)}
.nav__socials svg{width:15px;height:15px}

.lang-toggle{
  display:flex;align-items:stretch;border-radius:100px;overflow:hidden;
  border:1px solid var(--line-strong);font-weight:700;font-size:13px;line-height:1;
}
/* light border/text only while the toggle sits on the dark hero (home nav, not scrolled) */
.nav:not(.scrolled) .lang-toggle{border-color:rgba(255,255,255,.22)}
.lang-toggle button{
  min-width:42px;padding:9px 6px;text-align:center;color:var(--text-soft);
  transition:color .25s,background .25s;
}
.nav:not(.scrolled) .lang-toggle button:not(.active){color:rgba(255,255,255,.75)}
.lang-toggle button.active{background:var(--accent);color:#fff}

.nav__cta{padding:11px 22px;font-size:14px}
.nav__burger{display:none;width:42px;height:42px;border-radius:12px;color:#fff;place-items:center}
.nav.scrolled .nav__burger{color:var(--text)}
.nav__burger svg{width:24px;height:24px}

/* ============================================================
   HERO
   ============================================================ */
.hero{
  position:relative;min-height:68vh;display:flex;align-items:flex-end;padding:0;
  background:
    radial-gradient(115% 85% at 76% 16%, rgba(33,118,189,.34) 0%, transparent 48%),
    linear-gradient(165deg,var(--hero-from),var(--hero-to));
  overflow:hidden;color:#fff;
}
.hero__grid{
  position:absolute;inset:0;
  background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image:radial-gradient(120% 100% at 50% 0%,#000,transparent 75%);
  mask-image:radial-gradient(120% 100% at 50% 0%,#000,transparent 75%);
  pointer-events:none;
}
.hero__watermark{
  position:absolute;top:-4%;bottom:-4%;inset-inline-end:-3%;height:108%;width:auto;opacity:.5;
  filter:invert(1);mix-blend-mode:screen;pointer-events:none;user-select:none;
}
.hero__inner{
  position:relative;z-index:3;width:100%;max-width:var(--maxw);margin:0 auto;
  padding:64px var(--pad) 6px;
  display:grid;grid-template-columns:1.05fr .95fr;align-items:end;gap:clamp(40px,6vw,104px);
  direction:ltr; /* lock hero layout: text left, photo right — in EN and AR */
}
.hero__copy{padding-bottom:0;max-width:640px;order:1;align-self:end}
body[dir="rtl"] .hero__copy{direction:rtl;text-align:right}
.hero__eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-size:13px;font-weight:600;letter-spacing:.04em;color:var(--accent-2);
  background:rgba(39,207,195,.1);border:1px solid rgba(39,207,195,.28);
  padding:8px 16px;border-radius:100px;margin-bottom:26px;
}
.hero__eyebrow .dot{width:8px;height:8px;border-radius:50%;background:var(--accent-2);box-shadow:0 0 0 4px rgba(39,207,195,.25)}
.hero__name{
  font-size:clamp(34px,4.8vw,62px);font-weight:800;line-height:1.02;letter-spacing:-.03em;white-space:nowrap;
  margin-bottom:8px;
  background:linear-gradient(95deg,var(--accent-2),var(--accent));
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}
/* Arabic name is wider per glyph — scale it down so it stays on one line (esp. on phones) */
[dir="ar"] .hero__name{font-size:clamp(26px,3.8vw,46px);white-space:nowrap;letter-spacing:0;line-height:1.15}
.hero__role{
  font-size:clamp(17px,2vw,22px);font-weight:600;color:#cfe3f0;margin:18px 0 22px;
  display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;
}
.hero__role .sep{width:6px;height:6px;border-radius:50%;background:var(--accent-2)}
.hero__tagline{font-size:clamp(15.5px,1.6vw,18px);color:#a9c4d6;max-width:50ch;margin-bottom:24px;text-wrap:pretty}
.hero__actions{display:flex;flex-wrap:wrap;gap:14px;align-items:center}

.hero__portrait-wrap{position:relative;align-self:stretch;justify-content:flex-end;display:flex;flex-direction:column;align-items:center;gap:26px;order:2}
.hero__portrait-wrap .hero__quote{margin-top:auto}
.hero__figure{position:relative;width:100%;height:64vh;min-height:460px;display:flex;justify-content:center;align-items:flex-end}
.hero__portrait{
  position:relative;z-index:2;height:117%;width:auto;object-fit:contain;object-position:bottom center;
  /* raised via height (bottom-anchored) so there's no empty gap under the photo */
  filter:drop-shadow(0 40px 60px rgba(0,0,0,.45));
}
.hero__halo{
  position:absolute;bottom:6%;left:50%;transform:translateX(-50%);
  width:118%;aspect-ratio:1;border-radius:50%;z-index:1;
  background:radial-gradient(circle,color-mix(in srgb,var(--accent) 55%,transparent) 0%,transparent 62%);
  filter:blur(18px);
}
.profile-card{
  position:absolute;z-index:4;bottom:6%;left:6%;transform:translateX(-50%);
  display:flex;align-items:center;gap:13px;text-decoration:none;cursor:pointer;
  background:linear-gradient(165deg,var(--card-from),var(--card-to));border:1px solid rgba(255,255,255,.14);
  padding:11px 20px 11px 12px;border-radius:60px;box-shadow:var(--shadow-lg);
  animation:floatyCardM 5s ease-in-out infinite;
  transition:transform .25s var(--ease),box-shadow .25s;
}
.profile-card:hover{transform:translateX(-50%) translateY(-4px);box-shadow:0 46px 100px -42px rgba(6,24,42,.62)}
body[dir="rtl"] .profile-card{padding:11px 12px 11px 20px}
.profile-card .pc-loc{display:flex;align-items:center;gap:5px;margin-top:5px;font-size:11.5px;font-weight:700;color:var(--gold)}
.profile-card .pc-loc svg{width:13px;height:13px;flex:0 0 auto}
[dir="ar"] .profile-card .pc-name,[dir="ar"] .profile-card .pc-role,[dir="ar"] .profile-card .pc-loc{font-family:'Cairo',sans-serif}
.profile-card .pc-logo{width:48px;height:48px;border-radius:50%;object-fit:cover;object-position:center;background:#fff;padding:5px;box-shadow:0 4px 12px -3px rgba(6,24,42,.55)}
.profile-card .pc-name{font-weight:800;font-size:15px;color:var(--text);line-height:1.1}
.profile-card .pc-role{font-size:12px;color:#fff;font-weight:600}
.profile-card .pc-badge{margin-inline-start:6px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--accent) 14%,transparent);color:var(--accent-deep)}
.profile-card .pc-badge svg{width:13px;height:13px}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
@keyframes floatyCard{0%,100%{transform:translate(-50%,-50%)}50%{transform:translate(-50%,calc(-50% - 12px))}}
@keyframes floatyCardM{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(-12px)}}

.hero__stats{
  display:flex;gap:12px;flex-wrap:wrap;margin-top:26px;
  direction:ltr;justify-content:flex-start; /* always pack to the far left (hero is locked photo-right) */
  animation:floaty 6s ease-in-out infinite;
}
.hstat{
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border-radius:9px;padding:12px 14px;text-align:center;
  width:132px;min-height:78px;display:flex;flex-direction:column;justify-content:center;
  box-shadow:0 14px 30px -16px rgba(0,0,0,.55);
}
.hstat b{display:block;font-size:23px;font-weight:800;color:#fff;letter-spacing:-.02em;line-height:1}
.hstat .plus{font-size:14px}
.hstat span{display:block;margin-top:3px;font-size:11px;font-weight:600;color:#9fbdd0;letter-spacing:.02em}
[dir="ar"] .hstat span{font-family:'Cairo',sans-serif}
@media(prefers-reduced-motion:reduce){.hero__stats{animation:none}}

.hero__scroll{
  position:absolute;bottom:12px;left:50%;transform:translateX(-50%);z-index:5;
  display:flex;flex-direction:column;align-items:center;gap:8px;
  color:rgba(255,255,255,.5);font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;
}
.hero__scroll .mouse{width:22px;height:34px;border:2px solid rgba(255,255,255,.4);border-radius:12px;position:relative}
.hero__scroll .mouse::after{content:"";position:absolute;top:6px;left:50%;transform:translateX(-50%);width:3px;height:7px;background:#fff;border-radius:2px;animation:scroller 1.6s infinite}
@keyframes scroller{0%{opacity:0;transform:translate(-50%,0)}40%{opacity:1}100%{opacity:0;transform:translate(-50%,11px)}}

/* ============================================================
   SECTION SCAFFOLD
   ============================================================ */
section{position:relative;padding:clamp(44px,5.5vw,78px) 0}
section.dark{background:linear-gradient(170deg,var(--navy-1),var(--ink));color:#fff}
/* alternating section backgrounds — break the color between neighbours */
section.sec-white{background:#fff}
section.sec-tint{background:var(--royal-tint)}
.sec-head{max-width:760px;margin-bottom:34px}
.sec-head.center{margin-inline:auto;text-align:center}
.sec-head .eyebrow{margin-bottom:18px}
.sec-head h2{margin-bottom:18px}

/* ---------- ASPIRATION QUOTE BAND (replaces trust strip) ---------- */
.aspire{position:relative;padding:clamp(24px,3.5vw,40px) 0 clamp(26px,3.5vw,40px);background:linear-gradient(165deg,var(--card-from),var(--card-to));color:#fff;overflow:hidden}
/* Scroll cue flows below the signature here (no overlap on any screen) */
.aspire .hero__scroll{position:static;left:auto;transform:none;margin-top:clamp(16px,3vw,26px)}
.aspire .wrap{display:flex;flex-direction:column;align-items:center;text-align:center}
.aspire__quote{position:relative;max-width:680px;margin:0 auto;
  font-size:clamp(13.5px,1.5vw,18px);font-weight:700;letter-spacing:-.01em;line-height:1.45;color:#fff;text-wrap:balance}
.aspire__quote::before{content:"\201C";display:block;font-family:Georgia,serif;
  font-size:clamp(26px,3.4vw,40px);line-height:.4;color:var(--accent-2);opacity:.55;margin-bottom:4px}
.aspire__sign{display:block;height:clamp(24px,2.8vw,36px);width:auto;margin-top:14px;opacity:.96;
  filter:drop-shadow(0 4px 14px rgba(0,0,0,.4))}
[dir="ar"] .aspire__quote{font-family:'Cairo',sans-serif}
[dir="ar"] .aspire__quote::before{content:"\201D"}

/* ---------- TRUST STRIP ---------- */
.trust{padding:38px 0;background:var(--navy-1);color:#fff;overflow:hidden}
.trust__label{text-align:center;font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.45);margin-bottom:24px}
.marquee{display:flex;overflow:hidden;direction:ltr;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
/* track stays LTR in both languages so the leftward scroll always overflows to
   the right and loops seamlessly; Arabic names still shape correctly via bidi */
.marquee__track{display:flex;direction:ltr;gap:54px;padding-inline:27px;flex-shrink:0;animation:marq 76s linear infinite}
.marquee:hover .marquee__track{animation-play-state:paused}
@keyframes marq{to{transform:translateX(-50%)}}
.marquee__item{display:flex;align-items:center;gap:11px;white-space:nowrap;font-weight:700;font-size:17px;color:rgba(255,255,255,.62);letter-spacing:.01em}
.marquee__item svg{width:20px;height:20px;color:var(--accent-2);flex-shrink:0}

/* ---------- BIOGRAPHY ---------- */
.bio{background:var(--paper-soft)}
.bio__grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(36px,5vw,76px);align-items:center}
.bio__media{position:relative}
.bio__photo{
  position:relative;border-radius:var(--r-lg);overflow:hidden;aspect-ratio:4/4.6;
  background:linear-gradient(160deg,var(--navy-2),var(--ink));box-shadow:var(--shadow-lg);
}
.bio__photo img{position:absolute;bottom:0;left:50%;transform:translateX(-50%);height:104%;width:auto;max-width:none}
.bio__photo .glow{position:absolute;inset:0;background:radial-gradient(70% 50% at 50% 20%,color-mix(in srgb,var(--accent) 40%,transparent),transparent 70%)}
.bio__quote{
  position:absolute;bottom:-30px;inset-inline-end:-22px;max-width:300px;z-index:3;
  background:var(--card);border-radius:var(--r-md);padding:22px 24px;box-shadow:var(--shadow-lg);
  border-top:3px solid var(--accent);
}
.bio__quote p{font-size:14.5px;font-style:italic;color:var(--text-soft);line-height:1.55;text-wrap:pretty}
.bio__quote .mark{font-size:46px;font-weight:800;color:var(--accent);line-height:.5;font-family:Georgia,serif}
.bio__body h2{margin-bottom:22px}
.bio__body p{color:var(--text-soft);font-size:16.5px;margin-bottom:18px;max-width:56ch;text-wrap:pretty}
.bio__statrow{display:flex;gap:34px;margin:34px 0 32px;flex-wrap:wrap}
.bio__stat b{display:block;font-size:38px;font-weight:800;letter-spacing:-.02em;color:var(--text);line-height:1}
.bio__stat .num{background:linear-gradient(135deg,var(--accent),var(--accent-deep));-webkit-background-clip:text;background-clip:text;color:transparent}
.bio__stat span{font-size:13.5px;color:var(--text-faint);font-weight:600}

/* ---------- EXPERTISE ---------- */
.exp__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.xcard{
  position:relative;background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);
  padding:32px 28px;transition:transform .4s var(--ease),box-shadow .4s var(--ease),border-color .4s;
  overflow:hidden;
}
.xcard::before{content:"";position:absolute;inset:0;background:linear-gradient(160deg,color-mix(in srgb,var(--accent) 7%,transparent),transparent 55%);opacity:0;transition:opacity .4s}
.xcard:hover{transform:translateY(-7px);box-shadow:var(--shadow-md);border-color:transparent}
.xcard:hover::before{opacity:1}
.xcard__icon{
  width:54px;height:54px;border-radius:15px;display:grid;place-items:center;margin-bottom:22px;
  background:linear-gradient(140deg,color-mix(in srgb,var(--accent) 16%,transparent),color-mix(in srgb,var(--accent-2) 14%,transparent));
  color:var(--accent-deep);position:relative;
}
.xcard__icon svg{width:26px;height:26px}
.xcard h3{font-size:19px;font-weight:800;margin-bottom:9px;letter-spacing:-.01em;position:relative}
.xcard p{font-size:14.5px;color:var(--text-soft);position:relative;text-wrap:pretty}
.xcard__num{position:absolute;top:22px;inset-inline-end:26px;font-size:13px;font-weight:800;color:var(--line-strong)}

/* ---------- HONORS (dark) ---------- */
.honors__head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:36px;flex-wrap:wrap}
.honors__viewall{flex-shrink:1;white-space:normal;text-align:center}
.honors-metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:42px;padding:26px 0;border-top:1px solid var(--line-strong);border-bottom:1px solid var(--line-strong)}
.hm b{display:block;font-size:clamp(32px,4vw,46px);font-weight:800;letter-spacing:-.02em;color:var(--text);line-height:1}
.hm__suf{color:var(--accent-2);font-size:.6em;margin-inline-start:1px}
.hm span{font-size:13px;font-weight:600;color:var(--text-faint);margin-top:6px;display:block}
.honors__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.award{
  position:relative;border-radius:var(--r-md);overflow:hidden;
  background:linear-gradient(165deg,rgba(255,255,255,.07),rgba(255,255,255,.02));
  border:1px solid rgba(255,255,255,.1);padding:20px;
  display:flex;flex-direction:column;gap:16px;min-height:228px;
  transition:transform .4s var(--ease),border-color .4s,background .4s;
}
.award:hover{transform:translateY(-7px);border-color:var(--cc1,var(--accent-2));background:linear-gradient(165deg,rgba(255,255,255,.1),rgba(255,255,255,.03))}
.award__logo{width:100%;aspect-ratio:16/9;background:#fff;border-radius:12px;overflow:hidden;display:block;padding:14px;box-sizing:border-box}
.award__logo image-slot{width:100%;height:100%;display:block}
.award__logo image-slot img{width:100%;height:100%;object-fit:contain}
.award__plate{display:grid;place-items:center;text-align:center;width:100%;aspect-ratio:16/9;border-radius:12px;padding:16px;
  background:linear-gradient(150deg,var(--cc1,#1d80b6),var(--cc2,#0e4673));color:#fff;
  font-weight:800;font-size:clamp(14px,1.5vw,18px);line-height:1.25;letter-spacing:-.01em}
[dir="ar"] .award__plate{font-family:'Cairo',sans-serif}
.award__foot{margin-top:auto;position:relative;z-index:2;padding-inline-end:42px}
.award__yr{font-size:11.5px;font-weight:700;letter-spacing:.04em;color:var(--cc1,var(--accent-2))}
.award h3{font-size:15.5px;font-weight:800;color:#fff;line-height:1.25;margin-top:5px}
.award__corner{
  position:absolute;bottom:0;inset-inline-end:0;width:74px;height:74px;
  display:grid;place-items:end;padding:0 12px 11px 0;color:#fff;
  background:radial-gradient(125% 125% at 100% 100%,var(--cc1,var(--accent)) 0%,var(--cc2,var(--accent-deep)) 70%,transparent 71%);
  border-start-start-radius:80%;
}
body[dir="rtl"] .award__corner{padding:0 0 11px 12px;background:radial-gradient(125% 125% at 0% 100%,var(--cc1,var(--accent)) 0%,var(--cc2,var(--accent-deep)) 70%,transparent 71%);border-start-start-radius:0;border-start-end-radius:80%}
.award__corner svg{width:22px;height:22px}

/* ---- Uniform branded honor card (.hcard) — shared with the All Honors page so
   Honors, Exceptional Experiences and Courses on the home page match exactly ---- */
.hcard{
  --bb:#283484;
  position:relative;display:flex;flex-direction:column;color:#fff;text-decoration:none;
  background:linear-gradient(165deg,var(--card-from),var(--card-to));border:1px solid rgba(255,255,255,.12);
  border-radius:16px;overflow:hidden;text-align:start;min-height:200px;
  box-shadow:0 18px 44px -26px rgba(6,24,42,.6);
  transition:transform .4s var(--ease),box-shadow .4s,border-color .4s;
}
.hcard:hover{transform:translateY(-5px);box-shadow:0 30px 64px -28px rgba(6,24,42,.8);border-color:rgba(255,255,255,.18)}
/* entity logo on a white tile at the top */
.hcard__logo{margin:16px 16px 4px;height:124px;background:#fff;border-radius:14px;display:flex;align-items:center;justify-content:center;padding:12px 14px;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(13,38,63,.06),0 10px 22px -16px rgba(6,24,42,.7)}
.hcard__logoimg{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;display:block}
.hcard__logoimg--round{height:88px;width:88px;max-height:none;max-width:none;border-radius:50%;object-fit:cover;box-shadow:0 8px 20px -8px rgba(13,38,63,.5)}
.hcard__ini{display:grid;place-items:center;height:48px;min-width:48px;padding:0 18px;border-radius:10px;
  background:var(--bb);color:#fff;font-weight:800;font-size:15px;letter-spacing:.02em;text-align:center;line-height:1.1}
[dir="ar"] .hcard__ini{font-family:'Cairo',sans-serif}
/* YEAR · category, then entity name */
.hcard__body{padding:8px 18px 22px;flex:1;display:flex;flex-direction:column;gap:6px}
.hcard__meta{display:flex;align-items:center;gap:6px;font-size:10px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--accent-2)}
.hcard__meta .dot{opacity:.55}
.hcard__yr{font-weight:800}
[dir="ar"] .hcard__yr{font-family:'Cairo',sans-serif}
.hcard__body h3{font-size:13.5px;font-weight:800;line-height:1.3;color:#fff;padding-inline-end:44px;
  display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
[dir="ar"] .hcard__body h3{font-family:'Cairo',sans-serif}
/* coloured, rounded quarter-circle corner wedge holding the section seal */
.hcard__seal{position:absolute;inset-inline-end:0;bottom:0;width:62px;height:62px;color:#fff;pointer-events:none;
  display:flex;align-items:flex-end;justify-content:flex-end;padding:0 13px 13px 0;
  background:radial-gradient(150% 150% at 100% 100%,var(--cc1,#27cfc3) 0%,var(--cc2,#0e4673) 64%,transparent 66%)}
[dir="rtl"] .hcard__seal{padding:0 0 13px 13px;background:radial-gradient(150% 150% at 0% 100%,var(--cc1,#27cfc3) 0%,var(--cc2,#0e4673) 64%,transparent 66%)}
.hcard__seal svg{width:20px;height:20px}
.hcard--ini .hcard__logo{background:#fff}
.hcard__capico{width:56px;height:56px;color:var(--accent-deep)}

/* ---------- PHILOSOPHY / SIGNATURE BAND ---------- */
.philosophy{
  position:relative;overflow:hidden;color:#fff;
  background:
    radial-gradient(90% 120% at 88% 0%,color-mix(in srgb,var(--accent) 30%,transparent),transparent 55%),
    linear-gradient(165deg,var(--navy-2),var(--ink));
}
.philosophy__wm{position:absolute;inset-inline-start:-5%;bottom:-28%;width:min(42vw,460px);opacity:.05;filter:brightness(0) invert(1);pointer-events:none}
.philosophy .wrap{position:relative;z-index:2}
.philo__eyebrow{margin-bottom:26px}
.philo__head{
  font-size:clamp(34px,6vw,82px);font-weight:800;line-height:1.02;letter-spacing:-.03em;
  max-width:16ch;text-wrap:balance;margin-bottom:18px;
}
.philo__head .hl{
  background:linear-gradient(120deg,var(--accent-2),var(--accent));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.philo__sub{font-size:clamp(15.5px,1.6vw,18px);color:#a9c4d6;max-width:52ch;margin-bottom:54px;text-wrap:pretty}
.philo__pillars{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.pillar{
  position:relative;border:1px solid rgba(255,255,255,.12);border-radius:var(--r-md);
  padding:34px 32px;background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.015));
  transition:transform .4s var(--ease),border-color .4s,background .4s;overflow:hidden;
}
.pillar:hover{transform:translateY(-6px);border-color:var(--accent-2);background:linear-gradient(160deg,rgba(255,255,255,.09),rgba(255,255,255,.02))}
.pillar__no{font-size:13px;font-weight:800;letter-spacing:.18em;color:var(--accent-2);margin-bottom:16px;display:block}
.pillar__icon{width:50px;height:50px;border-radius:14px;display:grid;place-items:center;margin-bottom:20px;background:linear-gradient(140deg,color-mix(in srgb,var(--accent) 30%,transparent),color-mix(in srgb,var(--accent-2) 22%,transparent));color:#fff}
.pillar__icon svg{width:26px;height:26px}
.pillar h3{font-size:clamp(20px,2.2vw,27px);font-weight:800;line-height:1.18;letter-spacing:-.01em;color:#fff;margin-bottom:10px;text-wrap:balance}
.pillar p{font-size:14.5px;color:#9fbdd0;text-wrap:pretty}
@media (max-width:880px){.philo__pillars{grid-template-columns:1fr}}

/* ---------- TIMELINE (career) ---------- */
/* experience as a card grid (matches WordPress layout) */
.exp-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
/* navy card · white logo tile · corner section-icon wedge (teal-green → navy) */
.exp-card{position:relative;display:flex;flex-direction:column;border-radius:16px;overflow:hidden;color:#fff;
  background:linear-gradient(165deg,var(--card-from),var(--card-to));border:1px solid rgba(255,255,255,.12);
  box-shadow:0 18px 44px -26px rgba(6,24,42,.6);transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.exp-card:hover{transform:translateY(-5px);box-shadow:0 30px 64px -28px rgba(6,24,42,.78)}
.exp-card__badge{position:absolute;top:13px;inset-inline-end:13px;z-index:3;font-size:9px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:#06243a;background:var(--accent-2);padding:4px 9px;border-radius:100px}
.exp-card__logo{margin:14px 14px 4px;height:92px;background:#fff;border-radius:12px;display:flex;align-items:center;justify-content:center;padding:12px;overflow:hidden}
.exp-card__logoimg{max-height:62px;max-width:84%;width:auto;object-fit:contain;display:block}
.exp-card__logoimg--round{height:66px;width:66px;max-height:none;max-width:none;border-radius:50%;object-fit:cover;background:#fff;padding:8px;box-shadow:0 8px 20px -8px rgba(13,38,63,.5)}
.exp-card__logo--ini{background:linear-gradient(150deg,var(--steel),var(--navy-2));color:#fff;font-weight:800;font-size:28px;letter-spacing:.02em}
.exp-card__body{padding:8px 18px 24px;display:flex;flex-direction:column;gap:4px}
.exp-card__meta{font-size:11.5px;font-weight:700;color:var(--accent-2);letter-spacing:.01em;order:-1}
.exp-card h3{font-size:15px;font-weight:800;letter-spacing:-.01em;color:#fff;line-height:1.28;padding-inline-end:48px}
.exp-card__company{font-size:12.5px;font-weight:600;color:#d7e8f4}
.exp-card--current .exp-card__company{color:var(--gold)}
.exp-card__seal{position:absolute;inset-inline-end:0;bottom:0;width:64px;height:64px;color:#fff;pointer-events:none;
  display:flex;align-items:flex-end;justify-content:flex-end;padding:0 13px 13px 0;
  background:radial-gradient(150% 150% at 100% 100%,var(--cc1,#27cfc3) 0%,var(--cc2,#0e4673) 64%,transparent 66%)}
[dir="rtl"] .exp-card__seal{padding:0 0 13px 13px;background:radial-gradient(150% 150% at 0% 100%,var(--cc1,#27cfc3) 0%,var(--cc2,#0e4673) 64%,transparent 66%)}
.exp-card__seal svg{width:21px;height:21px}
[dir="ar"] .exp-card h3,[dir="ar"] .exp-card__company,[dir="ar"] .exp-card__meta{font-family:'Cairo',sans-serif}

.timeline{position:relative;max-width:880px}
.timeline::before{content:"";position:absolute;inset-inline-start:31px;top:14px;bottom:30px;width:2px;background:linear-gradient(var(--accent),var(--line-strong));border-radius:2px}
.tl-item{position:relative;display:grid;grid-template-columns:64px 1fr;gap:26px;padding-bottom:38px}
.tl-item:last-child{padding-bottom:0}
.tl-logo{
  width:64px;height:64px;border-radius:50%;background:#fff;position:relative;z-index:2;
  box-shadow:0 6px 18px -6px rgba(8,30,48,.25);border:1px solid var(--line);overflow:hidden;
}
.tl-logo image-slot{width:100%;height:100%;display:block}
.tl-content{padding-top:3px}
.tl-content h3{font-size:20px;font-weight:800;letter-spacing:-.01em;color:var(--text);line-height:1.2}
.tl-company{font-size:15px;font-weight:700;color:var(--accent-deep);margin:4px 0 7px}
.tl-meta{font-size:13.5px;color:var(--text-faint);font-weight:500}
.tl-desc{font-size:14px;line-height:1.65;color:var(--text-soft,var(--text-faint));margin:10px 0 0;max-width:60ch}
.tl-tags{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:12px}
.tl-tags .tl-chip{margin-top:0}
.tl-link{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--accent-deep);text-decoration:none;transition:gap .2s ease,opacity .2s ease}
.tl-link .arw{display:inline-flex}
.tl-link:hover{gap:10px;opacity:.82}
/* people variant (mentors & digital friends) — same row style as experience, no connector line */
.timeline--people{margin-inline:auto}
.timeline--people::before{display:none}
.tl-logo img{width:100%;height:100%;object-fit:cover;display:block}
.tl-logo--ini{display:grid;place-items:center;font-weight:800;font-size:20px;color:#fff;background:linear-gradient(150deg,var(--steel),var(--navy-2));border:none}

/* digital friends — big photo cards */
.friends-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:28px;max-width:900px;margin-inline:auto}
.friend-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r-lg,20px);overflow:hidden;background:var(--card);transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .3s}
.friend-card:hover{transform:translateY(-6px);box-shadow:0 26px 60px -18px rgba(13,38,63,.34);border-color:color-mix(in srgb,var(--accent) 32%,var(--line))}
.friend-card__photo{aspect-ratio:4/5;background:linear-gradient(150deg,var(--steel),var(--navy-2));overflow:hidden}
.friend-card__photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s var(--ease)}
.friend-card__photo--ini{display:grid;place-items:center;color:#fff;font-weight:800;font-size:clamp(44px,7vw,68px);letter-spacing:.02em}
.friend-card:hover .friend-card__photo img{transform:scale(1.04)}
.friend-card__body{padding:22px 24px 26px}
.friend-card__body h3{font-size:22px;font-weight:800;letter-spacing:-.01em;color:var(--text);line-height:1.2}
.friend-card__role{font-size:14.5px;font-weight:700;color:var(--accent-deep);margin:6px 0 14px}
.friend-card__more{display:inline-flex;align-items:center;gap:7px;font-size:14px;font-weight:700;color:var(--text-soft);transition:gap .25s,color .25s}
.friend-card:hover .friend-card__more{color:var(--accent-deep);gap:11px}
[dir="ar"] .friend-card__body h3,[dir="ar"] .friend-card__role,[dir="ar"] .friend-card__more{font-family:'Cairo',sans-serif}

/* ===== Digital Friends — 4-across bigger photos, unified background, hover-to-enlarge (video #9) ===== */
.df-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:8px}
@media(max-width:900px){.df-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.df-grid{grid-template-columns:1fr}}
/* swipe variant (Mentors) — scroll left/right */
.df-swipe{display:flex;gap:22px;margin-top:8px;overflow-x:auto;scroll-snap-type:x mandatory;justify-content:safe center;
  scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;padding:4px 2px 12px}
.df-swipe::-webkit-scrollbar{display:none}
.df-swipe .dfcard{flex:0 0 250px;max-width:80vw;scroll-snap-align:start}
.dfcard{position:relative;display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:18px;overflow:hidden;text-decoration:none;
  transition:transform .35s var(--ease),box-shadow .35s,border-color .3s}
/* section icon (laptop) in a blue corner seal — matches the other section cards */
.dfcard__seal{position:absolute;inset-inline-end:0;bottom:0;width:56px;height:56px;color:#fff;pointer-events:none;
  display:flex;align-items:flex-end;justify-content:flex-end;padding:0 11px 11px 0;
  background:radial-gradient(150% 150% at 100% 100%,#2f5fbf 0%,#18356e 64%,transparent 66%)}
[dir="rtl"] .dfcard__seal{padding:0 0 11px 11px;background:radial-gradient(150% 150% at 0% 100%,#2f5fbf 0%,#18356e 64%,transparent 66%)}
.dfcard__seal svg{width:18px;height:18px}
.dfcard:hover{transform:translateY(-5px);box-shadow:0 26px 60px -20px rgba(13,38,63,.34);border-color:color-mix(in srgb,var(--accent) 32%,var(--line))}
.dfcard__photo{position:relative;aspect-ratio:1/1;overflow:hidden;display:grid;place-items:center;
  background:linear-gradient(150deg,var(--card-from),var(--card-to))}      /* unified background behind every portrait */
.dfcard__photo img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.dfcard:hover .dfcard__photo img{transform:scale(1.06)}                    /* hover-to-enlarge */
.dfcard__ini{color:#fff;font-weight:800;font-size:clamp(40px,6vw,56px);letter-spacing:.02em}
.dfcard__net{position:absolute;bottom:10px;inset-inline-end:10px;width:30px;height:30px;border-radius:50%;background:#fff;
  display:grid;place-items:center;color:var(--accent-deep);box-shadow:0 6px 16px -6px rgba(13,38,63,.5)}
.dfcard__net svg{width:16px;height:16px}
/* VIP mentors: gold crown seal + a small gold crown badge on the photo */
.dfcard--vip .dfcard__seal{background:radial-gradient(150% 150% at 100% 100%,#d4af38 0%,#8a6a1f 64%,transparent 66%)}
[dir="rtl"] .dfcard--vip .dfcard__seal{background:radial-gradient(150% 150% at 0% 100%,#d4af38 0%,#8a6a1f 64%,transparent 66%)}
.dfcard--vip{border-color:color-mix(in srgb,#d4af38 26%,var(--line))}
.dfcard__vip{position:absolute;top:10px;inset-inline-start:10px;width:30px;height:30px;border-radius:50%;
  display:grid;place-items:center;color:#3a2c08;background:linear-gradient(150deg,#f0d98a,#c9a24b);box-shadow:0 6px 16px -6px rgba(13,38,63,.5)}
.dfcard__vip svg{width:17px;height:17px}
.dfcard__body{padding:16px 16px 18px;display:flex;flex-direction:column;gap:3px}
.dfcard__name{font-weight:800;font-size:16px;color:var(--text);line-height:1.25}
.dfcard__role{font-size:12.5px;font-weight:700;color:var(--accent-deep)}
.dfcard__more{margin-top:9px;display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:700;color:var(--text-soft);transition:gap .25s,color .25s}
.dfcard:hover .dfcard__more{color:var(--accent-deep);gap:10px}
[dir="ar"] .dfcard__name,[dir="ar"] .dfcard__role,[dir="ar"] .dfcard__more{font-family:'Cairo',sans-serif}
/* partner card with its own Become-a-partner button */
.friend-card--withcta{padding-bottom:18px}
.friend-card__link{display:flex;flex-direction:column;color:inherit;text-decoration:none}
.friend-card__cta{display:flex;align-items:center;justify-content:center;margin:0 18px;padding:11px 18px;border-radius:100px;
  font-size:14px;font-weight:700;color:var(--accent-deep);background:color-mix(in srgb,var(--accent) 12%,transparent);
  border:1.5px solid color-mix(in srgb,var(--accent) 32%,transparent);transition:background .25s,color .25s,transform .25s}
.friend-card__cta:hover{background:var(--accent-deep);border-color:var(--accent-deep);color:#fff;transform:translateY(-2px)}
[dir="ar"] .friend-card__cta{font-family:'Cairo',sans-serif}
[dir="rtl"] .tl-link .arw{transform:scaleX(-1)}

/* ---------- BOOKS ---------- */
.books{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.book{display:flex;flex-direction:column;gap:10px}
.book image-slot{width:100%;aspect-ratio:3/4.3;display:block;box-shadow:var(--shadow-md);border-radius:10px}
.book{text-decoration:none;color:inherit;transition:transform .35s var(--ease)}
a.book:hover{transform:translateY(-3px)}
a.book:hover image-slot{box-shadow:var(--shadow-lg,var(--shadow-md))}
.book .bt{font-size:13.5px;font-weight:700;line-height:1.25;color:var(--text)}
.book .ba{font-size:12px;color:var(--text-faint)}
.book .bd{font-size:12.5px;line-height:1.55;color:var(--text-faint);margin-top:6px}
a.pod{text-decoration:none}

/* ---------- PODCAST list ---------- */
.pod{display:flex;gap:16px;align-items:center;padding:14px;border-radius:var(--r-md);background:var(--card);border:1px solid var(--line);margin-bottom:14px;transition:transform .35s var(--ease),box-shadow .35s,border-color .35s}
.pod:hover{transform:translateY(-3px);box-shadow:var(--shadow-sm);border-color:color-mix(in srgb,var(--accent) 30%,transparent)}
.pod image-slot{width:76px;height:76px;flex-shrink:0;display:block;border-radius:12px}
.pod h3{font-size:15.5px;font-weight:700;color:var(--text);line-height:1.25}
.pod p{font-size:13px;color:var(--text-faint);margin-top:3px}

@media (max-width:560px){.books{grid-template-columns:repeat(3,1fr)}}

/* ---------- CARDS: blog & courses ---------- */
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:clamp(34px,5vw,68px)}
.feature-block{}
.feature-block .eyebrow{margin-bottom:16px}
.feature-block h2{font-size:clamp(26px,3vw,38px);font-weight:800;letter-spacing:-.02em;margin-bottom:14px;line-height:1.08}
.feature-block .lead{margin-bottom:26px}

/* Ektoob → horizontal swipe carousel (matches the site pattern) */
/* Ektoob: 4 category columns (sections), each stacking its cards */
#postsList{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;align-items:stretch;padding:4px 0 6px}
#postsList .post-col__list{flex:1}
#postsList .post{height:100%}
.post-col{display:flex;flex-direction:column;gap:14px}
.post-col__head{font-size:13px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--accent-deep);
  padding-bottom:10px;border-bottom:2px solid color-mix(in srgb,var(--accent) 28%,transparent)}
.post-col__list{display:flex;flex-direction:column;gap:14px}
@media(max-width:980px){#postsList{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){#postsList{grid-template-columns:1fr}}
/* prev/next arrows for horizontal swipe rows */
.swipe{position:relative}
.swipe__nav{position:absolute;top:50%;transform:translateY(-50%);z-index:6;width:44px;height:44px;border-radius:50%;
  border:1px solid var(--line-strong);background:var(--card);color:var(--accent-deep);display:grid;place-items:center;cursor:pointer;
  box-shadow:0 8px 20px -8px rgba(13,38,63,.45);transition:background .25s,color .25s,opacity .25s,transform .25s}
.swipe__nav:hover{background:var(--accent-deep);color:#fff;border-color:transparent}
.swipe__nav svg{width:20px;height:20px}
.swipe__nav--prev{inset-inline-start:-10px}
.swipe__nav--next{inset-inline-end:-10px}
.swipe__nav.is-off{opacity:0;pointer-events:none}
.swipe--none .swipe__nav{display:none}
[dir="rtl"] .swipe__nav svg{transform:scaleX(-1)}
@media (max-width:560px){.swipe__nav{width:38px;height:38px}.swipe__nav--prev{inset-inline-start:-4px}.swipe__nav--next{inset-inline-end:-4px}}
.post{
  position:relative;overflow:hidden;width:100%;
  display:flex;gap:14px;padding:15px;border-radius:var(--r-md);
  background:var(--card);border:1px solid var(--line);
  transition:transform .35s var(--ease),box-shadow .35s,border-color .35s;
}
.post__body{min-width:0}
.post__body h3{padding-inline-end:24px}
.post__seal{position:absolute;inset-inline-end:0;bottom:0;width:42px;height:42px;color:#fff;pointer-events:none;
  display:flex;align-items:flex-end;justify-content:flex-end;padding:0 10px 10px 0;
  background:radial-gradient(150% 150% at 100% 100%,var(--cc1,#2a93d4) 0%,var(--cc2,#0e4673) 64%,transparent 66%)}
[dir="rtl"] .post__seal{padding:0 0 10px 10px;background:radial-gradient(150% 150% at 0% 100%,var(--cc1,#2a93d4) 0%,var(--cc2,#0e4673) 64%,transparent 66%)}
.post__seal svg{width:17px;height:17px}
.post:hover{transform:translateY(-4px);box-shadow:var(--shadow-sm);border-color:color-mix(in srgb,var(--accent) 35%,transparent)}
.post__thumb{flex-shrink:0;width:54px;height:54px;border-radius:11px;display:grid;place-items:center;color:#fff;font-weight:800;font-size:17px;background:linear-gradient(150deg,var(--accent),var(--accent-deep))}
.post__thumb.alt{background:linear-gradient(150deg,var(--accent-2),#0f9f95)}
.post__thumb.alt2{background:linear-gradient(150deg,var(--steel),var(--navy-2))}
.post__thumb.alt3{background:linear-gradient(150deg,#e3b25a,#a9742a)}
.post__meta{font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-deep);margin-bottom:5px}
.post h3{font-size:14px;font-weight:700;line-height:1.32;margin-bottom:5px;color:var(--text)}
.post p{font-size:13.5px;color:var(--text-faint)}

.course{
  display:block;text-decoration:none;color:inherit;
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden;
  transition:transform .4s var(--ease),box-shadow .4s,border-color .4s;
}
.course:hover{transform:translateY(-6px);box-shadow:var(--shadow-md);border-color:transparent}
.course__media{position:relative;display:block;aspect-ratio:1.414/1;background:#fff;border-bottom:1px solid var(--line);overflow:hidden}
.course__media image-slot{width:100%;height:100%;display:block}
.course__verified{position:absolute;top:12px;inset-inline-start:12px;z-index:3;display:flex;align-items:center;gap:5px;background:rgba(0,0,0,.45);backdrop-filter:blur(4px);padding:5px 11px;border-radius:100px;font-size:11px;font-weight:700;letter-spacing:.02em;color:#fff}
.course__verified svg{width:13px;height:13px;color:var(--gold)}
.course__body{padding:20px 22px 24px}
.course__tag{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--accent-deep)}
.course__body h3{font-size:17px;font-weight:800;margin:8px 0 6px;line-height:1.25}
.course__body p{font-size:13.5px;color:var(--text-soft)}

/* ---------- PARTNERS / TESTIMONIALS ---------- */
.partners{background:var(--royal-tint)}

/* Partners → swipeable multi-card testimonial carousel */
.pslider{position:relative;max-width:1120px;margin:8px auto 44px;display:flex;align-items:center;gap:10px}
.pslider__viewport{flex:1;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;
  scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch}
.pslider__viewport::-webkit-scrollbar{display:none}
.pslider__track{display:flex;gap:20px;padding:6px 2px}
/* Testimonial card — large centered avatar on top */
.pslide{flex:0 0 300px;max-width:86vw;scroll-snap-align:start;box-sizing:border-box;min-height:316px;padding:30px 26px 26px;
  display:flex;flex-direction:column;align-items:center;gap:11px;text-align:center;position:relative;overflow:hidden;
  background:var(--card);border:1px solid var(--line);border-radius:18px;box-shadow:0 18px 50px -30px rgba(13,38,63,.32)}
/* whole testimonial card is clickable (links to the partner page) */
a.pslide{text-decoration:none;color:inherit;cursor:pointer;transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s}
a.pslide:hover{transform:translateY(-5px);box-shadow:0 28px 62px -28px rgba(13,38,63,.42);border-color:color-mix(in srgb,var(--accent) 30%,var(--line))}
.pslide__avwrap{position:relative;margin:2px 0 4px}
.pslide__av{width:96px;height:96px;border-radius:50%;overflow:hidden;display:grid;place-items:center;
  background:linear-gradient(150deg,var(--cc1,var(--steel)),var(--cc2,var(--navy-2)));color:#fff;font-weight:800;font-size:33px;letter-spacing:.02em;
  box-shadow:0 10px 26px -10px rgba(13,38,63,.5)}
.pslide__av img{width:100%;height:100%;object-fit:cover}
/* Partners in Success: light-blue avatar circle with a #4B5568 icon/initials */
.partners .pslide__av{background:#cfe3f5;color:#4B5568}
/* corner seal: circle in the title color with a #4B5568 icon — enlarged + brighter circle so the icon pops */
.partners .pslide__seal{color:#4B5568;width:66px;height:66px}
.partners .pslide__seal svg{width:25px;height:25px}
.pslide__name{font-weight:800;font-size:17px;color:var(--text);line-height:1.25}
.pslide__role{font-size:13px;font-weight:700;color:var(--accent-deep);margin-top:-3px}
.pslide__badge{position:absolute;bottom:2px;right:2px;left:auto;width:28px;height:28px;border-radius:50%;
  border:3px solid var(--card);display:grid;place-items:center;background:var(--accent-deep);color:#fff}
.pslide__badge svg{width:13px;height:13px}
.pslide__mark{width:26px;height:26px;color:var(--accent);opacity:.75;flex:0 0 auto;margin:2px auto 0}
.pslide__quote{font-size:15px;line-height:1.6;font-weight:600;color:var(--text);margin:0;text-wrap:pretty;
  display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden}
.pslide__more{display:inline-flex;align-items:center;gap:7px;font-size:14px;font-weight:700;color:var(--accent-deep);
  text-decoration:none;margin:auto auto 0;transition:gap .2s ease}
.pslide__more:hover{gap:11px}
/* section-icon corner wedge (shield-check) on the testimonial card */
.pslide__seal{position:absolute;inset-inline-end:0;bottom:0;width:58px;height:58px;color:#fff;pointer-events:none;
  display:flex;align-items:flex-end;justify-content:flex-end;padding:0 11px 11px 0;
  background:radial-gradient(150% 150% at 100% 100%,var(--cc1,#1d96c6) 0%,var(--cc2,#0e4673) 64%,transparent 66%)}
[dir="rtl"] .pslide__seal{padding:0 0 11px 11px;background:radial-gradient(150% 150% at 0% 100%,var(--cc1,#1d96c6) 0%,var(--cc2,#0e4673) 64%,transparent 66%)}
.pslide__seal svg{width:18px;height:18px}
/* Mentor card variant — no quote: shorter card, social glyph in the corner wedge */
.pslide--mentor{min-height:262px;justify-content:center;gap:9px}
.pslide--mentor .pslide__more{margin:6px auto 0}
.pslide__seal--net svg{width:19px;height:19px}
/* Podcast card — "Recommended" pill */
.pslide__pill{display:inline-flex;align-items:center;font-size:10.5px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;
  color:var(--accent-deep);background:rgba(29,150,198,.12);border-radius:999px;padding:3px 11px;margin-top:-2px}
/* Book card — cover only */
.pslide--book{flex:0 0 232px;min-height:auto;padding:0;gap:0;overflow:hidden;border-radius:16px;
  transition:transform .25s ease,box-shadow .25s ease}
.pslide--book:hover{transform:translateY(-4px);box-shadow:0 26px 60px -28px rgba(13,38,63,.5)}
.pslide__cover{width:100%;height:auto;display:block;object-fit:cover}
[dir="rtl"] .pslide__more .arw{transform:scaleX(-1)}

/* ===== Books I recommend — framed cover + white space, title & author below (video #10) ===== */
.books-row{display:flex;flex-wrap:wrap;justify-content:center;gap:24px;margin-top:8px}
.bookcard{position:relative;flex:0 1 230px;display:flex;flex-direction:column;text-decoration:none;
  background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px 18px 16px;overflow:hidden;
  box-shadow:0 24px 50px -24px rgba(13,38,63,.5);transition:transform .35s var(--ease),box-shadow .35s,border-color .3s}
.bookcard:hover{transform:translateY(-8px);box-shadow:0 40px 78px -26px rgba(13,38,63,.62);border-color:color-mix(in srgb,var(--accent) 32%,var(--line))}
.bookcard__frame{background:#fff;border:1px solid var(--line);border-radius:10px;padding:18px;display:grid;place-items:center;
  box-shadow:inset 0 0 0 1px rgba(13,38,63,.04)}                          /* white space / frame around the book */
.bookcard__cover{width:100%;height:240px;object-fit:contain;display:block;border-radius:4px;
  box-shadow:0 26px 44px -14px rgba(13,38,63,.6),0 8px 16px -8px rgba(13,38,63,.5);transition:transform .5s var(--ease),box-shadow .5s}
.bookcard:hover .bookcard__cover{transform:translateY(-6px) scale(1.04);box-shadow:0 38px 56px -14px rgba(13,38,63,.66),0 10px 20px -8px rgba(13,38,63,.55)}  /* cover surfs off the card */
.bookcard__body{padding:14px 4px 2px;display:flex;flex-direction:column;gap:3px}
.bookcard__title{font-weight:800;font-size:16px;color:var(--text);line-height:1.25}
.bookcard__author{font-size:12px;font-weight:700;color:var(--accent-deep)}  /* author in small font */
.bookcard__seal{position:absolute;inset-inline-end:0;bottom:0;width:54px;height:54px;color:#fff;pointer-events:none;
  display:flex;align-items:flex-end;justify-content:flex-end;padding:0 11px 11px 0;
  background:radial-gradient(150% 150% at 100% 100%,#8a5a2b 0%,#5a3a1a 64%,transparent 66%)}  /* carton/brown corner */
[dir="rtl"] .bookcard__seal{padding:0 0 11px 11px;background:radial-gradient(150% 150% at 0% 100%,#8a5a2b 0%,#5a3a1a 64%,transparent 66%)}
.bookcard__seal svg{width:18px;height:18px}
[dir="ar"] .bookcard__title,[dir="ar"] .bookcard__author{font-family:'Cairo',sans-serif}
.pslider__nav{flex:0 0 auto;width:44px;height:44px;border-radius:50%;border:1px solid var(--line-strong);
  background:var(--card);color:var(--accent-deep);display:grid;place-items:center;cursor:pointer;
  transition:background .25s,color .25s,transform .25s,border-color .25s;box-shadow:0 6px 16px -8px rgba(13,38,63,.4)}
.pslider__nav:hover{background:var(--accent-deep);color:#fff;border-color:transparent;transform:translateY(-2px)}
.pslider__nav svg{width:20px;height:20px}
.pslider__dots{position:absolute;left:0;right:0;bottom:-28px;display:flex;justify-content:center;gap:8px}
.pslider__dot{width:8px;height:8px;border-radius:50%;border:none;padding:0;cursor:pointer;background:var(--line-strong);transition:width .25s,background .25s,border-radius .25s}
.pslider__dot.active{width:22px;border-radius:5px;background:var(--accent-deep)}
[dir="ar"] .pslide__quote,[dir="ar"] .pslide__name,[dir="ar"] .pslide__role{font-family:'Cairo',sans-serif}
@media(prefers-reduced-motion:reduce){.pslider__track{transition:none}}
@media (max-width:560px){
  .pslide{padding:26px 22px 24px;gap:10px;min-height:300px}
  .pslide__av{width:84px;height:84px;font-size:29px}
  .pslider__nav{width:38px;height:38px}
  .pslider{gap:6px}
}
/* Exceptional Experiences → B CLINIC guest comment + Amr's reply (social thread style) */
.stories__grid{display:flex;gap:22px;margin-top:8px;overflow-x:auto;scroll-snap-type:x mandatory;
  scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;padding:4px 2px 12px}
.stories__grid::-webkit-scrollbar{display:none}
.story{flex:0 0 340px;max-width:86vw;scroll-snap-align:start;position:relative;overflow:hidden;color:#fff;
  background:linear-gradient(165deg,var(--card-from),var(--card-to));border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:22px 22px 24px;
  display:flex;flex-direction:column;gap:13px;text-align:start;box-shadow:0 18px 50px -34px rgba(6,24,42,.6)}
.story__top{display:flex;align-items:center;gap:12px}
.story__av{width:54px;height:54px;border-radius:50%;flex:0 0 auto;overflow:hidden;display:grid;place-items:center;
  background:linear-gradient(150deg,var(--steel),var(--navy-2));color:#fff;font-weight:800;font-size:20px;box-shadow:0 6px 16px -6px rgba(0,0,0,.5)}
.story__av img{width:100%;height:100%;object-fit:cover}
.story__who{display:flex;flex-direction:column;min-width:0}
.story__name{font-weight:800;font-size:15.5px;color:#fff;line-height:1.2}
.story__role{font-size:12.5px;font-weight:700;color:var(--accent-2);margin-top:2px}
/* conversation bubbles on white inside the navy card */
.story__comment{font-size:14px;line-height:1.55;font-weight:600;color:var(--text);margin:0;text-wrap:pretty;
  background:#fff;border-radius:13px;padding:13px 15px;box-shadow:0 6px 18px -12px rgba(0,0,0,.4)}
.story__reply{margin-top:0;padding:12px 15px;border-radius:13px;background:#fff;box-shadow:0 6px 18px -12px rgba(0,0,0,.4);
  border-inline-start:3px solid var(--accent-2);display:flex;flex-direction:column;gap:7px}
.story__replytop{display:flex;align-items:center;gap:8px}
.story__avsm{width:28px;height:28px;border-radius:50%;flex:0 0 auto;overflow:hidden;display:grid;place-items:center;
  background:var(--accent-deep);color:#fff;font-weight:800;font-size:11px;letter-spacing:.02em}
.story__avsm img{width:100%;height:100%;object-fit:cover;object-position:top center}
.story__replytop .story__name{font-size:13.5px;color:var(--text)}
.story__tick{width:18px;height:18px;border-radius:50%;display:grid;place-items:center;background:var(--accent-deep);color:#fff;flex:0 0 auto}
.story__tick svg{width:11px;height:11px}
.story__replytext{margin:0;font-size:13px;line-height:1.55;font-weight:600;color:var(--text-soft);text-wrap:pretty;padding-inline-end:36px}
/* wrap the conversation text in quotation marks */
.story__comment,.story__replytext{quotes:"\201C" "\201D" "\2018" "\2019"}
.story__comment::before,.story__replytext::before{content:open-quote;color:var(--accent-deep);font-weight:800}
.story__comment::after,.story__replytext::after{content:close-quote;color:var(--accent-deep);font-weight:800}
[dir="ar"] .story__comment,[dir="ar"] .story__replytext{quotes:"\00AB" "\00BB"}
/* gold star corner wedge — the Exceptional Experiences section icon */
.story__seal{position:absolute;inset-inline-end:0;bottom:0;width:60px;height:60px;color:#fff;pointer-events:none;
  display:flex;align-items:flex-end;justify-content:flex-end;padding:0 12px 12px 0;
  background:radial-gradient(150% 150% at 100% 100%,var(--cc1,#f5d694) 0%,var(--cc2,#0e4673) 64%,transparent 66%)}
[dir="rtl"] .story__seal{padding:0 0 12px 12px;background:radial-gradient(150% 150% at 0% 100%,var(--cc1,#f5d694) 0%,var(--cc2,#0e4673) 64%,transparent 66%)}
.story__seal svg{width:18px;height:18px}
[dir="ar"] .story__name,[dir="ar"] .story__comment,[dir="ar"] .story__replytext,[dir="ar"] .story__role{font-family:'Cairo',sans-serif}
@media (max-width:560px){.story{padding:20px 20px 18px}}

/* ===== Exceptional Experiences — wide testimonial cards, swipe left/right (one per view) ===== */
#entitiesGrid{display:flex;flex-direction:row;gap:22px;margin-top:20px;overflow-x:auto;scroll-snap-type:x mandatory;
  scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;padding:4px 2px 14px}
#entitiesGrid::-webkit-scrollbar{display:none}
/* nudge the prev/next arrows into the side gutter so they never cover card text */
#exceptional .swipe__nav--prev{inset-inline-start:-16px}
#exceptional .swipe__nav--next{inset-inline-end:-16px}
@media (max-width:560px){#exceptional .swipe__nav--prev{inset-inline-start:-6px}#exceptional .swipe__nav--next{inset-inline-end:-6px}}

/* ===== Courses — swipe left/right like Exceptional Experiences ===== */
#coursesGrid{display:flex;flex-direction:row;gap:18px;margin-top:20px;overflow-x:auto;scroll-snap-type:x mandatory;
  scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch;padding:4px 2px 14px}
#coursesGrid::-webkit-scrollbar{display:none}
#coursesGrid .hcard{flex:0 0 clamp(230px,44%,300px);scroll-snap-align:start}
#courses .swipe__nav--prev{inset-inline-start:-16px}
#courses .swipe__nav--next{inset-inline-end:-16px}
@media (max-width:560px){#courses .swipe__nav--prev{inset-inline-start:-6px}#courses .swipe__nav--next{inset-inline-end:-6px}
  #coursesGrid .hcard{flex:0 0 80%}}
.xstory{flex:0 0 min(560px,86%);max-width:560px;scroll-snap-align:center;overflow:hidden;
  position:relative;display:grid;grid-template-columns:auto 1fr;gap:clamp(16px,3vw,30px);align-items:center;
  background:var(--card);border:1px solid var(--line);border-radius:20px;padding:clamp(18px,2.4vw,26px) clamp(22px,3.2vw,40px);
  text-decoration:none;overflow:hidden;box-shadow:0 18px 50px -34px rgba(13,38,63,.4);
  transition:transform .35s var(--ease),box-shadow .35s,border-color .35s}
.xstory:hover{transform:translateY(-4px);box-shadow:0 30px 64px -32px rgba(13,38,63,.5);border-color:color-mix(in srgb,var(--accent) 30%,transparent)}
.xstory--flip{grid-template-columns:1fr auto}
.xstory--flip .xstory__av{order:2}
.xstory--flip .xstory__body{order:1}
.xstory__av{width:clamp(70px,10vw,104px);height:clamp(70px,10vw,104px);border-radius:50%;overflow:hidden;flex:0 0 auto;
  display:grid;place-items:center;background:linear-gradient(150deg,var(--card-from),var(--card-to));
  color:#fff;font-weight:800;font-size:clamp(26px,4.5vw,40px);box-shadow:0 14px 34px -14px rgba(13,38,63,.5)}
.xstory__av img{width:100%;height:100%;object-fit:cover}
.xstory__body{min-width:0}
.xstory__mark{font-family:Georgia,serif;font-size:54px;line-height:.1;color:var(--accent);opacity:.4;display:block;height:26px}
.xstory__quote{font-size:clamp(16px,2vw,20px);line-height:1.6;font-weight:600;color:var(--text);margin:6px 0 0;text-wrap:pretty}
.xstory__foot{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-top:18px;flex-wrap:wrap}
.xstory__who{display:flex;flex-direction:column}
.xstory__name{font-weight:800;font-size:16px;color:var(--text)}
.xstory__role{font-size:13px;font-weight:700;color:var(--accent-deep);margin-top:2px}
.xstory__more{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;font-weight:700;color:var(--accent-deep)}
.xstory__seal{position:absolute;inset-inline-end:0;bottom:0;width:58px;height:58px;color:#fff;pointer-events:none;
  display:flex;align-items:flex-end;justify-content:flex-end;padding:0 12px 12px 0;
  background:radial-gradient(150% 150% at 100% 100%,#c5a159 0%,#8a6a1f 64%,transparent 66%)}
[dir="rtl"] .xstory__seal{padding:0 0 12px 12px;background:radial-gradient(150% 150% at 0% 100%,#c5a159 0%,#8a6a1f 64%,transparent 66%)}
.xstory__seal svg{width:20px;height:20px}
[dir="ar"] .xstory__quote,[dir="ar"] .xstory__name,[dir="ar"] .xstory__role{font-family:'Cairo',sans-serif}
@media(max-width:680px){
  .xstory,.xstory--flip{grid-template-columns:1fr;justify-items:center;text-align:center;gap:16px}
  .xstory--flip .xstory__av,.xstory--flip .xstory__body{order:0}
  .xstory__foot{flex-direction:column;align-items:center}
}
.tcarousel{position:relative}
.tcarousel__viewport{overflow:hidden}
.tcarousel__track{display:flex;transition:transform .6s var(--ease)}
.tslide{flex:0 0 100%;padding-inline:4px}
.tcard{
  background:var(--card);border-radius:var(--r-lg);padding:clamp(30px,4vw,54px);
  display:grid;grid-template-columns:auto 1fr;gap:clamp(26px,4vw,52px);align-items:center;
  box-shadow:var(--shadow-md);border:1px solid var(--line);
}
.tcard__person{text-align:center;width:200px}
.tcard__avatar{
  width:118px;height:118px;border-radius:50%;margin:0 auto 16px;display:grid;place-items:center;
  font-size:38px;font-weight:800;color:#fff;
  background:linear-gradient(150deg,var(--accent),var(--navy-2));box-shadow:0 16px 34px -14px color-mix(in srgb,var(--accent) 70%,transparent)
}
.tcard__person .nm{font-weight:800;font-size:17px;color:var(--text)}
.tcard__person .ro{font-size:13px;color:var(--text-faint);font-weight:600;margin-top:3px}
.tcard__stars{display:flex;gap:3px;justify-content:center;margin-top:10px;color:var(--gold)}
.tcard__stars svg{width:16px;height:16px}
.tcard__quote .mark{font-family:Georgia,serif;font-size:64px;font-weight:800;color:color-mix(in srgb,var(--accent) 26%,transparent);line-height:.4}
.tcard__quote p{font-size:clamp(16px,1.8vw,21px);line-height:1.55;color:var(--text);font-weight:500;margin-top:14px;text-wrap:pretty}
.tcarousel__nav{display:flex;align-items:center;justify-content:center;gap:18px;margin-top:34px}
.tcarousel__dots{display:flex;gap:8px}
.tcarousel__dots button{width:9px;height:9px;border-radius:50%;background:var(--line-strong);transition:all .3s}
.tcarousel__dots button.active{background:var(--accent);width:26px;border-radius:5px}
.tc-arrow{width:48px;height:48px;border-radius:50%;border:1.5px solid var(--line-strong);display:grid;place-items:center;color:var(--text-soft);transition:all .3s;background:#fff}
.tc-arrow:hover{background:var(--accent);color:#fff;border-color:var(--accent)}
.tc-arrow svg{width:20px;height:20px}
body[dir="rtl"] .tc-arrow svg{transform:scaleX(-1)}

/* ---------- MENTORS ---------- */
.mentors__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.mentor{
  background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);padding:24px 20px;text-align:center;
  transition:transform .35s var(--ease),box-shadow .35s,border-color .35s;
}
.mentor:hover{transform:translateY(-5px);box-shadow:var(--shadow-sm);border-color:color-mix(in srgb,var(--accent) 30%,transparent)}
.mentor__av{width:64px;height:64px;border-radius:50%;margin:0 auto 14px;display:grid;place-items:center;font-weight:800;font-size:20px;color:#fff;background:linear-gradient(150deg,var(--steel),var(--navy-2))}
.mentor__av--photo{overflow:hidden;padding:0}
.mentor__av--photo img{width:100%;height:100%;object-fit:cover;display:block}
.mentor .nm{font-weight:700;font-size:14.5px;color:var(--text);line-height:1.25}
.mentor .ro{font-size:12px;color:var(--text-faint);margin-top:4px}
a.mentor{display:block;text-decoration:none;color:inherit}
.mentor__net{position:absolute;top:12px;inset-inline-end:12px;width:18px;height:18px;color:var(--text-faint);opacity:.7;transition:color .25s,opacity .25s}
.mentor{position:relative}
a.mentor:hover .mentor__net{color:var(--accent-deep);opacity:1}
.mentor__net svg{width:100%;height:100%}

/* ---------- EXCEPTIONAL EXPERIENCES (entities) ---------- */
.entities__grid{display:grid;grid-template-columns:repeat(5,1fr);gap:18px}
.entity{position:relative;background:var(--card);border:1px solid var(--line);border-radius:var(--r-md);padding:26px 18px 22px;text-align:center;transition:transform .35s var(--ease),box-shadow .35s,border-color .35s}
.entity:hover{transform:translateY(-5px);box-shadow:var(--shadow-sm);border-color:color-mix(in srgb,var(--accent) 30%,transparent)}
.entity__logo{width:84px;height:84px;margin:0 auto 14px}
.entity__logo image-slot{width:100%;height:100%;display:block}
.entity__logo image-slot img{width:100%;height:100%;object-fit:contain}
.entity__name{font-weight:700;font-size:13.5px;color:var(--text);line-height:1.3}
.entity__seal{position:absolute;top:12px;inset-inline-end:12px;width:18px;height:18px;color:color-mix(in srgb,var(--accent) 55%,transparent)}
.entity__seal svg{width:100%;height:100%}
.center{text-align:center}

/* ---------- CTA BAND ---------- */
.cta{
  position:relative;overflow:hidden;color:#fff;text-align:center;
  background:
    radial-gradient(80% 130% at 50% 0%,color-mix(in srgb,var(--accent) 38%,transparent),transparent 60%),
    linear-gradient(160deg,var(--navy-2),var(--ink));
}
.cta__inner{position:relative;z-index:2;max-width:760px;margin:0 auto;text-align:center}
.cta h2{font-size:clamp(30px,4.4vw,54px);font-weight:800;letter-spacing:-.02em;line-height:1.05;margin-bottom:18px;text-wrap:balance}
.cta p{font-size:18px;color:#a9c4d6;margin-bottom:34px;max-width:54ch;margin-inline:auto;text-wrap:pretty}
.cta__actions{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.cta__wm{position:absolute;inset-inline-end:-3%;bottom:-20%;width:min(40vw,460px);opacity:.05;filter:brightness(0) invert(1)}

/* ---------- FOOTER ---------- */
.footer{background:var(--ink);color:#fff;padding:64px 0 0}
.footer__grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.2fr;gap:40px;padding-bottom:48px}
.footer__brand img{width:auto;height:34px;margin-bottom:16px;display:block;filter:brightness(0) invert(1)}
.footer__brand p{font-size:14px;color:#8fa9bb;max-width:34ch;text-wrap:pretty}
.footer__brand .socials{display:flex;gap:9px;margin-top:20px}
.footer__brand .socials a{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.06);color:#cfe0ec;transition:all .3s}
.footer__brand .socials a:hover{background:var(--accent);color:#fff;transform:translateY(-2px)}
.footer__brand .socials svg{width:16px;height:16px}
.footer__col h4{font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#fff;margin-bottom:18px}
.footer__col a{display:block;font-size:14.5px;color:#8fa9bb;padding:6px 0;transition:color .25s}
.footer__col a:hover{color:var(--accent-2)}
.footer__contact a{display:flex;align-items:center;gap:10px;color:#cfe0ec;font-size:14.5px;padding:7px 0}
.footer__contact svg{width:17px;height:17px;color:var(--accent-2);flex-shrink:0}
.footer__bar{border-top:1px solid rgba(255,255,255,.08);padding:24px 0;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;font-size:13px;color:#6e879a}
.footer__bar a:hover{color:#fff}

/* ---------- WHATSAPP FAB ---------- */
.wa-fab{
  position:fixed;bottom:26px;inset-inline-end:26px;z-index:70;
  display:flex;align-items:center;gap:11px;padding:12px 22px 12px 14px;border-radius:100px;
  background:linear-gradient(145deg,#25d366,#128c4b);color:#fff;font-weight:700;font-size:14.5px;
  box-shadow:0 12px 30px -8px rgba(18,140,75,.6),inset 0 1px 0 rgba(255,255,255,.25);
  backdrop-filter:saturate(1.2);
  transition:transform .35s var(--ease),box-shadow .35s;
  animation:wafloat 4.5s ease-in-out infinite;will-change:transform;
}
.wa-fab::before{content:"";position:absolute;inset:0;border-radius:inherit;background:#25d366;z-index:-1;animation:wapulse 2.4s ease-out infinite}
.wa-fab:hover{transform:translateY(-4px) scale(1.04);box-shadow:0 22px 46px -10px rgba(18,140,75,.75),inset 0 1px 0 rgba(255,255,255,.3)}
.wa-fab svg{width:24px;height:24px;filter:drop-shadow(0 1px 1px rgba(0,0,0,.18))}
body[dir="rtl"] .wa-fab{padding:12px 14px 12px 22px}
@keyframes wafloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes wapulse{0%{opacity:.55;transform:scale(1)}70%,100%{opacity:0;transform:scale(1.5)}}
@media(prefers-reduced-motion:reduce){.wa-fab{animation:none}.wa-fab::before{animation:none;opacity:0}}

/* ============================================================
   REVEAL ANIMATIONS
   ============================================================ */
@media (prefers-reduced-motion:no-preference){
  .reveal{opacity:0;transform:translateY(34px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
  .reveal.in{opacity:1;transform:none}
  .reveal[data-d="1"]{transition-delay:.08s}
  .reveal[data-d="2"]{transition-delay:.16s}
  .reveal[data-d="3"]{transition-delay:.24s}
  .reveal[data-d="4"]{transition-delay:.32s}
  .reveal[data-d="5"]{transition-delay:.4s}
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:1080px){
  .nav__links{display:none}
  .nav__burger{display:grid}
  .nav__socials{display:none}
  .exp-cards{grid-template-columns:repeat(2,1fr)}
  .honors__grid{grid-template-columns:repeat(2,1fr)}
  .honors-metrics{grid-template-columns:repeat(2,1fr);gap:24px}
  .mentors__grid{grid-template-columns:repeat(3,1fr)}
  .entities__grid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:880px){
  .hero{align-items:center;padding-top:90px}
  .hero__inner{grid-template-columns:1fr;padding-top:118px}
  .hero__copy{padding-bottom:30px;order:2;text-align:center;margin-inline:auto}
  .hero__eyebrow,.hero__actions{justify-content:center}
  .hero__role{justify-content:center}
  .hero__portrait-wrap{order:1}
  .hero__figure{height:46vh;min-height:340px}
  .profile-card{left:50%;inset-inline-end:auto;top:auto;bottom:2%;transform:translateX(-50%);animation:floatyCardM 5s ease-in-out infinite;
    gap:10px;padding:8px 15px 8px 9px;border-radius:40px}
  .profile-card .pc-logo{width:38px;height:38px}
  .profile-card .pc-loc{font-size:10.5px}
  .profile-card .pc-role{font-size:11px}
  .hero__name .scribble{margin-inline:auto}
  .hero__sign{margin-inline:auto}
  .bio__grid,.two-col{grid-template-columns:1fr}
  .bio__quote{position:static;margin-top:24px;max-width:none;inset-inline-end:auto}
  .tcard{grid-template-columns:1fr;text-align:center}
  .tcard__person{width:auto;margin:0 auto}
  .footer__grid{grid-template-columns:1fr 1fr;gap:32px}
  .nav__cta{display:none}
}
/* Experience → horizontal swipe carousel on mobile (per Amr) */
@media (max-width:720px){
  .exp-cards{display:flex;grid-template-columns:none;overflow-x:auto;scroll-snap-type:x mandatory;
    gap:14px;padding-bottom:10px;margin-inline:calc(var(--pad) * -1);padding-inline:var(--pad);
    -webkit-overflow-scrolling:touch;scrollbar-width:none}
  .exp-cards::-webkit-scrollbar{display:none}
  .exp-card{flex:0 0 82%;scroll-snap-align:center}
}
@media (max-width:560px){
  .honors__grid,.mentors__grid{grid-template-columns:1fr}
  .entities__grid{grid-template-columns:repeat(2,1fr)}
  .footer__grid{grid-template-columns:1fr}
  .bio__statrow{gap:24px}
  .wa-fab span{display:none}
  .wa-fab{padding:14px;border-radius:50%}
  .lang-toggle{font-size:14px}
  .lang-toggle button{min-width:48px;padding:11px 8px}
}

/* mobile menu */
.mobile-menu{
  position:fixed;inset:0;z-index:90;background:linear-gradient(160deg,var(--navy-1),var(--ink));
  display:flex;flex-direction:column;padding:90px var(--pad) 40px;gap:6px;
  transform:translateY(-100%);transition:transform .5s var(--ease);visibility:hidden;
}
.mobile-menu.open{transform:none;visibility:visible}
.mobile-menu a{font-size:26px;font-weight:700;color:#fff;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.mobile-menu .mm-close{position:absolute;top:24px;inset-inline-end:var(--pad);width:46px;height:46px;color:#fff;display:grid;place-items:center}
.mobile-menu .mm-close svg{width:30px;height:30px}
.mobile-menu .mm-foot{margin-top:auto;display:flex;gap:14px;align-items:center}
/* mobile menu is a dark overlay — keep its EN/AR toggle light like the hero nav */
.mobile-menu .lang-toggle{border-color:rgba(255,255,255,.22)}
.mobile-menu .lang-toggle button:not(.active){color:rgba(255,255,255,.75)}

/* ---------- consultation form (contact CTA) ---------- */
.cta-form{max-width:620px;margin:32px auto 0;text-align:start}
.cta-form__hp{position:absolute;width:1px;height:1px;padding:0;margin:-1px;border:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.cta-form__row{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}
.cta-form input,.cta-form textarea{
  width:100%;font:inherit;font-size:15px;color:#fff;background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.18);border-radius:12px;padding:13px 16px;transition:border-color .2s,background .2s;
}
.cta-form textarea{margin-bottom:16px;resize:vertical;min-height:96px;display:block}
.cta-form input::placeholder,.cta-form textarea::placeholder{color:rgba(255,255,255,.55)}
.cta-form input:focus,.cta-form textarea:focus{outline:none;border-color:rgba(255,255,255,.6);background:rgba(255,255,255,.13)}
.cta-form__foot{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.cta-form__foot .btn{cursor:pointer;border:none}
.cta-form__status{margin:14px 0 0;font-size:14px;font-weight:600;min-height:20px;color:rgba(255,255,255,.85)}
.cta-form__status.ok{color:#7ee0a8}
.cta-form__status.err{color:#ffb4a8}
@media(max-width:560px){.cta-form__row{grid-template-columns:1fr}}

/* ============================================================
   ARABIC / RTL refinements — Arabic script needs no negative
   letter-spacing and a little more line-height so it reads
   open and uncrowded (per Amr's "معجوق" note 2026-06-13).
   ============================================================ */
[dir="rtl"] h1,[dir="rtl"] h2,[dir="rtl"] h3,[dir="rtl"] h4,
[dir="rtl"] .hero__name,[dir="rtl"] .section-title,[dir="rtl"] .philo__head,
[dir="rtl"] .hl,[dir="rtl"] .eyebrow{letter-spacing:0}
[dir="rtl"] .hero__name{font-size:clamp(28px,4.4vw,54px);line-height:1.2;white-space:nowrap}
[dir="rtl"] .section-title{line-height:1.45}
[dir="rtl"] p,[dir="rtl"] .lead,[dir="rtl"] .hero__tagline,
[dir="rtl"] .philo__sub,[dir="rtl"] .pslide__quote,
[dir="rtl"] .exp-card__desc,[dir="rtl"] .friend-card__body p{line-height:1.9}
[dir="rtl"] .hero__role,[dir="rtl"] .exp-card__meta{letter-spacing:0;line-height:1.7}
[dir="rtl"] .eyebrow{font-weight:700}
/* a touch more breathing room between Arabic words in tight chips */
[dir="rtl"] .hchip,[dir="rtl"] .nav__links a,[dir="rtl"] .mobile-menu a{letter-spacing:0}

/* Hero layout mirrors with language: EN → photo LEFT / copy RIGHT;
   AR → photo RIGHT / copy LEFT (natural RTL flip of the grid).
   The grid keeps its native direction so the columns flip automatically;
   the copy column just inherits RTL text flow. */
[dir="rtl"] .hero__copy{text-align:right}
[dir="rtl"] .hero__eyebrow{align-self:flex-end}