/* sangmian.com · webshare.io 对标 · Rola IP · ws-* 视觉体系 */

:root {
  --ws-brand: #00b19a;
  --ws-brand-hover: #009882;
  --ws-brand-soft: #ecfdf5;
  --ws-brand-tint: #ccfbf1;
  --ws-brand-dark: #0f2e2a;
  --ws-purple: #7c3aed;
  --ws-purple-soft: #ede9fe;
  --ws-lavender: #e9e0f5;
  --ws-lavender-text: #6d28d9;
  --ws-hero-shell: #ecfdf5;
  --ws-panel: #f3f4f6;
  --ws-success: #10b981;
  --ws-success-soft: #ecfdf5;
  --ws-promo: #0f172a;
  --ws-dark: #0f2e2a;
  --ws-dark-2: #1a3d38;
  --ws-text: #0f2e2a;
  --ws-muted: #5f6b68;
  --ws-border: #e5e7eb;
  --ws-bg: #ffffff;
  --ws-bg-alt: #f8fafc;
  --ws-bg-muted: #f3f4f6;
  --ws-radius: 12px;
  --ws-radius-lg: 24px;
  --ws-radius-xl: 40px;
  --ws-radius-pill: 999px;
  --ws-shadow: 0 20px 50px rgba(15, 46, 42, 0.08);
  --ws-shadow-sm: 0 4px 20px rgba(15, 46, 42, 0.06);
  --ws-wrap: 1200px;
  --ws-header-h: 68px;
  --ws-promo-h: 40px;
  /* xlb 过渡期变量映射 */
  --xlb-green: var(--ws-brand);
  --xlb-green-dark: var(--ws-brand-hover);
  --xlb-green-soft: var(--ws-brand-soft);
  --xlb-green-tint: var(--ws-brand-tint);
  --xlb-dark: var(--ws-dark);
  --xlb-dark-2: var(--ws-dark-2);
  --xlb-text: var(--ws-text);
  --xlb-muted: var(--ws-muted);
  --xlb-border: var(--ws-border);
  --xlb-grey-bg: var(--ws-bg-alt);
  --xlb-radius: var(--ws-radius);
  --xlb-shadow: var(--ws-shadow);
  --xlb-header-h: var(--ws-header-h);
}

