@import url("base.css?v=10");
@import url("components.css?v=10"); /*BUTTONS*/
 @import url("header.css?v=11");  /*Navbar */
@import url("hero.css?v=10");
@import url("services.css?v=13"); /*servicrs cards*/
@import url("service-page.css?v=12");


@import url("aboutsection.css?v=11");
@import url("service-page.css?v=13");
@import url("portfolio.css?v=10");
@import url("contact.css?v=10");
@import url("aboutus.css?v=12");
@import url("process.css?v=11"); /* process steps*/
@import url("whatsapp.css?v=14");
@import url("why.css?v=13");

@import url("footer.css?v=11");


/*  =======================================
     ===CTA banner
  ==========================================*/
.cta-banner {
  background: var(--gradient-dark); color: #fff;
  border-radius: 28px; padding: 3rem 2rem; text-align: center;
  box-shadow: var(--shadow-lift);
}
.cta-banner.light { background: var(--brand-light); color: var(--foreground); box-shadow: none; }
.cta-banner h2 { font-size: clamp(1.6rem, 3vw, 2.4rem); }
.cta-banner p { opacity: .85; margin-block: .6rem 1.5rem; }


/* Page hero (small) */
.page-hero { background: var(--gradient-hero); text-align: center; padding-block: 80px 90px; }
.page-hero h1 { font-size: clamp(2.2rem, 4.5vw, 3.5rem); margin-block: .5rem 1rem; }
.page-hero p { color: var(--muted); max-width: 560px; margin: 0 auto; }



/* لاخفاء صور الhero في الجوال*/
@media (max-width: 768px) {
  .hero-image {
    display: none;
  }

  .hero-grid {
    grid-template-columns: 1fr;
  }

  .hero-content {
    text-align: center;
    max-width: 100%;
  }


 .about-intro-visual {
    display: none;
  }

  .about-intro {
    grid-template-columns: 1fr;
  }
    .about-intro-visual {
    display: none !important;
  }
}