/* 自动续费与取消 帮助文档；沿用站点暖白、绿色与圆角卡片体系。 */
.doc-page{background:#fdfefa}
.doc-hero{width:min(1360px,calc(100% - 48px));margin:45px auto 0;padding:69px 35px 58px;text-align:center;border:1px solid #e4e9df;border-radius:27px;background-color:#f3f6ef;background-image:radial-gradient(#ccd9c440 .8px,transparent .8px);background-size:22px 22px;position:relative;overflow:hidden}
.doc-hero>.eyebrow{justify-content:center;color:#5b9671;font-size:11px;letter-spacing:2.2px;margin-bottom:19px}
.doc-hero h1{font-size:clamp(34px,4.6vw,55px);letter-spacing:-2px;line-height:1.3;font-weight:750}
.doc-lead{max-width:790px;margin:19px auto 0;font-size:13px;color:#87917c;line-height:1.95}
.doc-meta{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:11px;margin-top:26px;font-size:10px;color:#89997a}
.doc-meta>span{font-weight:600;color:#39845a}
.doc-meta i{height:11px;width:1px;background:#d4ddcd}
.doc-meta a{color:#89997a}
.doc-meta a:hover{color:#258a55}
.doc-motif{position:absolute;color:#dbe7d0;line-height:1;pointer-events:none;font-size:152px;opacity:.55}
.doc-motif.left{left:4%;top:120px;transform:rotate(-15deg)}
.doc-motif.right{right:5%;top:110px;transform:rotate(9deg)}
.doc-body{padding-top:54px;padding-bottom:10px}
.doc-grid{display:grid;grid-template-columns:1.12fr 1fr;gap:25px;max-width:1000px;margin:0 auto}
.doc-card{border:1px solid #e2e8db;border-radius:16px;padding:30px 32px;background:#f9fbf5}
.doc-card h2{font-size:18px;font-weight:600}
.doc-card>p{margin-top:12px;font-size:12px;color:#8f9c83;line-height:1.9}
.doc-steps{list-style:none;padding:0;margin:26px 0 0;counter-reset:docstep}
.doc-steps li{counter-increment:docstep;position:relative;margin:0 0 22px;padding-left:37px;font-size:13px;line-height:1.9;color:#48533f}
.doc-steps li:last-child{margin-bottom:0}
.doc-steps li:before{content:counter(docstep);position:absolute;left:0;top:2px;width:24px;height:24px;display:grid;place-items:center;background:#e9f1df;color:#7b9867;border:1px solid #dbe6ce;border-radius:50%;font-size:11px}
.doc-steps li strong{font-weight:650;color:#2b3a2b}
.doc-steps a{color:#267249;text-decoration:underline;text-decoration-color:#b6d3a2;text-underline-offset:4px}
.doc-steps a:hover{color:#258a55;text-decoration-color:#8fbf74}
.doc-bullets{list-style:none;padding:0;margin:24px 0 0}
.doc-bullets li{position:relative;margin:0 0 16px;padding-left:21px;font-size:13px;line-height:1.9;color:#48533f}
.doc-bullets li:last-child{margin-bottom:0}
.doc-bullets li:before{content:"";position:absolute;left:2px;top:11px;width:6px;height:6px;border-radius:50%;background:#8dbf68}
.doc-cta{display:flex;align-items:center;justify-content:space-between;gap:30px;max-width:1000px;margin:26px auto 0;padding:32px 38px;border:1px solid #dce6d0;border-radius:17px;background:#eaf1df}
.doc-cta .eyebrow{font-size:8px;letter-spacing:1.6px;margin-bottom:12px;color:#8a9e77}
.doc-cta h2{font-size:24px;font-weight:600;letter-spacing:-.5px}
.doc-cta p{font-size:11px;color:#90a07e;margin-top:9px}
.doc-cta-actions{display:flex;align-items:center;gap:10px;flex:none}
.doc-cta .button{font-size:12px;gap:9px;white-space:nowrap}
.doc-page .footer{padding-top:32px}
@media(max-width:950px){.doc-hero{padding-top:55px}.doc-hero h1{font-size:46px}.doc-motif{font-size:120px;opacity:.4}.doc-motif.left{left:-46px}.doc-motif.right{right:-40px}.doc-grid{gap:17px}.doc-card{padding:26px 25px}.doc-card h2{font-size:17px}.doc-cta{padding:29px}}
@media(max-width:760px){.doc-grid{grid-template-columns:1fr}}
@media(max-width:640px){.doc-hero{width:calc(100% - 26px);margin-top:20px;border-radius:18px;padding:39px 18px 28px}.doc-hero>.eyebrow{font-size:8px;letter-spacing:1.5px;margin-bottom:17px}.doc-hero h1{font-size:34px;letter-spacing:-1px}.doc-lead{font-size:11px;line-height:1.95}.doc-meta{margin-top:21px;font-size:9px;gap:8px}.doc-motif{display:none}.doc-body{padding-top:32px}.doc-card{padding:24px 22px;border-radius:14px}.doc-card h2{font-size:16px}.doc-steps{margin-top:22px}.doc-steps li{font-size:12px;padding-left:33px;margin-bottom:19px}.doc-bullets li{font-size:12px}.doc-cta{display:block;padding:26px 22px;border-radius:14px}.doc-cta h2{font-size:22px}.doc-cta-actions{margin-top:20px;flex-wrap:wrap}.doc-page .footer{padding-top:12px}}
@media(max-width:370px){.doc-cta-actions{flex-direction:column;align-items:stretch}.doc-cta-actions .button{justify-content:center}}
@media print{.doc-motif,.doc-cta-actions{display:none}.doc-hero{border:0;background:none}.doc-grid{display:block}.doc-card{break-inside:avoid;margin:18px 0}.doc-cta{background:#fff}}