/* 滚动进入视口淡入上滑（对标 cazhi.cn .rp-reveal） */
.ws-reveal {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.ws-reveal.is-visible {
  opacity: 1;
  transform: translateY(0);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body.ws-body,
body.xlb-body {
  font-family: 'Inter', system-ui, -apple-system, 'PingFang SC', 'Microsoft YaHei', sans-serif;
  background: var(--ws-bg);
  color: var(--ws-text);
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
img, svg { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }
button { font: inherit; cursor: pointer; border: none; background: none; color: inherit; }

.ws-wrap,
.ws-container,
.xlb-container { max-width: var(--ws-wrap); margin: 0 auto; padding: 0 20px; }

/* ===== 顶栏促销 / 企业条 ===== */
.ws-promo-bar {
  background: var(--ws-promo);
  color: #e2e8f0;
  font-size: 0.8125rem;
  text-align: center;
  padding: 10px 16px;
  line-height: 1.4;
}
.ws-promo-bar a {
  color: #fff;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.ws-promo-bar a:hover { color: var(--ws-brand-tint); }
.ws-promo-bar--accent { background: linear-gradient(90deg, #009882, #00b19a); }
.ws-promo-bar strong { color: #fff; }

/* ===== Header ===== */
.ws-header-wrap {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1000;
}
.ws-header-placeholder { height: calc(var(--ws-promo-h) + var(--ws-header-h)); }
.ws-header {
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--ws-border);
  transition: box-shadow 0.2s;
}
.ws-header-wrap.is-scrolled .ws-header { box-shadow: var(--ws-shadow-sm); }
.ws-header__shell {
  max-width: var(--ws-wrap);
  margin: 0 auto;
  padding: 0 20px;
  height: var(--ws-header-h);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.ws-logo {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 800;
  font-size: 1.05rem;
  color: var(--ws-text);
  flex-shrink: 0;
}
.ws-logo img { width: 30px; height: 30px; border-radius: 6px; }

/* 导航 */
.ws-nav { display: flex; align-items: center; gap: 2px; }
.ws-nav > li { position: relative; }
.ws-nav > li[data-mega].is-open::after {
  content: '';
  position: absolute;
  left: -8px;
  right: -8px;
  top: 100%;
  height: 10px;
  z-index: 99;
}
.ws-nav__trigger {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 10px 14px;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  border-radius: 8px;
  transition: background 0.12s, color 0.12s;
  white-space: nowrap;
}
.ws-nav__trigger:hover,
.ws-nav > li.is-open .ws-nav__trigger { background: var(--ws-bg-alt); color: var(--ws-brand); }
.ws-nav__chev { width: 10px; height: 6px; opacity: 0.5; transition: transform 0.2s; flex-shrink: 0; }
.ws-nav > li.is-open .ws-nav__chev { transform: rotate(180deg); }

/* Mega Menu */
.ws-mega {
  position: absolute;
  top: calc(100% + 6px);
  left: 50%;
  transform: translateX(-50%) translateY(8px);
  min-width: 280px;
  background: #fff;
  border: 1px solid var(--ws-border);
  border-radius: var(--ws-radius);
  padding: 16px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.18s, transform 0.18s;
  box-shadow: var(--ws-shadow);
  z-index: 1100;
}
.ws-nav > li.is-open .ws-mega {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0);
}
.ws-mega--wide {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px 20px;
  min-width: 720px;
  padding: 20px;
}
.ws-mega--product {
  grid-template-columns: repeat(3, 1fr);
  gap: 12px 28px;
  min-width: 780px;
  align-items: start;
}
/* 产品下拉三列：每列纵向堆叠链接，避免分类标签占位错乱 */
.ws-mega-product-col {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}
.ws-mega-product-col .ws-mega__link {
  align-items: flex-start;
}
.ws-mega--price { min-width: 300px; max-width: 360px; }
.ws-mega__label {
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: #9ca3af;
  padding: 0 4px 8px;
  grid-column: 1 / -1;
}
.ws-mega__label--inline { grid-column: auto; margin-top: 8px; padding-top: 12px; border-top: 1px solid var(--ws-border); }
.ws-mega__link {
  display: flex;
  gap: 12px;
  padding: 10px;
  border-radius: 10px;
  transition: background 0.12s;
}
.ws-mega__link:hover { background: var(--ws-bg-alt); }
.ws-mega__icon {
  flex-shrink: 0;
  width: 36px;
  height: 36px;
  border-radius: 8px;
  background: var(--ws-brand-soft);
  border: 1px solid var(--ws-brand-tint);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
}
/* 地区下拉：SVG 国旗/地球图标（避免 Windows 下 emoji 显示为字母） */
.ws-mega__icon--flag {
  padding: 0;
  background: #fff;
  border-color: var(--ws-border);
  overflow: hidden;
}
.ws-mega__icon--flag img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.ws-mega__title { display: block; font-size: 0.84rem; font-weight: 600; margin-bottom: 2px; color: var(--ws-text); }
.ws-mega__sub { display: block; font-size: 0.74rem; color: var(--ws-muted); line-height: 1.4; }
.ws-mega__price { display: block; font-size: 0.74rem; font-weight: 700; color: var(--ws-brand); margin-top: 4px; }

.ws-header__aside { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.ws-header__login {
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
  padding: 8px 14px;
  border-radius: 8px;
  transition: color 0.12s;
}
.ws-header__login:hover { color: var(--ws-brand); }
.ws-toggle {
  display: none;
  flex-direction: column;
  gap: 5px;
  padding: 8px;
  border-radius: 8px;
}
.ws-toggle span { width: 22px; height: 2px; background: var(--ws-text); border-radius: 2px; transition: transform 0.2s, opacity 0.2s; }
.ws-toggle.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.ws-toggle.is-open span:nth-child(2) { opacity: 0; }
.ws-toggle.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.ws-nav__mobile-foot { display: none; }

/* ===== 按钮 / 徽章 ===== */
.ws-btn,
.xlb-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 12px 28px;
  border-radius: var(--ws-radius-pill);
  font-size: 0.875rem;
  font-weight: 600;
  border: 2px solid transparent;
  transition: all 0.15s;
  cursor: pointer;
  text-decoration: none;
  white-space: nowrap;
}
.ws-btn--primary,
.xlb-btn--primary { background: var(--ws-brand); color: #fff; border-color: var(--ws-brand); }
.ws-btn--primary:hover,
.xlb-btn--primary:hover { background: var(--ws-brand-hover); border-color: var(--ws-brand-hover); }
.ws-btn--outline,
.xlb-btn--outline { background: #fff; color: var(--ws-text); border-color: var(--ws-border); }
.ws-btn--outline:hover,
.xlb-btn--outline:hover { border-color: var(--ws-brand); color: var(--ws-brand); }
.ws-btn--lavender {
  background: var(--ws-lavender);
  color: var(--ws-lavender-text);
  border-color: transparent;
}
.ws-btn--lavender:hover { background: #ddd6fe; }
.ws-btn--block { width: 100%; }
.ws-btn--ghost:hover { background: var(--ws-bg-alt); }
.ws-btn--google {
  background: #fff;
  color: var(--ws-text);
  border-color: var(--ws-border);
  box-shadow: var(--ws-shadow-sm);
}
.ws-btn--lg,
.xlb-btn--lg { padding: 14px 32px; font-size: 0.95rem; }
.ws-btn--sm,
.xlb-btn--sm { padding: 8px 20px; font-size: 0.8125rem; }
.ws-link,
.xlb-link { color: var(--ws-brand); font-weight: 600; font-size: 0.875rem; }
.ws-link:hover,
.xlb-link:hover { color: var(--ws-brand-hover); }
.ws-badge,
.xlb-badge {
  display: inline-block;
  padding: 2px 8px;
  background: var(--ws-success-soft);
  color: #047857;
  font-size: 0.625rem;
  font-weight: 700;
  border-radius: 4px;
  vertical-align: middle;
  line-height: 1.35;
}
.ws-badge--promo { background: #fef3c7; color: #b45309; }

/* ===== 通用区块 ===== */
.ws-section,
.xlb-section { padding: 72px 0; }
.ws-section--sm { padding: 48px 0; }
.ws-section--alt,
.xlb-section--grey { background: var(--ws-bg-alt); }
.ws-section--dark,
.xlb-section--dark { background: var(--ws-dark); color: #cbd5e1; }
.ws-section--dark h2,
.ws-section--dark h3,
.xlb-section--dark h2,
.xlb-section--dark h3 { color: #fff; }
.ws-h1 { font-size: clamp(2rem, 4vw, 2.75rem); font-weight: 800; line-height: 1.15; letter-spacing: -0.02em; }
.ws-h2,
.ws-section-title,
.xlb-section-title {
  font-size: clamp(1.4rem, 2.8vw, 1.85rem);
  font-weight: 800;
  margin-bottom: 14px;
  letter-spacing: -0.02em;
  line-height: 1.3;
}
.ws-section-title--center,
.xlb-section-title--center { text-align: center; }
.ws-lead,
.ws-section-lead,
.xlb-section-lead {
  color: var(--ws-muted);
  font-size: 1rem;
  line-height: 1.7;
  margin-bottom: 28px;
  max-width: 640px;
}
.ws-section-title--center + .ws-section-lead,
.ws-section-title--center + .xlb-section-lead,
.xlb-section-title--center + .ws-section-lead,
.xlb-section-title--center + .xlb-section-lead { margin-left: auto; margin-right: auto; text-align: center; }
.ws-text-center { text-align: center; }

/* ===== 首页 Hero 薄荷绿容器 + Bento ===== */
.ws-home-hero { padding: 24px 0 0; }
.ws-home-hero__shell {
  background: var(--ws-hero-shell);
  border-radius: var(--ws-radius-xl);
  padding: 56px 40px 32px;
  box-shadow: var(--ws-shadow-sm);
}
.ws-home-hero__intro { text-align: center; max-width: 720px; margin: 0 auto 40px; }
.ws-home-hero__intro h1 {
  font-size: clamp(2rem, 4.2vw, 2.85rem);
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -0.03em;
  color: var(--ws-brand-dark);
  margin-bottom: 16px;
}
.ws-home-hero__intro .ws-hero__lead { margin: 0 auto 20px; text-align: center; max-width: 600px; }
.ws-home-hero__pills {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
  margin-bottom: 28px;
  font-size: 0.875rem;
  font-weight: 500;
  color: #374151;
}
.ws-home-hero__pills span { display: inline-flex; align-items: center; gap: 6px; }
.ws-home-hero__cta { justify-content: center; margin-bottom: 16px; }
.ws-home-hero__video { display: block; margin: 0 auto; }

/* Bento 6 格：2 列 × 3 行，文字与插图水平排列 */
.ws-bento {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px;
}
.ws-bento-card {
  background: #fff;
  border-radius: var(--ws-radius-lg);
  padding: 20px 22px;
  border: 1px solid rgba(15, 46, 42, 0.06);
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 96px;
}
.ws-bento-card__text {
  flex: 1;
  min-width: 0;
}
.ws-bento-card h3 { font-size: 1rem; font-weight: 700; color: var(--ws-brand-dark); margin-bottom: 4px; line-height: 1.35; }
.ws-bento-card p { font-size: 0.8125rem; color: var(--ws-muted); line-height: 1.5; margin-bottom: 0; }
.ws-bento-card__art {
  flex-shrink: 0;
  width: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
}
/* Bento 首卡：3×2 国旗网格 */
.ws-art-countries {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 5px;
  width: 100%;
  max-width: 108px;
}
.ws-art-countries__item {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--ws-bg-muted);
  border: 1px solid var(--ws-border);
  border-radius: 6px;
  padding: 5px 4px;
  min-height: 28px;
}
.ws-art-countries__item img {
  display: block;
  width: 28px;
  height: 18px;
  object-fit: cover;
  border-radius: 3px;
}
.ws-art-gauge {
  width: 80px; height: 40px;
  border: 6px dashed var(--ws-brand);
  border-bottom: none;
  border-radius: 80px 80px 0 0;
}
.ws-art-puzzle { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; width: 96px; }
.ws-art-puzzle span { padding: 6px 4px; font-size: 0.625rem; font-weight: 700; text-align: center; border-radius: 5px; color: #fff; line-height: 1.2; }
.ws-art-puzzle span:nth-child(1) { background: #f59e0b; }
.ws-art-puzzle span:nth-child(2) { background: var(--ws-brand); }
.ws-art-puzzle span:nth-child(3) { background: var(--ws-purple); }
.ws-art-puzzle span:nth-child(4) { background: #3b82f6; }
.ws-art-ext { width: 96px; background: #fff; border: 1px solid var(--ws-border); border-radius: 8px; padding: 8px; box-shadow: var(--ws-shadow-sm); }
.ws-art-ext__bar { height: 5px; background: var(--ws-bg-muted); border-radius: 3px; margin-bottom: 8px; }
.ws-art-ext__toggle { height: 20px; background: var(--ws-brand-soft); border-radius: 10px; position: relative; }
.ws-art-ext__toggle::after { content: ''; position: absolute; right: 2px; top: 2px; width: 16px; height: 16px; background: var(--ws-brand); border-radius: 50%; }
.ws-art-chat { width: 96px; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.ws-art-chat__avatar { font-size: 1.25rem; line-height: 1; }
.ws-art-chat__bubble { background: var(--ws-brand-soft); padding: 6px 8px; border-radius: 8px; font-size: 0.625rem; color: var(--ws-brand-dark); line-height: 1.3; text-align: center; white-space: nowrap; }
.ws-art-code { width: 96px; background: #1e293b; border-radius: 8px; padding: 8px 10px; font-family: 'JetBrains Mono', monospace; font-size: 0.625rem; color: #94a3b8; line-height: 1.45; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* 信任条 + Logo 跑马灯 */
.ws-home-trust { padding: 40px 0; }
.ws-home-trust__row { display: flex; flex-wrap: wrap; align-items: center; gap: 24px 32px; }
.ws-home-trust__text { font-size: 0.9375rem; color: var(--ws-muted); white-space: nowrap; }
.ws-home-trust__text strong { color: var(--ws-brand-dark); }
.ws-home-trust__logos {
  flex: 1;
  overflow: hidden;
  mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.ws-home-trust__track { display: flex; width: max-content; animation: wsLogoScroll 35s linear infinite; }
.ws-home-trust__group { display: flex; align-items: center; gap: 40px; padding-right: 40px; }
.ws-home-trust__group img { height: 22px; width: auto; opacity: 0.45; filter: grayscale(1); }
@keyframes wsLogoScroll { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }

/* 产品方案三卡 */
.ws-sol-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.ws-sol-card {
  background: #fff;
  border: 1px solid var(--ws-border);
  border-radius: var(--ws-radius-lg);
  padding: 28px 24px 24px;
  display: flex;
  flex-direction: column;
  text-align: left;
}
.ws-sol-card__icon {
  width: 44px; height: 44px;
  border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.25rem;
  margin-bottom: 16px;
}
.ws-sol-card__icon--green { background: #d1fae5; }
.ws-sol-card__icon--purple { background: var(--ws-purple-soft); }
.ws-sol-card h3 { font-size: 1.125rem; font-weight: 700; margin-bottom: 8px; color: var(--ws-brand-dark); }
.ws-sol-card__desc { font-size: 0.875rem; color: var(--ws-muted); line-height: 1.55; margin-bottom: 20px; flex: 1; }
.ws-sol-card__price { font-size: 2rem; font-weight: 800; color: var(--ws-brand-dark); margin-bottom: 20px; }
.ws-sol-card__price small { font-size: 0.875rem; font-weight: 500; color: var(--ws-muted); }
.ws-custom-banner {
  margin-top: 20px;
  padding: 16px 24px;
  background: var(--ws-brand-soft);
  border-radius: var(--ws-radius-lg);
  text-align: center;
  font-size: 0.9375rem;
  color: var(--ws-muted);
}
.ws-custom-banner a { color: var(--ws-brand); font-weight: 600; }

/* 全球网络灰底容器 */
.ws-loc-panel {
  background: var(--ws-panel);
  border-radius: var(--ws-radius-xl);
  padding: 48px 40px;
}
.ws-loc-panel .ws-section-head { margin-bottom: 32px; }
.ws-loc-card {
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 12px;
  text-align: left;
  padding: 16px 18px;
}
.ws-loc-card img { width: 32px; height: 22px; object-fit: cover; border-radius: 3px; flex-shrink: 0; }
.ws-loc-card__body strong { display: block; font-size: 0.9rem; font-weight: 700; color: var(--ws-brand-dark); }
.ws-loc-card__body span { font-size: 0.78rem; color: var(--ws-muted); }

/* 硅谷徽章 */
.ws-sv-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  background: var(--ws-bg-muted);
  border-radius: var(--ws-radius-pill);
  font-size: 0.8125rem;
  color: var(--ws-muted);
  margin-bottom: 20px;
}

/* KPI 大圆角灰盒 */
.ws-stats-box {
  background: var(--ws-panel);
  border-radius: var(--ws-radius-xl);
  padding: 48px 32px;
  margin-top: 32px;
}
.ws-stats-box .ws-stat strong { color: var(--ws-brand-dark); font-size: clamp(2rem, 4vw, 2.75rem); }

/* 客户支持左对齐 + 插图卡 */
.ws-support-head { text-align: left; max-width: 560px; margin-bottom: 32px; }
.ws-support-head .ws-section-lead { margin-left: 0; text-align: left; }
.ws-support-card { text-align: left; padding: 0; border: none; overflow: hidden; }
.ws-support-card__visual {
  background: var(--ws-bg-muted);
  border-radius: var(--ws-radius-lg);
  min-height: 160px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
  border: 1px solid var(--ws-border);
}
.ws-support-card h3 { font-size: 1rem; font-weight: 700; margin-bottom: 8px; padding: 0 4px; }
.ws-support-card p { font-size: 0.875rem; color: var(--ws-muted); padding: 0 4px; }

/* ===== 首页 Hero（旧类保留兼容） ===== */
.ws-hero { padding: 64px 0 56px; background: linear-gradient(180deg, var(--ws-brand-soft) 0%, #fff 55%); }
.ws-hero__grid { display: grid; grid-template-columns: 1.05fr 0.95fr; gap: 48px; align-items: center; }
.ws-hero__eyebrow { font-size: 0.875rem; font-weight: 600; color: var(--ws-brand); margin-bottom: 12px; }
.ws-hero h1 { font-size: clamp(1.85rem, 3.8vw, 2.65rem); font-weight: 800; line-height: 1.2; margin-bottom: 16px; letter-spacing: -0.02em; }
.ws-hero__lead { font-size: 1.05rem; color: var(--ws-muted); margin-bottom: 24px; line-height: 1.7; max-width: 520px; }
.ws-hero__checks { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 24px; }
.ws-hero__checks li {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.875rem;
  color: #374151;
  font-weight: 500;
}
.ws-hero__checks li::before {
  content: '✓';
  color: var(--ws-success);
  font-weight: 800;
}
.ws-hero__cta { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.ws-hero__visual img { width: 100%; max-width: 520px; margin: 0 auto; border-radius: var(--ws-radius); box-shadow: var(--ws-shadow); }

/* 6 格卖点 */
.ws-feat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.ws-feat-grid--steps { max-width: 960px; margin-left: auto; margin-right: auto; }
.ws-feat-card {
  padding: 24px 20px;
  background: #fff;
  border: 1px solid var(--ws-border);
  border-radius: var(--ws-radius);
  transition: box-shadow 0.15s, transform 0.15s;
}
.ws-feat-card:hover { box-shadow: var(--ws-shadow-sm); transform: translateY(-2px); }
.ws-feat-card__icon {
  width: 44px;
  height: 44px;
  border-radius: 10px;
  background: var(--ws-brand-soft);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  margin-bottom: 14px;
}
.ws-feat-card h3 { font-size: 1rem; font-weight: 700; margin-bottom: 8px; }
.ws-feat-card p { font-size: 0.875rem; color: var(--ws-muted); line-height: 1.6; }

/* webshare 产品页 benefits 四格（浅紫底 + 白底图标盒） */
.ws-benefits-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.ws-benefits-card {
  padding: 24px 20px;
  background: #f3f5fb;
  border-radius: 12px;
  border: none;
}
.ws-benefits-card__icon {
  width: 48px;
  height: 48px;
  margin-bottom: 20px;
  padding: 10px;
  background: #fff;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 1px 2px rgba(15, 46, 42, 0.04);
}
.ws-benefits-card__icon img {
  width: 28px;
  height: 28px;
  object-fit: contain;
}
.ws-benefits-card h3 {
  font-size: 1.0625rem;
  font-weight: 700;
  color: var(--ws-brand-dark);
  margin-bottom: 10px;
  line-height: 1.35;
}
.ws-benefits-card p {
  font-size: 0.875rem;
  color: #5f6b68;
  line-height: 1.55;
}

/* 信任条 */
.ws-trust { padding: 32px 0; border-bottom: 1px solid var(--ws-border); text-align: center; }
.ws-trust__label { font-size: 0.875rem; color: var(--ws-muted); margin-bottom: 16px; }
.ws-trust__label strong { color: var(--ws-text); }

/* 三产品卡 */
.ws-prod-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.ws-prod-card {
  padding: 28px 24px;
  background: #fff;
  border: 1px solid var(--ws-border);
  border-radius: var(--ws-radius);
  text-align: center;
  transition: box-shadow 0.15s, border-color 0.15s;
  display: flex;
  flex-direction: column;
  height: 100%;
}
.ws-prod-card:hover { border-color: var(--ws-brand-tint); box-shadow: var(--ws-shadow-sm); }
.ws-prod-card h3 { font-size: 1.05rem; font-weight: 700; margin-bottom: 8px; }
.ws-prod-card__desc { font-size: 0.875rem; color: var(--ws-muted); line-height: 1.6; margin-bottom: 16px; flex: 1; }
.ws-prod-card__price { font-size: 2rem; font-weight: 800; color: var(--ws-text); margin-bottom: 4px; }
.ws-prod-card__price small { font-size: 0.875rem; font-weight: 500; color: var(--ws-muted); }
.ws-prod-card__meta { font-size: 0.8125rem; color: var(--ws-muted); margin-bottom: 20px; }
.ws-prod-card__foot { margin-top: auto; }
.ws-section-head { text-align: center; max-width: 720px; margin: 0 auto 36px; }
.ws-section-head .ws-section-lead { margin-left: auto; margin-right: auto; text-align: center; }

/* Hero 视频按钮 */
.ws-hero__video {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--ws-brand);
  margin-top: 12px;
  cursor: pointer;
  background: none;
  border: none;
  padding: 0;
}
.ws-hero__video:hover { color: var(--ws-brand-hover); }
.ws-hero__mock {
  background: linear-gradient(145deg, #1e293b 0%, #0f172a 100%);
  border-radius: var(--ws-radius);
  padding: 20px;
  box-shadow: var(--ws-shadow);
  min-height: 320px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.ws-hero__mock-bar { height: 10px; border-radius: 4px; background: rgba(255,255,255,0.12); }
.ws-hero__mock-bar--short { width: 40%; }
.ws-hero__mock-bar--med { width: 65%; }
.ws-hero__mock-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; flex: 1; margin-top: 8px; }
.ws-hero__mock-cell { background: rgba(20,110,245,0.25); border-radius: 8px; border: 1px solid rgba(255,255,255,0.08); min-height: 80px; }

/* Silicon Valley 背书 */
.ws-team-badge {
  text-align: center;
  padding: 40px 0;
  border-top: 1px solid var(--ws-border);
  border-bottom: 1px solid var(--ws-border);
  background: #fff;
}
.ws-team-badge p { font-size: 0.9375rem; color: var(--ws-muted); }
.ws-team-badge strong { color: var(--ws-text); font-weight: 700; }

/* 客户支持三卡 */
.ws-support-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.ws-support-card {
  padding: 28px 22px;
  background: #fff;
  border: 1px solid var(--ws-border);
  border-radius: var(--ws-radius);
  text-align: center;
}
.ws-support-card__icon { font-size: 1.75rem; margin-bottom: 14px; }
.ws-support-card h3 { font-size: 1rem; font-weight: 700; margin-bottom: 10px; }
.ws-support-card p { font-size: 0.875rem; color: var(--ws-muted); line-height: 1.6; }

/* 开发者友好：API + 集成 Tab */
.ws-dev-split { display: grid; grid-template-columns: 1fr 1.1fr; gap: 40px; align-items: start; }
.ws-dev-split__code { margin-top: 20px; }
.ws-int-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-top: 16px; }
.ws-int-chip {
  padding: 14px 12px;
  background: var(--ws-bg-alt);
  border: 1px solid var(--ws-border);
  border-radius: 10px;
  text-align: center;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #374151;
}

/* 免费代理 / 控制台三 Tab */
.ws-free-panel { margin-top: 24px; }
.ws-free-mock {
  background: var(--ws-dark);
  border-radius: var(--ws-radius);
  padding: 24px;
  color: #e2e8f0;
  min-height: 280px;
}
.ws-free-mock h4 { color: #fff; font-size: 1.1rem; margin-bottom: 12px; }
.ws-free-mock ul { margin: 16px 0; }
.ws-free-mock li { padding: 6px 0; font-size: 0.875rem; color: #94a3b8; }
.ws-free-mock li::before { content: '✓ '; color: var(--ws-success); }

/* 免费代理特性页（webshare /features/free-proxy） */
.ws-free-perks-head {
  text-align: center;
  max-width: 520px;
  margin: 0 auto 28px;
}
.ws-free-perks-head h2 {
  font-size: 1.375rem;
  font-weight: 800;
  color: var(--ws-brand-dark);
  margin-bottom: 8px;
}
.ws-free-perks-head p {
  font-size: 0.9375rem;
  color: var(--ws-muted);
  line-height: 1.55;
}
.ws-free-perks {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.ws-free-perk {
  padding: 22px 16px;
  background: #fff;
  border: 1px solid var(--ws-border);
  border-radius: var(--ws-radius);
  text-align: center;
}
.ws-free-perk__icon {
  font-size: 1.5rem;
  line-height: 1;
  margin-bottom: 12px;
}
.ws-free-perk h3 {
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--ws-brand-dark);
  margin-bottom: 8px;
}
.ws-free-perk p {
  font-size: 0.8125rem;
  color: var(--ws-muted);
  line-height: 1.55;
}
.ws-free-promo-band {
  margin: 40px 0;
  padding: 28px 24px;
  text-align: center;
  background: var(--ws-hero-shell);
  border-radius: var(--ws-radius-lg);
}
.ws-free-promo-band p {
  font-size: 0.9375rem;
  color: var(--ws-muted);
  margin-bottom: 16px;
}
.ws-free-promo-band strong {
  display: block;
  font-size: 1.125rem;
  font-weight: 800;
  color: var(--ws-brand-dark);
  margin-bottom: 6px;
}
.ws-free-spec-row {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  background: var(--ws-bg-muted);
  border-radius: var(--ws-radius);
  overflow: hidden;
  text-align: center;
}
.ws-free-spec-row__item {
  padding: 20px 14px;
  border-right: 1px solid var(--ws-border);
}
.ws-free-spec-row__item:last-child { border-right: none; }
.ws-free-spec-row__label {
  display: block;
  font-size: 0.72rem;
  color: var(--ws-muted);
  margin-bottom: 6px;
}
.ws-free-spec-row__value {
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--ws-brand-dark);
  line-height: 1.35;
}
.ws-free-list-cta {
  text-align: center;
  padding: 48px 32px;
  background: var(--ws-panel);
  border-radius: var(--ws-radius-xl);
}
.ws-free-list-cta h2 {
  font-size: 1.5rem;
  font-weight: 800;
  color: var(--ws-brand-dark);
  margin-bottom: 10px;
}
.ws-free-list-cta p {
  font-size: 0.9375rem;
  color: var(--ws-muted);
  margin-bottom: 24px;
}
.ws-free-protocol {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  max-width: 960px;
  margin: 0 auto;
}
.ws-free-protocol__card {
  padding: 28px 24px;
  background: #fff;
  border: 1px solid var(--ws-border);
  border-radius: var(--ws-radius);
}
.ws-free-protocol__card h3 {
  font-size: 1.125rem;
  font-weight: 700;
  margin-bottom: 12px;
  color: var(--ws-brand-dark);
}
.ws-free-protocol__card p {
  font-size: 0.875rem;
  color: var(--ws-muted);
  line-height: 1.65;
  margin-bottom: 16px;
}

/* Private / Dedicated 四卡 */
.ws-premium-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.ws-premium-card {
  padding: 24px;
  background: #fff;
  border: 1px solid var(--ws-border);
  border-radius: var(--ws-radius);
}
.ws-premium-card__tag { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; color: var(--ws-muted); margin-bottom: 6px; }
.ws-premium-card__type { font-size: 0.8125rem; color: var(--ws-brand); font-weight: 600; margin-bottom: 12px; }
.ws-premium-card__ips { font-size: 0.875rem; color: var(--ws-muted); margin-bottom: 8px; }
.ws-premium-card__price { font-size: 1.75rem; font-weight: 800; margin-bottom: 4px; }
.ws-premium-card__price span { font-size: 0.875rem; font-weight: 500; color: var(--ws-muted); }
.ws-premium-card__total { font-size: 0.8125rem; color: var(--ws-muted); margin-bottom: 16px; }
.ws-premium-card__group { margin-bottom: 24px; }
.ws-premium-card__group h4 { font-size: 0.9375rem; font-weight: 700; margin-bottom: 12px; padding-bottom: 8px; border-bottom: 1px solid var(--ws-border); }

/* 评价区 */
.ws-testimonials { text-align: center; }
.ws-testimonials__badge { display: inline-flex; align-items: center; gap: 8px; font-size: 0.875rem; font-weight: 600; color: var(--ws-muted); margin-bottom: 24px; }
.ws-quote-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; text-align: left; }
.ws-quote-card {
  padding: 22px;
  background: #fff;
  border: 1px solid var(--ws-border);
  border-radius: var(--ws-radius);
}
.ws-quote-card blockquote { font-size: 0.875rem; color: #374151; line-height: 1.65; font-style: italic; margin-bottom: 14px; }
.ws-quote-card strong { font-size: 0.8125rem; display: block; }
.ws-quote-card span { font-size: 0.75rem; color: var(--ws-muted); }

/* 应用场景 Tab 面板 */
.ws-use-panel { display: none; grid-template-columns: 1fr 1fr; gap: 32px; align-items: center; margin-top: 28px; }
.ws-use-panel.is-active { display: grid; }
.ws-use-panel__tags { display: flex; flex-wrap: wrap; gap: 8px; margin: 16px 0; }
.ws-use-panel__tags span {
  padding: 4px 12px;
  background: var(--ws-brand-soft);
  color: var(--ws-brand);
  border-radius: var(--ws-radius-pill);
  font-size: 0.75rem;
  font-weight: 600;
}
.ws-use-panel__visual {
  background: var(--ws-bg-alt);
  border: 1px solid var(--ws-border);
  border-radius: var(--ws-radius);
  min-height: 220px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 3rem;
}

/* 扩展下载条 */
.ws-ext-strip {
  padding: 20px 0;
  background: var(--ws-dark);
  color: #e2e8f0;
  text-align: center;
  font-size: 0.9375rem;
}
.ws-ext-strip a { color: #fff; font-weight: 600; text-decoration: underline; }

/* 弹窗 */
.ws-modal {
  position: fixed;
  inset: 0;
  z-index: 2000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: rgba(15, 23, 42, 0.65);
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s;
}
.ws-modal.is-open { opacity: 1; visibility: visible; }
.ws-modal__box {
  background: #fff;
  border-radius: var(--ws-radius);
  max-width: 720px;
  width: 100%;
  padding: 32px;
  position: relative;
}
.ws-modal__close {
  position: absolute;
  top: 12px;
  right: 16px;
  font-size: 1.5rem;
  color: var(--ws-muted);
  line-height: 1;
}
.ws-modal__box h3 { font-size: 1.25rem; font-weight: 800; margin-bottom: 12px; }
.ws-modal__box p { color: var(--ws-muted); font-size: 0.9375rem; line-height: 1.65; margin-bottom: 20px; }
.ws-modal__video {
  aspect-ratio: 16/9;
  background: var(--ws-bg-muted);
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--ws-muted);
  font-size: 0.875rem;
}

/* KPI 统计 */
.ws-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; text-align: center; }
.ws-stat strong { display: block; font-size: clamp(1.75rem, 3vw, 2.25rem); font-weight: 800; color: var(--ws-brand); margin-bottom: 6px; }
.ws-stat span { font-size: 0.875rem; color: var(--ws-muted); }

/* 地区网格 */
.ws-loc-grid,
.xlb-loc-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-top: 28px; }
.ws-loc-card,
.xlb-loc-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  padding: 18px 14px;
  background: #fff;
  border: 1px solid var(--ws-border);
  border-radius: 10px;
  text-align: center;
  transition: all 0.12s;
}
.ws-loc-card:hover,
.xlb-loc-card:hover { border-color: var(--ws-brand); box-shadow: var(--ws-shadow-sm); }
.ws-loc-card strong,
.xlb-loc-card strong { font-size: 0.9rem; font-weight: 700; }
.ws-loc-card span,
.xlb-loc-card span { font-size: 0.78rem; color: var(--ws-brand); font-weight: 600; }

/* Tab 切换 */
.ws-tabs { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 28px; }
.ws-tabs button,
.ws-pills button,
.xlb-pills button {
  padding: 8px 18px;
  border-radius: var(--ws-radius-pill);
  font-size: 0.8125rem;
  font-weight: 600;
  border: 1px solid var(--ws-border);
  background: #fff;
  color: #374151;
  transition: all 0.12s;
}
.ws-tabs button.is-active,
.ws-pills button.is-active,
.xlb-pills button.is-active { background: var(--ws-dark); color: #fff; border-color: var(--ws-dark); }
.ws-tab-panel { display: none; }
.ws-tab-panel.is-active { display: block; }
.ws-dev-split.ws-tab-panel.is-active { display: grid; }

/* 定价卡片 */
.ws-price-grid,
.xlb-price-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.ws-price-card,
.xlb-price-card {
  padding: 24px 20px;
  background: #fff;
  border: 1px solid var(--ws-border);
  border-radius: var(--ws-radius);
  text-align: center;
  position: relative;
}
.ws-price-card.is-pop,
.xlb-price-card.is-pop { border-color: var(--ws-brand); box-shadow: 0 0 0 1px rgba(20, 110, 245, 0.2); }
.ws-price-card.is-pop::before,
.xlb-price-card.is-pop::before {
  content: '热门';
  position: absolute;
  top: -10px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--ws-brand);
  color: #fff;
  font-size: 0.625rem;
  font-weight: 700;
  padding: 2px 10px;
  border-radius: var(--ws-radius-pill);
}
.ws-price-card__amt,
.xlb-price-card__price { font-size: 1.5rem; font-weight: 800; margin: 8px 0; color: var(--ws-text); }
.ws-price-card__unit { font-size: 0.8125rem; color: var(--ws-muted); }

/* FAQ 手风琴 */
.ws-faq { max-width: 820px; margin: 0 auto; }
.ws-faq__item,
.xlb-faq-item { border-bottom: 1px solid var(--ws-border); }
.ws-faq__q {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 20px 0;
  text-align: left;
  font-size: 1rem;
  font-weight: 600;
  color: var(--ws-text);
}
.ws-faq__q::after {
  content: '+';
  font-size: 1.25rem;
  font-weight: 400;
  color: var(--ws-muted);
  flex-shrink: 0;
  transition: transform 0.2s;
}
.ws-faq__item.is-open .ws-faq__q::after { transform: rotate(45deg); }
.ws-faq__a {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.25s ease;
}
.ws-faq__item.is-open .ws-faq__a { max-height: 600px; padding-bottom: 20px; }
.ws-faq__a p,
.xlb-faq-item__a p { font-size: 0.9rem; color: var(--ws-muted); line-height: 1.7; margin-bottom: 8px; }

/* 用例卡 */
.ws-use-grid,
.xlb-use-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.ws-use-card,
.xlb-use-card {
  padding: 22px 18px;
  background: #fff;
  border: 1px solid var(--ws-border);
  border-radius: var(--ws-radius);
  transition: all 0.15s;
  display: block;
}
.ws-use-card:hover,
.xlb-use-card:hover { border-color: var(--ws-brand); box-shadow: var(--ws-shadow-sm); transform: translateY(-2px); }
.ws-use-card h4,
.xlb-use-card h4 { font-size: 0.95rem; font-weight: 700; margin-bottom: 8px; }
.ws-use-card p,
.xlb-use-card p { font-size: 0.8125rem; color: var(--ws-muted); line-height: 1.55; }

/* 底部 CTA */
.ws-cta-band,
.xlb-cta-band {
  padding: 64px 0;
  text-align: center;
  background: linear-gradient(135deg, var(--ws-brand-soft), #fff);
  border-top: 1px solid var(--ws-brand-tint);
}
.ws-cta-band h2,
.xlb-cta-band h2 { font-size: clamp(1.35rem, 2.8vw, 1.75rem); font-weight: 800; margin-bottom: 20px; }

/* 子页 Hero */
.ws-page-hero,
.xlb-page-hero {
  padding: 52px 0 40px;
  background: linear-gradient(180deg, var(--ws-brand-soft), #fff);
  border-bottom: 1px solid var(--ws-border);
}
.ws-page-hero h1,
.xlb-page-hero h1 { font-size: clamp(1.65rem, 3.2vw, 2.2rem); font-weight: 800; margin-bottom: 12px; }
.ws-bc,
.xlb-bc { font-size: 0.76rem; color: #9ca3af; margin-bottom: 14px; display: flex; gap: 6px; flex-wrap: wrap; }
.ws-bc a:hover,
.xlb-bc a:hover { color: var(--ws-brand); }

/* 产品子页 Hero（webshare 产品模板） */
.ws-prod-hero {
  padding: 48px 0 56px;
  background: linear-gradient(180deg, var(--ws-brand-soft), #fff);
  border-bottom: 1px solid var(--ws-border);
}
.ws-prod-hero__grid {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 40px;
  align-items: center;
}
.ws-prod-hero__lead { font-size: 1.0625rem; color: var(--ws-muted); line-height: 1.65; margin-bottom: 16px; }
.ws-prod-hero__pills { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.ws-prod-hero__pills span {
  padding: 6px 12px;
  background: #fff;
  border: 1px solid var(--ws-border);
  border-radius: var(--ws-radius-pill);
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--ws-brand-dark);
}
.ws-prod-hero__checks { margin: 0 0 24px; }
.ws-prod-hero__checks li {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  padding: 5px 0;
  font-size: 0.9375rem;
  color: #374151;
}
.ws-prod-hero__checks li::before { content: '✓'; color: var(--ws-brand); font-weight: 700; flex-shrink: 0; }
.ws-prod-hero__cta { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.ws-prod-hero__media img { border-radius: var(--ws-radius-lg); box-shadow: var(--ws-shadow); }
/* webshare 产品 Hero 插图为 SVG，无需阴影 */
.ws-prod-hero__media img.ws-prod-hero__illustration { box-shadow: none; max-height: 480px; width: 100%; object-fit: contain; }

/* 产品页技术规格条 — 四行文字，无卡片（对标 webshare Proxy Endpoints） */
.ws-spec-bar {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 14px;
  padding-top: 24px;
  margin-top: 4px;
}
.ws-spec-bar__item {
  text-align: left;
  padding: 0;
  background: transparent;
  border: none;
  border-radius: 0;
}
.ws-spec-bar__item strong {
  display: block;
  font-size: 1.0625rem;
  font-weight: 700;
  color: var(--ws-brand-dark);
  margin-bottom: 2px;
  line-height: 1.3;
}
.ws-spec-bar__item span {
  font-size: 0.8125rem;
  color: var(--ws-muted);
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.4;
}

/* 产品页定价扩展 */
.ws-pricing-tier { margin-top: 8px; }
.ws-pricing-tier .ws-tabs { margin-bottom: 20px; }
.ws-price-card__proxies { font-size: 0.9375rem; font-weight: 700; margin-bottom: 6px; color: var(--ws-brand-dark); }
.ws-price-card__save { display: inline-block; font-size: 0.72rem; font-weight: 700; color: #047857; background: var(--ws-success-soft); padding: 2px 8px; border-radius: var(--ws-radius-pill); margin-bottom: 8px; }
.ws-price-card__per { font-size: 0.8125rem; color: var(--ws-muted); margin-bottom: 4px; }
.ws-price-card__total { font-size: 1.35rem; font-weight: 800; margin-bottom: 4px; }
.ws-price-card__was { font-size: 0.8125rem; color: var(--ws-muted); text-decoration: line-through; margin-right: 6px; }
.ws-price-card__band { font-size: 0.72rem; color: var(--ws-muted); margin-bottom: 16px; }
.ws-pricing-note { text-align: center; font-size: 0.75rem; color: var(--ws-muted); margin-top: 20px; }

/* 定价总览页（对标 webshare /pricing） */
.ws-pricing-hero {
  padding: 56px 0 24px;
  text-align: center;
}
.ws-pricing-hero h1 {
  font-size: clamp(1.75rem, 4vw, 2.5rem);
  font-weight: 800;
  color: var(--ws-brand-dark);
  margin-bottom: 12px;
}
.ws-pricing-hero .ws-section-lead { max-width: 560px; margin: 0 auto; }
.ws-pricing-hub { padding-bottom: 64px; }
.ws-pricing-hub .ws-billing-toggle--product {
  margin-bottom: 32px;
}
.ws-billing-toggle--product button {
  padding: 8px 14px;
  font-size: 0.8125rem;
  white-space: nowrap;
}
/* 定价总览：5 列单行 + 卡片等高按钮 */
.ws-pricing-hub .ws-price-grid {
  align-items: stretch;
}
.ws-pricing-hub .ws-price-grid--5 {
  grid-template-columns: repeat(5, 1fr);
}
.ws-pricing-hub .ws-price-card {
  display: flex;
  flex-direction: column;
  height: 100%;
}
.ws-pricing-hub .ws-price-card__save {
  flex-shrink: 0;
}
.ws-pricing-hub .ws-price-card__save.is-empty {
  visibility: hidden;
  margin-bottom: 8px;
}
.ws-pricing-hub .ws-price-card__total {
  min-height: 1.75rem;
}
.ws-pricing-hub .ws-price-card__band {
  flex: 1;
  margin-bottom: 0;
}
.ws-pricing-hub .ws-price-card > .ws-btn {
  margin-top: 16px;
  flex-shrink: 0;
}
.ws-billing-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0;
  background: #eef1f6;
  border-radius: var(--ws-radius-pill);
  padding: 4px;
  margin-bottom: 28px;
}
.ws-billing-toggle button {
  padding: 8px 22px;
  border-radius: var(--ws-radius-pill);
  border: none;
  background: transparent;
  font-weight: 600;
  font-size: 0.875rem;
  color: #374151;
  cursor: pointer;
  transition: background 0.12s, box-shadow 0.12s;
}
.ws-billing-toggle button.is-active {
  background: #fff;
  box-shadow: var(--ws-shadow-sm);
  color: var(--ws-brand-dark);
}
.ws-billing-toggle__save {
  font-size: 0.7rem;
  font-weight: 700;
  color: #047857;
  margin-left: 4px;
}
/* 月/年套餐面板切换 */
[data-ws-billing] [data-billing-panel] { display: none; }
[data-ws-billing] [data-billing-panel].is-active { display: block; }
.ws-pricing-foot {
  text-align: center;
  margin-top: 28px;
  font-size: 0.875rem;
  color: var(--ws-muted);
}
.ws-pricing-foot a { font-weight: 600; }

/* 定价页：端点四格 + 参数条 + 定价表 */
.ws-pricing-context { margin-bottom: 40px; }
.ws-pricing-endpoints {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-bottom: 20px;
}
.ws-pricing-endpoints__item {
  background: #fff;
  border: 1px solid var(--ws-border);
  border-radius: var(--ws-radius);
  padding: 16px 14px;
  text-align: left;
}
.ws-pricing-endpoints__check {
  display: inline-flex;
  width: 18px;
  height: 18px;
  align-items: center;
  justify-content: center;
  background: var(--ws-success-soft);
  color: #047857;
  border-radius: 50%;
  font-size: 0.65rem;
  font-weight: 700;
  margin-bottom: 10px;
}
.ws-pricing-endpoints__label {
  display: block;
  font-size: 0.72rem;
  color: var(--ws-muted);
  margin-bottom: 4px;
}
.ws-pricing-endpoints__item strong {
  display: block;
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--ws-brand-dark);
  line-height: 1.3;
}
.ws-pricing-context .ws-loc-panel { margin-top: 0; }
.ws-pricing-context .ws-loc-panel .ws-section-title { margin-bottom: 24px; }
.ws-pricing-meta {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: stretch;
  gap: 0;
  background: var(--ws-bg-muted);
  border-radius: var(--ws-radius);
  padding: 14px 20px;
  margin-bottom: 8px;
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
}
.ws-pricing-meta__item {
  flex: 1;
  min-width: 120px;
  text-align: center;
  padding: 0 16px;
  border-right: 1px solid var(--ws-border);
}
.ws-pricing-meta__item:last-child { border-right: none; }
.ws-pricing-meta__item span {
  display: block;
  font-size: 0.72rem;
  color: var(--ws-muted);
  margin-bottom: 4px;
}
.ws-pricing-meta__item strong {
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--ws-brand-dark);
}
.ws-price-table-wrap {
  overflow-x: auto;
  margin-top: 32px;
  border: 1px solid var(--ws-border);
  border-radius: var(--ws-radius);
  background: #fff;
}
.ws-price-table {
  width: 100%;
  min-width: 640px;
  border-collapse: collapse;
  font-size: 0.875rem;
}
.ws-price-table th {
  text-align: left;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--ws-muted);
  padding: 14px 16px;
  border-bottom: 1px solid var(--ws-border);
  background: #fafbfc;
}
.ws-price-table td {
  padding: 14px 16px;
  border-bottom: 1px solid var(--ws-border);
  vertical-align: middle;
}
.ws-price-table tbody tr:last-child td { border-bottom: none; }
.ws-price-table tr.is-pop { background: #f5f3ff; }
.ws-price-table td s { color: var(--ws-muted); margin-right: 6px; }
.ws-price-table__tag {
  display: block;
  font-size: 0.6rem;
  font-weight: 700;
  color: #fff;
  background: var(--ws-brand);
  padding: 2px 8px;
  border-radius: var(--ws-radius-pill);
  margin-bottom: 4px;
  width: fit-content;
}
.ws-price-table .ws-price-card__save { margin-bottom: 0; }

/* 产品 upsell 四卡 */
.ws-upsell-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.ws-upsell-card {
  padding: 20px 18px;
  background: #fff;
  border: 1px solid var(--ws-border);
  border-radius: var(--ws-radius);
  display: flex;
  flex-direction: column;
}
.ws-upsell-card h4 { font-size: 0.9375rem; font-weight: 700; margin-bottom: 8px; }
.ws-upsell-card p { font-size: 0.8125rem; color: var(--ws-muted); line-height: 1.55; margin-bottom: 12px; flex: 1; }
.ws-upsell-card__from { font-size: 0.75rem; color: var(--ws-muted); }
.ws-upsell-card__price { font-size: 1.2rem; font-weight: 800; color: var(--ws-brand); margin: 4px 0 14px; }
.ws-upsell-card__price small { font-size: 0.75rem; font-weight: 500; color: var(--ws-muted); }

/* 双产品对比 */
.ws-compare-bar { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; max-width: 760px; margin: 0 auto; }
.ws-compare-bar__card {
  padding: 28px 22px;
  border: 1px solid var(--ws-border);
  border-radius: var(--ws-radius);
  text-align: center;
  background: #fff;
}
.ws-compare-bar__card.is-current { border-color: var(--ws-brand); background: var(--ws-brand-soft); box-shadow: 0 0 0 1px rgba(0, 177, 154, 0.15); }
.ws-compare-bar__card h4 { font-size: 1rem; font-weight: 700; margin-bottom: 8px; }
.ws-compare-bar__card .ws-price-card__amt { font-size: 1.75rem; }
.ws-compare-bar__meta { font-size: 0.8125rem; color: var(--ws-muted); margin: 12px 0 16px; line-height: 1.6; }

/* 产品对比页（webshare /product-comparison） */
.ws-compare-page { padding-bottom: 64px; }
.ws-compare-cols {
  display: grid;
  grid-template-columns: minmax(140px, 22%) repeat(3, 1fr);
  border: 1px solid var(--ws-border);
  border-radius: var(--ws-radius-lg) var(--ws-radius-lg) 0 0;
  overflow: hidden;
  background: #fff;
}
.ws-compare-cols__label {
  padding: 24px 16px;
  background: var(--ws-bg-muted);
}
.ws-compare-cols__col {
  padding: 24px 16px;
  text-align: center;
  border-left: 1px solid var(--ws-border);
}
.ws-compare-cols__col h3 {
  font-size: 1rem;
  font-weight: 700;
  color: var(--ws-brand-dark);
  margin-bottom: 10px;
}
.ws-compare-cols__from {
  font-size: 0.72rem;
  color: var(--ws-muted);
  margin-bottom: 4px;
}
.ws-compare-cols__price {
  font-size: 1.625rem;
  font-weight: 800;
  color: var(--ws-brand-dark);
  line-height: 1.2;
  margin-bottom: 14px;
}
.ws-compare-cols__price small {
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--ws-muted);
}
.ws-compare-cols__actions {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: center;
}
.ws-compare-matrix-wrap {
  border: 1px solid var(--ws-border);
  border-top: none;
  border-radius: 0 0 var(--ws-radius-lg) var(--ws-radius-lg);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  background: #fff;
}
.ws-compare-matrix {
  width: 100%;
  min-width: 720px;
  border-collapse: collapse;
}
.ws-compare-matrix th,
.ws-compare-matrix td {
  padding: 14px 16px;
  border-bottom: 1px solid var(--ws-border);
  vertical-align: top;
  font-size: 0.875rem;
  line-height: 1.6;
}
.ws-compare-matrix th {
  text-align: left;
  font-weight: 600;
  color: var(--ws-brand-dark);
  width: 22%;
  background: var(--ws-bg-muted);
}
.ws-compare-matrix td {
  width: 26%;
  color: var(--ws-muted);
}
.ws-compare-matrix tbody tr:last-child th,
.ws-compare-matrix tbody tr:last-child td { border-bottom: none; }
.ws-compare-matrix tr.ws-compare-matrix__section th {
  background: var(--ws-panel);
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--ws-muted);
}
.ws-compare-matrix tr.ws-compare-matrix__section td {
  background: var(--ws-panel);
}
.ws-compare-tier {
  display: block;
  margin-bottom: 8px;
}
.ws-compare-tier:last-child { margin-bottom: 0; }
.ws-compare-tier strong { color: var(--ws-brand-dark); font-weight: 600; }
.ws-compare-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.ws-compare-tags span {
  font-size: 0.75rem;
  padding: 4px 10px;
  background: var(--ws-bg-muted);
  border-radius: 999px;
  color: var(--ws-brand-dark);
}
.ws-compare-checklist {
  list-style: none;
  margin: 0;
  padding: 0;
}
.ws-compare-checklist li {
  padding: 3px 0;
  padding-left: 1.25em;
  position: relative;
}
.ws-compare-checklist li::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: var(--ws-success);
  font-weight: 700;
}
.ws-compare-access {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.ws-compare-access span {
  font-size: 0.75rem;
  font-weight: 600;
  padding: 4px 10px;
  border: 1px solid var(--ws-border);
  border-radius: var(--ws-radius-sm);
  color: var(--ws-brand-dark);
}
.ws-compare-mobile { display: none; }
.ws-compare-mobile__panel {
  display: none;
  padding: 24px;
  background: #fff;
  border: 1px solid var(--ws-border);
  border-radius: var(--ws-radius-lg);
  margin-top: 16px;
}
.ws-compare-mobile__panel.is-active { display: block; }
.ws-compare-mobile__head {
  text-align: center;
  margin-bottom: 20px;
  padding-bottom: 20px;
  border-bottom: 1px solid var(--ws-border);
}
.ws-compare-mobile__row {
  padding: 14px 0;
  border-bottom: 1px solid var(--ws-border);
}
.ws-compare-mobile__row:last-child { border-bottom: none; }
.ws-compare-mobile__row h4 {
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ws-muted);
  margin-bottom: 6px;
}
.ws-compare-bottom {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 48px;
}
.ws-compare-bottom__card {
  padding: 24px 20px;
  text-align: center;
  background: #fff;
  border: 1px solid var(--ws-border);
  border-radius: var(--ws-radius-lg);
}
.ws-compare-bottom__card h3 {
  font-size: 1rem;
  font-weight: 700;
  margin-bottom: 10px;
  color: var(--ws-brand-dark);
}

/* 扩展推广块 */
.ws-ext-promo {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 24px;
  align-items: center;
  padding: 28px 32px;
  background: var(--ws-bg-alt);
  border-radius: var(--ws-radius-lg);
  border: 1px solid var(--ws-border);
}
.ws-ext-promo h3 { font-size: 1.15rem; font-weight: 700; margin-bottom: 8px; }
.ws-ext-promo p { font-size: 0.875rem; color: var(--ws-muted); line-height: 1.6; }
.ws-ext-promo ul { margin-top: 12px; }
.ws-ext-promo li { font-size: 0.8125rem; color: #374151; padding: 4px 0; }
.ws-ext-promo li::before { content: '✓ '; color: var(--ws-brand); font-weight: 700; }

/* 用例三卡（产品页） */
.ws-use-case-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.ws-use-case-card {
  padding: 24px 20px;
  background: #fff;
  border: 1px solid var(--ws-border);
  border-radius: var(--ws-radius);
  transition: box-shadow 0.15s, border-color 0.15s;
}
.ws-use-case-card:hover { border-color: var(--ws-brand-tint); box-shadow: var(--ws-shadow-sm); }
.ws-use-case-card__tag { font-size: 0.65rem; font-weight: 700; text-transform: uppercase; color: var(--ws-brand); margin-bottom: 8px; }
.ws-use-case-card h3 { font-size: 1rem; font-weight: 700; margin-bottom: 8px; }
.ws-use-case-card p { font-size: 0.875rem; color: var(--ws-muted); line-height: 1.6; }

/* 双卡用例：居中横排，尺寸约为默认单卡的 2 倍 */
.ws-use-case-grid--duo {
  grid-template-columns: repeat(2, 1fr);
  max-width: 960px;
  margin-left: auto;
  margin-right: auto;
  gap: 40px;
}
.ws-use-case-grid--duo .ws-use-case-card {
  padding: 48px 40px;
}
.ws-use-case-grid--duo .ws-use-case-card__tag {
  font-size: 0.8125rem;
  margin-bottom: 16px;
}
.ws-use-case-grid--duo .ws-use-case-card h3 {
  font-size: 1.5rem;
  margin-bottom: 16px;
}
.ws-use-case-grid--duo .ws-use-case-card p {
  font-size: 1rem;
  line-height: 1.65;
  margin-bottom: 20px;
}

/* Footer — webshare 深色多列 */
.ws-footer {
  background: var(--ws-dark);
  color: #94a3b8;
  font-size: 0.8125rem;
}
.ws-footer__cta {
  padding: 40px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  text-align: center;
  background: var(--ws-dark-2);
}
.ws-footer__cta h3 { color: #fff; font-size: 1.1rem; margin-bottom: 16px; }
.ws-footer__cta p { color: #94a3b8; margin-bottom: 16px; }
.ws-footer__grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 24px;
  padding: 40px 0;
}
.ws-footer__col h5 {
  font-size: 0.72rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: #e2e8f0;
  margin-bottom: 14px;
}
.ws-footer__col li { margin-bottom: 8px; }
.ws-footer__col a { color: #94a3b8; transition: color 0.12s; font-size: 0.8rem; }
.ws-footer__col a:hover { color: var(--ws-brand-tint); }
.ws-footer__bottom {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 24px 0 36px;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  font-size: 0.76rem;
}
.ws-footer__legal a { color: #94a3b8; margin-right: 16px; }
.ws-footer__legal a:hover { color: #fff; }
.ws-footer__bar {
  padding: 20px 0;
  background: #0b1220;
  text-align: center;
  font-size: 0.8125rem;
  color: #64748b;
}
.ws-footer__bar a { color: #e2e8f0; font-weight: 600; }

/* 代码块 */
.ws-code-block,
.xlb-code-block {
  background: #1e293b;
  border-radius: 10px;
  position: relative;
  overflow: hidden;
}
.ws-code-block pre,
.xlb-code-block pre {
  font-family: 'JetBrains Mono', Consolas, monospace;
  font-size: 0.76rem;
  color: #e2e8f0;
  padding: 20px;
  line-height: 1.65;
  white-space: pre-wrap;
  overflow-x: auto;
}

/* 轮播 */
.ws-carousel { position: relative; }
.ws-carousel__track {
  display: flex;
  gap: 16px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
.ws-carousel__track::-webkit-scrollbar { display: none; }
.ws-carousel__nav {
  display: flex;
  justify-content: center;
  gap: 12px;
  margin-top: 20px;
}
.ws-carousel__nav button {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 1px solid var(--ws-border);
  background: #fff;
  font-size: 1.1rem;
  transition: all 0.12s;
}
.ws-carousel__nav button:hover { border-color: var(--ws-brand); color: var(--ws-brand); }

/* ===== xlb 兼容层（存量页面过渡期，批次 B 后逐页迁移） ===== */
.xlb-topbar { background: var(--ws-promo); color: #cbd5e1; font-size: 0.78rem; padding: 8px 0; }
.xlb-topbar__inner { display: flex; align-items: center; justify-content: center; gap: 20px; flex-wrap: wrap; }
.xlb-topbar a { color: #fff; opacity: 0.85; }
.xlb-topbar a:hover { opacity: 1; color: var(--ws-brand-tint); }
.xlb-header { position: sticky; top: 0; z-index: 1000; background: #fff; border-bottom: 1px solid var(--ws-border); }
.xlb-header.is-scrolled { box-shadow: var(--ws-shadow-sm); }
.xlb-header__inner { display: flex; align-items: center; justify-content: space-between; height: var(--ws-header-h); gap: 12px; }
.xlb-logo { display: flex; align-items: center; gap: 8px; font-weight: 800; font-size: 1.05rem; }
.xlb-nav { display: flex; align-items: center; }
.xlb-nav > li { position: relative; }
.xlb-nav > li > button { display: flex; align-items: center; gap: 4px; padding: 10px 14px; font-size: 0.86rem; font-weight: 500; border-radius: 8px; }
.xlb-nav > li > button:hover,
.xlb-nav > li.is-open > button { background: var(--ws-bg-alt); }
.xlb-mega {
  position: absolute; top: calc(100% + 4px); left: 50%;
  transform: translateX(-50%) translateY(8px);
  min-width: 320px; background: #fff; border: 1px solid var(--ws-border);
  border-radius: var(--ws-radius); padding: 16px; opacity: 0; visibility: hidden;
  pointer-events: none; transition: opacity 0.18s, transform 0.18s; box-shadow: var(--ws-shadow); z-index: 1100;
}
.xlb-nav > li.is-open .xlb-mega { opacity: 1; visibility: visible; pointer-events: auto; transform: translateX(-50%) translateY(0); }
.xlb-mega--wide { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px 16px; min-width: 720px; padding: 20px; }
.xlb-mega--proxy { grid-template-columns: repeat(3, 1fr); }
.xlb-mega--res { grid-template-columns: repeat(3, 1fr); min-width: 780px; }
.xlb-mega--pricing { min-width: 640px; max-width: 780px; padding: 14px 16px; }
.xlb-mega a { display: flex; gap: 12px; padding: 8px 10px; border-radius: 10px; }
.xlb-mega a:hover { background: var(--ws-bg-alt); }
.xlb-mega strong { display: block; font-size: 0.82rem; font-weight: 600; }
.xlb-mega span { font-size: 0.74rem; color: var(--ws-muted); display: block; }
.xlb-hero--cn { padding: 56px 0 48px; background: linear-gradient(180deg, var(--ws-brand-soft), #fff); }
.xlb-hero__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; }
.xlb-hero--cn h1 { font-size: clamp(1.75rem, 3.6vw, 2.35rem); font-weight: 800; line-height: 1.25; margin-bottom: 18px; }
.xlb-hero__lead { font-size: 1.02rem; color: var(--ws-muted); max-width: 520px; margin: 0 0 28px; }
.xlb-prod-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.xlb-prod-card { padding: 0 0 24px; background: #fff; border: 1px solid var(--ws-border); border-radius: var(--ws-radius); }
.xlb-footer { background: var(--ws-dark); color: #94a3b8; }
.xlb-footer__grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 24px; padding: 36px 0; }
.xlb-footer__col h5 { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; color: #e2e8f0; margin-bottom: 14px; }
.xlb-footer__col a { color: #94a3b8; font-size: 0.8rem; }
.xlb-footer__col a:hover { color: var(--ws-brand-tint); }
.xlb-footer__bottom { display: flex; flex-wrap: wrap; justify-content: space-between; padding: 24px 0 36px; border-top: 1px solid rgba(255,255,255,0.06); }
.xlb-toggle { display: none; flex-direction: column; gap: 5px; padding: 8px; }
.xlb-toggle span { width: 22px; height: 2px; background: var(--ws-text); border-radius: 2px; }

/* P1-c：博客 / 联系 / 关于 子页（对标 webshare 资源与公司页） */
.ws-blog-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
/* 列表仅一篇时居中展示 */
.ws-blog-grid--single {
  grid-template-columns: minmax(0, 400px);
  justify-content: center;
}
.ws-blog-card {
  display: flex;
  flex-direction: column;
  padding: 24px;
  background: #fff;
  border: 1px solid var(--ws-border);
  border-radius: var(--ws-radius);
  transition: border-color 0.15s, box-shadow 0.15s, transform 0.15s;
  height: 100%;
}
.ws-blog-card:hover {
  border-color: var(--ws-brand-tint);
  box-shadow: var(--ws-shadow-sm);
  transform: translateY(-2px);
}
.ws-blog-card__cat {
  display: inline-block;
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ws-brand);
  margin-bottom: 12px;
}
.ws-blog-card h3 {
  font-size: 1.0625rem;
  font-weight: 700;
  line-height: 1.45;
  margin-bottom: 10px;
  color: var(--ws-brand-dark);
}
.ws-blog-card h3 a { color: inherit; }
.ws-blog-card h3 a:hover { color: var(--ws-brand); }
.ws-blog-card__excerpt {
  font-size: 0.875rem;
  color: var(--ws-muted);
  line-height: 1.6;
  flex: 1;
  margin-bottom: 16px;
}
.ws-blog-card__meta {
  font-size: 0.75rem;
  color: #9ca3af;
  margin-top: auto;
}
.ws-blog-cats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  margin-bottom: 36px;
}
.ws-blog-cats button {
  padding: 8px 16px;
  border-radius: var(--ws-radius-pill);
  border: 1px solid var(--ws-border);
  background: #fff;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #374151;
  cursor: default;
}
.ws-blog-cats button.is-active {
  background: var(--ws-brand-dark);
  border-color: var(--ws-brand-dark);
  color: #fff;
}
/* 博客详情页：Hero + 正文排版 */
.ws-blog-hero {
  padding: 48px 0 32px;
  background: linear-gradient(180deg, var(--ws-brand-soft), #fff);
  border-bottom: 1px solid var(--ws-border);
}
.ws-blog-hero .ws-wrap { max-width: 760px; }
.ws-blog-hero h1 {
  font-size: clamp(1.65rem, 3.2vw, 2.1rem);
  font-weight: 800;
  line-height: 1.35;
  margin-bottom: 16px;
  color: var(--ws-brand-dark);
}
.ws-blog-hero__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  font-size: 0.8125rem;
  color: var(--ws-muted);
}
.ws-blog-hero__cat {
  font-weight: 700;
  color: var(--ws-brand);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-size: 0.68rem;
}
.ws-blog-article {
  max-width: 760px;
  margin: 0 auto;
  font-size: 1rem;
  line-height: 1.75;
  color: #374151;
}
.ws-blog-article h3 {
  font-size: 1.125rem;
  font-weight: 700;
  margin: 32px 0 12px;
  color: var(--ws-brand-dark);
}
.ws-blog-article p { margin-bottom: 16px; }
.ws-blog-article ul,
.ws-blog-article ol { margin: 0 0 16px 1.25rem; }
.ws-blog-article li { margin-bottom: 8px; }
.ws-blog-article strong { font-weight: 600; color: var(--ws-brand-dark); }
.ws-blog-article pre,
.ws-blog-article code { font-family: 'JetBrains Mono', Consolas, monospace; }
.ws-blog-article code {
  background: var(--ws-bg-alt);
  padding: 2px 6px;
  border-radius: 4px;
  font-size: 0.875em;
}
.ws-blog-article pre {
  background: #1e293b;
  color: #e2e8f0;
  padding: 16px 20px;
  border-radius: 10px;
  overflow-x: auto;
  margin: 16px 0 20px;
  line-height: 1.6;
  font-size: 0.8125rem;
}
.ws-blog-article pre code { background: transparent; padding: 0; color: inherit; }
.ws-blog-article a { color: var(--ws-brand); font-weight: 600; }
.ws-blog-article a:hover { text-decoration: underline; }
/* 首页博客区块：查看全部按钮 */
.ws-blog-more { text-align: center; margin-top: 36px; }
.ws-home-blog .ws-section-lead { text-align: center; margin-left: auto; margin-right: auto; }
.ws-contact-layout {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 48px;
  align-items: start;
}
.ws-contact-form {
  padding: 32px;
  background: #fff;
  border: 1px solid var(--ws-border);
  border-radius: var(--ws-radius-lg);
  box-shadow: var(--ws-shadow-sm);
}
.ws-contact-form h2 {
  font-size: 1.25rem;
  font-weight: 800;
  margin-bottom: 8px;
}
.ws-contact-form > p {
  font-size: 0.875rem;
  color: var(--ws-muted);
  margin-bottom: 24px;
  line-height: 1.6;
}
.ws-form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}
.ws-form-field { margin-bottom: 16px; }
.ws-form-field label {
  display: block;
  font-size: 0.8125rem;
  font-weight: 600;
  margin-bottom: 6px;
  color: var(--ws-brand-dark);
}
.ws-form-field label span { color: #dc2626; }
.ws-form-field input,
.ws-form-field select,
.ws-form-field textarea {
  width: 100%;
  padding: 10px 14px;
  border: 1px solid var(--ws-border);
  border-radius: 8px;
  font-size: 0.875rem;
  font-family: inherit;
  transition: border-color 0.12s, box-shadow 0.12s;
}
.ws-form-field input:focus,
.ws-form-field select:focus,
.ws-form-field textarea:focus {
  outline: none;
  border-color: var(--ws-brand);
  box-shadow: 0 0 0 3px var(--ws-brand-soft);
}
.ws-form-field textarea { min-height: 120px; resize: vertical; }
.ws-form-note {
  font-size: 0.75rem;
  color: var(--ws-muted);
  margin-top: 12px;
  line-height: 1.55;
}
.ws-form-note a { color: var(--ws-brand); font-weight: 600; }
.ws-contact-aside { display: flex; flex-direction: column; gap: 16px; }
.ws-contact-card {
  padding: 24px;
  background: var(--ws-bg-alt);
  border: 1px solid var(--ws-border);
  border-radius: var(--ws-radius);
}
.ws-contact-card h3 {
  font-size: 0.9375rem;
  font-weight: 700;
  margin-bottom: 12px;
}
.ws-contact-card p,
.ws-contact-card li {
  font-size: 0.875rem;
  color: var(--ws-muted);
  line-height: 1.65;
}
.ws-contact-card ul { margin-top: 8px; }
.ws-contact-card li { margin-bottom: 6px; }
.ws-contact-card a { color: var(--ws-brand-dark); font-weight: 600; }
.ws-contact-card a:hover { color: var(--ws-brand); }
/* 关于页：双栏特性块 */
.ws-about-split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
.ws-about-split__card {
  padding: 28px 24px;
  background: #fff;
  border: 1px solid var(--ws-border);
  border-radius: var(--ws-radius);
}
.ws-about-split__card h3 {
  font-size: 1.0625rem;
  font-weight: 700;
  margin-bottom: 10px;
}
.ws-about-split__card p {
  font-size: 0.875rem;
  color: var(--ws-muted);
  line-height: 1.65;
}
.ws-about-intro {
  max-width: 760px;
  margin: 0 auto;
  text-align: center;
}
.ws-about-intro p {
  font-size: 1.0625rem;
  color: var(--ws-muted);
  line-height: 1.7;
}

/* P1-b：应用场景索引与详情页 */
.ws-uc-index-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.ws-uc-card {
  display: flex;
  flex-direction: column;
  padding: 24px;
  background: #fff;
  border: 1px solid var(--ws-border);
  border-radius: var(--ws-radius);
  transition: border-color 0.15s, box-shadow 0.15s, transform 0.15s;
  height: 100%;
}
.ws-uc-card:hover {
  border-color: var(--ws-brand-tint);
  box-shadow: var(--ws-shadow-sm);
  transform: translateY(-2px);
}
.ws-uc-card__cat {
  display: inline-block;
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--ws-brand);
  margin-bottom: 10px;
}
.ws-uc-card h3 {
  font-size: 1.0625rem;
  font-weight: 700;
  margin-bottom: 8px;
  line-height: 1.4;
}
.ws-uc-card h3 a { color: inherit; }
.ws-uc-card h3 a:hover { color: var(--ws-brand); }
.ws-uc-card p {
  font-size: 0.875rem;
  color: var(--ws-muted);
  line-height: 1.6;
  flex: 1;
  margin-bottom: 14px;
}
.ws-uc-card .ws-link { font-size: 0.8125rem; font-weight: 600; margin-top: auto; }
/* 集成页：工具卡片图标 */
.ws-integ-card__icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: var(--ws-brand-soft);
  border: 1px solid var(--ws-brand-tint);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.15rem;
  margin-bottom: 12px;
}
.ws-uc-cats {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  margin-bottom: 36px;
}
.ws-uc-cats button {
  padding: 8px 16px;
  border-radius: var(--ws-radius-pill);
  border: 1px solid var(--ws-border);
  background: #fff;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #374151;
  cursor: default;
}
.ws-uc-cats button.is-active {
  background: var(--ws-brand-dark);
  border-color: var(--ws-brand-dark);
  color: #fff;
}
/* 应用场景详情：用途六格 */
.ws-uc-benefits { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.ws-uc-benefit {
  padding: 22px 20px;
  background: #fff;
  border: 1px solid var(--ws-border);
  border-radius: var(--ws-radius);
}
.ws-uc-benefit h4 { font-size: 0.9375rem; font-weight: 700; margin-bottom: 8px; }
.ws-uc-benefit p { font-size: 0.8125rem; color: var(--ws-muted); line-height: 1.6; }
.ws-sol-card__badge {
  display: inline-block;
  font-size: 0.68rem;
  font-weight: 700;
  color: #047857;
  background: var(--ws-success-soft);
  padding: 2px 8px;
  border-radius: var(--ws-radius-pill);
  margin-bottom: 8px;
}

/* ===== 响应式 ===== */
@media (max-width: 1024px) {
  .ws-bento { grid-template-columns: repeat(2, 1fr); }
  .ws-bento-card { padding: 16px 18px; gap: 14px; min-height: 88px; }
  .ws-bento-card__art { width: 88px; }
  .ws-sol-grid { grid-template-columns: 1fr; }
  .ws-home-hero__shell { padding: 40px 24px 24px; }
  .ws-hero__grid,
  .ws-feat-grid,
  .ws-prod-grid,
  .ws-stats { grid-template-columns: 1fr; }
  .ws-benefits-grid { grid-template-columns: repeat(2, 1fr); }
  .ws-support-grid,
  .ws-quote-grid,
  .ws-premium-grid,
  .ws-dev-split,
  .ws-use-panel { grid-template-columns: 1fr; }
  .ws-prod-hero__grid { grid-template-columns: 1fr; }
  .ws-upsell-grid { grid-template-columns: repeat(2, 1fr); }
  .ws-use-case-grid { grid-template-columns: 1fr; }
  .ws-ext-promo { grid-template-columns: 1fr; }
  .ws-int-grid { grid-template-columns: repeat(2, 1fr); }
  .ws-loc-grid,
  .xlb-loc-grid { grid-template-columns: repeat(3, 1fr); }
  .ws-price-grid,
  .xlb-price-row { grid-template-columns: repeat(2, 1fr); }
  .ws-pricing-hub .ws-price-grid--5 { grid-template-columns: repeat(3, 1fr); }
  .ws-billing-toggle--product { flex-wrap: wrap; justify-content: center; }
  .ws-pricing-endpoints { grid-template-columns: repeat(2, 1fr); }
  .ws-compare-cols--head,
  .ws-compare-matrix-wrap { display: none; }
  .ws-compare-mobile { display: block; }
  .ws-compare-bottom { grid-template-columns: 1fr; }
  .ws-footer__grid { grid-template-columns: repeat(3, 1fr); }
  .ws-blog-grid { grid-template-columns: repeat(2, 1fr); }
  .ws-blog-grid.ws-blog-grid--single { grid-template-columns: minmax(0, 400px); justify-content: center; }
  .ws-uc-index-grid { grid-template-columns: repeat(2, 1fr); }
  .ws-uc-benefits { grid-template-columns: repeat(2, 1fr); }
  .ws-contact-layout { grid-template-columns: 1fr; }
  .ws-about-split { grid-template-columns: 1fr; }
  .ws-mega--wide,
  .ws-mega--product { grid-template-columns: 1fr; min-width: 90vw; }
  .ws-mega-product-col { gap: 0; }
  .xlb-hero__grid,
  .xlb-prod-row { grid-template-columns: 1fr; }
  .xlb-mega--wide,
  .xlb-mega--proxy,
  .xlb-mega--res { grid-template-columns: 1fr; min-width: 90vw; }
  .xlb-footer__grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 768px) {
  .ws-nav,
  .xlb-nav {
    position: fixed;
    inset: calc(var(--ws-promo-h) + var(--ws-header-h)) 0 0 0;
    background: #fff;
    flex-direction: column;
    padding: 16px;
    transform: translateX(100%);
    transition: transform 0.25s;
    overflow-y: auto;
    align-items: stretch;
    z-index: 999;
  }
  body.ws-body--has-promo .ws-nav { inset: calc(var(--ws-header-h) + var(--ws-promo-h)) 0 0 0; }
  .ws-nav.is-open,
  .xlb-nav.open { transform: translateX(0); }
  .ws-nav > li > .ws-nav__trigger,
  .xlb-nav > li > button { width: 100%; justify-content: space-between; }
  .ws-mega,
  .xlb-mega {
    position: static;
    transform: none;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    display: none;
    box-shadow: none;
    border: none;
    padding: 8px 0 8px 12px;
    min-width: 100%;
  }
  .ws-nav > li.is-open .ws-mega,
  .xlb-nav > li.is-open .xlb-mega { display: block; }
  .ws-toggle,
  .xlb-toggle { display: flex; }
  .ws-nav__mobile-foot {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 16px;
    padding-top: 16px;
    border-top: 1px solid var(--ws-border);
  }
  .ws-feat-grid,
  .ws-benefits-grid,
  .ws-prod-grid,
  .ws-use-case-grid,
  .ws-upsell-grid,
  .ws-blog-grid,
  .ws-uc-index-grid,
  .ws-uc-benefits,
  .ws-compare-bar,
  .ws-compare-bottom,
  .ws-use-grid,
  .xlb-use-grid,
  .ws-loc-grid,
  .xlb-loc-grid { grid-template-columns: 1fr; }
  .ws-blog-grid.ws-blog-grid--single { max-width: 400px; margin-left: auto; margin-right: auto; }
  .ws-ext-promo { grid-template-columns: 1fr; }
  .ws-footer__grid,
  .xlb-footer__grid { grid-template-columns: 1fr 1fr; }
  .ws-price-grid,
  .xlb-price-row { grid-template-columns: 1fr; }
  .ws-pricing-hub .ws-price-grid--5 { grid-template-columns: 1fr; }
  .ws-pricing-endpoints { grid-template-columns: 1fr; }
  .ws-free-perks { grid-template-columns: 1fr; }
  .ws-free-spec-row { grid-template-columns: 1fr; }
  .ws-free-spec-row__item { border-right: none; border-bottom: 1px solid var(--ws-border); }
  .ws-free-spec-row__item:last-child { border-bottom: none; }
  .ws-free-perks { grid-template-columns: repeat(2, 1fr); }
  .ws-form-row { grid-template-columns: 1fr; }
  .ws-free-spec-row { grid-template-columns: repeat(2, 1fr); }
  .ws-free-spec-row__item:nth-child(2) { border-right: none; }
  .ws-free-protocol { grid-template-columns: 1fr; }
  .ws-bento { grid-template-columns: 1fr; }
  .ws-home-trust__row { flex-direction: column; align-items: flex-start; }
  .ws-header__login { display: none; }
  .ws-loc-panel { padding: 32px 20px; }
}
@media (prefers-reduced-motion: reduce) {
  .ws-home-trust__track { animation-duration: 55s; }
  .ws-reveal { opacity: 1; transform: none; transition: none; }
}
