/* =========================================================
   VantoShops Full Site Rebuild v3
   目标：全站标题更稳重加粗、字号整体小一号、中文字体优化、页面更精致。
   说明：此文件在 Tailwind 构建 CSS 之后加载，用于静态部署版统一覆盖全站视觉。
========================================================= */
:root{
  --vs-blue:#006cff;
  --vs-blue-dark:#0047c9;
  --vs-navy:#050b1f;
  --vs-text:#0f172a;
  --vs-muted:#5f6f86;
  --vs-border:#e4ebf5;
  --vs-bg:#f7faff;
  --vs-font:"PingFang SC","Microsoft YaHei","Noto Sans SC","Source Han Sans SC","Hiragino Sans GB","Heiti SC",Arial,sans-serif;
}
html,body{font-family:var(--vs-font)!important;color:var(--vs-text);text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
body{background:#fff!important;}

/* Header rebuilt: 更轻、更接近专业 SaaS 官网 */
.vp-topbar{height:32px!important;background:linear-gradient(90deg,#0a55d8 0%,#1740ae 46%,#08185f 100%)!important;}
.vp-topbar-inner{height:32px!important;font-size:12px!important;font-weight:700!important;letter-spacing:.015em!important;}
.vp-header{height:73px!important;background:rgba(255,255,255,.975)!important;border-bottom:1px solid rgba(226,232,240,.92)!important;}
.vp-header-inner{height:73px!important;}
.vp-logo{height:25px!important;}
.vp-nav,.vp-nav-item,.vp-nav-link{height:73px!important;}
.vp-nav-link{font-size:14px!important;font-weight:800!important;letter-spacing:.005em!important;color:#172033!important;cursor:pointer!important;padding-left:15px!important;padding-right:15px!important;}
.vp-login{font-size:13px!important;font-weight:800!important;}
.vp-primary{height:38px!important;padding:0 20px!important;font-size:13px!important;font-weight:800!important;}
.vp-mega-panel{top:73px!important;border-top:0!important;box-shadow:0 24px 60px rgba(15,23,42,.12)!important;}
.vp-mega-panel::before{top:-8px!important;height:8px!important;}
.vp-mega-inner{max-width:1660px!important;min-height:236px!important;padding-top:22px!important;padding-bottom:24px!important;grid-template-columns:430px 1fr!important;gap:48px!important;}
.vp-mega-kicker{font-size:18px!important;font-weight:800!important;}
.vp-mega-desc{font-size:13px!important;line-height:1.75!important;}
.vp-mega-card{padding:16px!important;border-radius:8px!important;}
.vp-mega-card strong{font-size:14px!important;font-weight:800!important;}
.vp-mega-card span{font-size:12.5px!important;}
.vp-menu-col-title{font-size:14px!important;font-weight:800!important;}
.vp-menu-link b{font-size:14px!important;font-weight:800!important;}
.vp-menu-link span{font-size:12.5px!important;line-height:1.55!important;}

/* 全站标题：全部加粗，字号小一号，行距更适合中文 */
main h1,
main .hero-title{
  font-size:clamp(31px,3.15vw,44px)!important;
  line-height:1.16!important;
  letter-spacing:-.045em!important;
  font-weight:800!important;
  color:#071022!important;
}
main h2,
main .section-title{
  font-size:clamp(25px,2.25vw,32px)!important;
  line-height:1.22!important;
  letter-spacing:-.038em!important;
  font-weight:800!important;
  color:#071022!important;
}
main h3{
  font-size:17px!important;
  line-height:1.45!important;
  font-weight:800!important;
  letter-spacing:-.018em!important;
  color:#101827!important;
}
main h4{
  font-size:15.5px!important;
  line-height:1.45!important;
  font-weight:800!important;
  color:#101827!important;
}
main p{letter-spacing:-.006em;}
main p.text-\[24px\], main .subtitle-large{font-size:21px!important;line-height:1.48!important;font-weight:700!important;}
main p.text-\[17px\], main .lead{font-size:16px!important;line-height:1.9!important;color:#536277!important;}
main p.text-\[16px\]{font-size:15.5px!important;line-height:1.85!important;}
main p.text-\[15px\]{font-size:14.5px!important;line-height:1.78!important;}

/* 大号数据不再过大，但更稳重 */
main p.text-\[26px\]{font-size:23px!important;font-weight:800!important;}
main p.text-\[30px\]{font-size:26px!important;font-weight:800!important;}
main p.text-\[32px\]{font-size:28px!important;font-weight:800!important;}
main p.text-\[40px\], main p.text-\[42px\]{font-size:34px!important;font-weight:800!important;}

/* 兼容 Tailwind class 写在标题上的情况 */
h1.font-medium,h2.font-medium,h3.font-medium,h4.font-medium,
h1.font-semibold,h2.font-semibold,h3.font-semibold,h4.font-semibold{font-weight:800!important;}
.font-medium.text-slate-950,.font-medium.text-slate-900{font-weight:800!important;}

/* 区块节奏：减少“AI模板感”，增强层次和留白 */
.section-pad{padding-top:72px!important;padding-bottom:72px!important;}
section{position:relative;}
section .max-w-\[1680px\]{max-width:1680px!important;}
main > section:first-child .max-w-\[1680px\]{max-width:1680px!important;}
.soft-grid{opacity:.38!important;background-size:52px 52px!important;mask-image:linear-gradient(to bottom,rgba(0,0,0,.9),rgba(0,0,0,.32),transparent)!important;-webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,.9),rgba(0,0,0,.32),transparent)!important;}
.bg-gradient-to-b.from-white.via-vanto-50\/55.to-white{background: radial-gradient(circle at 78% 15%, rgba(26, 214, 255, .28), transparent 28%), radial-gradient(circle at 15% 5%, rgba(21, 92, 255, .18), transparent 30%), linear-gradient(180deg, #F7FAFF 0%, #FFFFFF 85%)!important;}

/* 卡片重构：更平、更精致 */
.rounded-\[36px\]{border-radius:28px!important;}
.rounded-\[32px\]{border-radius:26px!important;}
.rounded-3xl{border-radius:22px!important;}
.card-hover,
[class*="card-hover"]{transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease!important;}
.card-hover:hover{transform:translateY(-3px)!important;border-color:#cfe0ff!important;box-shadow:0 22px 55px rgba(15,23,42,.08)!important;}
.border-slate-200{border-color:#e3ebf5!important;}
.bg-slate-50{background:#f7faff!important;}
.shadow-sm{box-shadow:0 12px 30px rgba(15,23,42,.045)!important;}

/* 图片：避免过大、统一质感 */
main img{object-fit:contain;}
main img[alt*="示意图"], main img[alt*="后台"], main img[alt*="业务"]{box-shadow:0 22px 64px rgba(15,23,42,.10)!important;border-radius:28px!important;}

/* 按钮：更克制 */
a.rounded-full,button.rounded-full{font-weight:800!important;}
.bg-slate-950{background:#050b1f!important;}
.hover\:bg-vanto-700:hover{background:#006cff!important;}

/* 表单和登录注册页 */
input,textarea,select,button{font-family:var(--vs-font)!important;}
label{font-weight:700!important;}

.hero{
    background: radial-gradient(circle at 78% 15%, rgba(26, 214, 255, .28), transparent 28%), radial-gradient(circle at 15% 5%, rgba(21, 92, 255, .18), transparent 30%), linear-gradient(180deg, #F7FAFF 0%, #FFFFFF 85%);
}

.hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: linear-gradient(rgba(21, 92, 255, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(21, 92, 255, .05) 1px, transparent 1px);
    background-size: 46px 46px;
    mask-image: linear-gradient(to bottom, #000, transparent 75%);
}

.e-con:before {
    transition: background var(--overlay-transition, .3s), border-radius var(--border-transition, .3s), opacity var(--overlay-transition, .3s);
}


@media (max-width:1023px){
  .vp-topbar{height:30px!important;}
  .vp-topbar-inner{height:30px!important;font-size:11.5px!important;padding:0 18px!important;}
  .vp-header,.vp-header-inner{height:60px!important;}
  .vp-logo{height:20px!important;}
  main h1{font-size:31px!important;line-height:1.2!important;}
  main h2{font-size:25px!important;line-height:1.25!important;}
  .section-pad{padding-top:56px!important;padding-bottom:56px!important;}
  .rounded-\[36px\],.rounded-\[32px\],.rounded-3xl{border-radius:20px!important;}
}
