:root {
  --orange: #f45b00;
  --orange-dark: #d94f00;
  --yellow: #f1c50e;
  --sky: #8fd9f7;
  --blue: #0086fb;
  --navy: #10283d;
  --ink: #151515;
  --muted: #666;
  --soft: #e5e5e5;
  --soft-2: #f4f4f4;
  --footer: #4d4d4d;
  --white: #fff;
  --radius: 14px;
  --shadow: 0 12px 34px rgba(0,0,0,.12);
  --max: 1140px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: #fff;
  font-family: Tahoma, Arial, sans-serif;
  line-height: 1.65;
  overflow-x: hidden;
}
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }
.container { width: min(var(--max), calc(100% - 40px)); margin-inline: auto; }
.visually-hidden { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }

/* Header */
.site-header {
  position: absolute;
  inset: 0 0 auto 0;
  z-index: 100;
  color: #fff;
  background: linear-gradient(to bottom, rgba(0,0,0,.42), rgba(0,0,0,0));
}
.site-header.solid { position: relative; background: #25313b; }
.header-inner {
  min-height: 94px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  direction: ltr;
}
.brand {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 0 0 auto;
}
.brand img { width: 78px; height: auto; }
.brand-name {
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.05rem, 2vw, 1.55rem);
  line-height: 1.05;
  white-space: nowrap;
}
.brand-name span { color: #2eccff; }
.main-nav { direction: rtl; }
.nav-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 17px;
}
.nav-list a {
  display: block;
  color: #fff;
  font-weight: 700;
  font-size: .92rem;
  padding: 8px 2px 6px;
  border-bottom: 3px solid transparent;
}
.nav-list a:hover, .nav-list a:focus-visible, .nav-list a[aria-current="page"] { border-bottom-color: var(--yellow); }
.nav-list .donate-nav { color: #ffd86a; }
.menu-toggle {
  display: none;
  width: 46px;
  height: 42px;
  border: 1px solid rgba(255,255,255,.55);
  border-radius: 8px;
  color: #fff;
  background: rgba(0,0,0,.2);
  cursor: pointer;
  align-items: center;
  justify-content: center;
}
.menu-toggle svg { width: 25px; height: 25px; fill: currentColor; }

/* Buttons */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: 9px 22px;
  border-radius: 999px;
  border: 2px solid transparent;
  font-weight: 800;
  line-height: 1.2;
  cursor: pointer;
  text-align: center;
  white-space: nowrap;
}
.btn-orange { color: #fff; background: var(--orange); border-color: rgba(255,255,255,.8); }
.btn-orange:hover, .btn-orange:focus-visible { background: var(--orange-dark); }
.btn-download { color:#111; background: var(--yellow); border-color: var(--yellow); }
.btn-download:hover, .btn-download:focus-visible { background: #ddb40c; }
.btn-read { color:#111; background: var(--sky); border-color: var(--sky); }
.btn-read:hover, .btn-read:focus-visible { color:#fff; background: var(--blue); border-color: var(--blue); }
.btn-disabled { opacity: .38; cursor: not-allowed; pointer-events: none; }

/* Home carousel */
.hero-carousel { position: relative; min-height: 740px; overflow: hidden; background: #0b2030; color: #fff; }
.carousel-track { position: relative; display: grid; min-height: 740px; }
.slide {
  position: relative;
  grid-area: 1 / 1;
  min-width: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity .55s ease;
  background-position: center;
  background-size: cover;
}
.slide::before { content:""; position:absolute; inset:0; background: rgba(0,0,0,.42); }
.slide.active { opacity: 1; visibility: visible; z-index: 2; }
.slide-1 { background-image: url("images/chihab-site-bg-00.jpg"); }
.slide-2 { background-image: url("images/eso1629a-1200x630-e1472166793115_0.jpg"); }
.slide-3 { background-image: url("images/Visualillusion-min.jpg"); }
.slide-content { position: relative; z-index: 1; min-height: 740px; padding-top: 122px; padding-bottom: 76px; }
.feature-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(260px, .55fr);
  gap: 42px;
  align-items: center;
  direction: rtl;
}
.feature-copy { text-align: right; }
.slogan { width: min(401px, 80%); margin-inline: auto 0; margin-bottom: 20px; }
.issue-lead {
  margin: 12px 0 18px;
  font-size: clamp(.92rem, 1.4vw, 1.05rem);
  white-space: pre-line;
  text-shadow: 0 1px 2px rgba(0,0,0,.45);
}
.feature-actions { margin-top: 18px; }
.feature-cover { width: min(365px, 100%); margin-inline: auto; box-shadow: 0 18px 42px rgba(0,0,0,.4); }
.center-message {
  min-height: 540px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  direction: rtl;
  padding: 40px;
}
.center-message p { max-width: 820px; font-size: clamp(1.1rem, 2.4vw, 1.9rem); margin: 0; font-weight: 600; }
.slide-3 .center-message { flex-direction: column; }
.slide-3 h1 { margin: 0; font-size: clamp(2.35rem, 6vw, 4.6rem); line-height: 1.2; }
.slide-3 p { margin-top: 18px; font-size: clamp(1.55rem, 4vw, 3rem); text-shadow: 2px 2px 8px rgba(0,0,0,.4); }
.carousel-dots {
  position: absolute; z-index: 5; left:50%; bottom: 28px; transform:translateX(-50%);
  display:flex; gap:9px;
}
.carousel-dot { width: 13px; height: 13px; border:0; border-radius:50%; padding:0; background: rgba(255,255,255,.55); cursor:pointer; }
.carousel-dot.active { background: #fff; transform: scale(1.08); }
.carousel-arrow {
  position:absolute; z-index:5; top:50%; transform:translateY(-50%);
  width:48px; height:48px; border:1px solid rgba(255,255,255,.5); border-radius:50%;
  color:#fff; background:rgba(0,0,0,.25); cursor:pointer; font-size:2rem; line-height:1;
}
.carousel-arrow:hover, .carousel-arrow:focus-visible { background:rgba(0,0,0,.55); }
.carousel-prev { left: 18px; }
.carousel-next { right: 18px; }

/* About */
.about-section { background: #e5e5e5; padding: 34px 0; }
.about-grid { display:grid; grid-template-columns: 1fr 1fr; gap: 26px; align-items: stretch; }
.about-card { background:#fff; padding: 28px 34px; min-height: 430px; }
.about-card h2 { margin:0 0 14px; font-size:1.55rem; }
.about-card p { margin:0; }
.about-card.ar { direction: rtl; text-align: right; }
.about-card.en { direction: ltr; text-align: left; }
/* Inner pages */
.page-hero {
  position: relative;
  min-height: 420px;
  display:flex;
  align-items:flex-end;
  color:#fff;
  background-position:center;
  background-size:cover;
}
.page-hero::before { content:""; position:absolute; inset:0; background: linear-gradient(to bottom, rgba(0,0,0,.18) 0%, rgba(0,0,0,.22) 45%, rgba(0,0,0,.88) 100%); }
.page-hero-content { position:relative; z-index:1; width:100%; padding: 150px 0 58px; direction:rtl; text-align:right; }
.page-hero h1 { margin:0 0 8px; font-size:clamp(2.2rem, 5vw, 4rem); line-height:1.2; }
.page-hero p { margin:0; max-width:800px; font-size:clamp(1rem,2vw,1.35rem); }
.hero-issues { background-image:url("images/Visualillusion-min.jpg"); }
.hero-team { background-image:url("images/6a3ad48b4a414895dda8440c19cefce0fc1833d5dcec4124d45fe61d2c6d9729613935dce15a49aa6713267d59e404a55c7195565edc1bd4123a58_1280.jpg"); }
.hero-contact { background-image:url("images/c08770d709d7f2a7ff3fc786a52c6d18ea496a490ec70e784aedf118c2041664dce545ca39f7aea6e6744d61c295f92bf4254616665eaaefaa2787_1280.jpg"); }

.content-section { background:#e4e4e4; padding: 52px 0 68px; }
.cards-grid { display:grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 28px; direction:rtl; }
.issue-card {
  background:#fff;
  border-radius:12px;
  padding:20px;
  box-shadow: 0 5px 20px rgba(0,0,0,.09);
  display:flex;
  flex-direction:column;
  min-width:0;
}
.issue-card img.cover { width:100%; aspect-ratio: .77; object-fit:cover; border-radius:10px; background:#efefef; }
.issue-card img.placeholder { object-fit:contain; padding:18px; background:linear-gradient(#fff,rgba(255,255,255,.2)); }
.issue-card h3 { margin:15px 0 3px; font-size:1.4rem; text-align:center; }
.issue-card p { margin:0 0 17px; text-align:center; min-height: 2.9em; font-weight:600; }
.card-actions { margin-top:auto; display:grid; grid-template-columns:1fr 1fr; gap:10px; direction:rtl; }
.card-actions .btn { width:100%; border-radius:8px; }

/* Team */
.team-stack { display:grid; gap:26px; direction:rtl; }
.team-card {
  position:relative;
  overflow:hidden;
  background:#fff;
  border-radius:12px;
  padding:34px;
  box-shadow:var(--shadow);
}
.team-card::before { content:""; position:absolute; width:180px; height:180px; border-radius:50%; right:-75px; top:-75px; background:linear-gradient(135deg,rgba(255,147,0,.32),rgba(219,84,90,.36)); }
.team-card > * { position:relative; z-index:1; }
.team-bilingual { display:grid; grid-template-columns: 1fr 1fr; gap:36px; direction:rtl; }
.team-col { padding: 4px 12px; }
.team-col.ar { text-align:right; direction:rtl; }
.team-col.en { text-align:left; direction:ltr; border-right:1px solid #e0e0e0; }
.role-list { margin:0; display:grid; grid-template-columns: minmax(120px,.65fr) 1fr; gap:10px 18px; }
.role-list dt { font-weight:800; color:#9a3b00; }
.role-list dd { margin:0; }
.team-simple h2 { margin:0 0 8px; font-size:1.45rem; }
.team-simple p { margin:0; font-size:1.08rem; }

/* Contact */
.contact-section { background:#e4e4e4; padding: 48px 0 68px; }
.contact-intro { text-align:center; direction:rtl; font-size:1.25rem; font-weight:700; margin:0 0 30px; }
.map-frame { border-radius:12px; overflow:hidden; box-shadow:var(--shadow); background:#ddd; }
.map-frame iframe { display:block; width:100%; height:480px; border:0; }
.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:22px; margin-top:28px; direction:rtl; }
.contact-card { background:#26333e; color:#fff; border-radius:12px; padding:28px; min-height:190px; }
.contact-card h2 { margin:0 0 14px; font-size:1.25rem; }
.contact-card p { margin:5px 0; }
.contact-card a { color:#fff; text-decoration:underline; text-underline-offset:3px; }
.contact-line { display:flex; gap:10px; align-items:flex-start; }
.contact-line svg { flex:0 0 auto; width:22px; height:22px; margin-top:4px; fill:currentColor; }
.ltr { direction:ltr; text-align:left; }

/* Blog */
.blog-main { background:#f4f4f4; padding:48px 0 68px; }
.blog-title { margin:0 0 30px; font-size:2rem; text-align:center; }
.blog-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:26px; }
.blog-card { background:#fff; border-radius:12px; overflow:hidden; box-shadow:0 6px 22px rgba(0,0,0,.09); }
.blog-card img { width:100%; aspect-ratio:4/1; object-fit:cover; }
.blog-card-body { padding:20px; direction:ltr; text-align:left; }
.blog-card h2 { margin:0 0 8px; font-size:1.25rem; }
.blog-card p { margin:0 0 16px; color:#555; }
.blog-read { display:inline-block; color:#176bb0; font-weight:700; border-bottom:2px solid #176bb0; }
.post-main { background:#f4f4f4; padding:48px 0 70px; }
.post-article { max-width:900px; margin:auto; background:#fff; border-radius:12px; overflow:hidden; box-shadow:var(--shadow); direction:ltr; }
.post-article img { width:100%; aspect-ratio:4/1; object-fit:cover; }
.post-body { padding:32px; }
.post-body h1 { margin:0 0 18px; }
.post-body p { margin:0; }

/* Footer */
.site-footer { background:var(--footer); color:#fff; padding: 38px 0 20px; direction:rtl; }
.footer-top { display:grid; grid-template-columns: 1.15fr 1fr 1fr; gap:34px; align-items:start; }
.footer-brand { display:flex; align-items:center; gap:12px; direction:ltr; margin-bottom:16px; }
.footer-brand img { width:76px; }
.footer-brand strong { font-family:Georgia,"Times New Roman",serif; font-size:1.18rem; }
.footer-nav { list-style:none; padding:0; margin:0 0 20px; display:flex; flex-wrap:wrap; gap:8px 16px; }
.footer-nav a { color:#fff; border-bottom:1px solid transparent; }
.footer-nav a:hover { border-color:#fff; }
.footer-block h3 { margin:0 0 12px; font-size:1.1rem; }
.footer-block p { margin:0 0 12px; color:#eee; font-size:.93rem; }
.footer-support { margin-top:18px; }
.paypal-img { width:170px; height:auto; margin-top:10px; }
.partner-logos { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; align-items:center; margin-top:18px; }
.partner-logos img { width:100%; max-width:72px; margin:auto; border-radius:50%; }
.footer-bottom { border-top:1px solid rgba(255,255,255,.22); margin-top:30px; padding-top:18px; text-align:center; font-size:.72rem; color:#bcbcbc; direction:ltr; }

/* Responsive */
@media (max-width: 980px) {
  .menu-toggle { display:inline-flex; }
  .main-nav {
    position:absolute; top:82px; right:20px; left:20px;
    background:rgba(55,14,18,.97); border-radius:10px; box-shadow:var(--shadow);
    max-height:0; opacity:0; overflow:hidden; pointer-events:none;
    transition:max-height .25s ease, opacity .2s ease;
  }
  .main-nav.open { max-height:520px; opacity:1; pointer-events:auto; }
  .nav-list { display:block; padding:10px 16px 16px; }
  .nav-list a { padding:12px 8px; border-bottom:1px solid rgba(255,255,255,.18); }
  .feature-grid { grid-template-columns:1fr 320px; gap:26px; }
  .cards-grid, .blog-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .footer-top { grid-template-columns:1fr 1fr; }
  .footer-top .footer-block:first-child { grid-column:1 / -1; }
}

@media (max-width: 720px) {
  .container { width:min(100% - 28px, var(--max)); }
  .header-inner { min-height:80px; }
  .brand img { width:60px; }
  .brand-name { font-size:.96rem; }
  .main-nav { top:70px; }
  .hero-carousel, .carousel-track { min-height:960px; }
  .slide-content { min-height:960px; padding-top:100px; padding-bottom:86px; }
  .feature-grid { grid-template-columns:1fr; gap:20px; }
  .feature-copy { order:2; text-align:right; }
  .feature-cover-wrap { order:1; }
  .feature-cover { width:min(265px,72vw); }
  .slogan { width:min(330px,94%); margin-inline:auto; }
  .issue-lead { font-size:.93rem; line-height:1.72; }
  .feature-actions { text-align:center; }
  .feature-actions .btn { min-width:180px; }
  .center-message { min-height:780px; padding:30px 24px; }
  .carousel-arrow { width:40px; height:40px; font-size:1.6rem; }
  .carousel-prev { left:8px; } .carousel-next { right:8px; }
  .about-grid { grid-template-columns:1fr; }
  .about-card { min-height:auto; padding:24px; }
.page-hero { min-height:340px; }
  .page-hero-content { padding-top:120px; padding-bottom:42px; text-align:center; }
  .page-hero p { margin-inline:auto; }
  .cards-grid, .blog-grid { grid-template-columns:1fr; gap:22px; }
  .issue-card { max-width:460px; width:100%; margin-inline:auto; }
  .card-actions { gap:8px; }
  .card-actions .btn { padding:10px 12px; min-height:46px; }
  .team-bilingual { grid-template-columns:1fr; gap:18px; }
  .team-col.en { border-right:0; border-top:1px solid #e0e0e0; padding-top:22px; }
  .role-list { grid-template-columns:1fr; gap:2px; }
  .role-list dd { margin-bottom:10px; }
  .contact-grid { grid-template-columns:1fr; }
  .map-frame iframe { height:360px; }
  .footer-top { grid-template-columns:1fr; }
  .footer-top .footer-block:first-child { grid-column:auto; }
  .partner-logos { grid-template-columns:repeat(4,1fr); }
}

@media (max-width: 410px) {
  .brand-name { display:none; }
  .feature-cover { width:min(245px,74vw); }
  .hero-carousel, .carousel-track, .slide-content { min-height:1000px; }
  .issue-lead { font-size:.88rem; }
  .btn { white-space:normal; }
  .card-actions { grid-template-columns:1fr; }
  .page-hero h1 { font-size:2.05rem; }
  .team-card, .contact-card { padding:22px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior:auto!important; transition:none!important; animation:none!important; }
}