/* ============ 服务协议 agreement.html 专属 ============ */
.agr-wrap{max-width:920px;margin:0 auto;padding:0 32px}

/* 顶部条款速跳 */
.agr-quick{position:sticky;top:88px;z-index:5;margin:0 auto 36px;max-width:920px;background:rgba(255,255,255,.85);backdrop-filter:blur(14px);border:1px solid var(--line);border-radius:999px;padding:10px 12px;box-shadow:var(--shadow-sm);display:flex;gap:6px;flex-wrap:wrap;justify-content:center}
.agr-quick a{padding:7px 16px;border-radius:999px;font-size:13px;font-weight:600;color:var(--ink-500);transition:background .25s,color .25s}
.agr-quick a:hover{background:var(--grad-brand);color:#fff}

/* 正文纸面 */
.agr-paper{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:48px 54px;box-shadow:var(--shadow-sm)}
.agr-meta{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px;padding-bottom:24px;margin-bottom:30px;border-bottom:2px solid var(--grad-brand)}
.agr-meta .agr-title{font-size:26px;font-weight:900;color:var(--ink-900)}
.agr-meta .agr-ver{font-size:12.5px;font-weight:600;color:var(--purple-700);background:var(--grad-brand-soft);border:1px solid var(--line);padding:6px 14px;border-radius:999px}
.agr-lead{font-size:15px;color:var(--ink-500);margin-bottom:34px}

/* 条款块 */
.agr-clause{position:relative;padding:24px 0 24px 56px;border-top:1px dashed var(--line);scroll-margin-top:140px}
.agr-clause:first-of-type{border-top:0}
.agr-clause-no{position:absolute;left:0;top:24px;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font-size:15px;font-weight:900;color:#fff;background:var(--grad-brand);box-shadow:0 6px 14px rgba(109,31,184,.26);font-variant-numeric:tabular-nums}
.agr-clause:first-of-type .agr-clause-no{top:0}
.agr-clause h2{font-size:19px;margin-bottom:12px;color:var(--ink-900)}
.agr-clause p{font-size:14.5px;color:var(--ink-700);margin-bottom:10px}
.agr-clause ul{display:grid;gap:6px;margin:8px 0 14px}
.agr-clause ul li{position:relative;padding-left:22px;font-size:14px;color:var(--ink-700)}
.agr-clause ul li::before{content:"";position:absolute;left:2px;top:10px;width:8px;height:8px;border-radius:2px;background:var(--blue-400);transform:rotate(45deg)}

/* 双方义务对照 */
.agr-duties{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:18px 0}
.agr-duty{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);padding:20px 22px}
.agr-duty.party-a{border-top:3px solid var(--purple-500)}
.agr-duty.party-b{border-top:3px solid var(--blue-500)}
.agr-duty h4{display:flex;align-items:center;gap:10px;font-size:15px;margin-bottom:12px}
.agr-duty .d-badge{font-size:11px;font-weight:800;color:#fff;padding:3px 10px;border-radius:999px;background:var(--grad-brand)}
.agr-duty.party-b .d-badge{background:linear-gradient(120deg,#00b4ff,#0084ff)}
.agr-duty ul li::before{background:var(--grad-brand)}
.agr-duty.party-b ul li::before{background:linear-gradient(120deg,#22d3ee,#0084ff)}

/* 交付里程碑 */
.agr-milestone{margin:18px 0;display:grid;grid-template-columns:repeat(4,1fr);gap:0;position:relative}
.agr-milestone::before{content:"";position:absolute;left:8%;right:8%;top:24px;height:2px;background:linear-gradient(90deg,var(--purple-400),var(--blue-400));opacity:.4}
.agr-ms{position:relative;text-align:center;padding:0 6px}
.agr-ms-dot{width:50px;height:50px;border-radius:999px;display:grid;place-items:center;margin:0 auto 12px;color:#fff;background:var(--grad-brand);box-shadow:var(--shadow-sm);position:relative;z-index:2}
.agr-ms-dot svg{width:22px;height:22px}
.agr-ms h4{font-size:14px;margin-bottom:3px}
.agr-ms p{font-size:12px;color:var(--ink-500);margin:0}
.agr-ms span{display:block;font-size:11px;font-weight:700;color:var(--purple-500);margin-top:4px}

/* 定义表 */
.agr-table{width:100%;border-collapse:collapse;margin:18px 0;font-size:13.5px;border:1px solid var(--line);border-radius:var(--r-md);overflow:hidden}
.agr-table th,.agr-table td{padding:12px 16px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
.agr-table thead th{background:var(--grad-brand-soft);color:var(--purple-700);font-weight:700;font-size:13px}
.agr-table tbody tr:last-child td{border-bottom:0}
.agr-table td:first-child{font-weight:600;color:var(--ink-900);width:28%}
.agr-table tbody tr:hover{background:rgba(168,85,247,.03)}

/* 提示条 */
.agr-note{display:flex;gap:12px;align-items:flex-start;background:linear-gradient(135deg,rgba(0,180,255,.08),rgba(168,85,247,.08));border:1px solid var(--line);border-radius:var(--r-md);padding:16px 20px;margin:18px 0}
.agr-note svg{width:20px;height:20px;color:var(--blue-600);flex:none;margin-top:2px}
.agr-note p{font-size:13.5px;color:var(--ink-700);margin:0}

/* 签署块 */
.agr-sign{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:40px;padding-top:30px;border-top:1px dashed var(--line)}
.agr-sign-block{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);padding:22px 24px}
.agr-sign-block h4{font-size:14px;margin-bottom:14px;color:var(--ink-900)}
.agr-sign-block .s-line{display:flex;justify-content:space-between;font-size:13px;color:var(--ink-500);padding:8px 0;border-bottom:1px dashed var(--line)}
.agr-sign-block .s-line:last-child{border-bottom:0}
.agr-sign-block .s-line b{color:var(--ink-700);font-weight:600}

.agr-foot{text-align:center;margin-top:36px;font-size:12.5px;color:var(--ink-300)}

@media (max-width:760px){
  .agr-paper{padding:32px 24px}
  .agr-clause{padding-left:0;padding-top:48px}
  .agr-clause-no{top:0}
  .agr-clause:first-of-type .agr-clause-no{top:0}
  .agr-duties,.agr-milestone,.agr-sign{grid-template-columns:1fr}
  .agr-milestone::before{display:none}
  .agr-quick{position:static;border-radius:var(--r-md)}
}