/* ============================================
   SKIP LINK (Accessibility)
   ============================================ */
.skip-link {
  position:absolute;top:-100%;left:50%;transform:translateX(-50%);
  background:var(--ink,#2A1A0E);color:#fff;padding:.75rem 1.5rem;
  border-radius:0 0 8px 8px;z-index:10000;font-size:.9rem;
  text-decoration:none;
}
.skip-link:focus { top:0 }

/* ============================================
   DESIGN TOKENS
   ============================================ */
:root {
  --bg:        #E8DDD0;
  --bg-alt:    #D9CBBA;
  --bg-card:   #EFE8DC;
  --warm:      #D4BFA0;
  --gold:      #B8935A;
  --gold-lt:   #D4AF6E;
  --ink:       #2A1A0E;
  --ink-mid:   #5C3D2A;
  --ink-lt:    #937060;
  --border:    #D0B080;
  --white:     #FDFAF5;
  --shadow:    rgba(42,26,14,0.13);
  --sea:       #7DD6FE;
  --sea-soft:  rgba(125,214,254,0.15);

  /* Tajawal — consistent Arabic/Latin font across all devices */
  --f-ar: "Tajawal", "Helvetica Neue", Arial, sans-serif;
  --f-en: "Calibri", "Candara", "Segoe UI", "Helvetica Neue", Arial, sans-serif;

  --r-sm: 8px;
  --r-md: 16px;
  --r-lg: 24px;
  --r-xl: 40px;
  --ease: cubic-bezier(.4,0,.2,1);
}

/* ============================================
   RESET
   ============================================ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;overflow-x:hidden}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:var(--f-ar);
  line-height:1.75;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
body.en{direction:ltr;font-family:var(--f-ar)}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
[id]{scroll-margin-top:72px}

/* ============================================
   LANGUAGE VISIBILITY
   ============================================ */
body.ar .en-only,
body.ar .logo-en,
body.ar .name-en,
body.ar .cover-en { display:none }

body.en .ar-only,
body.en .logo-ar,
body.en .name-ar,
body.en .cover-ar { display:none }

/* ============================================
   LAYOUT
   ============================================ */
.wrap    { max-width:1160px; margin:0 auto; padding:0 1.25rem }
.wrap-sm { max-width:700px;  margin:0 auto; padding:0 1.25rem }

/* ============================================
   TYPOGRAPHY
   ============================================ */
.label {
  font-size:1.8rem;
  font-weight:600;
  letter-spacing:0;
  word-spacing:.3em;
  color:var(--gold);
  font-family:var(--f-ar);
  display:block;
  text-align:center;
  margin-bottom:1rem;
}
h2.sec-title {
  font-size:clamp(1.75rem,4vw,2.75rem);
  color:var(--ink);
  line-height:1.2;
  margin-bottom:1.25rem;
  text-align:right;
}

/* ============================================
   SPLASH
   ============================================ */
.splash {
  position:fixed;top:0;left:0;right:0;bottom:0;
  z-index:9999;
  background:var(--bg);
  display:flex;align-items:center;justify-content:center;
  transition:opacity 1.5s ease;
}
.splash-logo {
  height:min(280px,50vw);width:auto;
  filter:drop-shadow(0 4px 24px rgba(184,147,90,.4));
  transition:opacity 1.5s ease;
}
.splash.out .splash-logo {
  opacity:0;
}
.splash.out {
  opacity:0;
  pointer-events:none;
}
.splash-active .site-header,
.splash-active .hero { opacity:0 }

/* ============================================
   HEADER
   ============================================ */
.site-header {
  position:fixed;top:0;left:0;right:0;z-index:1000;
  background:rgba(246,239,228,.94);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid transparent;
  transition:border-color .3s var(--ease), box-shadow .3s var(--ease);
}
.site-header.stuck {
  border-color:var(--border);
  box-shadow:0 2px 24px var(--shadow);
}
.lang-btn {
  background: transparent;
  border: 1.5px solid var(--border);
  color: var(--gold);
  border-radius: var(--r-md);
  font-size: .85rem;
  font-weight: 700;
  letter-spacing: .03em;
  cursor: pointer;
  transition: all .25s;
  width: 48px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: system-ui, -apple-system, sans-serif;
  flex-shrink: 0;
  padding: 1px 0 0;
  line-height: 0;
  text-align: center;
}
.lang-btn:hover { background: var(--warm); border-color: var(--gold); }
body.en .lang-btn { font-family:var(--f-ar);font-size:1.1rem;padding:0 0 2px }

.mob-overlay {
  display:none;
  position:fixed;
  inset:0;
  background:rgba(42,26,14,0.45);
  z-index:998;
  backdrop-filter:blur(2px);
}
.mob-overlay.show { display:block; }

/* AR: burger RIGHT, lang LEFT | EN: burger LEFT, lang RIGHT */
.hdr-inner {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:.9rem 1.25rem;
  max-width:1160px;
  margin:0 auto;
  flex-direction:row;
}

/* AR layout: lang(left) | nav(center) | logo(right) */
.hdr-left  { display:flex; align-items:center; gap:.5rem; order:1; flex:0 0 48px; }
.logo      { order:2; font-size:1rem; font-weight:700; color:var(--ink); line-height:1.2; flex:1; text-align:center; display:flex; justify-content:center; align-items:center; }
.hdr-right { display:flex; align-items:center; gap:.5rem; flex:0 0 48px; order:3; }

.logo-img {
  height:50px;
  width:auto;
  display:block;
}

.desk-nav {
  display:none;
  gap:.15rem;
  align-items:center;
}
.desk-nav a {
  padding:.45rem .85rem;
  border-radius:var(--r-sm);
  font-size:.85rem;
  color:var(--ink-mid);
  font-family:var(--f-ar);
  font-weight:500;
  transition:all .25s;
  display:flex;align-items:center;min-height:38px;
  white-space:nowrap;
}
.desk-nav a:hover { color:var(--gold); background:none; }
.desk-nav a:active { color:var(--gold); background:none; }
.burger {
  display:flex;
  flex-direction:column;
  gap:5px;
  background:none;border:none;cursor:pointer;
  padding:6px;min-width:44px;min-height:44px;
  justify-content:center;align-items:center;
  order:0;
}
.burger span {
  display:block;width:22px;height:2px;
  background:var(--ink);border-radius:2px;
  transition:all .5s var(--ease);
}
.burger.open span:nth-child(1){transform:translateY(3.5px) rotate(45deg)}
.burger.open span:nth-child(2){transform:translateY(-3.5px) rotate(-45deg)}

/* AR: burger on right side */
body.ar .hdr-left  { order:3; }
body.ar .logo      { order:2; }
body.ar .hdr-right { order:1; }

.mob-nav {
  position:fixed;
  top:0; left:0; right:0; bottom:0;
  width:100%; height:100%;
  max-width:none;
  background:var(--bg);
  flex-direction:column;
  justify-content:flex-start;
  padding:5rem 0 1.5rem;
  box-shadow:none;
  transform:translateY(-100%);
  transition:transform .8s cubic-bezier(.4,0,.2,1);
  display:flex;
  z-index:999;
  border-radius:0;
  border-bottom:none;
}
.mob-nav.open { transform:translateY(0); }
body.en .mob-nav {
  right:0; left:0;
  transform:translateY(-100%);
  box-shadow:none;
  border-radius:0;
}
body.en .mob-nav.open { transform:translateY(0); }

.mob-nav-name {
  font-size:1.6rem;
  font-weight:700;
  color:var(--gold);
  text-align:center;
  direction:rtl;
  padding:1.5rem 1.5rem .75rem;
  letter-spacing:.06em;
  border-bottom:none;
  margin-bottom:.5rem;
  padding-bottom:1rem;
  position:relative;
  font-family:var(--f-ar);
  opacity:.8;
}
body.en .mob-nav-name {
  text-align:center;
  direction:ltr;
}
.mob-nav-name::after {
  content:'';
  display:block;
  width:80px;
  height:2px;
  background:var(--gold);
  margin:.6rem auto 0;
  opacity:.6;
  border-radius:2px;
}

.mob-nav a {
  padding:.9rem 2rem;
  font-size:1.6rem;
  font-weight:600;
  color:var(--ink);
  border:none;
  display:block;
  text-align:right;
  direction:rtl;
  transition:color .15s;
  font-family:var(--f-ar);
  text-decoration:none;
  white-space:nowrap;
}
.mob-nav a:last-child { border-bottom:none; }
body.en .mob-nav a {
  text-align:left;
  direction:ltr;
}
.mob-nav a:hover, .mob-nav a:active {
  color:var(--gold);
  background:none;
}

/* AR (RTL default): show burger-right + lang-right on mobile, hide burger-left + lang-left */
.burger-left  { display:none !important; }
.lang-left    { display:none !important; }
.burger-right { display:flex !important; }
.lang-right   { display:flex; }

/* EN (LTR): show burger-left + lang-left, hide burger-right + lang-right */
body.en .burger-left  { display:flex !important; }
body.en .lang-left    { display:flex !important; }
body.en .burger-right { display:none !important; }
body.en .lang-right   { display:none !important; }

/* ============================================
   HERO
   ============================================ */
.hero {
  min-height:100svh;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:7rem 1.25rem 2rem;
  position:relative;
  overflow:hidden;
}
.hero::before {
  content:'';
  position:absolute;
  top:-8%;inset-inline-end:-12%;
  width:55vw;max-width:520px;
  height:55vw;max-height:520px;
  border-radius:50%;
  background:radial-gradient(circle,var(--warm) 0%,transparent 68%);
  opacity:.55;pointer-events:none;
}
.hero::after {
  content:'';
  position:absolute;
  bottom:8%;inset-inline-start:-8%;
  width:35vw;max-width:300px;
  height:35vw;max-height:300px;
  border-radius:50%;
  background:radial-gradient(circle,var(--gold-lt) 0%,transparent 70%);
  opacity:.18;pointer-events:none;
}
.hero-inner {
  display:flex;
  flex-direction:column;
  gap:2.5rem;
  max-width:1160px;
  margin:0 auto;
  width:100%;
  position:relative;z-index:1;
}
.hero-text { order:2; text-align:center; }
.hero-lbl {
  font-size:1.4rem;
  font-weight:600;
  letter-spacing:0;
  word-spacing:.3em;
  color:var(--gold);
  font-family:var(--f-ar);
  margin-bottom:1rem;
  opacity:0;
  animation:fadeUp .7s 1.6s var(--ease) both;
  text-align:center;
}
.hero-name {
  font-size:8.5vw;
  font-weight:700;
  color:var(--ink);
  line-height:1.0;
  margin-bottom:1.25rem;
  font-family:var(--f-ar);
  opacity:0;
  animation:fadeUp .7s 1.7s var(--ease) both;
  text-align:center;
}
.hero-tagline {
  font-size:clamp(1rem,2.2vw,1.25rem);
  color:var(--ink-mid);
  max-width:480px;
  line-height:1.85;
  margin-bottom:2rem;
  opacity:0;
  animation:fadeUp .7s 1.85s var(--ease) both;
  text-align:center;
  margin-left:auto;
  margin-right:auto;
}
.hero-cta {
  display:flex;gap:.85rem;flex-wrap:wrap;
  justify-content:center;
  opacity:0;
  animation:fadeUp .7s 2.0s var(--ease) both;
}
/* portrait */
.hero-portrait {
  order:1;
  display:flex;flex-direction:column;
  align-items:center;gap:1.5rem;
  opacity:0;
  animation:fadeUp .8s 1.65s var(--ease) both;
}
.portrait-wrap { position:relative;display:inline-block }
.portrait-img {
  width:min(240px,68vw);
  height:min(300px,84vw);
  border-radius:var(--r-xl) var(--r-xl) var(--r-xl) var(--r-xl);
  background:linear-gradient(145deg,#D4B483 0%,#A0784A 50%,#6B4A2A 100%);
  display:flex;align-items:center;justify-content:center;
  position:relative;overflow:hidden;
  box-shadow:0 20px 60px var(--shadow);
}
.portrait-img img {
  width:100%;height:100%;object-fit:cover;
  transform:scale(1.24);
  transform-origin:0% 100%;
}
.portrait-img::after {
  content:'';position:absolute;inset:0;
  background:linear-gradient(160deg,transparent 40%,rgba(42,26,14,.3) 100%);
}
.portrait-initials {
  font-size:3.5rem;font-weight:700;
  color:rgba(255,255,255,.35);
  font-family:var(--f-ar);
  position:relative;z-index:1;
}
.portrait-deco {
  position:absolute;
  bottom:-10px;inset-inline-end:-10px;
  width:55%;height:55%;
  border:2px solid var(--gold);
  border-radius:var(--r-lg);
  opacity:.45;z-index:-1;
}
.portrait-deco2 {
  position:absolute;
  top:-10px;inset-inline-start:-10px;
  width:40%;height:40%;
  border:1.5px solid var(--gold-lt);
  border-radius:var(--r-lg);
  opacity:.3;z-index:-1;
}
.hero-stats {
  display:flex;gap:1.25rem;align-items:center;flex-wrap:wrap;justify-content:center;
}
.stat { display:flex;flex-direction:column;align-items:center;text-align:center }
.stat-n { font-size:2.2rem;font-weight:700;color:var(--ink);line-height:1 }
.stat-l { font-size:1rem;color:var(--ink-lt);font-family:var(--f-ar);margin-top:.15rem }
.stat-div { width:1px;height:32px;background:var(--border) }

/* scroll hint */
.scroll-hint {
  display:flex;flex-direction:column;align-items:center;gap:1.8rem;
  margin-top:2.5rem;
  font-size:1.8rem;letter-spacing:0;word-spacing:.3em;
  color:var(--ink-lt);font-family:var(--f-ar);
  opacity:0;animation:fadeUp .6s 2.4s var(--ease) both;
}
.scroll-hint > span { display:inline-block; }

/* ── alternating infograph timeline ── */
.scroll-line {
  position:relative;
  width:240px;
  display:flex;
  flex-direction:column;
}
.scroll-line::before {
  content:'';
  position:absolute;
  left:50%;top:-40px;bottom:-40px;
  width:1px;
  transform:translateX(-50%);
  background:linear-gradient(to bottom,transparent 0%,var(--gold) 35%,var(--gold) 65%,transparent 100%);
}
.sl-item {
  display:flex;
  align-items:center;
  height:80px;
  position:relative;
  text-decoration:none;
  color:var(--ink-lt);
  transition:color .2s;
}
.sl-item::before {
  content:'';
  position:absolute;
  left:50%;top:50%;
  transform:translate(-50%,-50%);
  width:8px;height:8px;
  border-radius:50%;
  background:var(--gold);
  opacity:.45;
  z-index:1;
  transition:opacity .2s,transform .2s;
}
.sl-item:hover::before { opacity:1;transform:translate(-50%,-50%) scale(1.4); }
.sl-r { padding-left:calc(50% + 18px); justify-content:flex-start; }
.sl-l { padding-right:calc(50% + 18px); justify-content:flex-end; }

.sl-card {
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:.3rem;
  width:90px;
  height:64px;
  padding:.45rem .6rem;
  border-radius:8px;
  border:1px solid transparent;
  transition:border-color .2s,background .2s;
}
.sl-item:hover .sl-card {
  border-color:color-mix(in srgb,var(--gold) 35%,transparent);
  background:color-mix(in srgb,var(--gold) 5%,transparent);
}
.sl-card svg {
  width:22px;height:22px;
  color:var(--gold);
  opacity:.6;
  transition:opacity .2s;
}
.sl-item:hover .sl-card svg { opacity:1; }
.sl-name {
  font-family:var(--f-ar);
  font-size:.68rem;
  letter-spacing:.04em;
  word-spacing:normal;
  white-space:nowrap;
  color:var(--ink-lt);
  transition:color .2s;
}
.sl-item:hover .sl-name { color:var(--gold); }

/* ============================================
   BUTTONS
   ============================================ */
.btn {
  display:inline-flex;align-items:center;gap:.45rem;
  padding:.82rem 1.75rem;
  border-radius:var(--r-xl);
  font-size:.88rem;font-weight:600;
  transition:all .28s var(--ease);
  cursor:pointer;border:none;
  font-family:inherit;
  min-height:48px;white-space:nowrap;
}
.btn-primary { background:var(--ink);color:var(--white) }
.btn-primary:hover { background:var(--ink-mid);transform:translateY(-2px);box-shadow:0 8px 28px var(--shadow) }
.btn-ghost {
  background:transparent;color:var(--ink);
  border:1.5px solid var(--border);
}
.btn-ghost:hover { background:var(--warm);border-color:var(--gold) }
.btn-sm { padding:.6rem 1.25rem;font-size:.82rem;min-height:42px }

.link-arr {
  display:inline-flex;align-items:center;gap:.4rem;
  color:var(--gold);font-size:.88rem;font-weight:600;
  transition:gap .25s var(--ease);
  font-family:var(--f-ar);
}
.link-arr:hover { gap:.7rem }

/* ============================================
   DIVIDER ORNAMENT
   ============================================ */
.ornament {
  display:flex;align-items:center;gap:1rem;
  padding:2rem 0;
  opacity:.35;
}
.ornament::before,.ornament::after {
  content:'';flex:1;height:1px;background:var(--border);
}
.ornament-icon { font-size:1rem;color:var(--gold) }

/* ============================================
   INTRO
   ============================================ */
.intro {
  padding:7rem 0 1.5rem;
  border-top:none;
}
.intro-text {
  font-size:1.155rem;
  color:var(--ink-mid);
  line-height:1.75;
  margin-bottom:1.5rem;
}
.bio-block {
  margin-bottom:1.5rem;
  border-top:none;
  padding-top:3rem;
  margin-top:1.5rem;
  position:relative;
}
.bio-block::before {
  content:'';
  position:absolute;
  top:0;
  left:50%;
  transform:translateX(-50%);
  width:60%;
  height:1px;
  background:var(--border);
}
/* Bio section headings — all same size */
.intro > .wrap-sm > .label,
.bio-heading {
  font-size:1.8rem;
  font-weight:600;
  letter-spacing:0;
  word-spacing:.3em;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:1.5rem;
  font-family:var(--f-ar);
  display:block;
  text-align:center;
  /* blur-fade reveal — starts hidden */
  opacity:0;
  transform:translateY(18px);
  filter:blur(5px);
  transition:opacity .65s ease, transform .65s ease, filter .65s ease;
}
.intro > .wrap-sm > .label.in,
.bio-heading.in {
  opacity:1;
  transform:translateY(0);
  filter:blur(0);
}
.bio-list {
  list-style:none;
  padding:0; margin:0;
  display:flex;
  flex-direction:column;
  gap:.2rem;
}
.bio-list li {
  font-size:1.155rem;
  color:var(--ink-mid);
  line-height:1.75;
  padding-right:1.1rem;
  position:relative;
  direction:rtl;
  text-align:right;
}
.bio-list li::before {
  content:'·';
  position:absolute;
  right:0;
  color:var(--gold);
  font-weight:700;
}
body.en .bio-list li {
  padding-right:0;
  padding-left:1.1rem;
  direction:ltr;
  text-align:left;
}
body.en .bio-list li::before {
  right:auto;
  left:0;
}
body.en .bio-heading { letter-spacing:.12em; }

/* ============================================
   FEATURED BOOK
   ============================================ */
.feat-book {
  padding:3rem 0 0;
  margin-top:-1.5rem;
  background:transparent;
  border-top:none;
  border-bottom:none;
  position:relative;
}
.feat-book::before {
  content:'';
  position:absolute;
  top:0;
  left:50%;
  transform:translateX(-50%);
  width:396px;
  max-width:60%;
  height:1px;
  background:var(--border);
}
.feat-grid {
  display:flex;flex-direction:column;
  gap:2.5rem;align-items:center;
}
.feat-book-img {
  width:340px;
  height:auto;
  display:block;
}
/* book cover */
.book-cover {
  position:relative;flex-shrink:0;
}
.cover-mock {
  width:var(--cw,170px);
  height:var(--ch,245px);
  border-radius:5px 18px 18px 5px;
  background:linear-gradient(
    145deg,
    hsl(var(--hue,30) 42% 52%) 0%,
    hsl(var(--hue,30) 55% 32%) 100%
  );
  display:flex;align-items:center;justify-content:center;
  box-shadow:
    -3px 0 8px rgba(0,0,0,.22),
    5px 5px 22px rgba(0,0,0,.28),
    inset -2px 0 6px rgba(0,0,0,.18);
  transition:transform .35s var(--ease), box-shadow .35s var(--ease);
  position:relative;overflow:hidden;
}
.cover-mock::before {
  content:'';
  position:absolute;
  top:0;inset-inline-start:0;
  width:6px;height:100%;
  background:rgba(0,0,0,.18);
}
.cover-mock::after {
  content:'';
  position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(255,255,255,.12) 0%,transparent 50%);
}
.cover-mock:hover {
  transform:translateY(-8px) rotate(-1.5deg);
  box-shadow:
    -3px 0 8px rgba(0,0,0,.22),
    10px 14px 36px rgba(0,0,0,.32),
    inset -2px 0 6px rgba(0,0,0,.18),
}
.cover-inner {
  text-align:center;padding:1.25rem .9rem;
  position:relative;z-index:1;
}
.cover-ar {
  font-family:var(--f-ar);
  font-size:1.05rem;font-weight:700;
  color:rgba(255,255,255,.96);line-height:1.45;
}
.cover-en {
  font-family:var(--f-ar);
  font-size:.88rem;
  color:rgba(255,255,255,.9);line-height:1.45;
}
.cover-line {
  width:32px;height:1px;
  background:rgba(255,255,255,.45);
  margin:.65rem auto;
}
.cover-shadow {
  position:absolute;bottom:-14px;left:6%;right:6%;height:18px;
  background:radial-gradient(ellipse,rgba(0,0,0,.22) 0%,transparent 70%);
  filter:blur(5px);
}
.feat-info { text-align:center }
.book-badge {
  display:inline-block;
  background:var(--gold);color:#fff;
  font-size:.78rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  padding:.38rem .9rem .2rem;border-radius:var(--r-xl);
  margin-bottom:.9rem;font-family:var(--f-ar);
  align-self:flex-start;
}
.feat-title {
  font-size:clamp(1.75rem,4.5vw,2.8rem);
  color:var(--ink);line-height:1.15;
  margin-bottom:.3rem;
}
.feat-year { font-size:1rem;color:var(--ink-lt);margin-bottom:1.1rem }
.feat-desc {
  font-size:1.155rem;color:var(--ink-mid);
  line-height:1.85;margin-bottom:1.25rem;
}
.feat-book .feat-desc { margin-bottom:1.8rem }
.feat-meta {
  display:flex;gap:2rem;
  justify-content:center;margin-bottom:1.5rem;flex-wrap:wrap;
}
.meta-i { display:flex;flex-direction:column;gap:.15rem }
.meta-lbl {
  font-size:.62rem;text-transform:uppercase;letter-spacing:.14em;
  color:var(--ink-lt);font-family:var(--f-ar);
}
.meta-val { font-size:.88rem;font-weight:600;color:var(--ink) }

/* ============================================
   BOOKS GRID
   ============================================ */
.books-sec {
  padding:3.5rem 0;
  position:relative;
}
.books-sec::before {
  content:'';
  position:absolute;
  top:0;
  left:50%;
  transform:translateX(-50%);
  width:396px;
  max-width:60%;
  height:1px;
  background:var(--border);
}
.sec-hdr {
  display:flex;flex-direction:column;gap:.1rem;
  margin-bottom:2rem;
  align-items:flex-start;
}
.sec-hdr .label {
  text-align:right;
}
#map .label,
#int .label {
  text-align:right;
}
#contact .wrap-sm {
  display:flex;
  flex-direction:column;
  align-items:center;
}
.contact-hdr {
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}
#contact .label,
#contact .sec-title {
  text-align:right;
  width:auto;
}
.books-grid {
  display:grid;
  grid-template-columns:1fr;
  gap:1.1rem;
  grid-auto-rows:1fr;
}
.books-grid .bcard:last-child { justify-self:center; }
.bcard {
  display:flex;flex-direction:column;align-items:center;
  height:100%;
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--r-md);
  padding:1.4rem 1.4rem .5rem;
  transition:transform .3s var(--ease), box-shadow .3s var(--ease);
}
.bcard:hover {
  transform:translateY(-4px);
  box-shadow:0 12px 40px var(--shadow);
}
.bcard-cover {
  display:block;text-decoration:none;
  width:280px;height:350px;flex-shrink:0;
  border-radius:6px;overflow:hidden;
  margin-bottom:.3rem;cursor:pointer;
}
.bcard-cover img {
  width:100%;height:100%;object-fit:contain;display:block;
}
.bcard:has(.bcard-cover--map) {
  background:#D9C19D;
  border-color:#6B4A2A;
}
.bcard:has(.bcard-cover--map) .bcard-title,
.bcard:has(.bcard-cover--map) .bcard-year,
.bcard:has(.bcard-cover--map) .btn-link { color:#6B4A2A; border-color:#6B4A2A; }
.bcard-cover--map {
  perspective:900px;
  overflow:visible;
  background:none;
}
.bcard-cover--map img {
  border-radius:6px;
  transform:rotateY(-12deg) scale(0.8);
  box-shadow:8px 8px 20px rgba(0,0,0,.25), 2px 2px 6px rgba(0,0,0,.15);
  height:100%;object-fit:cover;
}
.bcard .cover-mock {
  --cw:200px;--ch:285px;flex-shrink:0;
}
.bcard .cover-ar { font-size:.75rem }
.bcard .cover-en { font-size:.58rem }
.bcard .cover-line { display:none }
.bcard-info { display:flex;flex-direction:column;align-items:center;gap:.15rem;width:100%;flex-grow:1 }
.bcard-title { font-size:.88rem;color:var(--ink);line-height:1.3;text-align:center }
.bcard-year { font-size:1rem;color:var(--ink-lt);text-align:center }
body.ar .bcard-year { font-size:1rem }
.btn-link {
  color:var(--gold);font-size:.8rem;font-weight:600;
  display:inline-flex;align-items:center;gap:.3rem;
  border-bottom:1px solid transparent;
  transition:border-color .2s;font-family:var(--f-ar);
  margin-top:auto;
  align-self:flex-end;
  margin-left:1rem;
}
.btn-link:hover { border-color:var(--gold) }
.btn-link-dl {
  color:var(--ink-lt);font-size:.7rem;
  border-bottom:none;
}
.btn-link-dl:hover { color:var(--gold);border-color:transparent }

/* ============================================
   QUOTE
   ============================================ */
.quote-sec {
  padding:3.5rem 0 1.5rem;
  background:var(--ink);
  position:relative;overflow:hidden;
}
.quote-sec::before {
  content:'';position:absolute;inset:0;
  background-image:
    repeating-linear-gradient(45deg,transparent,transparent 28px,rgba(184,147,90,.04) 28px,rgba(184,147,90,.04) 29px);
}
.q-mark {
  font-size:7rem;line-height:.5;
  color:var(--gold);opacity:.25;
  font-family:var(--f-ar);
  margin-bottom:0;
  text-align:right;
}
.q-mark-end {
  text-align:left;
  margin-bottom:0;
  margin-top:5rem;
}
.q-text {
  font-size:1.6rem;
  color:var(--warm);line-height:1.85;
  margin-bottom:0;
  position:relative;z-index:1;
}
.q-author {
  font-size:clamp(1rem,2.2vw,1.25rem);
  color:var(--gold-lt);
  font-family:var(--f-ar);
  letter-spacing:.05em;
  display:block;
  text-align:left;
}
body.en .q-author   { text-align:right; }
body.en .q-mark     { text-align:left; }
body.en .q-mark-end { text-align:right; }
body.en #map .label, body.en #map .sec-title, body.en #map .map-sub { text-align:left; }
body.en #int .label, body.en #int .sec-title { text-align:left; }

/* ============================================
   MAP SECTION
   ============================================ */
.map-sec { padding:3rem 24px 2rem; position:relative; }
.map-sec::before {
  content:'';
  position:absolute;
  top:0;
  left:50%;
  transform:translateX(-50%);
  width:396px;
  max-width:60%;
  height:1px;
  background:var(--border);
}
.map-sub {
  font-size:clamp(1rem,2.2vw,1.25rem);color:var(--ink-mid);
  line-height:1.75;margin-top:.75rem;
}

/* --- Interactive Map Container --- */
.map-container {
  margin:2rem auto 3.5rem;
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--r-md);
  max-width:900px;
  overflow:hidden;
  position:relative;
  box-shadow:0 4px 24px var(--shadow);
}

