/* home.css — page-unique styles for الرئيسية (homepage) */

/* ---------- hero (homepage start-aligned variant of .page-hero) ---------- */
/* The homepage hero is a rotating carousel: stacked full-bleed slides
   cross-fade behind a warm overlay tint; all real content sits above both. */
.hero-slides{position:absolute;inset:0;z-index:0}
.hero-slide{position:absolute;inset:0;background:center/cover no-repeat;opacity:0;transition:opacity .6s ease}
.hero-slide.active{opacity:1}
.hero-overlay{position:absolute;inset:0;z-index:1;background:var(--overlay-hero)}
.page-hero--full > .topbar,
.page-hero--full > .navbar,
.page-hero--full > .page-hero-body{position:relative;z-index:2}
.page-hero--full > .hero-side,
.page-hero--full > .hero-dots{z-index:2}

.page-hero-body--start{justify-content:flex-start;text-align:start;padding-block:0}
.page-hero-body--start .page-hero-text{max-width:640px;width:auto}
.page-hero-text--start h1{font-size:clamp(2.4rem,5.5vw,4rem)}
.page-hero-text--start p{margin-bottom:2.2rem}

.hero-side{position:absolute;top:34%;right:auto;left:2.2rem;display:flex;flex-direction:column;align-items:center;gap:1.2rem}
.hero-side .vtext{writing-mode:vertical-rl;font-size:1rem;letter-spacing:.12em;opacity:.9}
.hero-side .line{width:1px;height:180px;background:#fff}
.hero-side a{font-size:1.15rem;opacity:.9;transition:.2s}
.hero-side a:hover{opacity:1;transform:scale(1.15)}

.hero-dots{position:absolute;bottom:2.2rem;left:auto;right:3rem;display:flex;gap:.5rem}
.hero-dots .dot{border-color:#fff}
.hero-dots .dot.on{background:#fff}

/* ---------- about summary (surface = shared .card-band) ---------- */
.about-card .about-text p{margin-bottom:1.8rem}
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:2.5rem;margin-top:4.5rem;text-align:center}
.pillar i{font-size:2.6rem;color:var(--orange)}
.pillar h3{color:var(--orange);font-size:1.35rem;font-weight:700;margin:.8rem 0 .4rem}
.pillar p{color:var(--ink-soft);font-size:1rem}

/* ---------- services (homepage section bg only; grid is shared) ---------- */
.services{background:var(--cream-2)}

/* ---------- news (homepage section) ---------- */
.news{background:var(--cream-2)}

/* ---------- media gallery ---------- */
.media-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:220px;gap:1.4rem}
.media-grid img{width:100%;height:100%;object-fit:cover;border-radius:var(--radius-sm);box-shadow:var(--shadow-sm);transition:transform .3s}
.media-grid img:hover{transform:scale(1.025)}
.media-grid .tall{grid-row:span 2}

/* ---------- contact (form fields / .split / .card-band / .phones are shared) ---------- */
.contact{background:var(--cream-2)}
.contact-grid{--cols:1.5fr 1fr;margin-top:2.5rem}
.contact-info{padding:2.4rem;box-shadow:var(--shadow-sm)}
.contact-info h3{display:flex;align-items:center;gap:.6rem;font-size:1.25rem;font-weight:700;margin-bottom:.4rem}
.contact-info h3 i{color:var(--orange);font-size:1.35rem}
.contact-info p{color:var(--ink-soft);margin-bottom:1.4rem}
.contact-info .phones{color:var(--ink-soft);margin-bottom:1.8rem}
.contact-info hr{border:none;border-top:1px solid var(--line);margin:1.6rem 0}

/* ---------- responsive (home-unique) ---------- */
@media(max-width:1020px){
  .media-grid{grid-template-columns:1fr 1fr}
  .hero-side{display:none}
}
@media(max-width:680px){
  .media-grid,.pillars{grid-template-columns:1fr}
  .hero-dots{right:1.2rem}
}