:root{
    /* غيّر المسارات حسب ملفاتك */
    --bg-image: url("1.jpg");
    --inline-logo: url("logo.png");

    /* ألوان Rikaza */
    --sand: #c2ad99; /* البيج الأساسي */
    --sand-80: rgba(194,173,153,.9);
    --ink: #000;

    --about-photo: url("6.jpg");
    --bg-brown: #201a16;   /* خلفية بنية داكنة */
    --bg-brown-2:#1a1512;
    --border-ivory:#efe5d8;
    --philosophy-photo: url("7.jpg");

    --what-photo: url("3.jpg"); /* الصورة البيضاوية الكبيرة */
    --what-avatar: url("2.jpg");       /* الدائرة الصغيرة */

    --vision-photo: url("5.jpg");   /* صورة الكتاب المفتوح مع الحروف - يمين */
    --mission-photo: url("1.jpg"); /* صورة الكتاب المضيء - أسفل يسار */

    --signature-photo: url("14.jpg"); /* ضع هنا صورة الشخص اللي ماسك الكتاب */

    --why-photo-main: url("13.jpg");   /* الصورة البيضاوية الكبيرة يمين */
    --why-photo-badge: url("8.jpg"); /* البيضاوية الصغيرة المتداخلة */

    --why2-photo-top: url("12.jpg");      /* الصورة البيضاوية الكبيرة */
    --why2-photo-bottom: url("9.jpg");/* الصورة الصغيرة المتداخلة */

    --apart-left:  url("10.jpg");   /* الصورة البيضاوية الكبيرة يسار */
    --apart-right: url("11.jpg");  /* الصورة البيضاوية الصغيرة يمين */
  }


  *{box-sizing:border-box}
  html,body{height:100%}
  body{
    margin:0;
    font-family:"Montserrat",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
    background: var(--ink);
    color: var(--sand);
    
  }
img,svg,video{max-width:100%; height:auto;}

/* ===== NAVBAR ===== */
.navbar {
  position: fixed;
  top: 0; left: 0; right: 0;
  background: rgba(26, 21, 18, 0.9);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(194,173,153,0.25);
  z-index: 999;
}

.nav-container {
  max-width: 1200px;
  margin: 0 auto;
  padding: 14px 28px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

/* اللوجو + الكلمة */
.nav-logo {
  display: flex;
  align-items: center;
  gap: 5px;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.3));
}

.nav-logo .inline-logo {
  width: 100px;
  height: 52px;
  background: var(--inline-logo) center/contain no-repeat;
}

.nav-logo span {
  font-weight: 700;
  font-size: 22px;
  color: var(--sand);
  letter-spacing: 0.06em;
}

/* الروابط */
.nav-links {
  list-style: none;
  display: flex;
  gap: 30px;
  margin: 0;
  padding: 0;
}

.nav-links a {
  text-decoration: none;
  color: var(--sand-80);
  font-weight: 500;
  transition: color 0.3s;
}

.nav-links a:hover {
  color: var(--sand);
}

/* زر الموبايل */
.menu-toggle {
  display: none;
  flex-direction: column;
  cursor: pointer;
  gap: 5px;
}

.bar {
  width: 25px;
  height: 3px;
  background-color: var(--sand);
  border-radius: 2px;
  transition: all 0.3s ease;
}

/* عند فتح القائمة */
.menu-toggle.active .bar:nth-child(1) {
  transform: rotate(45deg) translate(5px, 5px);
}
.menu-toggle.active .bar:nth-child(2) {
  opacity: 0;
}
.menu-toggle.active .bar:nth-child(3) {
  transform: rotate(-45deg) translate(5px, -5px);
}

/* ===== Responsive Navbar ===== */
@media (max-width: 768px) {
  .menu-toggle {
    display: flex;
  }

  .nav-links {
    position: absolute;
    top: 70px;
    left: 0;
    right: 0;
    background: var(--bg-brown);
    flex-direction: column;
    align-items: center;
    gap: 18px;
    padding: 20px 0;
    border-top: 1px solid rgba(194,173,153,0.2);
    display: none;
  }

  .nav-links.active {
    display: flex;
    animation: slideDown 0.3s ease;
  }

  @keyframes slideDown {
    from { opacity: 0; transform: translateY(-10px); }
    to { opacity: 1; transform: translateY(0); }
  }

  .nav-links a {
    font-size: 18px;
    color: var(--sand-80);
  }

  .nav-logo .inline-logo {
    width: 36px;
    height: 36px;
  }

  .nav-logo span {
    font-size: 20px;
  }
}

