/* =========================================================
   Arctus Cloud — 首页样式（2026-10 改版）
   仅作用于 body#index，不影响会员中心/其它页面
   ========================================================= */
body#index {
  background: #fff;
  overflow-x: hidden;
}

body#index header {
  max-width: 100%;
}

body#index header {
  position: relative;
  z-index: 5;
  background: #fff;
}

.ac-wrap {
  max-width: 1240px;
  margin: 0 auto;
  padding: 0 24px;
}

/* ---------- HERO ---------- */
.ac-hero {
  position: relative;
  overflow: hidden;
  padding: 110px 0 90px;
  background: #0a1020;
  background-image:
    radial-gradient(900px 500px at 78% 8%, rgba(255, 103, 57, 0.22), transparent 62%),
    radial-gradient(700px 420px at 8% 92%, rgba(56, 116, 255, 0.16), transparent 65%),
    linear-gradient(168deg, #0b1222 0%, #0a0f1c 55%, #0d1424 100%);
  color: #fff;
}

.ac-hero-grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.045) 1px, transparent 1px);
  background-size: 64px 64px;
  -webkit-mask-image: radial-gradient(circle at 50% 30%, #000 0%, transparent 78%);
  mask-image: radial-gradient(circle at 50% 30%, #000 0%, transparent 78%);
  pointer-events: none;
}

.ac-hero-inner {
  position: relative;
  z-index: 2;
}

.ac-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.04);
  font-size: 13px;
  color: rgba(255, 255, 255, 0.78);
  letter-spacing: 0.02em;
}

.ac-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #ff6739;
  box-shadow: 0 0 0 0 rgba(255, 103, 57, 0.55);
  animation: acPulse 2.4s ease-out infinite;
}

@keyframes acPulse {
  0% { box-shadow: 0 0 0 0 rgba(255, 103, 57, 0.5); }
  70% { box-shadow: 0 0 0 10px rgba(255, 103, 57, 0); }
  100% { box-shadow: 0 0 0 0 rgba(255, 103, 57, 0); }
}

.ac-h1 {
  margin: 26px 0 0;
  font-size: 58px;
  line-height: 1.16;
  font-weight: 700;
  letter-spacing: -0.02em;
  color: #fff;
}

.ac-grad {
  background: linear-gradient(92deg, #ffa77f 0%, #ff6739 55%, #ff7f4d 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}

.ac-sub {
  margin: 24px 0 0;
  max-width: 620px;
  font-size: 17px;
  line-height: 1.85;
  color: rgba(255, 255, 255, 0.64);
}

.ac-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 36px;
}

.ac-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 52px;
  padding: 0 30px;
  border-radius: 10px;
  font-size: 15px;
  font-weight: 500;
  text-decoration: none !important;
  transition: all 0.25s ease;
  border: 1px solid transparent;
}

.ac-btn-primary {
  background: #ff6739;
  color: #fff !important;
  box-shadow: 0 10px 30px rgba(255, 103, 57, 0.32);
}

.ac-btn-primary:hover {
  background: #ff7d53;
  transform: translateY(-2px);
  box-shadow: 0 14px 36px rgba(255, 103, 57, 0.4);
}

.ac-btn-ghost {
  border-color: rgba(255, 255, 255, 0.26);
  color: rgba(255, 255, 255, 0.92) !important;
  background: rgba(255, 255, 255, 0.02);
}

.ac-btn-ghost:hover {
  background: rgba(255, 255, 255, 0.09);
  border-color: rgba(255, 255, 255, 0.4);
  transform: translateY(-2px);
}

.ac-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  margin-top: 66px;
  padding-top: 38px;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
}

.ac-stat b {
  display: block;
  font-size: 34px;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: #fff;
  line-height: 1.2;
}

.ac-stat span {
  display: block;
  margin-top: 8px;
  font-size: 13px;
  color: rgba(255, 255, 255, 0.5);
}

/* ---------- SECTION ---------- */
.ac-section {
  padding: 96px 0;
  background: #fff;
}

.ac-products,
.ac-nodes {
  background: #f7f8fa;
}

.ac-head {
  max-width: 720px;
  margin-bottom: 52px;
}

.ac-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.14em;
  color: #ff6739;
}

.ac-eyebrow::before {
  content: '';
  width: 18px;
  height: 2px;
  border-radius: 2px;
  background: #ff6739;
}