/* Toolbar */
.map-toolbar {
  display:flex;
  align-items:center;
  gap:8px;
  padding:10px 16px;
  background:var(--bg);
  border-bottom:1px solid var(--border);
}
.map-tool {
  display:flex;align-items:center;justify-content:center;gap:6px;
  padding:6px 14px;
  border:1.5px solid var(--border);
  border-radius:var(--r-md);
  background:var(--bg-card);
  color:var(--ink-mid);
  font-family:var(--f);font-size:.8rem;font-weight:600;
  cursor:pointer;
  transition:all .25s var(--ease);
}
.map-tool:hover { border-color:var(--gold); color:var(--ink); }
.map-tool.active {
  background:var(--gold);color:#fff;border-color:var(--gold);
}
.map-tool.active svg { stroke:#fff; }
.map-zoom-btns {
  display:flex;gap:4px;
  margin-inline-start:auto;
}
.map-zbtn {
  width:34px;height:34px;
  display:flex;align-items:center;justify-content:center;
  border:1.5px solid var(--border);
  border-radius:var(--r-md);
  background:var(--bg-card);
  color:var(--ink);
  font-size:1.1rem;font-weight:700;
  cursor:pointer;
  font-family:var(--f);
  transition:all .2s var(--ease);
}
.map-zbtn:hover { border-color:var(--gold);background:var(--gold);color:#fff; }

/* Viewport */
.map-viewport {
  position:relative;
  overflow:hidden;
  cursor:none;
  background:#e8ddd0;
  max-height:65vh;
  direction:ltr;
}
.map-viewport.panning { cursor:grab; }
.map-viewport.panning:active { cursor:grabbing; }
.map-viewport.panning .magnifier { display:none !important; }
.map-layer {
  position:relative;
  width:200%;
  transition:transform .15s ease-out;
  transform-origin:center center;
}
.map-img {
  width:100%;
  height:auto;
  display:block;
  user-select:none;
  -webkit-user-drag:none;
  max-width:none;
}

/* Magnifying Glass */
.magnifier {
  position:absolute;
  width:180px;height:180px;
  border-radius:50%;
  border:3px solid var(--gold);
  box-shadow:0 0 0 2px rgba(42,26,14,.15), 0 8px 32px rgba(0,0,0,.25), inset 0 0 20px rgba(0,0,0,.05);
  pointer-events:none;
  display:none;
  z-index:20;
  background-repeat:no-repeat;
  background-image:url('images/map-hires.jpg');
  overflow:hidden;
}
.magnifier::after {
  content:'';
  position:absolute;
  inset:0;
  border-radius:50%;
  background:radial-gradient(circle at 35% 35%, rgba(255,255,255,.15) 0%, transparent 60%);
  pointer-events:none;
}
.map-viewport:hover .magnifier,
.map-viewport:focus-within .magnifier { display:block; }

/* Story Pins */
.map-pins { display:none; position:absolute; top:0; left:0; width:100%; height:100%; pointer-events:none; }
.map-pins.visible { display:block; }
.map-pin { pointer-events:auto; }
.map-pin {
  position:absolute;
  width:20px;height:20px;
  background:none;border:none;
  cursor:pointer;
  z-index:15;
  transform:translate(50%,-50%);
  padding:0;
}
.pin-dot {
  display:block;
  width:8px;height:8px;
  background:var(--gold);
  border:1.5px solid #fff;
  border-radius:50%;
  position:absolute;
  top:50%;left:50%;
  transform:translate(-50%,-50%);
  z-index:2;
  box-shadow:0 1px 5px rgba(0,0,0,.35);
  transition:transform .2s, background .2s;
}
.map-pin:hover .pin-dot {
  transform:translate(-50%,-50%) scale(1.4);
}
/* Category colors matching the map legend */
.map-pin[data-cat="mosque"] .pin-dot { background:#5B8C5A; }
.map-pin[data-cat="mosque"]:hover .pin-dot { background:#7AB879; }
.map-pin[data-cat="school"] .pin-dot { background:#C47060; }
.map-pin[data-cat="school"]:hover .pin-dot { background:#D4907E; }
.map-pin[data-cat="palace"] .pin-dot { background:#8B7BB5; }
.map-pin[data-cat="palace"]:hover .pin-dot { background:#A899CC; }
.map-pin[data-cat="husainiya"] .pin-dot { background:#4A9B8E; }
.map-pin[data-cat="husainiya"]:hover .pin-dot { background:#6BB5A9; }
.map-pin[data-cat="landmark"] .pin-dot { background:var(--gold); }
.map-pin[data-cat="landmark"]:hover .pin-dot { background:var(--gold-lt); }
.map-pin[data-cat="cemetery"] .pin-dot { background:#7A8C8A; }
.map-pin[data-cat="cemetery"]:hover .pin-dot { background:#9AACAA; }
.map-pin[data-cat="coastal"] .pin-dot { background:#87CEEB; }
.map-pin[data-cat="coastal"]:hover .pin-dot { background:#B0E0FF; }
/* Birthplace pin — special styling */
.map-pin-home .pin-dot {
  width:10px;height:10px;
  background:var(--ink);
  border:2px solid var(--gold);
}
.map-pin-home .pin-pulse {
  background:rgba(42,26,14,.3);
  width:28px;height:28px;
}
.map-pin-home:hover .pin-dot {
  background:var(--gold);
}
.pin-pulse {
  display:block;
  width:20px;height:20px;
  border-radius:50%;
  background:rgba(184,147,90,.3);
  position:absolute;
  top:50%;left:50%;
  transform:translate(-50%,-50%);
  animation:pinPulse 2s ease-out infinite;
  will-change:transform,opacity;
}
@keyframes pinPulse {
  0% { transform:translate(-50%,-50%) scale(.5);opacity:1 }
  100% { transform:translate(-50%,-50%) scale(2);opacity:0 }
}

/* Pin Popup */
.pin-popup {
  display:none;
  position:absolute;
  z-index:25;
  background:var(--bg-card);
  border:1px solid var(--border);
  border-radius:var(--r-md);
  padding:14px 18px 14px 14px;
  width:240px;
  box-shadow:0 8px 32px rgba(0,0,0,.2);
  direction:rtl;
  text-align:right;
  transform:translateX(-50%);
  margin-top:10px;
}
.pin-popup.show { display:block; }
.pin-popup-close {
  position:absolute;
  top:6px;left:10px;
  background:none;border:none;
  font-size:1.3rem;
  color:var(--ink-lt);
  cursor:pointer;
  line-height:1;
}
.pin-popup-close:hover { color:var(--ink); }
.pin-popup-title {
  font-family:var(--f-ar);
  font-size:1rem;
  font-weight:700;
  color:var(--gold);
  margin-bottom:6px;
}
.pin-popup-desc {
  font-family:var(--f-ar);
  font-size:.85rem;
  color:var(--ink-mid);
  line-height:1.7;
}
.en .pin-popup { direction:ltr;text-align:left; }
.en .pin-popup-close { left:auto;right:10px; }

/* Hint */
.map-hint {
  padding:10px 16px;
  text-align:center;
  font-size:.82rem;
  color:var(--ink-lt);
  background:var(--bg);
  border-top:1px solid var(--border);
}

/* Touch zoom controls */
@media (hover:none) {
  .map-viewport { cursor:default; }
}

/* ============================================
   INTERVIEWS
   ============================================ */
.int-sec {
  padding:3.5rem 0;
  background:var(--bg-card);
  border-top:1px solid var(--border);
}
.vids-grid {
  display:flex;
  flex-direction:row;
  gap:1.25rem;
  margin-top:1.75rem;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
  padding-bottom:.5rem;
}
.vids-grid::-webkit-scrollbar { display:none; }
.vid-card {
  flex:0 0 85%;
  background:var(--bg);
  border:1px solid var(--border);
  border-radius:var(--r-md);
  overflow:hidden;
  scroll-snap-align:start;
  transition:transform .3s var(--ease), box-shadow .3s var(--ease);
}
.vid-card:hover { transform:translateY(-4px);box-shadow:0 12px 40px var(--shadow) }
.vid-wrap {
  position:relative;padding-top:56.25%;
  background:var(--ink);
}
.vid-wrap iframe {
  position:absolute;inset:0;width:100%;height:100%;border:none;
}
.vid-placeholder {
  position:absolute;inset:0;
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  gap:.65rem;cursor:pointer;
  background:linear-gradient(140deg,var(--ink) 0%,var(--ink-mid) 100%);
}
.vid-placeholder:hover .play-btn { background:rgba(255,255,255,.25) }
.vid-thumb { position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.85; }
.play-btn {
  width:58px;height:58px;border-radius:50%;
  background:rgba(255,255,255,.15);
  border:2px solid rgba(255,255,255,.38);
  display:flex;align-items:center;justify-content:center;
  transition:background .25s;
}
.play-lbl {
  font-size:.72rem;color:rgba(255,255,255,.5);
  font-family:var(--f-ar);letter-spacing:.1em;
}
.vid-info { padding:1.1rem }
.vid-title { font-size:1rem;color:var(--ink);margin-bottom:.4rem;line-height:1.4 }
.vid-desc { font-size:.83rem;color:var(--ink-mid);line-height:1.6;margin-bottom:.6rem }
.vid-dur {
  font-size:.72rem;color:var(--ink-lt);
  background:var(--bg-alt);
  padding:.18rem .55rem;border-radius:var(--r-sm);
  font-family:var(--f-ar);display:inline-block;
}

/* ============================================
   CONTACT
   ============================================ */
.contact-sec { padding:3.5rem 0 .25rem;border-top:1px solid var(--border) }
.contact-intro {
  font-size:.97rem;color:var(--ink-mid);
  margin:.65rem 0 2rem;
}
.contact-links { display:flex;flex-direction:row;gap:0;margin-bottom:2rem;justify-content:center }
.c-link {
  display:flex;flex-direction:column;align-items:center;gap:.6rem;
  padding:1.2rem .2rem;
  min-width:6rem;
  background:transparent;border:none;
  border-radius:var(--r-md);
  transition:all .28s var(--ease);text-align:center;
}
.c-link:hover {
  transform:translateY(-3px);
}
.c-icon {
  width:46px;height:46px;border-radius:var(--r-md);
  background:transparent;color:var(--gold);
  border:1.5px solid var(--gold);
  display:flex;align-items:center;justify-content:center;
  font-size:1rem;flex-shrink:0;
  transition:all .28s var(--ease);
}
.c-link:hover .c-icon { background:var(--gold);color:var(--bg) }
.c-icon svg { width:20px;height:20px;stroke:var(--gold);transition:stroke .28s var(--ease) }
.c-link:hover .c-icon svg { stroke:var(--bg) }
.c-icon svg [fill="currentColor"] { fill:var(--gold);transition:fill .28s var(--ease) }
.c-link:hover .c-icon svg [fill="currentColor"] { fill:var(--bg) }
.c-lbl {
  font-size:.65rem;text-transform:uppercase;
  letter-spacing:.14em;color:var(--ink-lt);
  font-family:var(--f-ar);display:block;margin-bottom:.15rem;
}
.c-val { font-size:.65rem;text-transform:uppercase;letter-spacing:.14em;color:var(--ink-lt);font-family:var(--f-ar) }


/* ============================================
   FOOTER
   ============================================ */
.site-footer {
  background:var(--ink);color:var(--warm);
  padding:1.2rem 0 1.5rem;
}
.foot-inner {
  display:flex;flex-direction:column;
  align-items:center;gap:.85rem;text-align:center;
  max-width:1160px;margin:0 auto;padding:0 1.25rem;
}
.foot-logo { font-size:.97rem;font-weight:700;color:var(--gold-lt);margin-bottom:.5rem }
.foot-copy { font-size:.72rem;color:rgba(255,255,255,.35) }
.foot-nav { display:flex;gap:1.5rem;flex-wrap:wrap;justify-content:center }
.foot-nav a {
  font-size:.82rem;color:rgba(255,255,255,.55);
  font-family:var(--f-ar);transition:color .2s;
}
.foot-nav a:hover { color:var(--gold-lt) }

/* ============================================
   ANIMATIONS
   ============================================ */
@keyframes fadeUp {
  from { opacity:0;transform:translateY(28px) }
  to   { opacity:1;transform:translateY(0) }
}
.reveal {
  opacity:0;transform:translateY(28px);
  transition:opacity .7s var(--ease), transform .7s var(--ease);
}
.reveal.in { opacity:1;transform:translateY(0) }
.reveal-d1 { transition-delay:.1s }
.reveal-d2 { transition-delay:.2s }
.reveal-d3 { transition-delay:.3s }
.reveal-d4 { transition-delay:.4s }
.reveal-d5 { transition-delay:.5s }

/* ============================================
   RESPONSIVE — TABLET 640+
   ============================================ */
@media(min-width:640px){
  .splash { padding-bottom:0; }
  .hero-name { font-size:min(6.5vw,5.5rem) }
  .hero-inner {
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    gap:2rem;
  }
  .hero-text { order:2; flex:unset; width:100%; text-align:center; }
  .hero-portrait { order:1; flex-shrink:0; }
  .hero-lbl { text-align:center; }
  .hero-name { text-align:center; }
  .hero-tagline { text-align:center; }
  .hero-btns { justify-content:center; }
  .hero-stats { justify-content:center; }
  .portrait-img { width:300px; height:380px; }
  .hero-portrait { display:flex; justify-content:center; margin-top:2rem; }
  .feat-info { text-align:start }
  .feat-meta { justify-content:flex-start }
  .books-grid { grid-template-columns:repeat(3,1fr) }
  .books-grid .bcard:last-child { grid-column:1/-1; max-width:calc((100% - 2.2rem)/3); }
  .bcard-cover { width:100%;max-width:250px;height:auto;aspect-ratio:250/313 }
  .vid-card { flex:0 0 42%; }
  .desk-nav   { display:flex }
  /* On desktop: hide all burgers, show only lang-right (EN toggle) */
  .burger-left, .burger-right { display:none !important }
  body.en .burger-left  { display:none !important }
  body.en .burger-right { display:none !important }
  .lang-right { display:flex !important }
  .lang-left  { display:none !important }
  /* Desktop header: logo always right, lang always left, nav center */
  .hdr-inner  { display:flex; flex-direction:row; align-items:center; gap:1rem; }
  body.ar .hdr-left   { order:3 !important; flex:0 0 auto; }
  body.ar .logo       { display:flex !important; order:1 !important; flex:0 0 auto; }
  .desk-nav   { order:2; flex:1 1 auto; justify-content:center; }
  .hdr-right  { display:none !important; }
  /* EN desktop: show hdr-right with AR lang button on left */
  body.en .hdr-right { display:flex !important; order:1 !important; }
  body.en .hdr-left  { display:none !important; }
  body.en .desk-nav  { order:2 !important; }
  body.en .logo      { display:flex !important; order:3 !important; flex:0 0 auto; }
  body.en .lang-left { display:flex !important; }
  /* Center hero tagline and buttons on desktop */
  .hero-tagline { text-align:center; width:100%; }
  .hero-btns  { justify-content:center; display:flex; gap:1rem; }
  .sec-hdr    { flex-direction:row;align-items:baseline;justify-content:space-between }
}
@media(min-width:1024px){
  .hero-name { font-size:min(6vw,5.5rem) }
  .feat-book-img { width:450px }
  .books-grid { grid-template-columns:repeat(4,1fr) }
  .books-grid .bcard:last-child { grid-column:1/-1; max-width:calc((100% - 3.3rem)/4); }
  .bcard-cover { width:100%;max-width:220px;height:auto;aspect-ratio:220/275 }
  .bcard .cover-mock { --cw:220px;--ch:275px }
  .bcard .cover-ar { font-size:.85rem }
  .bcard .cover-en { font-size:.7rem }
  .bcard .cover-line { display:block }
  .vid-card { flex:0 0 30%; }
  .foot-inner { flex-direction:column;align-items:center;text-align:center }
}

/* ============================================
   EN OVERRIDES
   ============================================ */
.en { direction:ltr;font-family:var(--f-ar) }
.en .label { font-family:var(--f-ar);letter-spacing:.18em;font-weight:600;word-spacing:normal }
.en .hero-lbl { letter-spacing:.18em;word-spacing:normal }
.en .mob-nav a,.en .desk-nav a,.en .btn,.en .link-arr,
.en .btn-link,.en .vid-dur,.en .foot-nav a,
.en .hero-lbl,.en .book-badge,.en .meta-lbl,
.en .stat-l,.en .c-lbl,.en .q-author { font-family:var(--f-ar) }

/* ============================================
   PWA BOTTOM NAV — only in standalone (home screen) mode
   ============================================ */
.pwa-nav {
  display: none;
  position: fixed;
  bottom: 0; left: 0; right: 0;
  z-index: 2000;
  background: rgba(232,221,208,0.96);
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
  border-top: 1px solid rgba(184,147,90,0.28);
  /* 50px visible tab area + safe area below (home indicator) */
  padding-top: 0;
  padding-bottom: env(safe-area-inset-bottom, 34px);
  min-height: calc(50px + env(safe-area-inset-bottom, 34px));
  flex-direction: row;
  justify-content: space-around;
  align-items: stretch;
}
.pwa-nav-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  padding: 8px 6px 0;
  flex: 1;
  color: var(--ink-lt);
  text-decoration: none;
  -webkit-tap-highlight-color: transparent;
  transition: color .2s var(--ease);
  position: relative;
}
.pwa-nav-item svg {
  width: 23px; height: 23px;
  stroke: currentColor; fill: none;
  stroke-width: 1.55;
  stroke-linecap: round; stroke-linejoin: round;
  transition: transform .25s var(--ease);
  flex-shrink: 0;
}
.pwa-nav-item span {
  font-size: 10px;
  font-family: var(--f-ar);
  font-weight: 600;
  letter-spacing: .01em;
  white-space: nowrap;
  line-height: 1;
}
.pwa-nav-item.active { color: var(--gold); }
.pwa-nav-item.active svg { transform: translateY(-3px) scale(1.08); }
.pwa-nav-item.active::after {
  content: '';
  position: absolute;
  top: 0; left: 50%;
  transform: translateX(-50%);
  width: 28px; height: 3px;
  background: var(--gold);
  border-radius: 0 0 4px 4px;
}

/* PWA top home button — hidden unless standalone */
.pwa-top-btn {
  display: none;
  align-items: center;
  justify-content: center;
  width: 34px; height: 34px;
  background: transparent;
  border: none;
  color: var(--gold);
  cursor: pointer;
  padding: 0;
  flex-shrink: 0;
  transition: opacity .2s, transform .2s var(--ease);
  -webkit-tap-highlight-color: transparent;
}
.pwa-top-btn svg { width: 23px; height: 23px; }
.pwa-top-btn:active { opacity: .6; transform: scale(.9); }

/* Show bottom nav only when running as installed PWA */
@media (display-mode: standalone) {
  .pwa-nav     { display: flex; }
  body         { padding-bottom: calc(50px + env(safe-area-inset-bottom, 34px)); }
  /* Push header below Dynamic Island — tighten inner padding so header stays compact */
  .site-header { padding-top: env(safe-area-inset-top, 54px); }
  .hdr-inner   { padding-top: .05rem; padding-bottom: .05rem; }
  /* Hero: clear the now-taller header exactly */
  .hero        { padding-top: calc(4rem + env(safe-area-inset-top, 54px)); }
  /* Push portrait a bit lower */
  .hero-portrait { margin-top: 2.5rem !important; }
  /* Hide ALL burgers in PWA — even body.en overrides */
  .burger, body.en .burger-left, body.en .burger-right { display: none !important; }
  /* Keep EN layout identical to AR: same order, same lang button position */
  body.en .hdr-left  { order: 3 !important; }
  body.en .hdr-right { order: 1 !important; }
  body.en .lang-left  { display: none !important; }
  body.en .lang-right { display: flex !important; }
  /* Show home button */
  .pwa-top-btn { display: flex; }
}