:root {
  --primary: #0f5a8a;
  --primary-dark: #093e60;
  --primary-light: #3a82b0;
  --accent: #f5a623;
  --bg-soft: #f0f6fa;
  --text-main: #2c3e50;
  --text-sub: #5a6c7d;
  --border: #d0e0ea;
}
.header-banner {
  background: linear-gradient(135deg, #0f5a8a 0%, #093e60 65%, #093e60dd 100%);
}
.header-banner::before {
  background:
    radial-gradient(ellipse 700px 360px at 75% 25%, #f5a62340, transparent 60%),
    radial-gradient(ellipse 500px 280px at 10% 90%, #3a82b050, transparent 60%);
}
.product-card .tag { background: linear-gradient(135deg, #0f5a8a, #093e60); }
.btn-primary { background: linear-gradient(135deg, #f5a623, #f5a623dd); }
.btn-primary:hover { box-shadow: 0 10px 24px #f5a62380; }
.advantage-icon { background: linear-gradient(135deg, #0f5a8a, #3a82b0); }
.section-head .eyebrow { background: #0f5a8a20; color: #0f5a8a; }
.section-head h2::after { background: linear-gradient(90deg, #0f5a8a, #f5a623); }
.product-tab.active { background: #0f5a8a; border-color: #0f5a8a; }
.about-img .badge { color: #0f5a8a; }
.scenes-feature {
  background: linear-gradient(135deg, #0f5a8a10, #f5a62308);
  padding: 60px 24px;
  border-radius: 16px;
  margin: 30px 0;
}
.city-feature-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 30px;
}
.city-feature {
  background: #fff;
  padding: 24px;
  border-radius: 10px;
  border-top: 3px solid #0f5a8a;
  box-shadow: 0 4px 16px #093e6010;
}
.city-feature h4 { color: #093e60; font-size: 16px; margin-bottom: 10px; display: flex; align-items: center; gap: 8px; }
.city-feature h4::before { content: "▣"; color: #f5a623; }
.city-feature p { color: #5a6c7d; font-size: 13px; line-height: 1.7; }
.contact-qr { background: linear-gradient(135deg, #0f5a8a, #093e60) !important; }
.nav-cta { color: #0f5a8a; }
.hero-card .dot { background: #f5a623; }