.ac-h2 {
  margin: 14px 0 0;
  font-size: 38px;
  line-height: 1.32;
  font-weight: 700;
  letter-spacing: -0.01em;
  color: #0b1220;
}

.ac-desc {
  margin: 16px 0 0;
  max-width: 660px;
  font-size: 15px;
  line-height: 1.85;
  color: #5b6472;
}

/* ---------- PRODUCTS ---------- */
.ac-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.ac-card {
  display: flex;
  flex-direction: column;
  padding: 28px 24px 24px;
  background: #fff;
  border: 1px solid #edf0f4;
  border-radius: 16px;
  text-decoration: none !important;
  transition: all 0.28s ease;
  animation: acFade 0.65s ease both;
}

.ac-card:hover {
  transform: translateY(-4px);
  border-color: #ffd9cb;
  box-shadow: 0 18px 44px rgba(17, 24, 39, 0.09);
}

.ac-card-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin-bottom: 20px;
}

.ac-ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 12px;
  background: rgba(255, 103, 57, 0.09);
  color: #ff6739;
  transition: all 0.28s ease;
}

.ac-ico svg {
  width: 24px;
  height: 24px;
}

.ac-card:hover .ac-ico {
  background: #ff6739;
  color: #fff;
}

.ac-tag {
  padding: 3px 9px;
  border-radius: 999px;
  background: #f1f3f6;
  color: #6b7280;
  font-size: 11px;
  letter-spacing: 0.04em;
  line-height: 18px;
}

.ac-tag-hot {
  background: #fff0ea;
  color: #ff6739;
}

.ac-card h3 {
  margin: 0 0 8px;
  font-size: 17px;
  line-height: 1.5;
  font-weight: 600;
  color: #0b1220;
}

.ac-card p {
  margin: 0;
  font-size: 13px;
  line-height: 1.7;
  color: #7b838f;
}

.ac-more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-top: auto;
  padding-top: 22px;
  font-size: 13px;
  color: #ff6739;
}

.ac-more i {
  font-style: normal;
  transition: transform 0.25s ease;
}

.ac-card:hover .ac-more i {
  transform: translateX(4px);
}

.ac-card:nth-child(1) { animation-delay: 0.02s; }
.ac-card:nth-child(2) { animation-delay: 0.06s; }
.ac-card:nth-child(3) { animation-delay: 0.1s; }
.ac-card:nth-child(4) { animation-delay: 0.14s; }
.ac-card:nth-child(5) { animation-delay: 0.18s; }
.ac-card:nth-child(6) { animation-delay: 0.22s; }
.ac-card:nth-child(7) { animation-delay: 0.26s; }
.ac-card:nth-child(8) { animation-delay: 0.3s; }

@keyframes acFade {
  from { opacity: 0; transform: translateY(14px); }
  to { opacity: 1; transform: translateY(0); }
}

/* ---------- FEATURES ---------- */
.ac-feat-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.ac-feat {
  padding: 30px 26px;
  background: #fbfcfd;
  border: 1px solid #eef1f5;
  border-radius: 16px;
  transition: all 0.28s ease;
}

.ac-feat:hover {
  background: #fff;
  border-color: #ffd9cb;
  box-shadow: 0 16px 40px rgba(17, 24, 39, 0.07);
}

.ac-feat-ico {
  display: block;
  color: #ff6739;
  margin-bottom: 16px;
}

.ac-feat-ico svg {
  width: 26px;
  height: 26px;
}

.ac-feat h4 {
  margin: 0 0 10px;
  font-size: 16px;
  font-weight: 600;
  color: #0b1220;
}

.ac-feat p {
  margin: 0;
  font-size: 13px;
  line-height: 1.8;
  color: #6b7280;
}

/* ---------- NODES ---------- */
.ac-nodes-inner {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 56px;
  align-items: center;
}

.ac-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.ac-chip {
  padding: 11px 18px;
  background: #fff;
  border: 1px solid #e8ecf1;
  border-radius: 10px;
  font-size: 14px;
  color: #374151;
  transition: all 0.22s ease;
}

.ac-chip:hover {
  border-color: #ff6739;
  color: #ff6739;
  transform: translateY(-2px);
}

/* ---------- CTA ---------- */
.ac-cta {
  padding: 60px 0;
  background: linear-gradient(135deg, #fff6f1 0%, #fffdfc 60%, #ffffff 100%);
  border-top: 1px solid #f4e8e2;
}

.ac-cta-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
}