/* تعويض المسافة عشان الـ navbar ثابت */
body {
  padding-top: 70px;
  direction: ltr;
}

/* سكرول ناعم */
html {
  scroll-behavior: smooth;
}

/* ======================== */


  /*  الشاشة الأولى (الكل على خلفية صورة)  */
  .hero{
    position:relative;
    min-height:100vh;        /* fallback */
    min-height:100svh;
    display:flex;
    flex-direction:column;
    justify-content:center;
    gap: clamp(18px, 3.2vw, 32px);
    padding: clamp(16px, 3vw, 40px);
    background: center/cover no-repeat;
    background-image: var(--bg-image);
    overflow:hidden;
    isolation:isolate;
  }
  /* تعتيم وتدرّج ناعم */
  .hero::before{
    content:"";
    position:absolute; inset:0;
    background:
      linear-gradient(to top, rgba(0,0,0,.65) 5%, rgba(0,0,0,.35) 40%, rgba(0,0,0,.55) 100%),
      radial-gradient(120% 120% at 50% 20%, rgba(0,0,0,.15) 0%, rgba(0,0,0,.7) 55%, rgba(0,0,0,.8) 100%);
    z-index:0;
  }

  /* الخط العلوي وكلمة profile */
  .topline{
    position:absolute; left:6%; right:6%; top:26px;
    display:flex; align-items:center; gap:14px;
    color:var(--sand-80);
    z-index:2;
  }
  .topline::before, .topline::after{
    content:""; flex:1; height:1px; background:var(--sand-80); opacity:.85;
  }
  .topline span{
    font-size: clamp(14px, 1.5vw, 20px);
    letter-spacing:.06em;
  }

  /* الحاوية الوسطى */
  .center{
    position:relative; z-index:2;
    margin-inline:auto;
    width:min(1100px, 92vw);
    text-align:center;
  }

  /* اللوجو مع كلمة RIKAZA جنب بعض */
  .lockup{
    display:inline-flex;
    align-items:center;          /* محاذاة أساس السطر */
    gap: clamp(14px, 2.4vw, 60px); /* المسافة بين الشعار والكلمة */
    filter: drop-shadow(0 6px 22px rgba(0,0,0,.35));
  }
  .lockup .inline-logo{
    width: clamp(200px, 10vw, 92px); /* غلط: الـ min أكبر من الـ max */
    aspect-ratio: 1/1;
    background: var(--inline-logo) center/contain no-repeat;
  }
  .lockup .word{
    font-weight: 700;
    font-size: clamp(54px, 9.5vw, 120px);
    letter-spacing:.06em;
    line-height: 1;
    color: var(--sand);
  }

  .tagline{
    margin-top: clamp(8px, 1.2vw, 14px);
    font-size: clamp(16px, 2.2vw, 28px);
    font-weight:600;
    color: var(--sand);
  }

  .lead{
    margin: clamp(28px, 4vw, 46px) auto 0;
    width:min(880px, 92vw);
    color: var(--sand-80);
    font-size: clamp(16px, 2.1vw, 24px);
    line-height:1.7;
  }
/* *********************** */


/* ===== About / Who We Are ===== */
.about{
  position: relative;
  background: var(--bg-brown);
  color: var(--sand);
  padding: clamp(48px, 7vw, 90px) clamp(16px, 5vw, 64px);
  overflow: hidden;
}

.about .kicker{
  display:flex; align-items:center; gap:16px;
  color: rgba(194,173,153,.85);
  margin-bottom: clamp(14px, 2.8vw, 24px);
  letter-spacing:.12em; text-transform:uppercase;
  font-weight:600; justify-content:center;
}
.about .kicker::before, .about .kicker::after{
  content:""; flex:1; height:1px; background: currentColor; opacity:.6;
}

.about-list{
  list-style: none;
  margin: clamp(18px, 3vw, 32px) auto 0;
  padding: 0;
  max-width: 50ch;
  display: flex;
  flex-direction: column;
  gap: clamp(12px, 1.8vw, 18px);
  color: var(--sand-80);
  font-size: clamp(15px, 1.8vw, 21px);
  line-height: 1.8;
}

