/* =========================================
   Main font setup for the whole site
   Arabic: Almarai (Light/Regular/Bold)
   English/Latin (optional): Tajawal (Regular/Medium/Bold)
   ========================================= */

/* If main.css is in /assets/css/, keep ../fonts/
   If main.css is in the theme root, change to: url("assets/fonts/...") */

/* ---------- Self-hosted (recommended) ---------- */
@font-face{
  font-family: "Almarai";
  src: url("../fonts/Almarai-Light.woff2") format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face{
  font-family: "Almarai";
  src: url("../fonts/Almarai-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face{
  font-family: "Almarai";
  src: url("../fonts/Almarai-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* Tajawal (uncomment only if the files exist in /assets/fonts/) */
/*
@font-face{
  font-family: "Tajawal";
  src: url("../fonts/Tajawal-Regular.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face{
  font-family: "Tajawal";
  src: url("../fonts/Tajawal-Medium.woff2") format("woff2");
  font-weight: 500; font-style: normal; font-display: swap;
}
@font-face{
  font-family: "Tajawal";
  src: url("../fonts/Tajawal-Bold.woff2") format("woff2");
  font-weight: 700; font-style: normal; font-display: swap;
}
*/

/* ---------- Global Typography Vars ---------- */
:root{
  /* Arabic/RTL default */
  --font-ar: "Almarai", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;

  /* English/Latin (will fall back to system if Tajawal is not loaded) */
  --font-en: "Tajawal", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;

  /* Main site font defaults to Arabic */
  --font-main: var(--font-ar);
}

/* Base */
body{
  font-family: var(--font-main);
  font-style: normal;
  font-weight: 400;
  line-height: 1.6;
  color: #1a1a1a;
  background-color: #ffffff;
  /* (optional) smooth rendering */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* Auto-apply the English stack to Latin content only */
:lang(en), .lang-en{
  font-family: var(--font-en);
}

/* Headings hierarchy */
h1, h2, h3, h4, h5, h6{
  font-family: var(--font-main);
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: .5em;
}

h1{ font-size: 2.5rem; }   /* ~40px */
h2{ font-size: 2rem; }     /* ~32px */
h3{ font-size: 1.75rem; }  /* ~28px */
h4{ font-size: 1.5rem; }   /* ~24px */
h5{ font-size: 1.25rem; }  /* ~20px */
h6{ font-size: 1rem; font-weight: 600; } /* ~16px */

p{ font-weight: 400; margin-bottom: 1em; }



.cinematic-slide a {
  position: relative;
  z-index: 50;
  pointer-events: auto;
}

.cinematic-slide > div {
  pointer-events: none;
}

.cinematic-slide > div a {
  pointer-events: auto;
}
