/* Word Lab — shared design layer (fonts, tokens, type scale, motion). Used by every page. */
@font-face{font-family:'Thmanyah';src:url(fonts/thmanyah-regular.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Thmanyah';src:url(fonts/thmanyah-bold.woff2) format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'Thmanyah';src:url(fonts/thmanyah-black.woff2) format('woff2');font-weight:900;font-display:swap}
@font-face{font-family:TraceEN;src:url(fonts/comicneue-bold.woff2) format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'InterWL';src:url(fonts/inter-latin.woff2) format('woff2');font-weight:100 900;font-display:swap}

:root{
  --ink:#0E2233;--ink2:#2B4256;--mut:#5C7184;--line:#E3ECF1;--card:#fff;--bg:#F3F8FA;
  --teal:#0F8A7E;--teal2:#14B8A6;--sky:#0284C7;--sky2:#38BDF8;--amber:#E39A0B;--amber2:#FBBF24;--green:#16A34A;--red:#E5484D;
  --ar:'Thmanyah','Sakkal Majalla','Segoe UI',Tahoma,system-ui,sans-serif;
  --ipa:system-ui,-apple-system,'Segoe UI','Lucida Sans Unicode',Arial,sans-serif;
  --kid:TraceEN,'Comic Sans MS','Segoe UI',sans-serif;
  --en:'InterWL','Segoe UI',system-ui,-apple-system,Arial,sans-serif;
  --r-lg:28px;--r-md:20px;--r-sm:14px;
  --sh-1:0 1px 2px rgba(14,34,51,.06),0 8px 24px -12px rgba(14,34,51,.18);
  --sh-2:0 2px 4px rgba(14,34,51,.05),0 24px 48px -24px rgba(14,34,51,.32);
  --sh-3:0 30px 70px -30px rgba(8,60,80,.45);
  --ease:cubic-bezier(.2,.9,.25,1);--spring:cubic-bezier(.34,1.56,.64,1);
  --wrap:min(1200px,100% - 32px);
  font-size:clamp(17px,15.4px + .35vw,20px);
}
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation-duration:.35s}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font-family:var(--ar);color:var(--ink);background:var(--bg);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
.en,[lang=en]{font-family:var(--en);direction:ltr;unicode-bidi:isolate}
img{max-width:100%}
button{font:inherit}
:focus-visible{outline:3px solid var(--sky2);outline-offset:3px;border-radius:10px}

/* reveal on scroll (wl-fx.js adds .in) */
.rv{opacity:0;transform:translateY(26px) scale(.98);transition:opacity .7s var(--ease),transform .8s var(--ease);transition-delay:calc(var(--d,0)*80ms)}
.rv.rv-in{opacity:1;transform:none}
/* pressed ripple */
.rip{position:relative;overflow:hidden;isolation:isolate}
.rip>.rp{position:absolute;border-radius:50%;pointer-events:none;background:currentColor;opacity:.18;transform:scale(0);animation:rp .6s var(--ease) forwards;z-index:-1}
@keyframes rp{to{transform:scale(1);opacity:0}}

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