/* ==========================================================
   D4t4D4DDy Products Page Visual Sync
   Scoped only to /products pages.
   Does not affect homepage.
   ========================================================== */

body.products-page,
body.product-page {
  font-family: Inter, Arial, sans-serif !important;
  color: #061a30 !important;
  background:
    radial-gradient(circle at 74% 30%, rgba(62,220,255,0.22), transparent 36%),
    radial-gradient(circle at 26% 38%, rgba(255,255,255,0.72), transparent 34%),
    linear-gradient(90deg, #f8fcff 0%, #eefaff 48%, #d7f6ff 100%) !important;
}

body.products-page main,
body.product-page main,
body.products-page .product-hero,
body.product-page .product-hero,
body.products-page .product-section,
body.product-page .product-section,
body.products-page .section,
body.product-page .section {
  background:
    radial-gradient(circle at 74% 30%, rgba(62,220,255,0.20), transparent 36%),
    radial-gradient(circle at 26% 38%, rgba(255,255,255,0.66), transparent 34%),
    linear-gradient(90deg, rgba(248,252,255,0.70), rgba(238,250,255,0.52) 48%, rgba(215,246,255,0.44)) !important;
}

body.products-page .product-topbar,
body.product-page .product-topbar,
body.products-page .site-header,
body.product-page .site-header {
  position: sticky !important;
  top: 0 !important;
  z-index: 1000 !important;
  background: #071523 !important;
  color: #eaf8ff !important;
  border-bottom: 1px solid rgba(62,220,255,0.18) !important;
  box-shadow: 0 18px 45px rgba(2,12,23,0.20) !important;
}

body.products-page .product-topbar a,
body.product-page .product-topbar a,
body.products-page .site-header a,
body.product-page .site-header a {
  color: #eaf8ff !important;
  font-weight: 800 !important;
}

body.products-page .product-topbar a:hover,
body.product-page .product-topbar a:hover,
body.products-page .site-header a:hover,
body.product-page .site-header a:hover {
  color: #3edcff !important;
}

body.products-page .product-card,
body.product-page .product-card,
body.products-page .product-panel,
body.product-page .product-panel,
body.products-page .product-roadmap-dashboard-card,
body.product-page .product-roadmap-dashboard-card,
body.products-page .family-summary-card,
body.product-page .family-summary-card,
body.products-page .current-milestone,
body.product-page .current-milestone,
body.products-page .roadmap-card,
body.product-page .roadmap-card,
body.products-page .timeline-card,
body.product-page .timeline-card {
  position: relative !important;
  z-index: 50 !important;
  background: rgba(248,253,255,0.91) !important;
  border: 1px solid rgba(16,139,234,0.15) !important;
  box-shadow: 0 24px 70px rgba(3,22,43,0.10) !important;
  backdrop-filter: blur(16px) saturate(120%) !important;
}

body.products-page .product-shell,
body.product-page .product-shell,
body.products-page .product-hero-copy,
body.product-page .product-hero-copy,
body.products-page .section-head,
body.product-page .section-head,
body.products-page .products-grid,
body.product-page .products-grid,
body.products-page .product-content,
body.product-page .product-content,
body.products-page .product-actions,
body.product-page .product-actions {
  position: relative !important;
  z-index: 50 !important;
}

body.products-page .product-hero-copy::before,
body.product-page .product-hero-copy::before,
body.products-page .section-head::before,
body.product-page .section-head::before {
  content: "" !important;
  position: absolute !important;
  inset: -34px -44px -34px -44px !important;
  z-index: -1 !important;
  border-radius: 36px !important;
  background:
    radial-gradient(circle at 32% 45%,
      rgba(255,255,255,0.92),
      rgba(255,255,255,0.62) 56%,
      rgba(255,255,255,0.16) 82%,
      transparent 100%) !important;
  pointer-events: none !important;
}

body.products-page h1,
body.product-page h1 {
  font-weight: 900 !important;
  letter-spacing: -0.07em !important;
  color: #061a30 !important;
}

body.products-page h1 span,
body.product-page h1 span,
body.products-page h1 strong,
body.product-page h1 strong {
  color: #108bea !important;
}

body.products-page h2,
body.product-page h2 {
  font-weight: 900 !important;
  letter-spacing: -0.055em !important;
  color: #061a30 !important;
}

body.products-page p,
body.product-page p {
  color: #335878 !important;
}

body.products-page .eyebrow,
body.product-page .eyebrow,
body.products-page .product-eyebrow,
body.product-page .product-eyebrow,
body.products-page .section-kicker,
body.product-page .section-kicker,
body.products-page .kicker,
body.product-page .kicker {
  color: #108bea !important;
  background: rgba(255,255,255,0.72) !important;
  border: 1px solid rgba(16,139,234,0.16) !important;
  border-radius: 999px !important;
  padding: 8px 14px !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
}

body.products-page .btn.primary,
body.product-page .btn.primary,
body.products-page .product-btn.primary,
body.product-page .product-btn.primary {
  background: linear-gradient(135deg, #108bea, #3edcff) !important;
  color: #020c17 !important;
  box-shadow: 0 18px 40px rgba(16,139,234,0.22) !important;
}
