/* ========================================
   云途车检官网 - 独立风格
   专业车检线品牌视觉
   ======================================== */

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:"Microsoft YaHei","PingFang SC","Helvetica Neue",sans-serif; color:#1a1a2e; background:#fff; -webkit-font-smoothing:antialiased; }
a { text-decoration:none; color:inherit; }
ul { list-style:none; }

/* ===== 容器 ===== */
.yt-container { width:1180px; margin:0 auto; padding:0 20px; }

/* ===== Header ===== */
.yt-header { position:fixed; top:0; left:0; right:0; z-index:1000; height:64px; transition:all .3s; }
.yt-header.scrolled { background:rgba(13,25,48,.95); backdrop-filter:blur(10px); box-shadow:0 2px 20px rgba(0,0,0,.15); }
.yt-header-inner { display:flex; align-items:center; justify-content:space-between; height:100%; max-width:1180px; margin:0 auto; padding:0 20px; }
.yt-logo { display:flex; align-items:center; gap:8px; font-size:22px; font-weight:800; color:#fff; }
.yt-logo-icon { font-size:28px; }
.yt-nav { display:flex; gap:4px; }
.yt-nav a { padding:8px 16px; font-size:14px; color:rgba(255,255,255,.75); border-radius:6px; transition:all .2s; }
.yt-nav a:hover, .yt-nav a.active { color:#fff; background:rgba(255,255,255,.12); }

/* ===== Hero ===== */
.yt-hero { position:relative; min-height:100vh; display:flex; align-items:center; justify-content:center; text-align:center; overflow:hidden; }
.yt-hero-bg { position:absolute; inset:0; background:linear-gradient(160deg, #0a1628 0%, #0f2347 30%, #142d5e 60%, #1a3a6b 100%); z-index:0; }
.yt-hero-bg::before { content:''; position:absolute; top:-30%; right:-10%; width:700px; height:700px; border-radius:50%; background:radial-gradient(circle, rgba(34,85,164,.25) 0%, transparent 70%); }
.yt-hero-bg::after { content:''; position:absolute; bottom:-20%; left:-5%; width:500px; height:500px; border-radius:50%; background:radial-gradient(circle, rgba(255,213,79,.08) 0%, transparent 70%); }
.yt-hero-content { position:relative; z-index:1; max-width:800px; padding:0 20px; }
.yt-hero-kicker { font-size:15px; color:rgba(255,255,255,.6); letter-spacing:4px; margin-bottom:20px; }
.yt-hero-content h1 { font-size:56px; font-weight:900; color:#fff; letter-spacing:6px; margin-bottom:12px; }
.yt-hero-sub { font-size:22px; color:#ffd54f; font-weight:600; margin-bottom:16px; }
.yt-hero-desc { font-size:15px; color:rgba(255,255,255,.7); line-height:2; margin-bottom:40px; }
.yt-hero-actions { display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }
.yt-hero-scroll { position:absolute; bottom:30px; left:50%; transform:translateX(-50%); color:rgba(255,255,255,.4); font-size:13px; animation:bounce 2s infinite; }
@keyframes bounce { 0%,100%{transform:translateX(-50%) translateY(0)} 50%{transform:translateX(-50%) translateY(-8px)} }

/* ===== 按钮 ===== */
.yt-btn { display:inline-block; padding:14px 36px; border-radius:8px; font-size:15px; font-weight:600; cursor:pointer; transition:all .25s; border:2px solid transparent; }
.yt-btn-primary { background:linear-gradient(135deg, #2255a4, #1e7ee0); color:#fff; border-color:transparent; }
.yt-btn-primary:hover { transform:translateY(-2px); box-shadow:0 8px 24px rgba(30,126,224,.35); }
.yt-btn-line { border-color:rgba(255,255,255,.4); color:#fff; }
.yt-btn-line:hover { border-color:#fff; background:rgba(255,255,255,.08); }

/* ===== Section通用 ===== */
.yt-section { padding:90px 0; }
.yt-section-dark { background:#0f2347; color:#fff; }
.yt-section-gray { background:#f5f6fa; }
.yt-section-accent { background:linear-gradient(135deg, #0f2347, #1a3a6b); color:#fff; }
.yt-section-dark .yt-sec-desc, .yt-section-accent .yt-sec-desc { color:rgba(255,255,255,.6); }
.yt-sec-head { text-align:center; margin-bottom:60px; }
.yt-sec-label { font-size:12px; letter-spacing:3px; color:#2255a4; margin-bottom:12px; font-weight:600; }
.yt-section-dark .yt-sec-label, .yt-section-accent .yt-sec-label { color:rgba(255,255,255,.5); }
.yt-sec-head h2 { font-size:34px; font-weight:800; margin-bottom:12px; }
.yt-section-dark .yt-sec-head h2, .yt-section-accent .yt-sec-head h2 { color:#fff; }
.yt-sec-desc { font-size:15px; color:#666; max-width:600px; margin:0 auto; }
.yt-sub-title { text-align:center; font-size:18px; font-weight:700; margin:40px 0 24px; padding-bottom:12px; border-bottom:2px solid #e8e8ee; }

/* ===== 痛点 ===== */
.yt-pain-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.yt-pain-card { background:#fff; border:1px solid #eef0f5; border-radius:10px; padding:32px 24px; transition:all .3s; }
.yt-pain-card:hover { transform:translateY(-4px); box-shadow:0 8px 32px rgba(0,0,0,.08); border-color:#d0d5e0; }
.yt-pain-num { font-size:36px; font-weight:900; color:#e8ecf4; margin-bottom:12px; }
.yt-pain-card h4 { font-size:17px; font-weight:700; margin-bottom:10px; color:#1a1a2e; }
.yt-pain-card p { font-size:13px; color:#777; line-height:1.8; }

/* ===== 解决方案 ===== */
.yt-sol-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:24px; }
.yt-sol-card { background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1); border-radius:12px; padding:36px 28px; transition:all .3s; }
.yt-sol-card:hover { background:rgba(255,255,255,.1); transform:translateY(-2px); }
.yt-sol-highlight { border-color:#ffd54f; background:rgba(255,213,79,.08); }
.yt-sol-icon { width:44px; height:44px; margin-bottom:16px; }
.yt-sol-icon svg { width:100%; height:100%; }
.yt-badge { display:inline-block; padding:3px 12px; border-radius:4px; font-size:11px; font-weight:600; background:rgba(255,255,255,.15); color:rgba(255,255,255,.8); margin-bottom:12px; }
.yt-badge-star { background:#ffd54f; color:#1a1a2e; }
.yt-sol-card h3 { font-size:20px; font-weight:700; margin-bottom:10px; }
.yt-sol-card > p { font-size:13px; color:rgba(255,255,255,.7); line-height:1.8; margin-bottom:16px; }
.yt-sol-card ul li { font-size:12px; color:rgba(255,255,255,.55); padding:4px 0; padding-left:16px; position:relative; }
.yt-sol-card ul li::before { content:''; position:absolute; left:0; top:11px; width:5px; height:5px; border-radius:50%; background:#ffd54f; }

/* ===== 分站独立营销 ===== */
.yt-station-item { margin-bottom:40px; }
.yt-station-item h3 { font-size:20px; font-weight:700; margin-bottom:20px; padding-bottom:10px; border-bottom:2px solid #eef0f5; }
.yt-station-grid-3 { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.yt-station-grid-3 > div { background:#f5f6fa; border-radius:8px; padding:20px; font-size:13px; color:#555; line-height:1.8; }
.yt-station-grid-3 > div strong { display:block; font-size:14px; color:#1a1a2e; margin-bottom:6px; }
.yt-station-grid-2 { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.yt-station-grid-2 > div { background:#f5f6fa; border-radius:8px; padding:20px; font-size:13px; color:#555; line-height:1.8; }
.yt-station-grid-2 > div strong { display:block; font-size:14px; color:#1a1a2e; margin-bottom:6px; }
.yt-check-list { display:grid; grid-template-columns:repeat(6,1fr); gap:10px; }
.yt-check-list span { text-align:center; padding:12px 8px; background:#f0f4ff; border-radius:6px; font-size:13px; color:#2255a4; font-weight:500; border:1px solid #dce4f8; }

/* ===== 产品 ===== */
.yt-prod-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.yt-prod-card { text-align:center; background:#fff; border-radius:12px; padding:32px 20px; border:1px solid #eef0f5; transition:all .3s; }
.yt-prod-card:hover { transform:translateY(-4px); box-shadow:0 8px 32px rgba(0,0,0,.08); }
.yt-prod-icon { width:56px; height:56px; margin:0 auto 16px; border-radius:14px; display:flex; align-items:center; justify-content:center; font-size:28px; }
.yt-icon-blue { background:#e8f0fe; color:#1e7ee0; }
.yt-icon-green { background:#e6f7ee; color:#16a34a; }
.yt-icon-orange { background:#fef3e6; color:#ea580c; }
.yt-icon-purple { background:#f0e8fe; color:#7c3aed; }
.yt-prod-card h4 { font-size:17px; font-weight:700; margin-bottom:8px; }
.yt-prod-card p { font-size:13px; color:#888; line-height:1.8; }

.yt-backend-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.yt-backend-card { background:#fff; border-radius:12px; padding:32px 24px; border:1px solid #eef0f5; }
.yt-backend-main { border-color:#2255a4; background:#f8faff; }
.yt-backend-card h4 { font-size:17px; font-weight:700; margin-bottom:12px; }
.yt-backend-card h4 span { font-size:11px; padding:2px 8px; border-radius:4px; background:#2255a4; color:#fff; margin-left:8px; vertical-align:middle; }
.yt-backend-card p { font-size:13px; color:#777; line-height:1.8; }

/* ===== 竞争壁垒 ===== */
.yt-barrier-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:30px; }
.yt-barrier-card { text-align:center; padding:40px 28px; border-radius:12px; background:rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.1); transition:all .3s; }
.yt-barrier-card:hover { background:rgba(255,255,255,.1); transform:translateY(-4px); }
.yt-barrier-icon { font-size:48px; margin-bottom:20px; }
.yt-barrier-card h4 { font-size:22px; font-weight:700; margin-bottom:12px; color:#ffd54f; }
.yt-barrier-card p { font-size:14px; color:rgba(255,255,255,.7); line-height:1.8; }

/* ===== 盈利模式 ===== */
.yt-income-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.yt-income-card { text-align:center; background:#fff; border-radius:10px; padding:36px 20px; border:1px solid #eef0f5; transition:all .3s; }
.yt-income-card:hover { transform:translateY(-4px); box-shadow:0 8px 32px rgba(0,0,0,.08); }
.yt-income-num { display:inline-block; width:48px; height:48px; border-radius:12px; background:linear-gradient(135deg,#2255a4,#1e7ee0); color:#fff; font-size:20px; font-weight:800; line-height:48px; margin-bottom:16px; }
.yt-income-card h4 { font-size:16px; font-weight:700; margin-bottom:8px; }
.yt-income-card p { font-size:12px; color:#888; }

/* ===== 合作方 ===== */
.yt-coop-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.yt-coop-card { background:#fff; border-radius:10px; padding:32px 24px; border:1px solid #eef0f5; transition:all .3s; }
.yt-coop-card:hover { transform:translateY(-4px); box-shadow:0 8px 32px rgba(0,0,0,.08); }
.yt-coop-icon { width:52px; height:52px; border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:26px; margin-bottom:16px; }
.yt-coop-card h4 { font-size:17px; font-weight:700; margin-bottom:10px; }
.yt-coop-card p { font-size:13px; color:#777; line-height:1.8; }

/* ===== 标语 ===== */
.yt-slogans { display:flex; flex-wrap:wrap; justify-content:center; gap:12px; }
.yt-slogans span { padding:10px 22px; border-radius:8px; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.15); color:rgba(255,255,255,.85); font-size:13px; }

/* ===== Footer ===== */
.yt-footer { background:#0a1628; color:rgba(255,255,255,.6); padding:50px 0 24px; }
.yt-footer-grid { display:grid; grid-template-columns:2fr 1fr 1.5fr; gap:40px; margin-bottom:30px; }
.yt-footer-brand h3 { font-size:22px; font-weight:800; color:#fff; margin-bottom:8px; }
.yt-footer-brand p { font-size:13px; }
.yt-footer-links h4, .yt-footer-contact h4 { font-size:14px; font-weight:700; color:#fff; margin-bottom:12px; }
.yt-footer-links a { display:block; font-size:13px; padding:3px 0; transition:color .2s; }
.yt-footer-links a:hover { color:#ffd54f; }
.yt-footer-contact p { font-size:13px; margin-bottom:4px; }
.yt-footer-contact a { color:rgba(255,255,255,.4); }
.yt-footer-contact a:hover { color:#ffd54f; }
.yt-footer-bottom { border-top:1px solid rgba(255,255,255,.08); padding-top:16px; text-align:center; font-size:12px; color:rgba(255,255,255,.3); }

/* ===== 响应式 ===== */
@media (max-width:1200px) {
    .yt-container { width:100%; }
    .yt-header-inner { width:100%; }
    .yt-pain-grid { grid-template-columns:repeat(2,1fr); }
    .yt-income-grid { grid-template-columns:repeat(3,1fr); }
    .yt-coop-grid { grid-template-columns:repeat(2,1fr); }
    .yt-backend-grid { grid-template-columns:1fr; }
    .yt-station-grid-2 { grid-template-columns:repeat(2,1fr); }
    .yt-check-list { grid-template-columns:repeat(4,1fr); }
}
@media (max-width:768px) {
    .yt-hero-content h1 { font-size:34px; letter-spacing:3px; }
    .yt-hero-sub { font-size:17px; }
    .yt-nav { display:none; }
    .yt-sol-grid { grid-template-columns:1fr; }
    .yt-pain-grid { grid-template-columns:1fr; }
    .yt-prod-grid { grid-template-columns:repeat(2,1fr); }
    .yt-barrier-grid { grid-template-columns:1fr; }
    .yt-income-grid { grid-template-columns:repeat(2,1fr); }
    .yt-coop-grid { grid-template-columns:1fr; }
    .yt-station-grid-3 { grid-template-columns:1fr; }
    .yt-station-grid-2 { grid-template-columns:1fr; }
    .yt-check-list { grid-template-columns:repeat(3,1fr); }
    .yt-footer-grid { grid-template-columns:1fr; gap:24px; }
    .yt-section { padding:60px 0; }
}