/* 页面整体背景 - 橙色 */
body {
    background-color: #FF9800;
}
.container {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    position: relative;
}
/* 自定义导航栏 */
.nav-bar {
    height: 2.75rem;
    /* 标准导航栏高度 */
    display: flex;
    align-items: center;
    padding: 0 0.9375rem;
    /* 适配状态栏高度在 vue 中通过 padding-top 实现，这里仅控制栏本身 */
}
.back-icon {
    font-size: 1.875rem;
    color: #fff;
    font-weight: bold;
    /* 增大点击区域 */
    width: 1.875rem;
    height: 1.875rem;
    line-height: 1.75rem;
    text-align: center;
    display: block;
}
/* 头部文案 */
.header-area {
    padding: 1.25rem 1.25rem 0.625rem;
    color: #fff;
    text-align: center;
}
.main-title {
    font-size: 1.5rem;
    font-weight: bold;
    display: block;
    margin-bottom: 0.625rem;
}
.sub-title {
    font-size: 1rem;
    opacity: 0.9;
    display: block;
}
/* 内容卡片 */
.content-card {
    background-color: #fff;
    border-radius: 0.9375rem;
    /* 四周圆角 */
    margin: 1.25rem 0.9375rem;
    /* 上下40 左右30 */
    padding: 1.875rem 1.25rem;
    display: flex;
    flex-direction: column;
    box-shadow: 0 0.3125rem 0.9375rem rgba(0, 0, 0, 0.1);
}
.benefit-item {
    display: flex;
    align-items: center;
    /* 垂直居中对齐 */
    margin-bottom: 1.875rem;
}
.icon-circle {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 0.9375rem;
    flex-shrink: 0;
    color: #fff;
    /* 图标文字白色 */
    font-weight: bold;
}
/* 图1 配色复刻 */
.icon-money {
    background-color: #26A69A;
    /* 青色/绿色 */
}
.icon-loc {
    background-color: #2979FF;
    /* 蓝色 */
}
.icon-clock {
    background-color: #FF7043;
    /* 橙色 */
}
.icon-text {
    font-size: 1.25rem;
}
.info {
    flex: 1;
}
.item-title {
    font-size: 1rem;
    font-weight: bold;
    color: #333;
    margin-bottom: 0.25rem;
    /* 减小间距 */
    display: block;
}
.item-desc {
    font-size: 0.8125rem;
    color: #666;
    line-height: 1.6;
    display: block;
}
/* 底部区域 */
.footer-area {
    margin-top: auto;
    /* 推到最底部 */
    padding: 0.625rem 1.25rem 2.5rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    /* 移除白色背景，呈现底色橙色 */
}
.join-btn {
    width: 100%;
    height: 2.8125rem;
    line-height: 2.8125rem;
    background: #fff;
    /* 白色按钮 */
    color: #FF5722;
    /* 橙色文字 */
    font-size: 1.0625rem;
    font-weight: bold;
    border-radius: 1.40625rem;
    box-shadow: 0 0.3125rem 0.625rem rgba(0, 0, 0, 0.1);
}
.join-btn::after {
    border: none;
}
.faq {
    margin-top: 0.9375rem;
    color: #fff;
    /* 白色文字 */
    font-size: 0.8125rem;
    display: flex;
    align-items: center;
}
.help-icon {
    width: 0.9375rem;
    height: 0.9375rem;
    border: 1px solid #fff;
    /* 白色边框 */
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.625rem;
    margin-right: 0.3125rem;
    color: #fff;
    /* 白色问号 */
}
