/* ZASK official brand colors (navy #0C2D48 primary, teal #0F6E56 secondary).
   Kept in a separate file loaded only on the real ZASK pages so the
   purchased template's own main.css - shared by all 24 demo pages,
   including demo-23.html which must stay untouched - never has to be
   edited directly. Load this AFTER main.css so these overrides win.

   --color-heading and --color-blue-theme already drive every heading
   (h1-h6 use var(--color-heading) globally) and every CTA
   button/link/small-icon accent (.btn-blue, .text-blue-theme,
   .bg-blue-theme, icon-box tints, etc.) across the site, so remapping
   just these two variables covers almost the entire distribution rule
   (navy dominant for headings, teal only for CTA/links/icons)
   automatically. */
:root {
   --color-heading: #0C2D48;
   --color-blue-theme: #5a8b38;
}

/* The header's nav-link colors are hardcoded literals in css/menu.css
   (not CSS variables), so they need an explicit override here: navy by
   default (matches "header stays navy-dominant"), teal only on hover
   (matches "teal used sparingly for links"). */
.navbar-dark .wsmenu > .wsmenu-list > li > a.h-link {
   color: #0C2D48;
}
.navbar-dark .wsmenu-list > li > a.h-link:hover {
   color: #5a8b38;
}

/* .bg-07 (main.css) ships the template's own stock-photo background
   (images/bg-07.jpg) for the "جاهز تبدأ مشروعك؟" CTA banner - reused
   identically across 7 service pages (web-development, seo,
   educational-platforms, projects, e-commerce, digital-marketing, ads).
   Overridden here (not page-scoped, since it's the same compiled
   utility class shared by all 7) with the standard brand gradient used
   site-wide instead of a stock photo. */
.bg-07 {
   background: linear-gradient(135deg, #0C2D48 0%, #5a8b38 150%);
}

/* .gr-whitesmoke (main.css) ships a lavender-tinted gradient
   (rgba(244, 244, 251, ...)) - shifted to a soft mint/teal tint instead,
   matching the site's own identity. Currently only used on index.php's
   Features section image boxes, but kept here (not a page-scoped style)
   since it's a straightforward color-only override of a compiled
   utility, the same pattern as the --color-heading/--color-blue-theme
   remap above. */
.gr-whitesmoke {
   background-image: linear-gradient(180deg, rgba(244, 251, 246, 0.9) 40%, rgba(244, 244, 251, .05) 100%);
}