/* Gulf Luxe — design tokens. Re-skinnable: client brand colors map onto these. */
:root{
  /* color */
  --c-base:#F7F3EC; --c-surface:#FFFFFF; --c-surface-2:#FBF8F2;
  --c-primary:#1B4F9E; --c-primary-dark:#143A73; --c-accent:#C8A24B;
  --c-ink:#1C1B19; --c-muted:#6B655C; --c-line:#E7E0D4; --c-whatsapp:#25D366;

  /* type */
  --font-ar-display:"El Messiri",system-ui,sans-serif;
  --font-ar-body:"IBM Plex Sans Arabic",system-ui,sans-serif;
  --font-en-display:"Fraunces",Georgia,serif;
  --font-en-body:"Inter",system-ui,sans-serif;
  --fs-display:clamp(2.5rem,5vw,4rem); --fs-h1:clamp(2rem,3.5vw,2.75rem);
  --fs-h2:clamp(1.5rem,2.5vw,2rem); --fs-h3:1.25rem; --fs-body:1.0625rem; --fs-sm:.875rem;

  /* space (4px scale) */
  --s-1:.25rem; --s-2:.5rem; --s-3:.75rem; --s-4:1rem; --s-6:1.5rem;
  --s-8:2rem; --s-12:3rem; --s-16:4rem; --s-24:6rem;

  /* shape + elevation */
  --r-card:1.25rem; --r-btn:.75rem; --r-pill:999px;
  --shadow-1:0 1px 2px rgba(28,27,25,.06),0 4px 16px rgba(28,27,25,.06);
  --shadow-2:0 8px 30px rgba(28,27,25,.12);

  /* motion */
  --dur-1:.2s; --dur-2:.4s; --dur-3:.7s; --ease-out-expo:cubic-bezier(.16,1,.3,1);

  --container:1200px;
}
html[lang="ar"]{--font-display:var(--font-ar-display);--font-body:var(--font-ar-body);}
html[lang="en"]{--font-display:var(--font-en-display);--font-body:var(--font-en-body);}
/* fallback when lang attr is neither */
html{--font-display:var(--font-ar-display);--font-body:var(--font-ar-body);}
