/* pages/escort/guide.wxss 内页规范:小色带 + 白底,不用整块主色面板; 卡片沿用首页「发丝边 + 紧阴影」,与首页保持同一套视觉语言 */ page { --brand-strong: #C2410C; /* 实心块/按钮:白字 4.69:1,过 AA 正文 */ --brand-soft: #FFF4E8; /* 图标衬底、标签底 */ --brand-line: #FFE0C2; /* 浅橙衬底描边 */ --brand-ink: #9A3412; /* 浅橙衬底上的文字/图标:6.8:1,过 AA */ --ink: #2B2521; --ink-2: #4A4038; --muted: #7A7068; /* 白底 4.8:1,过 AA 正文 */ --line: #F0E9E0; /* 米色发丝边 */ --paper: #FAF6F0; /* 暖白纸面 */ --white: #FFFFFF; --shadow-card: 0 2rpx 10rpx rgba(63, 43, 25, 0.04); background-color: var(--paper); } .page-bg { min-height: 100vh; background: var(--paper); } .container { padding: 32rpx 32rpx 0; } /* ===== 头部:小色带 + 深墨标题 ===== */ .page-header { padding: 24rpx 0 8rpx; } .header-accent { width: 64rpx; height: 8rpx; border-radius: 4rpx; background: var(--brand-strong); } .header-title { display: block; margin-top: 20rpx; font-size: 46rpx; font-weight: 700; color: var(--ink); letter-spacing: 1rpx; } .header-subtitle { display: block; margin-top: 12rpx; font-size: 26rpx; color: var(--muted); letter-spacing: 1rpx; } /* ===== 通用白卡 ===== */ .card { margin-top: 32rpx; padding: 28rpx 26rpx; border-radius: 28rpx; background: var(--white); border: 2rpx solid var(--line); box-shadow: var(--shadow-card); } .card-head { display: flex; align-items: center; margin-bottom: 20rpx; } .card-mark { width: 44rpx; height: 44rpx; border-radius: 12rpx; background: var(--brand-strong); display: flex; align-items: center; justify-content: center; flex-shrink: 0; } .card-title { margin-left: 14rpx; font-size: 32rpx; font-weight: 700; color: var(--ink); letter-spacing: 1rpx; } /* ===== 服务流程:左侧序号 + 递进条目 ===== */ .step-item { display: flex; padding: 18rpx 0; } .step-index { width: 44rpx; height: 44rpx; border-radius: 50%; background: var(--brand-soft); color: var(--brand-ink); font-size: 26rpx; font-weight: 700; display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-right: 20rpx; } .step-body { display: flex; flex-direction: column; flex: 1; min-width: 0; } .step-title { font-size: 30rpx; font-weight: 600; color: var(--ink); } .step-desc { margin-top: 8rpx; font-size: 26rpx; color: var(--muted); line-height: 1.6; } /* ===== 要点列表 ===== */ .dot-item { display: flex; padding: 12rpx 0; } .dot { width: 10rpx; height: 10rpx; border-radius: 50%; background: var(--brand-strong); margin: 16rpx 18rpx 0 4rpx; flex-shrink: 0; } .dot-text { flex: 1; font-size: 28rpx; color: var(--ink-2); line-height: 1.7; } /* ===== 底部出口 ===== */ .guide-cta { display: flex; align-items: center; justify-content: center; margin-top: 48rpx; padding: 26rpx; border-radius: 999rpx; background: var(--brand-strong); box-shadow: 0 6rpx 16rpx rgba(194, 65, 12, 0.22); transition: transform 0.15s ease; } .guide-cta:active { transform: scale(0.98); } .guide-cta-text { font-size: 30rpx; font-weight: 600; color: var(--white); letter-spacing: 2rpx; margin-right: 6rpx; } .guide-help { display: flex; align-items: center; justify-content: center; margin-top: 24rpx; padding: 22rpx; border-radius: 20rpx; background: var(--brand-soft); border: 2rpx solid var(--brand-line); } .guide-help:active { opacity: 0.75; } .guide-help-text { margin-left: 12rpx; font-size: 26rpx; font-weight: 600; color: var(--brand-ink); } .footer-space { height: 60rpx; }