.ac-cta h2 {
  margin: 0 0 10px;
  font-size: 28px;
  font-weight: 700;
  color: #0b1220;
  letter-spacing: -0.01em;
}

.ac-cta p {
  margin: 0;
  font-size: 15px;
  color: #6b7280;
}

.ac-cta-actions {
  display: flex;
  gap: 12px;
  flex-shrink: 0;
}

.ac-btn-ghost-dark {
  border-color: #e2e6eb;
  background: #fff;
  color: #0b1220 !important;
}

.ac-btn-ghost-dark:hover {
  background: #f7f8fa;
  border-color: #cfd6de;
  transform: translateY(-2px);
}

/* ---------- RESPONSIVE ---------- */
@media (max-width: 1100px) {
  .ac-h1 { font-size: 44px; }
  .ac-grid { grid-template-columns: repeat(2, 1fr); }
  .ac-feat-grid { grid-template-columns: repeat(2, 1fr); }
  .ac-nodes-inner { grid-template-columns: 1fr; gap: 32px; }
  .ac-h2 { font-size: 32px; }
  .ac-hero { padding: 84px 0 72px; }
  .ac-section { padding: 76px 0; }
}

@media (max-width: 767px) {
  /* —— 移动端导航：单行横滑，避免撑破视口 —— */
  #index header .nav-header {
    flex-wrap: nowrap;
    gap: 6px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  #index header .nav-header::-webkit-scrollbar {
    display: none;
  }

  #index header .nav-left {
    flex-wrap: nowrap;
    flex-shrink: 0;
  }

  /* 右侧「文档 / 控制台 / 登录 / 注册」不允许被压成竖排 */
  #index header .nav-item,
  #index header .login-in,
  #index header .login-in > div,
  #index header .reg-btn,
  #index header .nav-right,
  #index header .nav-header > div {
    white-space: nowrap;
    flex-shrink: 0;
  }

  /* 手机上收起「产品 / 客户支持」菜单，避免挤掉登录注册按钮
     （页面里已有产品矩阵与页脚导航） */
  #index header .nav-menu {
    display: none;
  }

  #index header .nav-header {
    overflow: visible;
  }

  #index header .nav-right {
    margin-left: auto;
    gap: 4px;
  }

  #index header .control {
    font-size: 13px;
    padding: 0 5px;
  }

  #index header .no-login {
    display: flex;
    align-items: center;
    gap: 6px;
  }

  #index header .no-login .btn {
    height: 32px;
    line-height: 32px;
    padding: 0 12px;
    font-size: 13px;
    border-radius: 6px;
  }

  #index header .nav-menu {
    flex-wrap: nowrap;
    flex-shrink: 0;
  }

  #index header .nav-menu .nav-item {
    height: 56px;
    padding: 0 10px;
    font-size: 13px;
    white-space: nowrap;
    flex-shrink: 0;
  }

  #index header .nav-left .nav-icon img {
    width: 104px;
    height: auto;
    margin-right: 12px;
  }

  #index header .login-in {
    height: 56px;
    padding: 0 12px;
    font-size: 13px;
    white-space: nowrap;
    flex-shrink: 0;
  }

  .ac-wrap { padding: 0 18px; }
  .ac-hero { padding: 64px 0 56px; }
  .ac-h1 { font-size: 32px; margin-top: 20px; }
  .ac-sub { font-size: 15px; margin-top: 18px; }
  .ac-actions { margin-top: 28px; }
  .ac-btn { width: 100%; height: 48px; }
  .ac-stats {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    margin-top: 44px;
    padding-top: 28px;
  }
  .ac-stat b { font-size: 26px; }
  .ac-section { padding: 56px 0; }
  .ac-head { margin-bottom: 36px; }
  .ac-h2 { font-size: 26px; }
  .ac-desc { font-size: 14px; }
  .ac-grid { grid-template-columns: 1fr; gap: 14px; }
  .ac-feat-grid { grid-template-columns: 1fr; gap: 14px; }
  .ac-card { padding: 22px 20px; }
  .ac-feat { padding: 24px 20px; }
  .ac-cta { padding: 44px 0; }
  .ac-cta-inner { flex-direction: column; align-items: flex-start; }
  .ac-cta h2 { font-size: 22px; }
  .ac-cta-actions { width: 100%; }
}


