/* ==========================================================================
   ROOT RESET — InBio's parent style.css sets html{font-size:10px}, which
   silently scaled this entire rem-based type system to 62.5%. brand.css only
   loads on the Anas Home template, so restoring 100% here is safe and scoped.
   This is THE fix for "typography is too small".
   ========================================================================== */
html { font-size: 100% !important; }

/* ==========================================================================
   Anas Alassi — design system v2
   Rebuilt after visual audit. Larger type, real spacing scale, layered depth.
   ========================================================================== */

/* ---------- TOKENS ------------------------------------------------------- */
:root {
  --aa-navy:#183054; --aa-blue:#3C78A8; --aa-wine:#90243C;

  --accent:#5AA6E4; --accent-strong:#7FC0F5; --accent-dim:rgba(90,166,228,.13);
  --accent-ring:rgba(90,166,228,.40); --accent-ink:#04121F;

  /* surfaces — lifted from near-black so elevation is readable */
  --bg:#0A0D14; --bg-2:#0D1220;
  --surface:#131A29; --surface-2:#1B2436; --surface-3:#232E44;
  --line:rgba(150,180,220,.13); --line-2:rgba(150,180,220,.24);

  /* text — brighter than v1; --text-3 was too weak to read */
  --text:#F2F5F9; --text-2:#BAC6D6; --text-3:#8B9AAF;

  --font-ui:'Inter',ui-sans-serif,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
  --font-ar:'IBM Plex Sans Arabic','Noto Sans Arabic',Tahoma,sans-serif;

  /* TYPE SCALE — body never below 16px, long-form 17–19px */
  --t-micro: clamp(.8125rem, .78rem + .12vw, .875rem);   /* 13–14 */
  --t-small: clamp(.9375rem, .9rem + .18vw, 1rem);       /* 15–16 */
  --t-body:  clamp(1.0625rem, 1rem + .32vw, 1.1875rem);  /* 17–19 */
  --t-lead:  clamp(1.1875rem, 1.08rem + .55vw, 1.4375rem);/* 19–23 */
  --t-h3:    clamp(1.25rem, 1.12rem + .6vw, 1.625rem);   /* 20–26 */
  --t-h2:    clamp(2rem, 1.5rem + 2.1vw, 3.25rem);       /* 32–52 */
  --t-h1:    clamp(2.75rem, 1.9rem + 4.2vw, 5.25rem);    /* 44–84 */

  --lh-tight:1.06; --lh-head:1.14; --lh-body:1.72;
  --measure:64ch;

  /* SPACING — single 4px-based scale used everywhere */
  --s1:.25rem; --s2:.5rem;  --s3:.75rem; --s4:1rem;   --s5:1.5rem;
  --s6:2rem;   --s7:2.75rem; --s8:3.5rem; --s9:4.5rem; --s10:6rem; --s11:8rem;
  --sec-y: clamp(4rem, 8vw, 7.5rem);

  --radius:16px; --radius-lg:24px; --radius-sm:10px;
  --container:1240px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --tap:44px;
}

