/* ====== HOME PAGE CUSTOM STYLE ====== */

    /* Reveal utility (للسكرول) */
    .reveal{ opacity:0; transform:translateY(22px); transition:opacity .7s ease, transform .7s ease; }
    .reveal.reveal-in{ opacity:1; transform:none; }

    @media (prefers-reduced-motion: reduce){
      .reveal, .reveal.reveal-in{
        transition:none !important; transform:none !important; opacity:1 !important;
      }
    }


:root{ --brand-1:#22c55e; --brand-2:#ef4444; --brand-3:#f59e0b; --ink:#0f172a; }

/* ارتفاع حقيقي 100vh على الموبايل */
.hero-slider{
  position: relative;
  width: 100%;
  height: calc(var(--vh, 1vh) * 100);
  /* لو عندك هيدر sticky بارتفاع ~92px حابب تتركه: */
  margin-top: .5rem;            /* عدّلها حسب تصميمك */
  overflow: hidden;
  border-radius: 18px;
  box-shadow: 0 16px 42px rgba(0,0,0,.18);
  isolation: isolate;
}

/* الشرائح */
.hero-slide{
  position:absolute; inset:0;
  background:#0f172a center/cover no-repeat;
  opacity:0; transform: translateX(6%) scale(1.02);
  transition: opacity .7s ease, transform .7s ease;
  display:grid; place-items:center;
}
.hero-slide.is-active{ opacity:1; transform:none; z-index:1; }

/* طبقة تحسين التباين */
.hero-layer{
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(90% 70% at 20% 0%, rgba(34,197,94,.22), transparent 55%),
    linear-gradient(180deg, rgba(15,23,42,.35) 0%, rgba(15,23,42,.75) 100%),
    linear-gradient(90deg, rgba(0,0,0,.15), rgba(0,0,0,0) 30%, rgba(0,0,0,0) 70%, rgba(0,0,0,.15));
}

/* المحتوى */
.hero-content{ position:relative; z-index:1; color:#fff; text-align:center; padding: clamp(1rem,2.4vw,2rem); max-width: 980px; }
.hero-title{ font-weight:900; letter-spacing:.2px; font-size: clamp(1.8rem, 2.2vw + 1rem, 2.8rem); margin:0 0 .5rem; text-shadow: 0 6px 22px rgba(0,0,0,.35); opacity:0; transform: translateY(-16px); }
.hero-lead { font-size: clamp(1rem, .7vw + .95rem, 1.25rem); margin:0 0 1rem; opacity:0; transform: translateY(16px); }
.hero-slide.is-active .hero-title, .hero-slide.is-active .hero-lead{ animation: fadeInUp .8s ease forwards; }
.hero-slide.is-active .hero-lead{ animation-delay:.1s; }

.hero-cta .btn{ border-radius: 12px; font-weight:800; padding:.75rem 1.2rem; margin:.2rem .35rem; box-shadow: 0 12px 28px rgba(34,197,94,.28); }
.hero-cta .btn.btn-outline-light:hover{ background: rgba(255,255,255,.12); }

/* أسهم */
.hero-nav{
  position:absolute; top:50%; transform:translateY(-50%);
  width:44px; height:44px; border-radius:12px; border:0;
  display:grid; place-items:center; color:#0f172a; background:#fff;
  box-shadow: 0 10px 24px rgba(0,0,0,.22);
  z-index:2; cursor:pointer; opacity:.92;
  transition: transform .2s ease, opacity .2s ease;
}
.hero-prev{ left:16px; } .hero-next{ right:16px; }
.hero-nav:hover{ transform:translateY(-50%) scale(1.05); opacity:1; }

/* نقاط */
.hero-dots{ position:absolute; left:0; right:0; bottom:18px; display:flex; gap:8px; justify-content:center; z-index:2; }
.hero-dots button{ width:10px; height:10px; border-radius:999px; border:0; background:rgba(255,255,255,.55); cursor:pointer; transition: all .2s ease; }
.hero-dots button[aria-selected="true"]{ width:26px; background:#fff; }

@keyframes fadeInUp{ to { opacity:1; transform: translateY(0); } }

/* تقليل الحركة */
@media (prefers-reduced-motion: reduce){
  .hero-slide, .hero-title, .hero-lead{ transition:none !important; animation:none !important; transform:none !important; opacity:1 !important; }
}

/* موبايل */
@media (max-width: 575.98px){ .hero-slider{ border-radius:14px; } }
/* خلي العناصر اللي عليها .reveal تظهر إذا ما نضاف كلاس js-reveal */
html:not(.js-reveal) .reveal { opacity: 1 !important; transform: none !important; }
/* reveal utility */
.reveal{ opacity:0; transform:translateY(22px); transition: opacity .7s ease, transform .7s ease; }
.reveal.reveal-in{ opacity:1; transform:none; }
/* fallback لو ما نضاف js-reveal */
html:not(.js-reveal) .reveal{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){
  .reveal, .reveal.reveal-in{ transition:none !important; transform:none !important; opacity:1 !important; }
}