:root{
      --bg:#f6f7fb;
      --panel:#ffffff;
      --panel-2:#fff8f1;
      --line:#e7eaf2;
      --text:#172033;
      --muted:#5d6780;
      --brand:#ff4f6d;
      --brand2:#6a5cff;
      --brand3:#ffb347;
      --shadow:0 18px 48px rgba(34,44,78,.10);
      --radius:22px;
      --radius-sm:16px;
      --container:1180px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
      color:var(--text);
      background:
        radial-gradient(circle at top left, rgba(255,79,109,.08), transparent 28%),
        radial-gradient(circle at top right, rgba(106,92,255,.08), transparent 30%),
        linear-gradient(180deg,#fff 0%, #f7f8fc 18%, var(--bg) 100%);
    }
    a{color:inherit;text-decoration:none}
    img{display:block;max-width:100%}
    .container{width:min(100% - 32px, var(--container)); margin:0 auto}
    .topbar{
      position:sticky; top:0; z-index:50;
      backdrop-filter:saturate(180%) blur(18px);
      background:rgba(255,255,255,.84);
      border-bottom:1px solid rgba(231,234,242,.9);
    }
    .nav{
      display:flex; align-items:center; justify-content:space-between; gap:18px;
      padding:14px 0;
    }
    .brand{display:flex; align-items:center; gap:12px; min-width:0}
    .brand img{width:44px; height:44px; object-fit:contain; border-radius:12px; background:#fff; box-shadow:0 10px 20px rgba(0,0,0,.06)}
    .brand strong{display:block; font-size:1rem; letter-spacing:.5px}
    .brand span{display:block; font-size:.84rem; color:var(--muted)}
    .nav-links{display:flex; align-items:center; gap:16px; flex-wrap:wrap; justify-content:flex-end}
    .nav-links a{font-size:.95rem; color:#27314b; padding:8px 10px; border-radius:999px}
    .nav-links a:hover,.nav-links a:focus-visible{background:#fff1f4; color:var(--brand)}
    .nav-cta{display:flex; align-items:center; gap:10px}
    .btn{
      display:inline-flex; align-items:center; justify-content:center; gap:8px;
      border:1px solid transparent; border-radius:999px; padding:12px 18px;
      font-weight:700; transition:.25s ease; cursor:pointer; white-space:nowrap;
      box-shadow:none; appearance:none;
    }
    .btn-primary{background:linear-gradient(135deg,var(--brand),var(--brand2)); color:#fff; box-shadow:0 14px 28px rgba(255,79,109,.22)}
    .btn-primary:hover{transform:translateY(-2px); box-shadow:0 18px 34px rgba(255,79,109,.28)}
    .btn-ghost{background:#fff; border-color:var(--line); color:var(--text)}
    .btn-ghost:hover{border-color:#ffcad4; color:var(--brand)}
    .menu-btn{display:none; background:#fff; border:1px solid var(--line); border-radius:12px; width:44px; height:44px}
    .menu-btn span{display:block; width:18px; height:2px; background:#2f3650; margin:4px auto; border-radius:2px}
    .hero{
      position:relative; overflow:hidden; padding:52px 0 28px;
    }
    .hero-grid{
      display:grid; grid-template-columns:1.1fr .9fr; gap:28px; align-items:stretch;
    }
    .hero-copy,.hero-card,.section-card,.info-card,.quote-card,.form-card,.faq-card,.case-card,.price-card,.review-card{
      background:rgba(255,255,255,.84); border:1px solid rgba(231,234,242,.92); border-radius:var(--radius); box-shadow:var(--shadow);
    }
    .hero-copy{padding:34px}
    .eyebrow{
      display:inline-flex; align-items:center; gap:8px; padding:8px 14px; border-radius:999px;
      background:linear-gradient(135deg, rgba(255,79,109,.10), rgba(106,92,255,.10));
      color:#7d2340; font-weight:700; font-size:.92rem;
    }
    h1{margin:18px 0 14px; font-size:clamp(2rem, 4vw, 3.6rem); line-height:1.12}
    .lead{font-size:1.06rem; color:var(--muted); line-height:1.85; margin:0 0 22px}
    .hero-actions{display:flex; flex-wrap:wrap; gap:12px; margin:20px 0 22px}
    .hero-points{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:12px}
    .point{
      padding:14px; border-radius:18px; background:linear-gradient(180deg,#fff, #fff8fb);
      border:1px solid #f0e5ea; min-height:88px;
    }
    .point b{display:block; margin-bottom:6px; font-size:1rem}
    .point span{font-size:.92rem; color:var(--muted); line-height:1.6}
    .hero-card{padding:24px; background:
      radial-gradient(circle at top right, rgba(255,179,71,.20), transparent 28%),
      radial-gradient(circle at bottom left, rgba(255,79,109,.13), transparent 30%),
      rgba(255,255,255,.84);}
    .hero-stats{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:12px; margin-bottom:16px}
    .stat{padding:18px; border-radius:18px; background:#fff; border:1px solid var(--line)}
    .stat strong{display:block; font-size:1.5rem; margin-bottom:6px; color:#171f31}
    .stat span{color:var(--muted); font-size:.93rem; line-height:1.5}
    .hero-mini{
      padding:18px; border-radius:18px; background:linear-gradient(135deg,#1f2a44,#2c3d6f);
      color:#fff; margin-bottom:12px;
    }
    .hero-mini h3{margin:0 0 8px; font-size:1.08rem}
    .hero-mini p{margin:0; color:rgba(255,255,255,.82); line-height:1.7; font-size:.95rem}
    .tag-cloud{display:flex; flex-wrap:wrap; gap:10px}
    .tag-cloud span,.pill{padding:9px 12px; border-radius:999px; background:#fff; border:1px solid var(--line); color:#35415f; font-size:.9rem}
    section{padding:22px 0}
    .section-head{display:flex; justify-content:space-between; align-items:end; gap:18px; margin-bottom:14px}
    .section-head h2{margin:0; font-size:clamp(1.45rem, 2.5vw, 2.2rem)}
    .section-head p{margin:0; color:var(--muted); line-height:1.7; max-width:760px}
    .grid-3{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px}
    .grid-2{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px}
    .section-card,.info-card,.quote-card,.case-card,.review-card,.price-card,.faq-card,.form-card{padding:22px}
    .feature{display:flex; flex-direction:column; gap:12px}
    .feature .icon{
      width:48px; height:48px; border-radius:14px; display:grid; place-items:center;
      background:linear-gradient(135deg, rgba(255,79,109,.14), rgba(106,92,255,.12)); color:#8d2744; font-size:1.2rem;
    }
    .feature h3,.section-card h3,.info-card h3,.quote-card h3,.case-card h3,.review-card h3,.price-card h3{margin:0; font-size:1.08rem}
    .feature p,.section-card p,.info-card p,.quote-card p,.case-card p,.review-card p,.price-card p{margin:0; color:var(--muted); line-height:1.78}
    .table-wrap{overflow:auto; border-radius:18px; border:1px solid var(--line); background:#fff}
    table{width:100%; border-collapse:collapse; min-width:860px}
    th,td{padding:16px 14px; text-align:left; border-bottom:1px solid var(--line); vertical-align:top}
    th{background:#fff7fa; color:#26324c; font-size:.95rem}
    td{color:#3c465f}
    .check{color:#0e8b5b; font-weight:700}
    .highlight{color:var(--brand); font-weight:700}
    .steps{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px}
    .step{
      padding:18px; border-radius:18px; background:linear-gradient(180deg,#fff, #fff9fd);
      border:1px solid var(--line); position:relative;
    }
    .step::after{
      content:""; position:absolute; inset:auto 18px 18px auto; width:42px; height:42px; border-radius:50%;
      background:linear-gradient(135deg, rgba(255,79,109,.12), rgba(106,92,255,.12));
    }
    .step b{display:block; margin-bottom:8px}
    .step span{display:block; color:var(--muted); line-height:1.7}
    .timeline{display:grid; gap:14px}
    .timeline-item{display:grid; grid-template-columns:120px 1fr; gap:16px; align-items:start; padding:16px 18px; border:1px solid var(--line); border-radius:18px; background:#fff}
    .timeline-item strong{color:var(--brand)}
    .timeline-item p{margin:0; color:var(--muted); line-height:1.7}
    .case-list,.news-list,.faq-list,.review-list{display:grid; gap:12px}
    .case-card h3{margin-bottom:6px}
    .case-meta{display:flex; flex-wrap:wrap; gap:10px; margin-top:12px}
    .case-meta span,.meta-badge{padding:7px 10px; border-radius:999px; background:#f7f8fc; border:1px solid var(--line); font-size:.88rem; color:#43506d}
    details{border:1px solid var(--line); border-radius:16px; background:#fff; padding:0 16px}
    summary{list-style:none; cursor:pointer; padding:16px 0; font-weight:700; color:#1f2a44}
    summary::-webkit-details-marker{display:none}
    details p{margin:0 0 16px; color:var(--muted); line-height:1.75}
    .reviews .review-card{height:100%}
    .review-top{display:flex; justify-content:space-between; gap:12px; align-items:center; margin-bottom:10px}
    .stars{color:#ff9800; letter-spacing:1px}
    .price-card{display:flex; flex-direction:column; gap:14px}
    .price{font-size:2rem; font-weight:800; color:#151d2f}
    .muted{color:var(--muted)}
    .footer{
      margin-top:18px; padding:26px 0 34px; background:#0f1728; color:#dfe6fb;
    }
    .footer a{color:#fff}
    .footer .container{display:grid; gap:18px}
    .footer-grid{display:grid; grid-template-columns:1.2fr .8fr; gap:18px; align-items:start}
    .footer-card{padding:18px; border-radius:18px; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.1)}
    .footer small{color:#b8c4e0}
    .footer-links{display:flex; flex-wrap:wrap; gap:10px}
    .floating{
      position:fixed; right:16px; bottom:16px; z-index:60; display:flex; flex-direction:column; gap:10px;
    }
    .float-btn{
      width:52px; height:52px; border-radius:16px; background:linear-gradient(135deg,var(--brand),var(--brand2));
      color:#fff; display:grid; place-items:center; box-shadow:0 16px 28px rgba(65,53,175,.25); border:none;
    }
    .float-panel{
      width:min(320px, calc(100vw - 32px));
      background:#fff; border:1px solid var(--line); border-radius:18px; box-shadow:var(--shadow); padding:14px; display:none;
    }
    .float-panel.open{display:block}
    .float-panel img{width:100%; border-radius:14px}
    .form-grid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px}
    .form-grid .full{grid-column:1/-1}
    input,select,textarea{
      width:100%; border:1px solid var(--line); border-radius:14px; padding:13px 14px; font:inherit; background:#fff; color:var(--text);
      outline:none; transition:.2s ease;
    }
    input:focus,select:focus,textarea:focus{border-color:#ffb0bf; box-shadow:0 0 0 4px rgba(255,79,109,.08)}
    textarea{min-height:130px; resize:vertical}
    .gallery{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px}
    .gallery img{border-radius:18px; border:1px solid var(--line); box-shadow:0 12px 28px rgba(23,32,51,.08)}
    .logos{display:flex; flex-wrap:wrap; gap:10px}
    .mobile-only{display:none}
    .scroll-top{position:fixed; left:16px; bottom:16px; z-index:60}
    .scroll-top .float-btn{width:46px; height:46px; border-radius:14px}
    .reveal{opacity:0; transform:translateY(18px); transition:.65s ease}
    .reveal.show{opacity:1; transform:none}
    @media (max-width: 1024px){
      .hero-grid,.grid-3,.grid-2,.steps,.gallery,.footer-grid,.form-grid{grid-template-columns:1fr}
      .hero-points{grid-template-columns:1fr}
      .nav-links{display:none}
      .menu-btn{display:inline-grid; place-items:center}
      .nav.open .nav-links{
        display:flex; position:absolute; left:16px; right:16px; top:74px; flex-direction:column; align-items:stretch;
        background:#fff; padding:14px; border:1px solid var(--line); border-radius:18px; box-shadow:var(--shadow)
      }
      .nav.open .nav-links a{padding:12px 14px}
      .nav-cta .btn-ghost{display:none}
      .timeline-item{grid-template-columns:1fr}
      .mobile-only{display:block}
    }
    @media (max-width: 640px){
      .container{width:min(100% - 20px, var(--container))}
      .hero{padding-top:28px}
      .hero-copy,.hero-card,.section-card,.info-card,.quote-card,.form-card,.faq-card,.case-card,.price-card,.review-card{padding:18px}
      h1{font-size:2rem}
      .nav{padding:12px 0}
      .brand img{width:40px; height:40px}
      .hero-actions .btn{width:100%}
      .nav.open .nav-links{top:68px}
    }