/* =========================================================
   深色主题（2026-10-23）：整站首页深色适配
   全部规则限定在 body#index 下，不影响会员中心与其它页面
   ========================================================= */

body#index {
  background: #0a0c12;
  color: #e6eaf1;
}

/* ---------- 顶部导航 ---------- */
body#index header,
body#index .nav-shadow {
  background: #0a0c12;
}

body#index header .nav-header {
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

body#index header .nav-menu .nav-item,
body#index header .nav-right .control {
  color: rgba(255, 255, 255, 0.76);
}

body#index header .nav-menu .nav-item:hover,
body#index header .nav-right .control:hover {
  color: #fff;
}

body#index header .nav-left .nav-icon img {
  filter: brightness(0) invert(1);
}

body#index header .no-login .btn-normal-light {
  background: rgba(255, 255, 255, 0.07);
  border: 1px solid rgba(255, 255, 255, 0.16);
  color: #fff;
}

body#index header .no-login .btn-normal-light:hover {
  background: rgba(255, 255, 255, 0.13);
}

body#index header .login-in::after {
  border-left-color: rgba(255, 255, 255, 0.12);
}

/* ---------- 区块底色 ---------- */
body#index .ac-section {
  background: #0a0c12;
}

body#index .ac-products,
body#index .ac-nodes {
  background: #0d1019;
}

/* ---------- 标题与正文 ---------- */
body#index .ac-h2,
body#index .ac-card h3,
body#index .ac-feat h4,
body#index .ac-cta h2 {
  color: #f2f4f8;
}

body#index .ac-desc,
body#index .ac-cta p {
  color: #98a2b3;
}

/* ---------- 产品卡 ---------- */
body#index .ac-card {
  background: #12161f;
  border-color: rgba(255, 255, 255, 0.08);
}

body#index .ac-card:hover {
  border-color: rgba(255, 103, 57, 0.45);
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.45);
}

body#index .ac-ico {
  background: rgba(255, 103, 57, 0.14);
  color: #ff8a5c;
}

body#index .ac-tag {
  background: rgba(255, 255, 255, 0.06);
  color: #9aa4b2;
}

body#index .ac-tag-hot {
  background: rgba(255, 103, 57, 0.16);
  color: #ff9c73;
}

body#index .ac-card p {
  color: #8b95a5;
}

body#index .ac-more {
  color: #ff8a5c;
}

/* ---------- 优势卡 ---------- */
body#index .ac-feat {
  background: #10141c;
  border-color: rgba(255, 255, 255, 0.07);
}

body#index .ac-feat:hover {
  background: #141a24;
  border-color: rgba(255, 103, 57, 0.4);
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.4);
}

body#index .ac-feat p {
  color: #8b95a5;
}

/* ---------- 节点 chips ---------- */
body#index .ac-chip {
  background: #10141c;
  border-color: rgba(255, 255, 255, 0.09);
  color: #c3cbd6;
}

body#index .ac-chip:hover {
  border-color: #ff6739;
  color: #ff9c73;
}

/* ---------- 底部 CTA ---------- */
body#index .ac-cta {
  background: linear-gradient(135deg, #16101f 0%, #0d1018 58%, #0a0c12 100%);
  border-top: 1px solid rgba(255, 255, 255, 0.07);
}

body#index .ac-btn-ghost-dark {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.22);
  color: #f2f4f8 !important;
}

body#index .ac-btn-ghost-dark:hover {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.4);
}

/* ---------- 页脚承诺条 / 内容区与深色底衔接 ---------- */
body#index .section-promise {
  background: #0b0e15;
}

body#index .footer-content {
  background: #0d1018;
}

/* ---------- 顶部下拉面板（深色） ---------- */
body#index .nav-cont {
  background: #0e121b;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.55);
}

body#index .nav-item-box {
  background: #141926;
  border: 1px solid rgba(255, 255, 255, 0.07);
  box-shadow: none;
}

body#index .nav-item-box .item-box-title {
  color: #e6eaf1;
}

body#index .nav-item-box .item-box-title .desc {
  color: rgba(255, 255, 255, 0.45);
}

body#index .nav-item-box:hover {
  border-color: rgba(255, 103, 57, 0.45);
}

body#index .nav-item-box:hover .title {
  color: #ff8a5c;
}