:root[data-accent="violet"]  { --accent:#9A8CFF; --accent-strong:#B4A8FF; --accent-dim:rgba(154,140,255,.14); --accent-ring:rgba(154,140,255,.42); --accent-ink:#0A0620; }
:root[data-accent="emerald"] { --accent:#3ADCB0; --accent-strong:#6BEBC8; --accent-dim:rgba(58,220,176,.14); --accent-ring:rgba(58,220,176,.42); --accent-ink:#02150F; }
:root[data-accent="amber"]   { --accent:#F5BC55; --accent-strong:#FFD07C; --accent-dim:rgba(245,188,85,.15); --accent-ring:rgba(245,188,85,.42); --accent-ink:#1A1002; }

:root[data-theme="light"] {
  --bg:#F6F8FC; --bg-2:#FFFFFF; --surface:#FFFFFF; --surface-2:#EEF2F8; --surface-3:#E3EAF4;
  --line:rgba(16,30,50,.11); --line-2:rgba(16,30,50,.20);
  --text:#0C1524; --text-2:#41536C; --text-3:#5F7085;
  --accent:#1B6AAE; --accent-strong:#12558D; --accent-dim:rgba(27,106,174,.09);
  --accent-ring:rgba(27,106,174,.32); --accent-ink:#FFFFFF;
}
:root[data-theme="light"][data-accent="violet"]  { --accent:#5B45D6; --accent-strong:#4632AE; --accent-dim:rgba(91,69,214,.09); --accent-ring:rgba(91,69,214,.32); }
:root[data-theme="light"][data-accent="emerald"] { --accent:#0A8465; --accent-strong:#076B51; --accent-dim:rgba(10,132,101,.09); --accent-ring:rgba(10,132,101,.32); }
:root[data-theme="light"][data-accent="amber"]   { --accent:#9A6205; --accent-strong:#7D4F04; --accent-dim:rgba(154,98,5,.09); --accent-ring:rgba(154,98,5,.32); }

/* ---------- BASE --------------------------------------------------------- */
body.aa-home {
  background:var(--bg); color:var(--text);
  font-family:var(--font-ui); font-size:var(--t-body); line-height:var(--lh-body);
  margin:0; -webkit-font-smoothing:antialiased; overflow-x:hidden;
  font-synthesis-weight:none;
}
html[lang^="ar"] body.aa-home { font-family:var(--font-ar); line-height:1.85; }
.aa-home *,.aa-home *::before,.aa-home *::after { box-sizing:border-box; }
.aa-home a { color:inherit; text-decoration:none; }
.aa-home img { max-width:100%; height:auto; }

/* ambient atmosphere — stops the near-black reading as flat/empty */
body.aa-home::before {
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size:76px 76px;
  opacity:.28;
  mask-image:radial-gradient(ellipse 90% 60% at 50% 0%, #000 30%, transparent 78%);
}
body.aa-home::after {
  content:""; position:fixed; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(60rem 40rem at 12% -8%, var(--accent-dim), transparent 62%),
    radial-gradient(48rem 34rem at 92% 6%, rgba(144,36,60,.10), transparent 60%);
}
body.aa-home > * { position:relative; z-index:1; }

.aa-wrap { width:min(100% - 2.75rem, var(--container)); margin-inline:auto; }
@media (max-width:600px){ .aa-wrap{ width:min(100% - 2rem, var(--container)); } }

.aa-home :focus-visible { outline:2px solid var(--accent); outline-offset:3px; border-radius:8px; }
.aa-skip { position:absolute; left:-9999px; top:0; z-index:200; background:var(--accent);
  color:var(--accent-ink); padding:var(--s3) var(--s4); border-radius:0 0 10px 0; font-weight:600; }
.aa-skip:focus { left:0; }

/* ---------- TYPE HELPERS ------------------------------------------------- */
.aa-home h1,.aa-home h2,.aa-home h3 { font-family:inherit; color:var(--text); margin:0; }
.aa-home h1 { font-size:var(--t-h1); line-height:var(--lh-tight); letter-spacing:-.035em; font-weight:700; }
.aa-home h2 { font-size:var(--t-h2); line-height:var(--lh-head); letter-spacing:-.028em; font-weight:700; }
.aa-home h3 { font-size:var(--t-h3); line-height:1.25; letter-spacing:-.015em; font-weight:600; }
.aa-prose { max-width:var(--measure); color:var(--text-2); }
.aa-prose p { margin:0 0 var(--s4); }
.aa-prose p:last-child { margin-bottom:0; }

.aa-kicker {
  display:inline-flex; align-items:center; gap:var(--s2);
  font-size:var(--t-micro); font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  color:var(--accent-strong); margin-bottom:var(--s4);
}
.aa-kicker::before { content:""; width:26px; height:2px; background:currentColor; border-radius:2px; opacity:.7; }

/* ---------- BUTTONS — min 44px tap target -------------------------------- */
.aa-btn {
  display:inline-flex; align-items:center; justify-content:center; gap:var(--s2);
  min-height:var(--tap); padding:var(--s3) var(--s5);
  border-radius:12px; font-size:var(--t-small); font-weight:600; letter-spacing:.005em;
  border:1px solid transparent; cursor:pointer; white-space:nowrap;
  transition:transform .18s var(--ease), background .22s var(--ease),
             border-color .22s var(--ease), box-shadow .28s var(--ease), color .22s var(--ease);
}
.aa-btn:hover { transform:translateY(-2px); }
.aa-btn:active { transform:translateY(0); }
.aa-btn--primary { background:var(--accent); color:var(--accent-ink);
  box-shadow:0 10px 30px -12px var(--accent-ring); }
.aa-btn--primary:hover { background:var(--accent-strong); box-shadow:0 16px 40px -14px var(--accent-ring); }
.aa-btn--ghost { border-color:var(--line-2); color:var(--text); background:color-mix(in srgb,var(--surface) 60%, transparent); }
.aa-btn--ghost:hover { border-color:var(--accent); color:var(--accent-strong); background:var(--accent-dim); }
.aa-btn--quiet { color:var(--text-2); border-color:transparent; }
.aa-btn--quiet:hover { color:var(--text); background:var(--surface); }
.aa-btn--lg { min-height:52px; padding:var(--s4) var(--s6); font-size:var(--t-body); }

/* ---------- HEADER ------------------------------------------------------- */
.aa-header {
  position:sticky; top:0; z-index:90;
  background:color-mix(in srgb, var(--bg) 76%, transparent);
  backdrop-filter:saturate(160%) blur(18px);
  border-bottom:1px solid transparent;
  transition:border-color .3s var(--ease), background .3s var(--ease);
}
.aa-header.is-stuck { border-bottom-color:var(--line); background:color-mix(in srgb, var(--bg) 92%, transparent); }
.aa-header__in { display:flex; align-items:center; gap:var(--s5); min-height:80px; }

.aa-brand { display:flex; align-items:center; gap:var(--s3); flex:0 0 auto; }
.aa-brand img { height:42px; width:auto; display:block; }
.aa-brand__txt { display:flex; flex-direction:column; line-height:1.2; }
.aa-brand__name { font-weight:650; letter-spacing:-.02em; font-size:1.0625rem; color:var(--text); }
.aa-brand__role { font-size:var(--t-micro); color:var(--text-3); letter-spacing:.06em; text-transform:uppercase; }

.aa-nav { display:flex; gap:var(--s1); margin-inline-start:auto; }
.aa-nav a {
  position:relative; display:flex; align-items:center; min-height:var(--tap);
  padding:0 var(--s4); border-radius:10px;
  font-size:var(--t-small); color:var(--text-2); font-weight:500;
  transition:color .2s var(--ease), background .2s var(--ease);
}
.aa-nav a:hover { color:var(--text); background:var(--surface); }
.aa-nav a.is-active { color:var(--text); }
.aa-nav a.is-active::after {
  content:""; position:absolute; inset-inline:var(--s4); bottom:10px; height:2px;
  background:var(--accent); border-radius:2px;
}
.aa-actions { display:flex; align-items:center; gap:var(--s2); flex:0 0 auto; margin-inline-start:var(--s4); }

/* language pill */
.aa-lang { display:flex; border:1px solid var(--line); border-radius:11px; overflow:hidden; }
.aa-lang a {
  min-height:var(--tap); display:flex; align-items:center; padding:0 var(--s3);
  font-size:var(--t-micro); font-weight:600; color:var(--text-3); letter-spacing:.04em;
  transition:.2s var(--ease);
}
.aa-lang a[aria-current="true"] { background:var(--accent-dim); color:var(--accent-strong); }
.aa-lang a:hover { color:var(--text); }

.aa-appear__btn {
  width:var(--tap); height:var(--tap); display:grid; place-items:center;
  border-radius:11px; border:1px solid var(--line); background:var(--surface);
  color:var(--text-2); cursor:pointer; transition:.2s var(--ease);
}
.aa-appear__btn:hover { border-color:var(--accent); color:var(--accent-strong); }
.aa-appear { position:relative; }
.aa-appear__pop {
  position:absolute; inset-inline-end:0; top:calc(100% + var(--s3)); width:264px;
  background:var(--surface); border:1px solid var(--line-2); border-radius:var(--radius);
  padding:var(--s4); box-shadow:0 30px 70px -28px rgba(0,0,0,.85); display:none; z-index:120;
}
.aa-appear__pop[data-open="true"] { display:block; }
.aa-appear__lbl { font-size:var(--t-micro); text-transform:uppercase; letter-spacing:.1em;
  color:var(--text-3); margin:0 0 var(--s2); font-weight:600; }
.aa-seg { display:grid; grid-template-columns:1fr 1fr; gap:var(--s2); margin-bottom:var(--s4); }
.aa-seg button { min-height:40px; border-radius:10px; border:1px solid var(--line);
  background:transparent; color:var(--text-2); font-size:var(--t-small); cursor:pointer; transition:.18s var(--ease); }
.aa-seg button[aria-pressed="true"] { background:var(--accent-dim); border-color:var(--accent); color:var(--text); }
.aa-swatches { display:flex; gap:var(--s2); margin-bottom:var(--s4); }
.aa-swatch { width:40px; height:40px; border-radius:11px; cursor:pointer;
  border:2px solid transparent; outline:1px solid var(--line); outline-offset:-1px; transition:.18s var(--ease); }
.aa-swatch[aria-pressed="true"] { border-color:var(--text); }
.aa-swatch[data-a="blue"]{background:linear-gradient(135deg,#5AA6E4,#183054)}
.aa-swatch[data-a="violet"]{background:linear-gradient(135deg,#9A8CFF,#3A2A8F)}
.aa-swatch[data-a="emerald"]{background:linear-gradient(135deg,#3ADCB0,#0A6B52)}
.aa-swatch[data-a="amber"]{background:linear-gradient(135deg,#F5BC55,#8A5605)}
.aa-reset { width:100%; min-height:40px; border-radius:10px; border:1px solid var(--line);
  background:transparent; color:var(--text-3); font-size:var(--t-micro); cursor:pointer; }
.aa-reset:hover { color:var(--text); border-color:var(--line-2); }

/* mobile menu */
.aa-burger { display:none; width:var(--tap); height:var(--tap); border-radius:11px;
  border:1px solid var(--line); background:var(--surface); color:var(--text); cursor:pointer;
  place-items:center; }
.aa-mobnav {
  display:none; position:fixed; inset:80px 0 0; z-index:88;
  background:color-mix(in srgb,var(--bg) 97%, transparent); backdrop-filter:blur(20px);
  padding:var(--s6) var(--s5) var(--s8); overflow-y:auto;
}
.aa-mobnav[data-open="true"] { display:block; }
.aa-mobnav a.aa-mobnav__l {
  display:flex; align-items:center; min-height:56px; font-size:var(--t-h3);
  font-weight:600; color:var(--text); border-bottom:1px solid var(--line);
}
.aa-mobnav .aa-cta { margin-top:var(--s6); flex-direction:column; }
.aa-mobnav .aa-btn { width:100%; }

/* ---------- HERO --------------------------------------------------------- */
.aa-hero { position:relative; padding-block:clamp(3rem,7vw,6rem) clamp(3.5rem,7vw,6rem); }
.aa-hero__grid { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);
  gap:clamp(2.5rem,5vw,5rem); align-items:center; }

.aa-avail {
  display:inline-flex; align-items:center; gap:var(--s3); min-height:40px;
  padding:0 var(--s4); border:1px solid var(--line-2); border-radius:999px;
  background:color-mix(in srgb,var(--surface) 75%, transparent);
  font-size:var(--t-small); color:var(--text-2); margin-bottom:var(--s5);
}
.aa-dot { width:8px; height:8px; border-radius:50%; background:#3ADCB0; position:relative; flex:0 0 auto; }
.aa-dot::after { content:""; position:absolute; inset:0; border-radius:50%; background:inherit;
  animation:aa-pulse 2.6s var(--ease) infinite; }
@keyframes aa-pulse { 0%{transform:scale(1);opacity:.75} 70%{transform:scale(2.8);opacity:0} 100%{opacity:0} }

.aa-hero h1 { margin-bottom:var(--s3); }
.aa-hero__role { font-size:var(--t-lead); color:var(--text); font-weight:500;
  margin:0 0 var(--s4); letter-spacing:-.012em; }
.aa-hero__role b { color:var(--accent-strong); font-weight:600; }
.aa-hero__sum { font-size:var(--t-body); color:var(--text-2); max-width:54ch; margin:0 0 var(--s5); }
.aa-place { display:inline-flex; align-items:center; gap:var(--s2); font-size:var(--t-small);
  color:var(--text-3); margin-bottom:var(--s6); }

.aa-cta { display:flex; flex-wrap:wrap; gap:var(--s3); align-items:center; }
.aa-iconbtn {
  width:var(--tap); height:var(--tap); display:grid; place-items:center; border-radius:12px;
  border:1px solid var(--line-2); color:var(--text-2); transition:.2s var(--ease);
}
.aa-iconbtn:hover { border-color:var(--accent); color:var(--accent-strong); background:var(--accent-dim); transform:translateY(-2px); }

.aa-sig { margin-top:var(--s7); font-size:var(--t-lead); color:var(--text-2); letter-spacing:-.015em; font-weight:500; }
.aa-sig b { font-weight:650; color:var(--text); }
.aa-tomorrow {
  font-weight:700;
  background:linear-gradient(100deg,var(--accent) 0%,var(--accent-strong) 42%,var(--aa-wine) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent;
  background-size:230% 100%; animation:aa-sheen 10s var(--ease) infinite;
}
@keyframes aa-sheen { 0%,100%{background-position:0 0} 50%{background-position:100% 0} }

/* portrait — framed, not a giant empty box */
.aa-portrait { position:relative; }
.aa-portrait__frame {
  position:relative; border-radius:var(--radius-lg); overflow:hidden;
  border:1px solid var(--line-2); aspect-ratio:4/4.6; display:grid; place-items:center;
  background:
    radial-gradient(120% 90% at 50% 0%, var(--accent-dim), transparent 60%),
    linear-gradient(160deg,var(--surface-2),var(--surface));
  box-shadow:0 40px 90px -50px rgba(0,0,0,.9), inset 0 1px 0 rgba(255,255,255,.05);
}
.aa-portrait__frame img { width:100%; height:100%; object-fit:cover; }
.aa-portrait__ph { text-align:center; padding:var(--s6); }
.aa-portrait__ph strong { display:block; color:var(--text-2); font-size:var(--t-h3); margin-bottom:var(--s2); font-weight:600; }
.aa-portrait__ph span { color:var(--text-3); font-size:var(--t-small); }
.aa-portrait__mark { width:56px; height:56px; margin:0 auto var(--s4); opacity:.5; }

/* ---------- TRUST STRIP -------------------------------------------------- */
.aa-trust { border-block:1px solid var(--line); background:color-mix(in srgb,var(--bg-2) 70%, transparent); }
.aa-trust__grid { display:grid; grid-template-columns:repeat(4,1fr); }
.aa-trust__i { padding:var(--s6) var(--s5); border-inline-start:1px solid var(--line); }
.aa-trust__i:first-child { border-inline-start:0; padding-inline-start:0; }
.aa-trust__i svg { color:var(--accent); margin-bottom:var(--s3); display:block; }
.aa-trust__i b { display:block; font-size:var(--t-small); font-weight:650; color:var(--text); margin-bottom:var(--s1); }
.aa-trust__i span { font-size:var(--t-small); color:var(--text-3); line-height:1.55; display:block; }

/* ---------- SECTIONS ----------------------------------------------------- */
.aa-sec { padding-block:var(--sec-y); position:relative; }
.aa-sec--alt { background:color-mix(in srgb,var(--bg-2) 60%, transparent); }
.aa-sec__head { max-width:58ch; margin-bottom:clamp(2.5rem,5vw,4rem); }
.aa-sec__lead { color:var(--text-2); font-size:var(--t-lead); margin:var(--s4) 0 0; }

/* ---------- FLAGSHIP SYSTEMS — differentiated, not identical cards ------- */
.aa-flags { display:grid; gap:var(--s5); }
.aa-flag {
  position:relative; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);
  border:1px solid var(--line); border-radius:var(--radius-lg); overflow:hidden;
  background:linear-gradient(150deg,var(--surface),color-mix(in srgb,var(--surface) 55%, transparent));
  transition:border-color .35s var(--ease), transform .35s var(--ease), box-shadow .35s var(--ease);
}
.aa-flag:hover { border-color:var(--line-2); transform:translateY(-4px);
  box-shadow:0 40px 80px -50px rgba(0,0,0,.85); }
.aa-flag:nth-child(even) { grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); }
.aa-flag:nth-child(even) .aa-flag__vis { order:2; border-inline-start:1px solid var(--line); border-inline-end:0; }

.aa-flag__vis {
  position:relative; min-height:300px; border-inline-end:1px solid var(--line);
  display:grid; place-items:center; overflow:hidden;
  background:
    radial-gradient(120% 100% at 30% 0%, var(--accent-dim), transparent 62%),
    linear-gradient(150deg,var(--surface-2),var(--surface-3));
}
.aa-flag__vis::before {
  content:""; position:absolute; inset:0;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:38px 38px; opacity:.5;
  mask-image:radial-gradient(ellipse 80% 70% at 50% 40%, #000 20%, transparent 75%);
}
.aa-flag__ph { position:relative; text-align:center; padding:var(--s5); }
.aa-flag__ph svg { color:var(--text-3); opacity:.5; margin-bottom:var(--s3); }
.aa-flag__ph span { display:block; font-size:var(--t-micro); color:var(--text-3); letter-spacing:.05em; text-transform:uppercase; }

.aa-flag__body { padding:clamp(1.75rem,3vw,2.75rem); display:flex; flex-direction:column; }
.aa-flag__meta { display:flex; flex-wrap:wrap; gap:var(--s2); margin-bottom:var(--s4); }
.aa-chip {
  font-size:var(--t-micro); padding:var(--s1) var(--s3); border-radius:999px;
  border:1px solid var(--line); color:var(--text-3); background:color-mix(in srgb,var(--surface-2) 60%, transparent);
}
.aa-chip--live { border-color:rgba(58,220,176,.45); color:#3ADCB0; }
.aa-chip--private { border-color:rgba(245,188,85,.45); color:#F5BC55; }
.aa-flag h3 { margin-bottom:var(--s3); }
.aa-flag__desc { color:var(--text-2); font-size:var(--t-body); margin:0 0 var(--s5); max-width:52ch; }
.aa-flag__list { list-style:none; padding:0; margin:0 0 var(--s6); display:grid; gap:var(--s2); }
.aa-flag__list li { display:flex; gap:var(--s3); font-size:var(--t-small); color:var(--text-2); align-items:flex-start; }
.aa-flag__list li::before { content:""; width:6px; height:6px; border-radius:50%; background:var(--accent);
  margin-top:.6em; flex:0 0 auto; }
.aa-flag__cta { display:flex; flex-wrap:wrap; gap:var(--s3); margin-top:auto; }

/* pending — editors only */
.aa-pending {
  border:1px dashed var(--line-2); border-radius:var(--radius-sm); padding:var(--s4);
  background:color-mix(in srgb,var(--accent-dim) 55%, transparent);
  font-size:var(--t-small); color:var(--text-2); margin-block:var(--s4);
}
.aa-pending b { color:var(--text); display:block; margin-bottom:var(--s1); font-size:var(--t-small); }

/* ---------- REVEAL / MOTION ---------------------------------------------- */
.aa-rv { opacity:1; transform:none; }
html.aa-js .aa-rv { opacity:0; transform:translateY(20px);
  transition:opacity .8s var(--ease), transform .8s var(--ease); }
html.aa-js .aa-rv.is-in { opacity:1; transform:none; }
.aa-rv[data-d="1"]{transition-delay:.08s}.aa-rv[data-d="2"]{transition-delay:.16s}
.aa-rv[data-d="3"]{transition-delay:.24s}.aa-rv[data-d="4"]{transition-delay:.32s}

.aa-glow { position:fixed; width:520px; height:520px; border-radius:50%; pointer-events:none;
  z-index:0; opacity:0; transition:opacity .5s var(--ease);
  background:radial-gradient(circle,var(--accent-dim),transparent 62%); transform:translate3d(-50%,-50%,0); }
@media (hover:hover) and (pointer:fine) and (min-width:1025px){ .aa-glow.is-on{opacity:.9} }

/* ---------- RESPONSIVE --------------------------------------------------- */
@media (max-width:1180px){
  .aa-trust__grid { grid-template-columns:repeat(2,1fr); }
  .aa-trust__i:nth-child(3) { border-inline-start:0; padding-inline-start:0; }
  .aa-trust__i:nth-child(-n+2) { border-bottom:1px solid var(--line); }
}
@media (max-width:1024px){
  .aa-nav { display:none; }
  .aa-burger { display:grid; }
  .aa-hero__grid { grid-template-columns:1fr; gap:var(--s7); }
  .aa-portrait { max-width:420px; }
  .aa-flag, .aa-flag:nth-child(even) { grid-template-columns:1fr; }
  .aa-flag__vis, .aa-flag:nth-child(even) .aa-flag__vis {
    order:0; min-height:230px; border-inline:0; border-bottom:1px solid var(--line); }
}
@media (max-width:760px){
  .aa-header__in { min-height:68px; gap:var(--s3); }
  .aa-mobnav { inset-block-start:68px; }
  .aa-brand img { height:34px; }
  .aa-brand__role { display:none; }
  .aa-trust__grid { grid-template-columns:1fr; }
  .aa-trust__i { border-inline-start:0 !important; padding-inline-start:0 !important;
    border-bottom:1px solid var(--line); padding-block:var(--s5); }
  .aa-trust__i:last-child { border-bottom:0; }
  .aa-cta .aa-btn { flex:1 1 100%; }
  .aa-portrait { max-width:none; }
  .aa-flag__body { padding:var(--s5); }
}
@media (max-width:380px){
  :root { --t-body:1rem; --t-small:.9375rem; }
  .aa-wrap { width:min(100% - 1.5rem, var(--container)); }
}

/* ---------- RTL ---------------------------------------------------------- */
[dir="rtl"] .aa-icon-dir { transform:scaleX(-1); }
[dir="rtl"] .aa-kicker::before { transform:scaleX(-1); }

/* ---------- REDUCED MOTION ----------------------------------------------- */
@media (prefers-reduced-motion: reduce){
  .aa-home *,.aa-home *::before,.aa-home *::after {
    animation-duration:.001ms !important; animation-iteration-count:1 !important;
    transition-duration:.001ms !important; }
  html.aa-js .aa-rv { opacity:1 !important; transform:none !important; }
  .aa-glow { display:none !important; }
}
html.aa-reduce .aa-tomorrow, html.aa-reduce .aa-dot::after { animation:none !important; }
html.aa-reduce .aa-glow { display:none !important; }

/* header CTA hides on small screens — the mobile menu carries it */
@media (max-width:1024px){ .aa-hide-sm { display:none; } }
body.aa-menu-open { overflow:hidden; }

/* ---------- HERO BALANCE FIXES (post-visual-audit) ----------------------- */
.aa-hero { padding-block: clamp(2rem,4.5vw,3.5rem) clamp(3.5rem,7vw,6rem); }
.aa-hero__grid { grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr); align-items:center; }
.aa-portrait__frame { aspect-ratio:4/4.15; max-height:520px; margin-inline-start:auto; }
.aa-hero__sum { max-width:56ch; }
/* tertiary CTA needs to read as a link-button, not dead text */
.aa-btn--quiet { border-color:var(--line); color:var(--text-2); }
.aa-btn--quiet:hover { border-color:var(--line-2); color:var(--text); background:var(--surface); }
@media (max-width:1024px){
  .aa-hero { padding-block: var(--s6) var(--s8); }
  .aa-portrait__frame { max-height:420px; margin-inline:auto; }
}

/* ---------- ARABIC TYPOGRAPHY -------------------------------------------
   Arabic needs materially more leading than Latin: at h1 sizes the hamza and
   descenders of أنس العاصي collide with the following line at lh 1.06.       */
html[lang^="ar"] body.aa-home h1 { line-height:1.34; letter-spacing:0; padding-block-end:.08em; }
html[lang^="ar"] body.aa-home h2 { line-height:1.38; letter-spacing:0; }
html[lang^="ar"] body.aa-home h3 { line-height:1.5;  letter-spacing:0; }
html[lang^="ar"] body.aa-home .aa-hero__role { line-height:1.6; }
html[lang^="ar"] body.aa-home .aa-hero__sum,
html[lang^="ar"] body.aa-home .aa-sec__lead,
html[lang^="ar"] body.aa-home .aa-flag__desc { line-height:1.95; }
html[lang^="ar"] body.aa-home .aa-kicker { letter-spacing:.06em; }
html[lang^="ar"] body.aa-home .aa-brand__role { letter-spacing:0; }
/* optical sizing: Arabic reads smaller at the same px, so lift body slightly */
html[lang^="ar"] body.aa-home { font-size:calc(var(--t-body) * 1.04); }

/* ---------- SHARED PATTERNS STILL IN USE -------------------------------- */
.aa-steps { display:grid; gap:var(--s3); counter-reset:s; }
.aa-step { display:grid; grid-template-columns:auto 1fr; gap:var(--s4); align-items:start;
  padding:var(--s5); border:1px solid var(--line); border-radius:var(--radius);
  background:color-mix(in srgb,var(--surface) 65%,transparent); cursor:pointer; transition:.3s var(--ease); }
.aa-step:hover,.aa-step[aria-expanded="true"] { border-color:var(--accent); background:var(--accent-dim); }
.aa-step__n { counter-increment:s; width:46px; height:46px; border-radius:13px; display:grid; place-items:center;
  background:var(--surface-2); color:var(--accent-strong); font-weight:700; font-size:var(--t-small);
  border:1px solid var(--line); font-variant-numeric:tabular-nums; }
.aa-step__n::before { content:counter(s,decimal-leading-zero); }
.aa-step h3 { margin:0; }
.aa-step p { margin:var(--s2) 0 0; font-size:var(--t-body); color:var(--text-2);
  max-height:0; overflow:hidden; opacity:0; transition:.35s var(--ease); }
.aa-step[aria-expanded="true"] p { max-height:16rem; opacity:1; }

.aa-band { border:1px solid var(--line-2); border-radius:var(--radius-lg); padding:clamp(2.5rem,5vw,4rem);
  background:radial-gradient(120% 100% at 50% 0%,var(--accent-dim),transparent 65%),var(--surface); text-align:center; }
.aa-band h2 { margin-inline:auto; max-width:22ch; }
.aa-band p { color:var(--text-2); max-width:56ch; margin:var(--s4) auto var(--s6); font-size:var(--t-body); }
.aa-band .aa-cta { justify-content:center; }
.aa-band .aa-kicker { justify-content:center; }

.aa-foot { border-top:1px solid var(--line); background:color-mix(in srgb,var(--bg-2) 70%,transparent);
  padding-block:clamp(3rem,6vw,4.5rem) var(--s6); }
.aa-foot__grid { display:grid; grid-template-columns:1.5fr 1fr 1fr; gap:var(--s7); margin-bottom:var(--s7); }
.aa-foot__grid h3 { font-size:var(--t-micro); text-transform:uppercase; letter-spacing:.12em;
  color:var(--text-3); margin:0 0 var(--s4); font-weight:650; }
.aa-foot__grid ul { list-style:none; margin:0; padding:0; display:grid; gap:var(--s3); }
.aa-foot__grid a { font-size:var(--t-small); color:var(--text-2); }
.aa-foot__grid a:hover { color:var(--accent-strong); }
.aa-foot__bar { border-top:1px solid var(--line); padding-top:var(--s5); display:flex; flex-wrap:wrap;
  gap:var(--s4); justify-content:space-between; align-items:center; font-size:var(--t-small); color:var(--text-3); }
.aa-oneday { font-style:italic; }
@media (max-width:900px){ .aa-foot__grid { grid-template-columns:1fr 1fr; } }
@media (max-width:600px){ .aa-foot__grid { grid-template-columns:1fr; } }

/* ==========================================================================
   CHECKPOINT B — section patterns.
   Deliberately varied: split prose, numbered rows, wide case study, timeline,
   grouped columns, accordion, engagement columns, audience paths.
   No section repeats another section's layout.
   ========================================================================== */

/* --- ABOUT: split prose + sticky aside ---------------------------------- */
.aa-about__grid { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(0,.65fr); gap:clamp(2.5rem,5vw,5rem); align-items:start; }
.aa-about__lede { font-size:var(--t-lead); color:var(--text); line-height:1.55; margin:0 0 var(--s5); letter-spacing:-.015em; }
.aa-about__body { color:var(--text-2); max-width:60ch; }
.aa-about__body p { margin:0 0 var(--s4); }
.aa-about__body strong { color:var(--text); font-weight:600; }
.aa-aside { position:sticky; top:104px; border:1px solid var(--line); border-radius:var(--radius);
  padding:var(--s6); background:linear-gradient(160deg,var(--surface),color-mix(in srgb,var(--surface) 40%,transparent)); }
.aa-aside h3 { font-size:var(--t-h3); margin-bottom:var(--s4); }
.aa-aside dl { margin:0; display:grid; gap:var(--s4); }
.aa-aside dt { font-size:var(--t-micro); text-transform:uppercase; letter-spacing:.1em; color:var(--text-3); font-weight:650; margin-bottom:var(--s1); }
.aa-aside dd { margin:0; font-size:var(--t-small); color:var(--text-2); }

/* --- SERVICES: numbered rows, not cards --------------------------------- */
.aa-rows { border-top:1px solid var(--line); }
.aa-row {
  display:grid; grid-template-columns:auto minmax(0,1fr) minmax(0,.9fr);
  gap:var(--s5); align-items:start; padding:var(--s6) var(--s3);
  border-bottom:1px solid var(--line); transition:background .3s var(--ease), padding-inline .3s var(--ease);
}
.aa-row:hover { background:color-mix(in srgb,var(--surface) 55%,transparent); }
.aa-row__n { font-size:var(--t-small); font-weight:700; color:var(--accent-strong);
  font-variant-numeric:tabular-nums; padding-top:.25em; min-width:2.5rem; }
.aa-row h3 { margin:0; }
.aa-row__d { color:var(--text-2); font-size:var(--t-body); margin:0; }
.aa-row__t { display:flex; flex-wrap:wrap; gap:var(--s2); align-self:center; }

/* --- CASE STUDY: wide visual + narrative -------------------------------- */
.aa-cs { border:1px solid var(--line); border-radius:var(--radius-lg); overflow:hidden; background:var(--surface); }
.aa-cs__vis {
  position:relative; aspect-ratio:21/8; min-height:220px; display:grid; place-items:center;
  border-bottom:1px solid var(--line);
  background:radial-gradient(90% 120% at 30% 0%,var(--accent-dim),transparent 60%),
             linear-gradient(150deg,var(--surface-2),var(--surface-3));
}
.aa-cs__vis::before { content:""; position:absolute; inset:0;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:44px 44px; opacity:.55;
  mask-image:radial-gradient(ellipse 70% 80% at 50% 40%,#000 20%,transparent 78%); }
.aa-cs__ph { position:relative; text-align:center; color:var(--text-3); }
.aa-cs__ph svg { opacity:.45; margin-bottom:var(--s2); }
.aa-cs__ph span { display:block; font-size:var(--t-micro); letter-spacing:.08em; text-transform:uppercase; }
.aa-cs__body { padding:clamp(1.75rem,3.5vw,3rem); }
.aa-cs__facts { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:var(--s4); padding-bottom:var(--s5); margin-bottom:var(--s5); border-bottom:1px solid var(--line); }
.aa-cs__facts dt { font-size:var(--t-micro); text-transform:uppercase; letter-spacing:.1em; color:var(--text-3); font-weight:650; margin-bottom:var(--s1); }
.aa-cs__facts dd { margin:0; font-size:var(--t-small); color:var(--text); font-weight:550; }
.aa-cs__cols { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:var(--s6); }
.aa-cs__cols h3 { font-size:var(--t-small); text-transform:uppercase; letter-spacing:.1em;
  color:var(--accent-strong); margin:0 0 var(--s3); font-weight:650; }
.aa-cs__cols p { margin:0; color:var(--text-2); font-size:var(--t-body); }
.aa-cs__cta { display:flex; flex-wrap:wrap; gap:var(--s3); margin-top:var(--s6); }

/* --- EXPERIENCE: timeline ------------------------------------------------ */
.aa-time { position:relative; padding-inline-start:var(--s7); max-width:60ch; }
.aa-time::before { content:""; position:absolute; inset-block:.6rem 0; inset-inline-start:5px; width:2px;
  background:linear-gradient(var(--accent),var(--line) 70%); }
.aa-time__i { position:relative; padding-bottom:var(--s7); }
.aa-time__i:last-child { padding-bottom:0; }
.aa-time__i::before { content:""; position:absolute; inset-inline-start:calc(-1 * var(--s7) + 1px);
  top:.55rem; width:12px; height:12px; border-radius:50%; background:var(--accent);
  box-shadow:0 0 0 5px var(--accent-dim); }
.aa-time__when { font-size:var(--t-micro); text-transform:uppercase; letter-spacing:.1em;
  color:var(--accent-strong); font-weight:650; display:block; margin-bottom:var(--s2); }
.aa-time h3 { margin:0 0 var(--s2); }
.aa-time p { margin:0; color:var(--text-2); font-size:var(--t-body); }

/* --- SKILLS: grouped columns --------------------------------------------- */
.aa-skills { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:var(--s6) var(--s7); }
.aa-skills h3 { font-size:var(--t-small); text-transform:uppercase; letter-spacing:.1em;
  color:var(--text-3); font-weight:650; margin:0 0 var(--s3); padding-bottom:var(--s3);
  border-bottom:1px solid var(--line); }
.aa-skills ul { list-style:none; margin:0; padding:0; display:grid; gap:var(--s2); }
.aa-skills li { font-size:var(--t-body); color:var(--text-2); }

/* --- PRODUCTS / ENGAGEMENT ---------------------------------------------- */
.aa-eng { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:var(--s4); }
.aa-eng__i { border:1px solid var(--line); border-radius:var(--radius); padding:var(--s6);
  background:color-mix(in srgb,var(--surface) 70%,transparent); transition:.3s var(--ease); }
.aa-eng__i:hover { border-color:var(--accent); background:var(--accent-dim); }
.aa-eng__i h3 { font-size:var(--t-h3); margin:0 0 var(--s2); }
.aa-eng__i p { margin:0 0 var(--s4); color:var(--text-2); font-size:var(--t-small); }
.aa-eng__price { font-size:var(--t-small); color:var(--accent-strong); font-weight:600; }

/* --- CONTACT PATHS ------------------------------------------------------- */
.aa-paths { display:grid; gap:var(--s3); }
.aa-path {
  display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:var(--s5); align-items:center;
  padding:var(--s5) var(--s6); border:1px solid var(--line); border-radius:var(--radius);
  background:color-mix(in srgb,var(--surface) 60%,transparent); transition:.3s var(--ease);
}
.aa-path:hover { border-color:var(--accent); background:var(--accent-dim); transform:translateX(4px); }
[dir="rtl"] .aa-path:hover { transform:translateX(-4px); }
.aa-path__ico { width:48px; height:48px; border-radius:14px; display:grid; place-items:center;
  background:var(--surface-2); color:var(--accent-strong); border:1px solid var(--line); flex:0 0 auto; }
.aa-path h3 { margin:0 0 var(--s1); font-size:var(--t-h3); }
.aa-path p { margin:0; color:var(--text-2); font-size:var(--t-small); }
.aa-path__go { color:var(--text-3); flex:0 0 auto; transition:.3s var(--ease); }
.aa-path:hover .aa-path__go { color:var(--accent-strong); }
[dir="rtl"] .aa-path__go { transform:scaleX(-1); }

/* --- FINAL CTA ----------------------------------------------------------- */
.aa-final { text-align:center; padding-block:clamp(4rem,8vw,7rem); position:relative; }
.aa-final::before { content:""; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(60% 100% at 50% 100%,var(--accent-dim),transparent 70%); }
.aa-final > * { position:relative; }
.aa-final h2 { max-width:20ch; margin-inline:auto; }
.aa-final p { color:var(--text-2); font-size:var(--t-lead); max-width:52ch; margin:var(--s4) auto var(--s6); }
.aa-final .aa-cta { justify-content:center; }

/* --- RESPONSIVE ---------------------------------------------------------- */
@media (max-width:1024px){
  .aa-about__grid { grid-template-columns:1fr; }
  .aa-aside { position:static; }
  .aa-row { grid-template-columns:auto minmax(0,1fr); }
  .aa-row__t { grid-column:2; }
}
@media (max-width:760px){
  .aa-row { grid-template-columns:1fr; gap:var(--s3); padding:var(--s5) 0; }
  .aa-row__n { padding-top:0; }
  .aa-row__t { grid-column:1; }
  .aa-cs__vis { aspect-ratio:16/10; }
  .aa-path { grid-template-columns:auto minmax(0,1fr); padding:var(--s4); gap:var(--s4); }
  .aa-path__go { display:none; }
  .aa-time { padding-inline-start:var(--s6); }
  .aa-time__i::before { inset-inline-start:calc(-1 * var(--s6) + 1px); }
}