/* =====================================================================
   SAT — Arabic typography layer  (loaded ONLY on Arabic / RTL pages)
   ---------------------------------------------------------------------
   Font        : Cairo (fallback Tajawal → system Arabic)
   Scope       : body.sat-ar  — added by sat_body_class() in plugin.php
   Why separate: the English/LTR site keeps Inter + Manrope untouched.

   Rules of Arabic type applied here:
   1. Cairo replaces Inter + Manrope via the two CSS tokens (cascades to all).
   2. letter-spacing MUST be 0 — tracking breaks Arabic letter joining.
   3. Arabic needs more leading (dots + diacritics sit above/below).
   4. Micro labels (10px) are illegible in Arabic → raised to a readable floor.
   5. Display sizes become fluid clamp() so mobile ↔ desktop scales smoothly.
   ===================================================================== */

/* ---------------------------------------------------------------------
   1. Font tokens — one override, inherited by every sat- element
   ------------------------------------------------------------------ */
body.sat-ar {
	--sat-font:         "Cairo", "Tajawal", "Segoe UI", system-ui, sans-serif;
	--sat-font-display: "Cairo", "Tajawal", "Segoe UI", system-ui, sans-serif;
}

body.sat-ar [class^="sat-"],
body.sat-ar [class*=" sat-"],
body.sat-ar [class^="sat-"] *,
body.sat-ar [class*=" sat-"] * {
	font-family: var(--sat-font);
	/* keep Western digits (1234) — Cairo would otherwise be free to swap them */
	font-variant-numeric: lining-nums;
	-webkit-font-feature-settings: normal;
	font-feature-settings: normal;
}

/* Form controls do not inherit font-family by default */
body.sat-ar [class^="sat-"] input,
body.sat-ar [class^="sat-"] textarea,
body.sat-ar [class^="sat-"] select,
body.sat-ar [class^="sat-"] button,
body.sat-ar .sat-btn { font-family: var(--sat-font); }

/* ---------------------------------------------------------------------
   2. Kill all letter-spacing — non-negotiable for Arabic
   ------------------------------------------------------------------ */
body.sat-ar [class^="sat-"],
body.sat-ar [class*=" sat-"],
body.sat-ar [class^="sat-"] *,
body.sat-ar [class*=" sat-"] * { letter-spacing: 0 !important; }

/* ---------------------------------------------------------------------
   3. Leading — Arabic needs ~20% more than Latin
   ------------------------------------------------------------------ */
body.sat-ar [class^="sat-"] h1, body.sat-ar [class^="sat-"] h2,
body.sat-ar [class^="sat-"] h3, body.sat-ar [class^="sat-"] h4,
body.sat-ar [class^="sat-"] h5, body.sat-ar [class^="sat-"] h6 { line-height: 1.4; }
body.sat-ar [class^="sat-"] p  { line-height: 1.95; }
body.sat-ar [class^="sat-"] li { line-height: 1.9; }

/* Gradient/clipped headings clip Arabic descenders (ج ح خ ع غ م ي) */
body.sat-ar .sat-metallic,
body.sat-ar .sat-petrol-text,
body.sat-ar .sat-hero-title,
body.sat-ar .sat-page-hero-title,
body.sat-ar .sat-pd-title,
body.sat-ar .sat-social-title,
body.sat-ar .sat-h2 { padding-bottom: 0.14em; }

/* ---------------------------------------------------------------------
   4. Micro labels / eyebrows — 10–11px Arabic is unreadable
   ------------------------------------------------------------------ */
body.sat-ar .sat-eyebrow,
body.sat-ar .sat-hero-eyebrow span:last-child,
body.sat-ar .sat-comp-num,
body.sat-ar .sat-about-badge-lbl,
body.sat-ar .sat-svc-num,
body.sat-ar .sat-proj-card-cat,
body.sat-ar .sat-stat-lbl,
body.sat-ar .sat-story-quote-by,
body.sat-ar .sat-founder-role,
body.sat-ar .sat-lic-code,
body.sat-ar .sat-form-field label,
body.sat-ar .sat-info-lbl,
body.sat-ar .sat-footer-brand-sub,
body.sat-ar .sat-pd-chip span:last-child,
body.sat-ar .sat-pd-fact dt,
body.sat-ar .sat-stack-cat,
body.sat-ar .sat-stack-stat dt {
	font-size: 0.8125rem;   /* 13px */
	line-height: 1.8;
	font-weight: 600;
}
@media (min-width: 640px) {
	body.sat-ar .sat-eyebrow,
	body.sat-ar .sat-hero-eyebrow span:last-child,
	body.sat-ar .sat-stat-lbl,
	body.sat-ar .sat-info-lbl,
	body.sat-ar .sat-form-field label { font-size: 0.875rem; }
}

