/* ============================================================
   ALO EGY — shared base across all landing directions
   FONT SWAP: when the Barseem file arrives, drop a @font-face
   for "Barseem" and set --font-display: 'Barseem', ... below.
   Everything else inherits automatically.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700;800;900;1000&family=Tajawal:wght@400;500;700;800;900&family=Lalezar&display=swap');

:root{
  /* brand */
  --brand:        #144AE0;   /* sampled from the ALO EGY logo */
  --brand-600:    #1140c4;
  --brand-700:    #0d33a0;
  --brand-ink:    #0a205e;

  /* type — swap --font-display to 'Barseem' when available */
  --font-display: 'Lalezar', 'Cairo', sans-serif; /* loud street-poster headlines */
  --font-heading: 'Cairo', sans-serif;            /* section headings / UI */
  --font-body:    'Tajawal', sans-serif;          /* body copy */
}

*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0;
  font-family:var(--font-body);
  direction:rtl;
  text-align:right;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{ display:block; max-width:100%; }
button{ font-family:inherit; cursor:pointer; border:0; background:none; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4,p{ margin:0; }
:focus-visible{ outline:3px solid var(--brand); outline-offset:3px; }

.display{ font-family:var(--font-display); font-weight:400; line-height:1.05; }
.heading{ font-family:var(--font-heading); font-weight:900; }

/* tiny shared util */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0;}