/* roulang page: index */
:root{
      --bg:#050b18;
      --bg-soft:#071426;
      --bg-panel:rgba(12,28,52,.72);
      --bg-card:rgba(255,255,255,.075);
      --bg-card-strong:rgba(255,255,255,.12);
      --primary:#37d7ff;
      --primary-dark:#0aaed6;
      --secondary:#7c5cff;
      --accent:#21f6a5;
      --warning:#ffd166;
      --text:#edf7ff;
      --muted:#a9bad0;
      --soft:#d5e5f5;
      --border:rgba(170,205,255,.18);
      --border-strong:rgba(55,215,255,.42);
      --shadow:0 24px 80px rgba(0,0,0,.35);
      --shadow-glow:0 0 28px rgba(55,215,255,.35),0 14px 45px rgba(124,92,255,.2);
      --radius-lg:28px;
      --radius-md:18px;
      --radius-sm:12px;
      --container:1160px;
      --transition:180ms ease;
    }
    *{box-sizing:border-box;margin:0;padding:0}
    html{scroll-behavior:smooth}
    body{
      min-height:100vh;
      font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",Arial,sans-serif;
      color:var(--text);
      line-height:1.7;
      background:
        radial-gradient(circle at 15% 8%,rgba(55,215,255,.22),transparent 32%),
        radial-gradient(circle at 88% 18%,rgba(124,92,255,.24),transparent 30%),
        radial-gradient(circle at 70% 82%,rgba(33,246,165,.12),transparent 28%),
        linear-gradient(180deg,#040816 0%,#071426 42%,#050b18 100%);
      overflow-x:hidden;
    }
    body::before{
      content:"";
      position:fixed;
      inset:0;
      pointer-events:none;
      background-image:
        linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
        linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
      background-size:54px 54px;
      mask-image:linear-gradient(to bottom,rgba(0,0,0,.65),transparent 80%);
      z-index:-2;
    }
    a{color:inherit;text-decoration:none}
    img{max-width:100%;display:block}
    button,input,textarea,select{font:inherit}
    button{cursor:pointer;border:0}
    input,textarea{outline:none}
    ::selection{background:rgba(55,215,255,.35);color:#fff}
    .container{width:min(var(--container),calc(100% - 40px));margin:0 auto}
    .site-header{
      position:sticky;
      top:0;
      z-index:50;
      background:rgba(5,11,24,.78);
      backdrop-filter:blur(18px);
      border-bottom:1px solid var(--border);
      box-shadow:0 12px 34px rgba(0,0,0,.16);
    }
    .brand-row{
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:18px;
      padding:15px 0 11px;
    }
    .logo{
      display:inline-flex;
      align-items:center;
      gap:11px;
      font-weight:900;
      letter-spacing:.02em;
      font-size:1.22rem;
      white-space:nowrap;
    }
    .logo-mark{
      width:38px;
      height:38px;
      border-radius:14px;
      display:grid;
      place-items:center;
      color:#04101d;
      background:linear-gradient(135deg,var(--primary),var(--accent));
      box-shadow:var(--shadow-glow);
      font-weight:950;
    }
    .header-tools{
      display:flex;
      align-items:center;
      gap:12px;
      min-width:0;
    }
    .mini-search{
      display:flex;
      align-items:center;
      gap:8px;
      width:280px;
      padding:9px 12px;
      border:1px solid var(--border);
      border-radius:999px;
      color:var(--muted);
      background:rgba(255,255,255,.06);
      transition:var(--transition);
    }
    .mini-search:focus-within{
      border-color:var(--border-strong);
      box-shadow:0 0 0 4px rgba(55,215,255,.1);
      background:rgba(255,255,255,.09);
    }
    .mini-search input{
      width:100%;
      color:var(--text);
      background:transparent;
      border:0;
      font-size:.92rem;
    }
    .mini-search input::placeholder{color:#8093aa}
    .header-cta{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      min-height:40px;
      padding:0 16px;
      border-radius:999px;
      color:#04101d;
      background:linear-gradient(135deg,var(--primary),var(--accent));
      font-weight:800;
      box-shadow:0 0 18px rgba(55,215,255,.26);
      transition:transform var(--transition),box-shadow var(--transition),filter var(--transition);
    }
    .header-cta:hover{transform:translateY(-2px);box-shadow:var(--shadow-glow);filter:saturate(1.12)}
    .chip-nav-wrap{
      border-top:1px solid rgba(255,255,255,.06);
      overflow-x:auto;
      scrollbar-width:none;
    }
    .chip-nav-wrap::-webkit-scrollbar{display:none}
    .chip-nav{
      display:flex;
      align-items:center;
      gap:10px;
      min-width:max-content;
      padding:10px 0 14px;
    }
    .nav-chip{
      display:inline-flex;
      align-items:center;
      gap:8px;
      min-height:38px;
      padding:0 16px;
      border-radius:999px;
      border:1px solid var(--border);
      color:var(--soft);
      background:rgba(255,255,255,.045);
      transition:background var(--transition),border-color var(--transition),transform var(--transition),color var(--transition);
    }
    .nav-chip:hover{
      color:#fff;
      border-color:rgba(55,215,255,.5);
      background:rgba(55,215,255,.1);
      transform:translateY(-1px);
    }
    .nav-chip.active{
      color:#04101d;
      border-color:transparent;
      background:linear-gradient(135deg,var(--primary),var(--accent));
      font-weight:850;
      box-shadow:0 0 20px rgba(55,215,255,.22);
    }
    .section{padding:78px 0}
    .section-sm{padding:56px 0}
    .section-kicker{
      display:inline-flex;
      align-items:center;
      gap:8px;
      margin-bottom:14px;
      padding:7px 12px;
      border-radius:999px;
      color:#bdeeff;
      border:1px solid rgba(55,215,255,.28);
      background:rgba(55,215,255,.08);
      font-size:.88rem;
      font-weight:750;
    }
    .section-title{
      font-size:clamp(1.8rem,3vw,2.85rem);
      line-height:1.16;
      letter-spacing:-.04em;
      margin-bottom:16px;
    }
    .section-desc{
      max-width:760px;
      color:var(--muted);
      font-size:1.03rem;
    }
    .hero{
      position:relative;
      min-height:620px;
      display:flex;
      align-items:center;
      padding:88px 0 76px;
      overflow:hidden;
      border-bottom:1px solid rgba(255,255,255,.06);
    }
    .hero::after{
      content:"";
      position:absolute;
      inset:auto -10% -45% -10%;
      height:420px;
      background:radial-gradient(closest-side,rgba(55,215,255,.18),transparent 70%);
      pointer-events:none;
    }
    .hero-inner{
      position:relative;
      z-index:1;
      width:min(980px,100%);
      margin:0 auto;
      text-align:center;
    }
    .hero-badge-row{
      display:flex;
      align-items:center;
      justify-content:center;
      gap:10px;
      flex-wrap:wrap;
      margin-bottom:22px;
    }
    .badge{
      display:inline-flex;
      align-items:center;
      gap:7px;
      padding:8px 12px;
      border-radius:999px;
      color:#dff8ff;
      border:1px solid var(--border);
      background:rgba(255,255,255,.065);
      backdrop-filter:blur(10px);
      font-size:.9rem;
    }
    h1{
      font-size:clamp(2.25rem,6.4vw,5.3rem);
      line-height:1.02;
      letter-spacing:-.065em;
      margin:0 auto 24px;
      max-width:970px;
    }
    .gradient-text{
      background:linear-gradient(135deg,#fff 8%,#8ceeff 42%,#9b87ff 78%,#7dffc9 100%);
      -webkit-background-clip:text;
      background-clip:text;
      color:transparent;
    }
    .hero-lead{
      max-width:820px;
      margin:0 auto 28px;
      color:#c5d6ea;
      font-size:clamp(1rem,1.7vw,1.18rem);
    }
    .hero-search{
      display:flex;
      align-items:center;
      gap:10px;
      width:min(760px,100%);
      margin:0 auto 18px;
      padding:10px;
      border:1px solid rgba(55,215,255,.32);
      border-radius:22px;
      background:rgba(255,255,255,.09);
      box-shadow:var(--shadow);
      backdrop-filter:blur(18px);
    }
    .hero-search label{
      position:absolute;
      width:1px;height:1px;
      padding:0;margin:-1px;overflow:hidden;
      clip:rect(0,0,0,0);white-space:nowrap;border:0;
    }
    .hero-search input{
      flex:1;
      min-width:0;
      border:0;
      color:var(--text);
      background:transparent;
      padding:15px 15px;
      font-size:1rem;
    }
    .hero-search input::placeholder{color:#8197b0}
    .btn{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      gap:9px;
      min-height:48px;
      padding:0 20px;
      border-radius:16px;
      font-weight:850;
      transition:transform var(--transition),box-shadow var(--transition),background var(--transition),border-color var(--transition),color var(--transition);
      user-select:none;
    }
    .btn-primary{
      color:#04101d;
      background:linear-gradient(135deg,var(--primary),var(--accent));
      box-shadow:0 0 24px rgba(55,215,255,.36),0 16px 34px rgba(0,0,0,.22);
    }
    .btn-primary:hover{transform:translateY(-2px);box-shadow:var(--shadow-glow)}
    .btn-secondary{
      color:#eaf8ff;
      border:1px solid var(--border);
      background:rgba(255,255,255,.07);
    }
    .btn-secondary:hover{transform:translateY(-2px);border-color:rgba(55,215,255,.52);background:rgba(55,215,255,.12)}
    .btn:focus-visible,.nav-chip:focus-visible,.header-cta:focus-visible,a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{
      outline:3px solid rgba(55,215,255,.38);
      outline-offset:3px;
    }
    .quick-entry{
      display:flex;
      justify-content:center;
      flex-wrap:wrap;
      gap:10px;
      margin:18px auto 26px;
    }
    .quick-entry a{
      padding:9px 13px;
      border-radius:999px;
      color:#cfe3f8;
      background:rgba(255,255,255,.06);
      border:1px solid rgba(255,255,255,.1);
      font-size:.93rem;
      transition:var(--transition);
    }
    .quick-entry a:hover{
      color:#fff;
      background:rgba(55,215,255,.12);
      border-color:rgba(55,215,255,.4);
      transform:translateY(-1px);
    }
    .hero-stats{
      display:grid;
      grid-template-columns:repeat(3,1fr);
      gap:14px;
      max-width:760px;
      margin:26px auto 0;
    }
    .hero-stat{
      border:1px solid var(--border);
      border-radius:20px;
      padding:18px 16px;
      background:linear-gradient(180deg,rgba(255,255,255,.095),rgba(255,255,255,.045));
      backdrop-filter:blur(16px);
      text-align:left;
    }
    .hero-stat strong{
      display:block;
      font-size:1.55rem;
      line-height:1.1;
      color:#fff;
      letter-spacing:-.03em;
    }
    .hero-stat span{display:block;margin-top:7px;color:var(--muted);font-size:.92rem}
    .search-note{min-height:24px;color:#9edfff;font-size:.92rem}
    .glass{
      border:1px solid var(--border);
      background:var(--bg-card);
      backdrop-filter:blur(18px);
      box-shadow:var(--shadow);
    }
    .cases-layout{
      display:grid;
      grid-template-columns:1.02fr 1.4fr;
      gap:24px;
      align-items:stretch;
      margin-top:34px;
    }
    .case-feature{
      border-radius:var(--radius-lg);
      padding:28px;
      position:relative;
      overflow:hidden;
    }
    .case-feature::after{
      content:"";
      position:absolute;
      width:230px;height:230px;
      right:-80px;bottom:-80px;
      border-radius:50%;
      background:radial-gradient(circle,rgba(33,246,165,.24),transparent 70%);
    }
    .case-feature h3{font-size:1.55rem;margin:14px 0 12px}
    .case-feature p{color:var(--muted)}
    .case-chip-row{display:flex;flex-wrap:wrap;gap:9px;margin-top:22px}
    .case-chip{
      padding:7px 10px;
      border-radius:999px;
      color:#ddf7ff;
      background:rgba(55,215,255,.1);
      border:1px solid rgba(55,215,255,.2);
      font-size:.86rem;
    }
    .case-list{
      display:grid;
      grid-template-columns:1fr;
      gap:14px;
    }
    .case-item{
      display:grid;
      grid-template-columns:78px 1fr auto;
      gap:16px;
      align-items:center;
      border-radius:22px;
      padding:18px;
      border:1px solid var(--border);
      background:rgba(255,255,255,.06);
      transition:transform var(--transition),border-color var(--transition),background var(--transition);
    }
    .case-item:hover{
      transform:translateY(-3px);
      border-color:rgba(55,215,255,.45);
      background:rgba(255,255,255,.09);
    }
    .case-icon{
      width:62px;height:62px;border-radius:20px;
      display:grid;place-items:center;
      color:#04101d;
      font-weight:950;
      background:linear-gradient(135deg,var(--primary),var(--secondary));
      box-shadow:0 0 22px rgba(55,215,255,.24);
    }
    .case-item h3{font-size:1.06rem;margin-bottom:4px}
    .case-item p{color:var(--muted);font-size:.94rem}
    .case-result{
      color:#8fffd1;
      font-weight:850;
      white-space:nowrap;
    }
    .dashboard{
      margin-top:34px;
      display:grid;
      grid-template-columns:1.35fr .85fr;
      gap:22px;
    }
    .metric-board{
      border-radius:var(--radius-lg);
      padding:24px;
      background:
        linear-gradient(135deg,rgba(55,215,255,.12),rgba(124,92,255,.08)),
        rgba(255,255,255,.055);
      border:1px solid rgba(55,215,255,.22);
      box-shadow:var(--shadow);
    }
    .metric-grid{
      display:grid;
      grid-template-columns:repeat(2,1fr);
      gap:14px;
    }
    .metric-card{
      padding:21px;
      border-radius:20px;
      border:1px solid rgba(255,255,255,.11);
      background:rgba(4,16,29,.42);
    }
    .metric-card b{
      display:block;
      font-size:2.15rem;
      line-height:1.05;
      letter-spacing:-.04em;
      color:#fff;
    }
    .metric-card span{display:block;margin-top:8px;color:var(--muted)}
    .signal-panel{
      border-radius:var(--radius-lg);
      padding:24px;
    }
    .signal-panel h3{font-size:1.25rem;margin-bottom:16px}
    .signal-list{display:grid;gap:13px}
    .signal{
      display:flex;
      gap:12px;
      align-items:flex-start;
      padding:13px;
      border-radius:16px;
      background:rgba(255,255,255,.055);
      border:1px solid rgba(255,255,255,.08);
    }
    .signal i{
      width:10px;height:10px;margin-top:9px;border-radius:50%;
      background:var(--accent);
      box-shadow:0 0 16px rgba(33,246,165,.8);
      flex:0 0 auto;
    }
    .signal strong{display:block;color:#fff}
    .signal span{color:var(--muted);font-size:.92rem}
    .matrix-wrap{
      margin-top:34px;
      display:grid;
      grid-template-columns:repeat(4,1fr);
      gap:14px;
    }
    .matrix-card{
      position:relative;
      min-height:210px;
      padding:22px;
      border-radius:24px;
      border:1px solid var(--border);
      background:linear-gradient(180deg,rgba(255,255,255,.095),rgba(255,255,255,.045));
      overflow:hidden;
      transition:transform var(--transition),border-color var(--transition),box-shadow var(--transition);
    }
    .matrix-card:hover{
      transform:translateY(-4px);
      border-color:rgba(55,215,255,.48);
      box-shadow:0 22px 60px rgba(0,0,0,.26);
    }
    .matrix-card::before{
      content:"";
      position:absolute;
      inset:0;
      background:radial-gradient(circle at 85% 8%,rgba(55,215,255,.18),transparent 36%);
      pointer-events:none;
    }
    .matrix-card .num{color:#72eaff;font-weight:900;font-size:.9rem}
    .matrix-card h3{position:relative;margin:14px 0 10px;font-size:1.15rem}
    .matrix-card p{position:relative;color:var(--muted);font-size:.95rem}
    .compare{
      margin-top:34px;
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:18px;
      align-items:start;
    }
    .compare-card{
      border-radius:var(--radius-lg);
      padding:26px;
      border:1px solid var(--border);
      background:rgba(255,255,255,.065);
    }
    .compare-card.after{
      border-color:rgba(55,215,255,.36);
      background:linear-gradient(135deg,rgba(55,215,255,.12),rgba(33,246,165,.07));
      box-shadow:0 0 35px rgba(55,215,255,.12);
    }
    .compare-card h3{font-size:1.35rem;margin-bottom:18px}
    .check-list{display:grid;gap:12px;list-style:none}
    .check-list li{
      display:flex;
      gap:11px;
      align-items:flex-start;
      color:var(--soft);
    }
    .check-list li::before{
      content:"";
      width:18px;height:18px;margin-top:5px;border-radius:50%;
      flex:0 0 auto;
      background:rgba(255,255,255,.14);
      border:1px solid rgba(255,255,255,.18);
    }
    .after .check-list li::before{
      background:linear-gradient(135deg,var(--primary),var(--accent));
      border:0;
      box-shadow:0 0 14px rgba(55,215,255,.45);
    }
    .news-shell{
      margin-top:34px;
      display:grid;
      grid-template-columns:minmax(0,1.45fr) minmax(290px,.75fr);
      gap:22px;
      align-items:start;
    }
    .news-list{
      border-radius:var(--radius-lg);
      border:1px solid var(--border);
      background:rgba(255,255,255,.06);
      overflow:hidden;
    }
    .news-item{
      display:grid;
      grid-template-columns:130px 1fr;
      gap:18px;
      padding:20px;
      border-bottom:1px solid rgba(255,255,255,.08);
      transition:background var(--transition);
    }
    .news-item:last-child{border-bottom:0}
    .news-item:hover{background:rgba(55,215,255,.07)}
    .news-date{
      color:#83efff;
      font-weight:850;
      font-size:.92rem;
    }
    .news-item h3{
      font-size:1.05rem;
      margin-bottom:5px;
      transition:color var(--transition);
    }
    .news-item a:hover h3{color:#83efff}
    .news-item p{color:var(--muted);font-size:.94rem}
    .recommend-panel{
      position:sticky;
      top:132px;
      border-radius:var(--radius-lg);
      padding:24px;
      border:1px solid rgba(55,215,255,.24);
      background:linear-gradient(180deg,rgba(55,215,255,.1),rgba(255,255,255,.055));
    }
    .recommend-panel h3{font-size:1.25rem;margin-bottom:14px}
    .rank-list{list-style:none;display:grid;gap:12px}
    .rank-list li{
      display:flex;
      gap:12px;
      align-items:flex-start;
      padding:12px;
      border-radius:16px;
      background:rgba(0,0,0,.14);
      border:1px solid rgba(255,255,255,.07);
    }
    .rank-list em{
      width:26px;height:26px;border-radius:9px;
      display:grid;place-items:center;
      flex:0 0 auto;
      color:#04101d;
      font-style:normal;
      font-weight:950;
      background:linear-gradient(135deg,var(--primary),var(--accent));
    }
    .rank-list strong{display:block;font-size:.96rem}
    .rank-list span{color:var(--muted);font-size:.88rem}
    .guide-grid{
      margin-top:34px;
      display:grid;
      grid-template-columns:repeat(4,1fr);
      gap:14px;
    }
    .guide-step{
      padding:22px;
      border-radius:24px;
      border:1px solid var(--border);
      background:rgba(255,255,255,.06);
    }
    .step-no{
      display:inline-flex;
      width:40px;height:40px;
      border-radius:14px;
      align-items:center;
      justify-content:center;
      margin-bottom:16px;
      color:#061423;
      background:linear-gradient(135deg,var(--warning),var(--primary));
      font-weight:950;
    }
    .guide-step h3{font-size:1.08rem;margin-bottom:8px}
    .guide-step p{color:var(--muted);font-size:.94rem}
    .progress-layout{
      margin-top:34px;
      display:grid;
      grid-template-columns:.9fr 1.1fr;
      gap:22px;
      align-items:center;
    }
    .progress-card{
      border-radius:var(--radius-lg);
      padding:26px;
      border:1px solid var(--border);
      background:rgba(255,255,255,.065);
    }
    .progress-bar{
      height:13px;
      border-radius:999px;
      background:rgba(255,255,255,.11);
      overflow:hidden;
      margin:18px 0 10px;
    }
    .progress-fill{
      width:76%;
      height:100%;
      border-radius:999px;
      background:linear-gradient(90deg,var(--primary),var(--accent));
      box-shadow:0 0 18px rgba(55,215,255,.55);
    }
    .progress-hint{color:#9eefff;font-weight:800}
    .task-list{list-style:none;display:grid;gap:12px}
    .task-list li{
      display:flex;
      justify-content:space-between;
      gap:14px;
      padding:16px;
      border-radius:18px;
      border:1px solid rgba(255,255,255,.09);
      background:rgba(255,255,255,.055);
    }
    .task-list strong{color:#fff}
    .task-list span{color:var(--accent);font-weight:850;white-space:nowrap}
    .faq-grid{
      margin-top:34px;
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:16px;
    }
    .faq-item{
      border-radius:24px;
      padding:22px;
      border:1px solid var(--border);
      background:rgba(255,255,255,.06);
      transition:border-color var(--transition),background var(--transition),transform var(--transition);
    }
    .faq-item:hover{
      transform:translateY(-2px);
      border-color:rgba(55,215,255,.42);
      background:rgba(255,255,255,.085);
    }
    .faq-item h3{font-size:1.08rem;margin-bottom:10px}
    .faq-item p{color:var(--muted);font-size:.96rem}
    .cta-panel{
      position:relative;
      overflow:hidden;
      border-radius:34px;
      padding:34px;
      border:1px solid rgba(55,215,255,.34);
      background:
        radial-gradient(circle at 15% 20%,rgba(55,215,255,.22),transparent 34%),
        radial-gradient(circle at 92% 15%,rgba(124,92,255,.2),transparent 32%),
        linear-gradient(135deg,rgba(255,255,255,.105),rgba(255,255,255,.05));
      box-shadow:var(--shadow);
    }
    .cta-panel::after{
      content:"";
      position:absolute;
      inset:auto -80px -120px auto;
      width:360px;height:360px;border-radius:50%;
      background:radial-gradient(circle,rgba(33,246,165,.16),transparent 70%);
      pointer-events:none;
    }
    .cta-grid{
      position:relative;
      z-index:1;
      display:grid;
      grid-template-columns:1fr 420px;
      gap:28px;
      align-items:start;
    }
    .cta-copy h2{
      font-size:clamp(1.8rem,3vw,3rem);
      line-height:1.15;
      margin-bottom:16px;
      letter-spacing:-.04em;
    }
    .cta-copy p{color:#c2d6eb;margin-bottom:22px;max-width:680px}
    .cta-points{
      display:grid;
      grid-template-columns:repeat(2,1fr);
      gap:12px;
      list-style:none;
    }
    .cta-points li{
      padding:13px 14px;
      border-radius:16px;
      background:rgba(255,255,255,.07);
      border:1px solid rgba(255,255,255,.1);
      color:#e6f7ff;
    }
    .contact-form{
      padding:22px;
      border-radius:24px;
      border:1px solid var(--border);
      background:rgba(3,12,24,.48);
      backdrop-filter:blur(18px);
    }
    .form-group{margin-bottom:14px}
    .form-group label{
      display:block;
      margin-bottom:7px;
      color:#dff7ff;
      font-weight:750;
      font-size:.92rem;
    }
    .form-group input,.form-group textarea,.form-group select{
      width:100%;
      border:1px solid rgba(255,255,255,.12);
      border-radius:15px;
      background:rgba(255,255,255,.075);
      color:var(--text);
      padding:12px 13px;
      transition:border-color var(--transition),box-shadow var(--transition),background var(--transition);
    }
    .form-group select option{background:#071426;color:#fff}
    .form-group textarea{min-height:96px;resize:vertical}
    .form-group input::placeholder,.form-group textarea::placeholder{color:#7f92aa}
    .form-group input:focus,.form-group textarea:focus,.form-group select:focus{
      border-color:rgba(55,215,255,.55);
      box-shadow:0 0 0 4px rgba(55,215,255,.1);
      background:rgba(255,255,255,.1);
    }
    .form-tip{margin-top:12px;color:#9fb4ca;font-size:.88rem}
    .site-footer{
      border-top:1px solid var(--border);
      background:rgba(3,8,18,.72);
      padding:38px 0 28px;
    }
    .footer-grid{
      display:grid;
      grid-template-columns:1.2fr .8fr .8fr;
      gap:26px;
      align-items:start;
    }
    .footer-brand{
      display:flex;
      align-items:center;
      gap:11px;
      margin-bottom:12px;
      font-size:1.15rem;
      font-weight:900;
    }
    .footer-desc{color:var(--muted);max-width:520px}
    .footer-col h3{font-size:1rem;margin-bottom:12px}
    .footer-links{list-style:none;display:grid;gap:9px}
    .footer-links a{
      color:var(--muted);
      transition:color var(--transition),transform var(--transition);
      display:inline-flex;
    }
    .footer-links a:hover{color:#83efff;transform:translateX(2px)}
    .copyright{
      margin-top:28px;
      padding-top:18px;
      border-top:1px solid rgba(255,255,255,.08);
      color:#8395aa;
      font-size:.9rem;
      display:flex;
      justify-content:space-between;
      gap:16px;
      flex-wrap:wrap;
    }
    @media (max-width:1024px){
      .dashboard,.cases-layout,.progress-layout,.cta-grid{grid-template-columns:1fr}
      .matrix-wrap,.guide-grid{grid-template-columns:repeat(2,1fr)}
      .recommend-panel{position:static}
      .news-shell{grid-template-columns:1fr}
      .cta-grid{gap:22px}
    }
    @media (max-width:768px){
      .container{width:min(100% - 28px,var(--container))}
      .brand-row{align-items:flex-start;flex-direction:column}
      .header-tools{width:100%;justify-content:space-between}
      .mini-search{width:100%;max-width:none}
      .header-cta{flex:0 0 auto}
      .hero{min-height:auto;padding:64px 0 56px}
      .hero-search{flex-direction:column;align-items:stretch;border-radius:24px}
      .hero-search .btn{width:100%}
      .hero-stats{grid-template-columns:1fr}
      .case-item{grid-template-columns:56px 1fr}
      .case-result{grid-column:2;white-space:normal}
      .case-icon{width:52px;height:52px;border-radius:16px}
      .metric-grid,.compare,.faq-grid,.cta-points,.footer-grid{grid-template-columns:1fr}
      .section{padding:58px 0}
      .section-sm{padding:46px 0}
      .news-item{grid-template-columns:1fr;gap:7px}
      .cta-panel{padding:24px;border-radius:26px}
    }
    @media (max-width:520px){
      h1{font-size:2.55rem}
      .section-title{font-size:1.75rem}
      .header-tools{flex-direction:column;align-items:stretch}
      .header-cta{width:100%}
      .matrix-wrap,.guide-grid{grid-template-columns:1fr}
      .hero-badge-row{justify-content:flex-start}
      .hero-inner{text-align:left}
      .quick-entry{justify-content:flex-start}
      .hero-stat{text-align:left}
      .btn{width:100%}
      .task-list li{flex-direction:column}
      .copyright{display:block}
      .copyright span{display:block;margin-top:8px}
    }