/* Badges / chips / pills */
body.sat-ar .sat-proj-badge,
body.sat-ar .sat-proj-card-badge,
body.sat-ar .sat-lic-badge,
body.sat-ar .sat-svc-badge,
body.sat-ar .sat-flip-fs-label,
body.sat-ar .sat-stack-num { font-size: 0.8125rem; line-height: 1.7; }

/* ---------------------------------------------------------------------
   5. Display type — fluid, so mobile and desktop are both correct
      (clamp replaces the 640/1024 step-ups for these elements)
   ------------------------------------------------------------------ */
body.sat-ar .sat-hero-title,
body.sat-ar .sat-page-hero-title,
body.sat-ar .sat-pd-title {
	font-size: clamp(1.85rem, 6.2vw, 4rem) !important;
	line-height: 1.35;
	font-weight: 800;
}
body.sat-ar .sat-social-title { font-size: clamp(1.75rem, 5.4vw, 3.25rem) !important; line-height: 1.35; }
body.sat-ar .sat-h2           { font-size: clamp(1.5rem, 4.2vw, 2.6rem)   !important; line-height: 1.4; }
body.sat-ar .sat-cta-title    { font-size: clamp(1.4rem, 3.6vw, 2.1rem)   !important; line-height: 1.45; }
body.sat-ar .sat-story-quote-text { font-size: clamp(1.3rem, 3.4vw, 2rem) !important; line-height: 1.6; }
body.sat-ar .sat-stat-num     { font-size: clamp(2rem, 5vw, 3rem)         !important; line-height: 1.2; }
body.sat-ar .sat-stack-title  { font-size: clamp(1.15rem, 2.8vw, 1.7rem)  !important; line-height: 1.4; }
body.sat-ar .sat-feat-num     { line-height: 1.1; }

/* ---------------------------------------------------------------------
   6. Body / lead copy — fluid and comfortably leaded
   ------------------------------------------------------------------ */
body.sat-ar .sat-lead,
body.sat-ar .sat-hero-sub,
body.sat-ar .sat-page-hero-sub,
body.sat-ar .sat-pd-lead,
body.sat-ar .sat-about-body {
	font-size: clamp(1rem, 1.9vw, 1.15rem) !important;
	line-height: 1.95;
}
body.sat-ar .sat-svc-desc,
body.sat-ar .sat-sg-desc,
body.sat-ar .sat-stack-desc,
body.sat-ar .sat-feat-desc,
body.sat-ar .sat-footer-desc {
	font-size: 0.95rem;
	line-height: 1.9;
}
body.sat-ar .sat-svc-title,
body.sat-ar .sat-sg-title,
body.sat-ar .sat-lic-title,
body.sat-ar .sat-proj-card-title,
body.sat-ar .sat-proj-mbody h3 { font-size: 1.15rem; line-height: 1.55; }

/* ---------------------------------------------------------------------
   7. Chrome — nav, buttons, footer, form fields
   ------------------------------------------------------------------ */
body.sat-ar .sat-btn {
	font-size: 0.95rem;
	line-height: 1.6;
	padding-block: 0.8rem;   /* Cairo sits taller than Inter in the pill */
}
body.sat-ar .sat-header-link,
body.sat-ar .sat-nav a,
body.sat-ar .sat-footer-link,
body.sat-ar .sat-footer-h { font-size: 0.95rem; line-height: 1.8; }
body.sat-ar .sat-footer-h { font-size: 1.05rem; }
body.sat-ar .sat-form-field input,
body.sat-ar .sat-form-field textarea,
body.sat-ar .sat-form-field select { font-size: 1rem; line-height: 1.8; }

/* Mobile menu — a bit larger for touch */
@media (max-width: 1023px) {
	body.sat-ar .sat-header-link,
	body.sat-ar .sat-nav a { font-size: 1.05rem; }
}

/* ---------------------------------------------------------------------
   8. Very small screens — keep long Arabic words from overflowing
   ------------------------------------------------------------------ */
@media (max-width: 380px) {
	body.sat-ar .sat-hero-title,
	body.sat-ar .sat-page-hero-title,
	body.sat-ar .sat-pd-title { font-size: 1.7rem !important; }
	body.sat-ar .sat-h2 { font-size: 1.4rem !important; }
	body.sat-ar .sat-btn { font-size: 0.9rem; padding-inline: 1.35rem; }
}