/* V5 final surface polish — deliberately ONLY non-interactive background texture.
   No changes to typography, spacing, layout, content, navigation, hero, or animations.
   The same decorative asset is cached and reused in both themes (<1 KB SVG).
*/

/* Edge-faded Islamic star lattice. Keep the reading zone clean and calm. */
.section-services,
.section-remedies,
.cta-section,
.site-footer {
  position: relative;
  isolation: isolate;
}

.section-services::before,
.section-remedies::before,
.cta-section::before,
.site-footer::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image: url("../patterns/heritage-geometry.svg");
  background-position: center top;
  background-repeat: repeat;
  background-size: 300px 300px;
  opacity: .038;
  -webkit-mask-image: linear-gradient(90deg, #000 0%, rgba(0,0,0,.45) 19%, transparent 48%, transparent 52%, rgba(0,0,0,.45) 81%, #000 100%);
  mask-image: linear-gradient(90deg, #000 0%, rgba(0,0,0,.45) 19%, transparent 48%, transparent 52%, rgba(0,0,0,.45) 81%, #000 100%);
}

/* Match the existing soft-ivory base; dark emerald surfaces reveal the pattern
   slightly more, never as an attention-grabbing wallpaper. */
html[data-theme="dark"] .section-services::before,
html[data-theme="dark"] .section-remedies::before,
html[data-theme="dark"] .cta-section::before,
html[data-theme="dark"] .site-footer::before {
  opacity: .105;
}

/* CTA remains a solid, high-contrast foreground card; the texture goes beneath it. */
.section-services > .container-wide,
.section-remedies > .container-wide,
.cta-section > .container-wide,
.site-footer > .container-wide {
  position: relative;
  z-index: 1;
}

/* Small screens: motif is quieter and lives near the outside edges only. */
@media (max-width: 640px) {
  .section-services::before,
  .section-remedies::before,
  .cta-section::before,
  .site-footer::before {
    background-size: 240px 240px;
    opacity: .028;
    -webkit-mask-image: linear-gradient(90deg, #000 0%, transparent 42%, transparent 58%, #000 100%);
    mask-image: linear-gradient(90deg, #000 0%, transparent 42%, transparent 58%, #000 100%);
  }
  html[data-theme="dark"] .section-services::before,
  html[data-theme="dark"] .section-remedies::before,
  html[data-theme="dark"] .cta-section::before,
  html[data-theme="dark"] .site-footer::before {opacity:.08;}
}