/* ============================================================
   Products page - Xinfeng Masterbatch reference style
   Dark navy + cyan, matching xinfeng-masterbatch.com/products
   ============================================================ */

html, body { background: #040a1a !important; background-color: #040a1a !important; }
body {
  color: #cfe0ec;
  font-family: "Inter", "Segoe UI", Arial, "PingFang SC", "Microsoft YaHei", sans-serif;
}

/* Header */
.site-header {
  background: rgba(4, 10, 26, 0.97) !important;
  border-bottom: 1px solid #1a3355 !important;
}
.site-header::before { background: linear-gradient(90deg, transparent, #00b4d8 50%, transparent); }
.brand-text strong { color: #ffffff; }
.brand-text small { color: #7a9ab8; }
.main-nav a { color: #aac4d8; }
.main-nav a:hover, .main-nav a.active { color: #00b4d8; background: rgba(0, 180, 216, 0.08); }
.header-tel { color: #cfe0ec; }
.header-tel:hover { color: #00b4d8; }
.nav-toggle { background: rgba(0, 180, 216, 0.1); color: #00b4d8; }
@media (max-width: 760px) {
  .main-nav { background: #071020; border-bottom: 1px solid #1a3355; }
}

/* Page hero */
.page-hero {
  background: linear-gradient(135deg, #040a1a, #071828);
  border-bottom: 1px solid #1a3355;
  text-align: center;
}
.page-hero::after { display: none; }
.page-hero h1 { color: #ffffff; }
.page-hero h1 span { color: #00b4d8; }
.page-hero p { color: #7a9ab8; }
.page-hero p { margin: 0 auto; max-width: 620px; }

/* Sticky category nav */
.prod-subnav { background: #071020; border-bottom: 1px solid #1a3355; }
.prod-subnav a {
  background: transparent;
  color: #7a9ab8;
  border-radius: 0;
  border-bottom: 3px solid transparent;
  font-weight: 600;
}
.prod-subnav a:hover, .prod-subnav a.active {
  background: transparent;
  color: #00b4d8;
  border-bottom-color: #00b4d8;
  border-radius: 0;
}

/* Section headings */
.section-head .tag {
  background: rgba(0, 180, 216, 0.1);
  border: 1px solid rgba(0, 180, 216, 0.3);
  color: #00b4d8;
  border-radius: 4px;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.section-head h2 { color: #ffffff; }
.section-head h2::after { background: #00b4d8; }
.section-head p { color: #7a9ab8; }

/* Filter buttons */
.catalog-filters .filter-btn {
  background: #071020;
  border: 1px solid #1a3355;
  color: #7a9ab8;
  border-radius: 4px;
}
.catalog-filters .filter-btn:hover { border-color: #00b4d8; color: #00b4d8; }
.catalog-filters .filter-btn.active { background: #00b4d8; border-color: #00b4d8; color: #040a1a; }

/* Product cards */
.catalog-grid .product-card, .card-grid .card {
  background: #0a1628;
  border: 1px solid #1a3355;
  border-radius: 12px;
}
.product-card:hover, .card:hover {
  border-color: #00b4d8;
  box-shadow: 0 10px 30px rgba(0, 180, 216, 0.15);
}
.product-card .pc-media, .card .card-media { background: #0d1e38; }
.product-card .pc-media img, .card .card-media img { object-fit: cover; }
.product-card .pc-body, .card .card-body { padding: 14px 16px 16px; }
.product-card .pc-badge, .card .card-badge {
  background: rgba(0, 180, 216, 0.1);
  color: #00b4d8;
  border-radius: 4px;
}
.product-card h3, .card-body h3 { color: #ffffff; font-size: 14px; font-weight: 700; }
.product-card p, .card-body p {
  color: #aac4d8;
  font-size: 12px;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.catalog-note { color: #7a9ab8; }

/* Category blocks */
.prod-block-head { gap: 12px; }
.prod-block-head .num {
  background: rgba(0, 180, 216, 0.1);
  border: 1px solid rgba(0, 180, 216, 0.3);
  color: #00b4d8;
  padding: 4px 11px;
  border-radius: 4px;
  font-size: 10px;
  letter-spacing: 1px;
}
.prod-block-head h2 { color: #ffffff; }
.prod-desc { color: #aac4d8; }
.prod-feature { background: #0a1628; border: 1px solid #1a3355; border-radius: 12px; }
.prod-feature .pf-icon { color: #00b4d8; }
.prod-feature h4 { color: #ffffff; }
.prod-feature p { color: #7a9ab8; }
.prod-sub-title { color: #ffffff; }

/* Tables */
.table-wrap { border: 1px solid #1a3355; border-radius: 12px; }
table.spec thead th { background: #071828; color: #00b4d8; }
table.spec th, table.spec td { border-bottom: 1px solid #1a3355; }
table.spec tbody tr:nth-child(even) { background: #071828; }
table.spec td { color: #aac4d8; }
table.spec td:first-child { color: #ffffff; }

/* Buttons */
.btn, .btn-primary, .btn-accent { border-radius: 6px; }
.btn-primary, .btn-accent { background: #00b4d8; color: #040a1a; border-color: #00b4d8; }
.btn-primary:hover, .btn-accent:hover { background: #48cae4; color: #040a1a; }

/* CTA band */
.cta-band { background: linear-gradient(90deg, #071020, #0a1f3a); }
.cta-band h2 { color: #ffffff; }
.cta-band p { color: #7a9ab8; }
.cta-band .btn { background: #00b4d8; color: #040a1a; }
.cta-band .btn:hover { background: #48cae4; color: #040a1a; }

/* Footer */
.site-footer { background: #071020; border-top: 1px solid #1a3355; }
.footer-bottom { border-top: 1px solid #1a3355; }

/* Product modal (xfm style) */
.pmodal { background: rgba(0, 0, 0, 0.9); }
.pmodal .pm-card { background: #0a1628; border: 1px solid #1a3355; border-radius: 14px; }
.pmodal .pm-media { background: #0d1e38; }
.pmodal .pm-body h3 { color: #ffffff; }
.pmodal .pm-body p { color: #aac4d8; }
.pmodal .pm-tag {
  background: rgba(0, 180, 216, 0.1);
  border: 1px solid rgba(0, 180, 216, 0.3);
  color: #00b4d8;
  border-radius: 4px;
}
.pmodal .pm-specs { border-top: 1px solid #1a3355; }
.pmodal .pm-specs li { border-bottom: 1px solid #1a3355; }
.pmodal .pm-specs li span:first-child { color: #7a9ab8; }
.pmodal .pm-specs li span:last-child { color: #ffffff; }
.pmodal .btn-accent { background: #00b4d8; color: #040a1a; }

/* Lightbox */
.lightbox { background: rgba(0, 0, 0, 0.92); }