/* Homepage tech background (footer styles live in erp-home-footer.css) */

:root {
  --elinom-footer-primary: #22d3ee;
  --elinom-tech-bg: #15203c;
  --elinom-tech-bg-gradient: linear-gradient(
    165deg,
    #141c38 0%,
    #1a2748 38%,
    #22335c 72%,
    #15203c 100%
  );
  --elinom-tech-ink: #e4e1ed;
  --elinom-tech-muted: #c7c4d7;
  --elinom-login-gradient: linear-gradient(
    120deg,
    #38bdf8 0%,
    #6366f1 34%,
    #f472b6 67%,
    #f59e0b 100%
  );
}

/* ── Landing page dark-blue linear gradient canvas ───────────── */
html[data-active-module="landing"],
html[data-active-module="landing"] body.erp-body,
html[data-active-module="landing"] body.erp-body .erp-content-scroll,
html[data-active-module="landing"] body.erp-body #landing.module-section,
html[data-active-module="landing"] body.erp-body #landing.module-section.active {
  background-color: var(--elinom-tech-bg) !important;
  background-image: var(--elinom-tech-bg-gradient) !important;
  background-size: 100% 100% !important;
  background-position: center center !important;
  background-attachment: fixed !important;
  background-repeat: no-repeat !important;
  color: var(--elinom-tech-ink) !important;
}

html[data-active-module="landing"] body.erp-body .erp-container,
html[data-active-module="landing"] body.erp-body .main-content {
  background: transparent !important;
  color: var(--elinom-tech-ink) !important;
}

html[data-active-module="landing"] body.erp-body #landing .text-muted,
html[data-active-module="landing"] body.erp-body #landing .erp-section-sub {
  color: #94a3b8 !important;
}

html[data-active-module="landing"] body.erp-body #landing .erp-hero .erp-hero-title,
html[data-active-module="landing"] body.erp-body #landing .erp-hero .erp-hero-title .erp-hero-title__lead {
  color: #e4e1ed !important;
}

html[data-active-module="landing"] body.erp-body #landing .erp-hero .erp-hero-title .accent,
html[data-active-module="landing"] body.erp-body #landing .erp-hero .erp-hero-title .erp-hero-title__tail.accent {
  background: var(--elinom-login-gradient) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: #38bdf8 !important;
}

html[data-active-module="landing"] body.erp-body #landing .erp-hero .erp-hero-subtitle {
  color: #c7c4d7 !important;
}

html[data-active-module="landing"] body.erp-body #landing .erp-hero .erp-hero-eyebrow {
  color: #c0c1ff !important;
}

html[data-active-module="landing"] body.erp-body #landing .erp-hero .btn-custom-outline,
html[data-active-module="landing"] body.erp-body #landing .erp-hero .erp-hero-cta .btn-custom-outline,
html[data-active-module="landing"] body.erp-body #landing .erp-hero .erp-hero-cta .btn-outline {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
  border-color: #c4b5fd !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0) 50%),
    linear-gradient(115deg, rgba(34, 211, 238, 0.34), rgba(99, 102, 241, 0.38), rgba(244, 114, 182, 0.32)) !important;
}

@media (prefers-reduced-motion: reduce) {
  html[data-active-module="landing"],
  html[data-active-module="landing"] body.erp-body,
  html[data-active-module="landing"] body.erp-body .erp-content-scroll,
  html[data-active-module="landing"] body.erp-body #landing.module-section,
  html[data-active-module="landing"] body.erp-body #landing.module-section.active {
    background-attachment: scroll !important;
  }
}

/* Phones: never pin the canvas. fixed attachment on html/body is a known
   Android Chrome paint stall (blank white document) and the document is
   already the scrollport. */
@media (max-width: 900px) {
  html[data-active-module="landing"],
  html[data-active-module="landing"] body.erp-body,
  html[data-active-module="landing"] body.erp-body .erp-content-scroll,
  html[data-active-module="landing"] body.erp-body #landing.module-section,
  html[data-active-module="landing"] body.erp-body #landing.module-section.active {
    background-attachment: scroll !important;
  }
}