.about-list li{
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.about-list .icon{
  font-size: 1.3em;
  flex-shrink: 0;
  color: var(--sand);
  line-height: 1;
  transform: translateY(3px);
}

/* الشبكة */
.about-inner{
  position:relative;
  z-index:1;
  width:min(1200px, 96vw);
  margin: 0 auto;
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap: clamp(28px, 4vw, 56px);
  align-items:center;
}

/* العنوان الكبير */
.about-title{
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:800;
  font-size: clamp(26px, 5.8vw, 64px); /* تصغير بسيط */
  letter-spacing:.1em;
  margin: 0 0 clamp(12px, 2vw, 16px);
  justify-content:center;
}

.about-title .question{
  font-weight:700;
  font-size: 0.8em; /* تصغير الاستفهام نسبيًا */
  transform: translateY(-2px);
}

/* النص */
.about-copy{
  color: var(--sand-80);
  font-size: clamp(15px, 1.8vw, 21px); /* تصغير بسيط */
  line-height: 1.8;
  text-align: center;
  max-width: 48ch;
  margin-inline:auto;
}

/* الصورة البيضاوية */
.about-photo{
  justify-self:center;
  width: min(440px, 48vw);
  height: min(520px, 56vw);
  border-radius: 50% / 40%; /* بيضاوية */
  background: var(--about-photo) center/cover no-repeat;
  border: 6px solid var(--border-ivory);
  box-shadow:
    0 18px 32px rgba(0,0,0,.45),
    0 2px 0 rgba(255,255,255,.25) inset;
}
/* ===== OUR PHILOSOPHY ===== */
.philosophy{
  position: relative;
  background: var(--bg-brown);
  color: var(--sand);
  padding: clamp(48px, 7vw, 90px) clamp(16px, 5vw, 64px);
  overflow: hidden;
}

/* نفس الكيكر المستخدم في الأقسام السابقة */
.philosophy .kicker{
  display:flex; align-items:center; gap:16px;
  color: rgba(194,173,153,.85);
  margin-bottom: clamp(14px, 2.6vw, 24px);
  letter-spacing:.12em; text-transform:uppercase;
  font-weight:600; justify-content:center;
}
.philosophy .kicker::before,
.philosophy .kicker::after{
  content:""; flex:1; height:1px; background: currentColor; opacity:.6;
}

.philo-inner{
  position:relative;
  width:min(1200px, 96vw);
  margin: 0 auto;
  display:grid;
  grid-template-columns: .95fr 1.05fr;  /* صورة يسار، نص يمين */
  gap: clamp(28px, 4.5vw, 64px);
  align-items:center;
}

/* الصورة البيضاوية على اليسار وتخرج قليلًا من الحافة */
.philo-photo{
  justify-self:start;
  width: min(440px, 48vw);
  height: min(540px, 56vw);
  border-radius: 50% / 40%;
  background: var(--philosophy-photo) center/cover no-repeat;
  border: 6px solid var(--border-ivory);
  box-shadow: 0 18px 32px rgba(0,0,0,.45), 0 2px 0 rgba(255,255,255,.25) inset;
  transform: translateX(-8%); /* تطلع من الحافة اليسار زي التصميم */
}

.philo-title{
  font-weight: 600;
  font-size: clamp(20px, 6vw, 50px);
  letter-spacing: .12em;
  text-align:center;
  margin: 0 0 clamp(12px, 2vw, 16px);
}

.philo-copy{
  color: var(--sand-80);
  font-size: clamp(15px, 1.9vw, 22px);
  line-height: 1.9;
  text-align: center;
  max-width: 60ch;
  margin-inline: auto;
}
.philo-copy p{ margin: 0 0 10px }
.philo-copy p:last-child{ margin-bottom: 0 }

.philo-list {
  list-style: none;
  margin: clamp(20px, 3vw, 32px) auto 0;
  padding: 0;
  max-width: 55ch;
  display: flex;
  flex-direction: column;
  gap: clamp(12px, 1.8vw, 18px);
  color: var(--sand-80);
  font-size: clamp(15px, 1.8vw, 21px);
  line-height: 1.8;
  text-align: left;
}

.philo-list li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.philo-list .icon {
  font-size: 1.3em;
  flex-shrink: 0;
  color: var(--sand);
  line-height: 1;
  transform: translateY(3px);
}

/* ===== WHAT WE DO ===== */
.what{
  position: relative;
  background: var(--bg-brown);
  color: var(--sand);
  padding: clamp(48px, 7vw, 90px) clamp(16px, 5vw, 64px);
  overflow: hidden;
}

.what .kicker{
  display:flex; align-items:center; gap:16px;
  color: rgba(194,173,153,.85);
  margin-bottom: clamp(14px, 2.6vw, 24px);
  letter-spacing:.12em; text-transform:uppercase;
  font-weight:600; justify-content:center;
}
.what .kicker::before,.what .kicker::after{
  content:""; flex:1; height:1px; background: currentColor; opacity:.6;
}

.what-inner{
  width:min(1200px, 96vw);
  margin:0 auto;
  display:grid;
  grid-template-columns: .95fr 1.05fr;   /* صورة يسار، نص يمين */
  gap: clamp(28px, 4.5vw, 64px);
  align-items:center;
  position:relative;
}

/* الصورة البيضاوية الكبيرة */
.what-photo{
  justify-self:start;
  width:min(480px, 50vw);
  height:min(600px, 60vw);
  border-radius: 50% / 40%;
  background: var(--what-photo) center/cover no-repeat;
  border:6px solid var(--border-ivory);
  box-shadow: 0 18px 32px rgba(0,0,0,.45), 0 2px 0 rgba(255,255,255,.25) inset;
  transform: translateX(-10%); /* تخرج من الحافة اليسرى */
  position:relative;
}

/* الصورة الدائرية الصغيرة المتداخلة أسفل اليسار */
.what-avatar{
  position:absolute;
  left: clamp(-10px, -3vw, -24px);
  bottom: clamp(-22px, -2vw, -10px);
  width:min(150px, 28vw);
  aspect-ratio:1/1;
  border-radius:50%;
  background: var(--what-avatar) center/cover no-repeat;
  border:6px solid var(--border-ivory);
  box-shadow: 0 14px 28px rgba(0,0,0,.45);
}

/* النصوص */
.what-title{
  font-weight:700;
  font-size: clamp(28px, 6vw, 62px);
  letter-spacing:.12em;
  text-align:center;
  margin: 0 0 clamp(12px, 2vw, 16px);
}

.what-intro{
  color: var(--sand-80);
  text-align:center;
  font-size: clamp(15px, 1.9vw, 22px);
  margin: 0 0 clamp(14px, 2.2vw, 22px);
}

/* القائمة */
.what-list{
  list-style:none; padding:0; margin:0 auto;
  max-width: 62ch;
  display:flex; flex-direction:column;
  gap: clamp(12px, 2vw, 18px);
  color: var(--sand-80);
  font-size: clamp(15px, 1.9vw, 22px);
  line-height:1.9;
  text-align:left;
}
.what-list li{
  position:relative;
  padding-left: 20px;
}
.what-list li::before{
  content:"•";               /* نقطة خفية أنيقة مثل التصميم */
  position:absolute; left:0; top:0;
  line-height:1;
  color: var(--sand);
  font-size: 1.2em;
  transform: translateY(2px);
}

/* ===== VISION & MISSION ===== */
.vm{
  position: relative;
  background: var(--bg-brown);
  color: var(--sand);
  padding: clamp(48px, 7vw, 90px) clamp(16px, 5vw, 64px);
  overflow: hidden;
}

/* kicker */
.vm .kicker{
  display:flex; align-items:center; gap:16px;
  color: rgba(194,173,153,.85);
  margin-bottom: clamp(14px, 2.6vw, 26px);
  letter-spacing:.12em; text-transform:uppercase;
  font-weight:600; justify-content:center;
}
.vm .kicker::before, .vm .kicker::after{
  content:""; flex:1; height:1px; background: currentColor; opacity:.6;
}

/* طبقة داخلية */
.vm-inner{
  width:min(1200px, 96vw);
  margin:0 auto;
  display:grid;
  gap: clamp(28px, 4.5vw, 64px);
}

/* صف الرؤية */
.vm-row{
  display:grid;
  grid-template-columns: 1.05fr .95fr; /* نص يسار / صورة يمين */
  align-items:center;
  gap: clamp(24px, 4vw, 56px);
}

/* عناوين */
.vm-title{
  font-weight:800;
  font-size: clamp(28px, 6vw, 68px);
  letter-spacing:.12em;
  margin:0 0 clamp(10px, 1.6vw, 14px);
}
.vm-text{
  color: var(--sand-80);
  font-size: clamp(15px, 1.9vw, 22px);
  line-height:1.9;
  max-width: 60ch;
}

/* صورة الرؤية (يمين) */
.vm-vision-photo{
  justify-self:center;
  width: min(440px, 48vw);
  height: min(520px, 56vw);
  border-radius: 50% / 40%; /* بيضاوية */
  background: var(--vision-photo) center/cover no-repeat;
  border: 6px solid var(--border-ivory);
  box-shadow:
    0 18px 32px rgba(0,0,0,.45),
    0 2px 0 rgba(255,255,255,.25) inset;
}

/* صف الرسالة */
.vm-row--mission{
  grid-template-columns: .95fr 1.05fr; /* صورة يسار / نص يمين */
  align-items:center;
}

/* صورة الرسالة (أسفل يسار) */
.vm-mission-photo-wrap{
  position: relative;
  justify-self:start;
}
.vm-mission-photo{
  justify-self:center;
  width: min(440px, 48vw);
  height: min(520px, 56vw);
  border-radius: 50% / 40%; /* بيضاوية */
  background: var(--mission-photo) center/cover no-repeat;
  border: 6px solid var(--border-ivory);
  box-shadow:
    0 18px 32px rgba(0,0,0,.45),
    0 2px 0 rgba(255,255,255,.25) inset;
}

/* ===== WHY RIKAZA ===== */
.why{
  position: relative;
  background: var(--bg-brown);
  color: var(--sand);
  padding: clamp(48px, 7vw, 90px) clamp(16px, 5vw, 64px);
  overflow: hidden;
}

.why .kicker{
  display:flex; align-items:center; gap:16px;
  color: rgba(194,173,153,.85);
  margin-bottom: clamp(14px, 2.6vw, 26px);
  letter-spacing:.12em; text-transform:uppercase;
  font-weight:600; justify-content:center;
}
.why .kicker::before,.why .kicker::after{
  content:""; flex:1; height:1px; background: currentColor; opacity:.6;
}

.why-inner{
  width:min(1200px, 96vw);
  margin:0 auto;
  display:grid;
  grid-template-columns: 1.05fr .95fr; /* نص يسار / صور يمين */
  gap: clamp(28px, 4.5vw, 64px);
  align-items:center;
}

/* العنوان */
.why-title{
  font-weight:700;
  font-size: clamp(28px, 6vw, 60px);
  letter-spacing:.12em;
  margin:0 0 clamp(12px, 2vw, 16px);
}

/* النقاط */
/* .why-list{
  list-style:none; margin:0; padding:0;
  color: var(--sand-80);
  font-size: clamp(15px, 1.9vw, 22px);
  line-height:1.9;
  display:flex; flex-direction:column; gap: clamp(10px, 1.6vw, 16px);
  max-width: 62ch;
}
.why-list li{ position:relative; padding-left: 0; } */

/* ===== Feature Cards for 'Why Rikaza' ===== */
.feature-cards{
  list-style: none;
  padding: 0;
  margin: 18px 0 8px;
  display: grid;
  gap: 12px;
}

.feature-cards li{
  position: relative;
  padding: 14px 16px 14px 54px; /* مسافة لأيقونة اليسار */
  background: #201a16;                 /* panel */
  border: 1px solid rgba(194,173,153,.28);
  border-radius: 14px;
  color: rgba(194,173,153,.95);
  line-height: 1.65;
  box-shadow: 0 8px 18px rgba(0,0,0,.28);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.feature-cards li:hover{
  transform: translateY(-1px);
  border-color: rgba(194,173,153,.45);
  box-shadow: 0 12px 26px rgba(0,0,0,.38);
}

/* دائرة الأيقونة */
.feature-cards li::before{
  content: "";
  position: absolute;
  left: 16px; top: 50%;
  transform: translateY(-50%);
  width: 28px; height: 28px;
  border-radius: 50%;
  background: rgba(194,173,153,.15);
  border: 1px solid rgba(194,173,153,.35);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}

/* علامة الصح */
.feature-cards li::after{
  content: "✓";
  position: absolute;
  left: 24px; top: 50%;
  transform: translateY(-52%);
  font-weight: 700;
  font-size: 16px;
  color: #c2ad99; /* sand */
}

/* صور يمين (بيضاوي) */
.why-photos{
  position:relative;
  justify-self:end;
}
.why-main{
  width:min(430px, 50vw);
  height:min(560px, 60vw);
  border-radius: 50% / 38%;
  background: var(--why-photo-main) center/cover no-repeat;
  border:6px solid var(--border-ivory);
  box-shadow: 0 18px 32px rgba(0,0,0,.45), 0 2px 0 rgba(255,255,255,.25) inset;
  /* امساك الحافة اليمنى مثل التصميم */
  transform: translateX(6%);
}
.why-badge{
  position:absolute;
  top: -26px;
  left: -34px;
  width:min(190px, 36vw);
  height:min(240px, 40vw);
  border-radius: 50% / 44%;
  background: var(--why-photo-badge) center/cover no-repeat;
  border:6px solid var(--border-ivory);
  box-shadow: 0 14px 28px rgba(0,0,0,.45);
}

/* ===== WHY RIKAZA (VERSION 2) ===== */
.why2{
  position: relative;
  background: var(--bg-brown);
  color: var(--sand);
  padding: clamp(48px, 7vw, 90px) clamp(16px, 5vw, 64px);
  overflow: hidden;
}

.why2 .kicker{
  display:flex; align-items:center; gap:16px;
  color: rgba(194,173,153,.85);
  margin-bottom: clamp(14px, 2.6vw, 24px);
  letter-spacing:.12em; text-transform:uppercase;
  font-weight:600; justify-content:center;
}
.why2 .kicker::before, .why2 .kicker::after{
  content:""; flex:1; height:1px; background: currentColor; opacity:.6;
}

/* الشبكة */
.why2-inner{
  width:min(1200px, 96vw);
  margin:0 auto;
  display:grid;
  grid-template-columns: 1fr 1fr; /* نص يسار - صور يمين */
  gap: clamp(28px, 4.5vw, 64px);
  align-items:center;
}

/* العنوان */
.why2-title{
  font-weight:700;
  font-size: clamp(28px, 6vw, 60px);
  letter-spacing:.12em;
  margin:0 0 clamp(12px, 2vw, 16px);
}

/* النقاط */
/* .why2-list{
  list-style:none; margin:0; padding:0;
  color: var(--sand-80);
  font-size: clamp(15px, 1.9vw, 22px);
  line-height:1.9;
  display:flex; flex-direction:column; gap: clamp(12px, 1.6vw, 18px);
  max-width: 60ch;
} */

/* الصور البيضاوية */
.why2-photos{
  position:relative;
  justify-self:end;
}

.why2-top{
  width:min(410px, 48vw);
  height:min(520px, 55vw);
  border-radius:50% / 38%;
  background: var(--why2-photo-top) center/cover no-repeat;
  border:6px solid var(--border-ivory);
  box-shadow: 0 18px 32px rgba(0,0,0,.45),
              0 2px 0 rgba(255,255,255,.25) inset;
  transform: translateX(6%);
}

.why2-bottom{
  position:absolute;
  bottom:-40px; left:-40px;
  width:min(210px, 40vw);
  height:min(280px, 44vw);
  border-radius:50% / 42%;
  background: var(--why2-photo-bottom) center/cover no-repeat;
  border:6px solid var(--border-ivory);
  box-shadow: 0 18px 32px rgba(0,0,0,.45);
}

/* ===== WHAT SETS US APART ===== */
.apart{
  position: relative;
  background: var(--bg-brown);
  color: var(--sand);
  padding: clamp(48px, 7vw, 90px) clamp(16px, 5vw, 64px);
  overflow: hidden;
}

/* kicker */
.apart .kicker{
  display:flex; align-items:center; gap:16px;
  color: rgba(194,173,153,.85);
  margin-bottom: clamp(14px, 2.6vw, 24px);
  letter-spacing:.12em; text-transform:uppercase;
  font-weight:600; justify-content:center;
}
.apart .kicker::before,.apart .kicker::after{
  content:""; flex:1; height:1px; background: currentColor; opacity:.6;
}

/* الحاوية الوسطى */
.apart-inner{
  width:min(1200px, 96vw);
  margin:0 auto;
  position:relative;
  text-align:center;
}

/* العنوان الكبير */
.apart-title{
  font-weight:800;
  font-size: clamp(28px, 6vw, 72px);
  letter-spacing:.12em;
  margin: 0 0 clamp(16px, 2.4vw, 20px);
}

/* السطور */
.apart-lines{
  color: var(--sand-80);
  font-size: clamp(15px, 1.9vw, 22px);
  line-height: 1.9;
  max-width: 80ch;
  margin: 0 auto;
}
.apart-lines p{ margin: 0 0 10px }
.apart-lines p:last-child{ margin-bottom: 0 }

/* الصور البيضاوية الجانبية
.apart-photo{
  position:absolute;
  background-position:center; background-size:cover; background-repeat:no-repeat;
  border:6px solid var(--border-ivory);
  box-shadow: 0 18px 32px rgba(0,0,0,.45), 0 2px 0 rgba(255,255,255,.25) inset;
}

/* يسار كبيرة داخلة من الحافة 
.apart-photo.left{
  left: -16%;
  top: 40%;
  width: min(360px, 48vw);
  height: min(250px, 58vw);
  border-radius: 50% / 42%;
  background-image: var(--apart-left);
  transform: translateY(-50%);
}

/* يمين أصغر 
.apart-photo.right{
  right: -15%;
  top: 40%;
  width: min(230px, 40vw);
  height: min(300px, 50vw);
  border-radius: 50% / 44%;
  background-image: var(--apart-right);
  transform: translateY(-50%);
} */


/* ***************************************************************** */

/* موبايل - تعديلات لضمان التجاوب على شاشات الهاتف */
@media (max-width: 768px){
  /* تعديلات على الشاشة الرئيسية (Hero) */
  .lockup{
    flex-direction: column; /* جعل اللوجو والكلمة فوق بعضهما البعض */
    gap: 10px;
  }
  .lockup .inline-logo{
    width: clamp(80px, 18vw, 120px); /* تصغير حجم اللوجو */
  }
  .lockup .word{
    font-size: clamp(40px, 10vw, 60px); /* تصغير حجم الكلمة */
  }

  /* تحويل جميع تخطيطات الشبكة إلى عمود واحد */
  .about-inner,
  .philo-inner,
  .what-inner,
  .vm-row,
  .vm-row--mission,
  .signature-inner,
  .why-inner,
  .why2-inner,
  .apart-inner {
    grid-template-columns: 1fr;
    gap: clamp(30px, 5vw, 50px);
  }

  .about-photo,
  .philo-photo,
  .what-photo,
  .vm-vision-photo,
  .vm-mission-photo,
  .signature-photo,
  .why-main,
  .why2-top{
    width:min(300px,90vw);
    aspect-ratio:1/1;
    height:auto;            /* يكفي مع الـ aspect-ratio */
    border-radius:50%/40%;
    justify-self:center;
    transform:none !important;
    margin-inline:auto;
  }

  /* إخفاء العناصر المتداخلة لتبسيط التصميم */
  .what-avatar,
  .why-badge,
  .why2-bottom {
    display: none;
  }

  /* تعديلات على قسم Apart */
  .apart-photo,
  .apart-photo.left,
  .apart-photo.right{
    width: min(250px, 60vw);
    height: min(300px, 70vw);
    display: block;
    margin: 18px auto;
  }

  /* تعديلات الخطوط والنصوص */
  .about-title,
  .philo-title,
  .what-title,
  .vm-title,
  .signature-title,
  .why-title,
  .why2-title,
  .apart-title {
    font-size: clamp(24px, 7vw, 40px);
  }

  .lead,
  .about-copy,
  .philo-copy,
  .what-intro,
  .vm-text,
  .signature-text,
  .why-list,
  .why2-list,
  .apart-lines {
    font-size: clamp(14px, 4vw, 18px);
    line-height: 1.6;
    text-align: center;
  }

  /* التأكد من توسيط جميع النصوص */
  .about-title,
  .philo-title,
  .what-title,
  .vm-title,
  .signature-title,
  .why-title,
  .why2-title,
  .apart-title {
    text-align: center;
    justify-content: center;
  }

  /* إعادة محاذاة القوائم لليمين (لأنها عربية) */
  .about-list,
  .philo-list,
  .what-list,
  .why-list,
  .why2-list {
    text-align: right;
    margin-inline: auto;
    max-width: 90vw; /* السماح بعرض أكبر */
  }

  /* توسيط محتوى القوائم */
  .about-list li,
  .philo-list li,
  .what-list li,
  .why-list li,
  .why2-list li {
    text-align: right; /* التأكد من محاذاة النص داخل العنصر لليمين */
    margin-inline: auto; /* توسيط العنصر نفسه داخل القائمة */
    width: 100%; /* السماح للعنصر بأخذ عرض القائمة */
  }

  /* توسيط حاويات الصور */
  .why-photos,
  .why2-photos {
    justify-self: center;
    margin-inline: auto;
  }

  /* التأكد من أن الصور لا تخرج عن حدود الشاشة */
  .about-photo,
  .philo-photo,
  .what-photo,
  .vm-vision-photo,
  .vm-mission-photo,
  .signature-photo,
  .why-main,
  .why2-top {
    max-width: 90%;
    width: min(300px, 90vw);
    height: auto;
    justify-self: center;
    margin-inline: auto;
  }

  .feature-cards{
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 14px;
  }
  .feature-cards, .feature-cards li{ text-align: left; }

}


  /* حركة دخول خفيفة (اختيارية) */
  @media (prefers-reduced-motion: no-preference){
    .lockup{ opacity:0; transform: translateY(14px); animation: rise .8s ease-out .05s forwards }
    .tagline{ opacity:0; transform: translateY(10px); animation: rise .8s ease-out .12s forwards }
    .lead{ opacity:0; transform: translateY(10px); animation: rise .8s ease-out .18s forwards }
    @keyframes rise{ to{ opacity:1; transform: translateY(0) } }
  }

/* ======================== */

/* ===== Contact Section ===== */
.contact-page {
  width: 100%;
  padding: 60px 20px;
}

.contact-container {
  text-align: center;
  max-width: 700px;
  margin: auto;
}

/* اللوجو */
.logo-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  margin-bottom: 24px;
}

.inline-logo {
  width: 100px;
  height: 100px;
  background: var(--inline-logo) center/contain no-repeat;
  border-radius: 50%;
  box-shadow: 0 0 20px rgba(0,0,0,.4);
}

.logo-wrap h1 {
  font-size: 40px;
  letter-spacing: 0.08em;
  font-weight: 700;
  color: var(--sand);
}

/* النص */
.contact-text {
  font-size: 18px;
  color: var(--sand-80);
  margin-bottom: 40px;
}

/* الروابط */
.contact-links {
  display: flex;
  justify-content: center;
  gap: 28px;
  margin-bottom: 40px;
}

.contact-links img {
  width: 40px;
  height: 40px;
  filter: brightness(0) invert(0.8);
  transition: transform 0.3s ease, filter 0.3s ease;
}

.contact-links img:hover {
  transform: scale(1.15);
  filter: brightness(1) invert(0);
}

/* الفوتر */
.footer {
  font-size: 14px;
  color: var(--sand-80);
  opacity: 0.8;
}

/* ريسبونسيف */
@media (max-width: 600px) {
  .inline-logo {
    width: 80px;
    height: 80px;
  }
  .logo-wrap h1 {
    font-size: 32px;
  }
  .contact-text {
    font-size: 16px;
  }
  .contact-links img {
    width: 34px;
    height: 34px;
  }
}

/* ===== Mobile text: left start + remove bullets ===== */
@media (max-width: 768px){

  /* كل الفقرات والقوائم تبدأ من الشمال */
  .lead,
  .about-copy,
  .philo-copy,
  .what-intro,
  .vm-text {
    text-align: left !important;
  }

  /* القوائم تبدأ من الشمال وتاخد العرض الطبيعي */
  .about-list,
  .philo-list,
  .what-list,
  .why-list,
  .why2-list {
    text-align: left !important;
    margin-left: auto;
    margin-right: auto;
    max-width: 92vw;
  }

  /* عناصر القوائم نفسها شمال */
  .about-list li,
  .philo-list li,
  .what-list li,
  .why-list li,
  .why2-list li {
    text-align: left !important;
    width: 100%;
  }

  /* إزالة النقط المصنوعة يدويًا في WHAT WE DO */
  .what-list li {
    padding-left: 0 !important;
  }
  .what-list li::before {
    content: none !important;
  }

  h1, h2, h3 {
    font-size: 90% !important;
    line-height: 1.3;
  }

  /* الفقرات والقوائم */
  p,
  li,
  .feature-cards li,
  .feature-cards p {
    font-size: 14px !important;   /* كان تقريبًا 16–17 */
    line-height: 1.6;
  }

  /* النصوص الطويلة */
  .lead,
  .about-copy,
  .philo-copy,
  .why-list,
  .why2-list {
    font-size: 13.5px !important;
    line-height: 1.7;
  }

}

@media (max-width: 480px) {
  p, li {
    font-size: 13px !important;
  }
  h2 {
    font-size: 18px !important;
  }
}