/* 99ABG99 轻量原创主题：保留原布局，仅优化色彩、层次与组件质感 */
:root {
  --primary-color: #081623;
  --secondary-color: #f0b84a;
  --accent-color: #0d6670;
  --highlight-color: #d46a3a;
  --text-color: #f7f8fb;
  --text-secondary: #bdc8d3;
  --bg-dark: #0d2030;
  --card-bg: rgba(14, 37, 52, 0.82);
  --border-color: rgba(240, 184, 74, 0.18);
  --gradient: linear-gradient(135deg, #f3c463 0%, #d96a38 100%);
  --gradient-dark: linear-gradient(135deg, #0d6670 0%, #081623 72%);
  --shadow: 0 16px 44px rgba(0, 0, 0, 0.28);
  --radius: 16px;
}

body {
  background:
    radial-gradient(circle at 12% 8%, rgba(13, 102, 112, 0.18), transparent 30rem),
    radial-gradient(circle at 88% 22%, rgba(240, 184, 74, 0.08), transparent 26rem),
    var(--primary-color);
}

header {
  background: rgba(8, 22, 35, 0.9);
  border-bottom: 1px solid rgba(240, 184, 74, 0.22);
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.2);
}

.logo {
  letter-spacing: 0.02em;
  text-shadow: 0 0 24px rgba(240, 184, 74, 0.16);
}

.logo > span:not(.logo-icon) {
  margin-left: 0.42rem;
  padding-left: 0.48rem;
  border-left: 1px solid rgba(240, 184, 74, 0.35);
}

nav a {
  border-radius: 999px;
}

nav a:hover {
  background: rgba(240, 184, 74, 0.08);
}

.banner,
.service-hero {
  background:
    linear-gradient(110deg, rgba(8, 22, 35, 0.96), rgba(13, 102, 112, 0.72)),
    radial-gradient(circle at 78% 16%, rgba(240, 184, 74, 0.22), transparent 22rem);
  border-bottom: 1px solid rgba(240, 184, 74, 0.2);
}

.banner::after,
.service-hero::after {
  content: "";
  position: absolute;
  inset: auto 8% 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(240, 184, 74, 0.7), transparent);
  pointer-events: none;
}

.eyebrow,
.section-kicker {
  letter-spacing: 0.16em;
  text-transform: uppercase;
}

.section-title h2::after {
  width: 68px;
  height: 3px;
  box-shadow: 0 0 16px rgba(240, 184, 74, 0.34);
}

.btn {
  color: #17120a;
  border: 1px solid rgba(255, 255, 255, 0.2);
  box-shadow: 0 12px 28px rgba(217, 106, 56, 0.23);
}

.btn-outline {
  color: #f3c463;
  border-color: rgba(243, 196, 99, 0.72);
  background: rgba(8, 22, 35, 0.28);
}

.btn-outline:hover {
  color: #17120a;
  background: #f3c463;
}

.service-link-card,
.feature-card,
.step-card,
.download-card,
.contact-card,
.service-info-card,
.faq-list details,
.service-notice-panel {
  background: linear-gradient(145deg, rgba(17, 45, 61, 0.9), rgba(9, 27, 40, 0.92));
  border: 1px solid rgba(240, 184, 74, 0.16);
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.2);
}

.service-link-card,
.feature-card,
.step-card,
.service-info-card {
  position: relative;
  overflow: hidden;
}

.service-link-card::before,
.feature-card::before,
.step-card::before,
.service-info-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  background: linear-gradient(180deg, #f3c463, #0d6670);
  opacity: 0.8;
}

.service-link-card:hover,
.feature-card:hover,
.download-card:hover,
.service-info-card:hover {
  border-color: rgba(240, 184, 74, 0.42);
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.3);
}

.domain-tip,
.security-note,
.service-notice-panel {
  border-left: 3px solid #f0b84a;
}

footer {
  background: linear-gradient(180deg, #0b1b29, #06111b);
  border-top: 1px solid rgba(240, 184, 74, 0.18);
}

@media (min-width: 769px) {
  nav ul { gap: 0.18rem; }
  nav a { padding-left: 0.78rem; padding-right: 0.78rem; }
  .banner-content { max-width: 880px; }
}

@media (max-width: 768px) {
  nav { background: rgba(8, 22, 35, 0.98); }
  nav a { border-radius: 0; }
  .logo > span:not(.logo-icon) { margin-left: 0.28rem; padding-left: 0.34rem; }
}

/* 长品牌名在桌面导航中保持单行，避免挤压菜单 */
.logo {
  flex-shrink: 0;
  white-space: nowrap;
}

@media (min-width: 769px) {
  .logo { font-size: 1.3rem; }
  .logo > span:not(.logo-icon) { font-size: 0.82em; }
}

@media (min-width: 1024px) {
  header { padding: 0.78rem 0; }
  .logo { font-size: 1.14rem; line-height: 1.15; }
  .logo-icon { margin-right: 0.35rem; font-size: 1.42rem; }
  .logo > span:not(.logo-icon) { font-size: 0.78em; }
  nav li { margin-left: 0.55rem; }
  nav a { padding: 0.42rem 0.48rem; font-size: 0.9rem; }
}