/* ============================================================
   Apple 质感英雄栏（统一规范 2026-09）
   深蓝紫渐变 + 金色点缀 + 毛玻璃数据卡片
   类名前缀：apple-hero
   ============================================================ */
.apple-hero {
    position: relative;
    overflow: hidden;
    border-radius: 20px;
    padding: 56px 40px 48px;
    background: linear-gradient(135deg, #0d1b2a 0%, #1b2a4a 55%, #2a1b4a 100%);
    color: #ffffff;
    box-shadow: 0 24px 64px rgba(13, 27, 42, 0.28);
}

/* 右上角柔和光晕 */
.apple-hero::before {
    content: "";
    position: absolute;
    top: -180px;
    right: -140px;
    width: 520px;
    height: 520px;
    background: radial-gradient(circle, rgba(240, 192, 64, 0.22) 0%, rgba(240, 192, 64, 0) 68%);
    pointer-events: none;
}

/* 网格纹理 */
.apple-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px);
    background-size: 34px 34px;
    pointer-events: none;
}

/* 右下角半透明图标 */
.apple-hero-icon {
    position: absolute;
    right: 20px;
    bottom: 4px;
    font-size: 150px;
    line-height: 1;
    opacity: 0.12;
    transform: rotate(-10deg);
    pointer-events: none;
    user-select: none;
}

.apple-hero-inner {
    position: relative;
    z-index: 1;
    max-width: 900px;
}

/* 顶部标签 */
.apple-hero-tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 16px;
    margin-bottom: 18px;
    border: 1px solid rgba(240, 192, 64, 0.45);
    border-radius: 999px;
    background: rgba(240, 192, 64, 0.10);
    color: #f0c040;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.04em;
}

/* 主标题（覆盖全局 h1 紫色 !important 规则） */
body .site-shell .apple-hero h1,
body .site-shell .apple-hero .apple-hero-title {
    margin: 0 0 12px;
    color: #ffffff !important;
    font-size: clamp(30px, 4.2vw, 46px);
    font-weight: 800 !important;
    line-height: 1.18;
    letter-spacing: -0.01em;
    text-shadow: 0 4px 24px rgba(0, 0, 0, 0.25);
}

/* 副标题 */
.apple-hero-sub {
    margin: 0 0 10px;
    color: rgba(255, 255, 255, 0.8);
    font-size: 17px;
    line-height: 1.7;
    font-weight: 500;
}

/* 描述文字 */
.apple-hero-desc {
    margin: 0;
    color: rgba(255, 255, 255, 0.6);
    font-size: 15px;
    line-height: 1.7;
    max-width: 680px;
}

/* 福利标签（金色胶囊） */
.apple-hero-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 18px;
    padding: 9px 18px;
    border-radius: 999px;
    background: rgba(240, 192, 64, 0.14);
    border: 1px solid rgba(240, 192, 64, 0.5);
    color: #fde6a8;
    font-size: 14px;
    font-weight: 600;
}

/* 数据卡片区 */
.apple-hero-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 28px;
}

.apple-hero-stat {
    min-width: 128px;
    padding: 18px 22px;
    border-radius: 16px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.apple-hero-stat-num {
    display: block;
    color: #ffffff;
    font-size: 30px;
    font-weight: 800;
    line-height: 1.1;
}

.apple-hero-stat-label {
    display: block;
    margin-top: 6px;
    color: rgba(255, 255, 255, 0.5);
    font-size: 13px;
    font-weight: 500;
}

/* 纯文本型数据（无 数字/标签 两段式，如“实时更新”“编审支持”） */
.apple-hero-stat-txt {
    display: block;
    color: #ffffff;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.4;
}

/* 按钮区 */
.apple-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 32px;
}

/* 金色渐变主按钮 */
.apple-hero-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 30px;
    border: none;
    border-radius: 999px;
    background: linear-gradient(135deg, #f0c040 0%, #d4a020 100%);
    color: #0d1b2a !important;
    font-size: 15px;
    font-weight: 800;
    font-family: inherit;
    text-decoration: none;
    cursor: pointer;
    box-shadow: 0 10px 26px rgba(240, 192, 64, 0.32);
    transition: transform 0.22s ease, box-shadow 0.22s ease, filter 0.22s ease;
}

.apple-hero-btn:hover {
    transform: translateY(-2px);
    filter: brightness(1.06);
    box-shadow: 0 14px 34px rgba(240, 192, 64, 0.42);
}

/* 次要描边按钮 */
.apple-hero-btn-ghost {
    background: transparent;
    color: #ffffff !important;
    border: 2px solid rgba(255, 255, 255, 0.55);
    box-shadow: none;
    cursor: pointer;
    font-family: inherit;
}

.apple-hero-btn-ghost:hover {
    background: rgba(255, 255, 255, 0.10);
    border-color: #f0c040;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
}

/* 移动端适配 */
@media (max-width: 768px) {
    .apple-hero {
        padding: 40px 22px 36px;
        border-radius: 16px;
    }
    .apple-hero-icon {
        font-size: 110px;
        right: 12px;
        bottom: 2px;
    }
    .apple-hero-stats {
        gap: 10px;
    }
    .apple-hero-stat {
        min-width: 0;
        flex: 1 1 40%;
        padding: 14px 16px;
    }
    .apple-hero-btn {
        width: 100%;
        justify-content: center;
    }
}

/* ============================================================
   Apple 质感英雄栏 · 品牌深紫版（统一 2026-09-03）
   深紫 #4A3A6B 渐变 + 金色点缀 + 毛玻璃数据卡片
   类名前缀：hero-apple（与 .apple-hero 并存，供该 5 个页面使用）
   ============================================================ */
.hero-apple {
    position: relative;
    overflow: hidden;
    border-radius: 20px;
    padding: 56px 40px 48px;
    background: linear-gradient(145deg, #4A3A6B 0%, #3A2A5B 55%, #2A1A4B 100%);
    color: #ffffff;
    box-shadow: 0 24px 64px rgba(42, 26, 75, 0.28);
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Inter', 'PingFang SC', 'Microsoft YaHei', sans-serif;
}

/* 右上角柔和光晕 */
.hero-apple::before {
    content: "";
    position: absolute;
    top: -180px;
    right: -140px;
    width: 520px;
    height: 520px;
    background: radial-gradient(circle, rgba(240, 192, 64, 0.22) 0%, rgba(240, 192, 64, 0) 68%);
    pointer-events: none;
}

/* 网格纹理装饰层 */
.hero-apple-grid {
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.05) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.05) 1px, transparent 1px);
    background-size: 34px 34px;
    pointer-events: none;
}

/* 右下角半透明主题图标 */
.hero-apple-icon {
    position: absolute;
    right: 20px;
    bottom: 4px;
    font-size: 150px;
    line-height: 1;
    opacity: 0.12;
    transform: rotate(-10deg);
    pointer-events: none;
    user-select: none;
}

/* 内容层 */
.hero-apple-content {
    position: relative;
    z-index: 1;
    max-width: 900px;
}

/* 顶部金色标签 */
.hero-apple-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 7px 16px;
    margin-bottom: 18px;
    border: 1px solid rgba(240, 192, 64, 0.45);
    border-radius: 999px;
    background: rgba(240, 192, 64, 0.10);
    color: #f0c040;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.04em;
}

/* 主标题（覆盖全局 h1 紫色 !important 规则） */
body .site-shell .hero-apple h1,
body .site-shell .hero-apple .hero-apple-title,
.hero-apple-title {
    margin: 0 0 12px;
    color: #ffffff !important;
    font-size: clamp(30px, 4.2vw, 40px);
    font-weight: 800 !important;
    line-height: 1.18;
    letter-spacing: -0.01em;
    font-family: inherit;
    text-shadow: 0 4px 24px rgba(0, 0, 0, 0.25);
}

/* 副标题 */
.hero-apple-sub {
    margin: 0 0 10px;
    color: rgba(255, 255, 255, 0.8);
    font-size: 17px;
    line-height: 1.7;
    font-weight: 500;
}

/* 描述文字 */
.hero-apple-desc {
    margin: 0;
    color: rgba(255, 255, 255, 0.75);
    font-size: 16px;
    line-height: 1.7;
    max-width: 680px;
}

/* 数据卡片区 */
.hero-apple-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 28px;
}

.hero-apple-stat {
    min-width: 128px;
    padding: 18px 22px;
    border-radius: 14px;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.hero-apple-stat .number {
    display: block;
    color: #ffffff;
    font-size: 26px;
    font-weight: 700;
    line-height: 1.1;
}

.hero-apple-stat .label {
    display: block;
    margin-top: 6px;
    color: rgba(255, 255, 255, 0.5);
    font-size: 14px;
    font-weight: 500;
}

/* 纯文字型数据卡（无 数字/标签 两段式） */
.hero-apple-stat-txt {
    display: block;
    color: #ffffff;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.4;
}

/* 按钮区（容器） */
.hero-apple-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 14px;
    margin-top: 32px;
}

/* 金色渐变主按钮 */
.hero-apple-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 14px 40px;
    border: none;
    border-radius: 30px;
    background: linear-gradient(145deg, #f0c040 0%, #d4a020 100%);
    color: #2A1A4B !important;
    font-size: 15px;
    font-weight: 600;
    font-family: inherit;
    text-decoration: none;
    cursor: pointer;
    box-shadow: 0 10px 26px rgba(240, 192, 64, 0.32);
    transition: transform 0.22s ease, box-shadow 0.22s ease, filter 0.22s ease;
}

.hero-apple-btn:hover {
    transform: translateY(-2px);
    filter: brightness(1.06);
    box-shadow: 0 14px 34px rgba(240, 192, 64, 0.42);
}

/* 次要描边按钮 */
.hero-apple-btn-ghost {
    background: transparent;
    color: #ffffff !important;
    border: 2px solid rgba(255, 255, 255, 0.55);
    box-shadow: none;
    cursor: pointer;
    font-family: inherit;
}

.hero-apple-btn-ghost:hover {
    background: rgba(255, 255, 255, 0.10);
    border-color: #f0c040;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);
}

/* 移动端适配 */
@media (max-width: 768px) {
    .hero-apple {
        padding: 40px 22px 36px;
        border-radius: 16px;
    }
    .hero-apple-icon {
        font-size: 110px;
        right: 12px;
        bottom: 2px;
    }
    .hero-apple-stats {
        gap: 10px;
    }
    .hero-apple-stat {
        min-width: 0;
        flex: 1 1 40%;
        padding: 14px 16px;
    }
    .hero-apple-btn {
        width: 100%;
        justify-content: center;
    }
    .hero-apple-btn-ghost {
        width: 100%;
        justify-content: center;
    }
}

/* ============================================================
   Apple 英雄栏 · 品牌主题变体（2026-09-05 统一品牌色体系）
   品牌紫 #4A3A6B · 品牌金 #D4AF37 · 浅紫 #F7F4FC · 深紫 #2E2445
   在 .apple-hero 基础上按页面差异化配色
   ============================================================ */

/* —— 品牌紫渐变（about / journal-list / journal-match） —— */
.apple-hero--purple {
    background: linear-gradient(135deg, #4A3A6B 0%, #2E2445 100%);
    box-shadow: 0 24px 64px rgba(46, 36, 69, 0.30);
}

/* —— 深紫 → 品牌紫 渐变（author-check） —— */
.apple-hero--deep {
    background: linear-gradient(135deg, #2E2445 0%, #4A3A6B 100%);
    box-shadow: 0 24px 64px rgba(46, 36, 69, 0.30);
}

/* —— 金色 → 品牌紫 渐变（membership） —— */
.apple-hero--gold {
    background: linear-gradient(135deg, #D4AF37 0%, #B8940F 40%, #4A3A6B 100%);
    box-shadow: 0 24px 64px rgba(74, 58, 107, 0.32);
}
.apple-hero--gold::before {
    background: radial-gradient(circle, rgba(255, 255, 255, 0.38) 0%, rgba(255, 255, 255, 0) 68%);
}
.apple-hero--gold .apple-hero-tag {
    border-color: rgba(255, 255, 255, 0.65);
    background: rgba(74, 58, 107, 0.35);
    color: #FFF8E1;
}
/* 金色渐变上主按钮改用品牌紫，白字，避免与金底同色（不误伤幽灵按钮） */
.apple-hero--gold .apple-hero-btn:not(.apple-hero-btn-ghost) {
    background: #4A3A6B;
    color: #FFFFFF !important;
    box-shadow: 0 10px 26px rgba(74, 58, 107, 0.34);
}
.apple-hero--gold .apple-hero-btn:not(.apple-hero-btn-ghost):hover {
    background: #3a2a5b;
    filter: none;
    box-shadow: 0 14px 34px rgba(74, 58, 107, 0.42);
}
.apple-hero--gold .apple-hero-btn-ghost {
    border-color: rgba(255, 255, 255, 0.75);
}

/* —— 浅紫背景（submission / about-guide） —— */
.apple-hero--light {
    background: linear-gradient(160deg, #F7F4FC 0%, #F1EAF8 68%, #FAF1D6 100%);
    color: #4A3A6B;
    box-shadow: 0 24px 64px rgba(74, 58, 107, 0.14);
}
/* 浅紫主题：深色网格换成柔金色网格纹理 */
.apple-hero--light::after {
    background-image:
        linear-gradient(rgba(212, 175, 55, 0.10) 1px, transparent 1px),
        linear-gradient(90deg, rgba(212, 175, 55, 0.10) 1px, transparent 1px);
}
.apple-hero--light .apple-hero-icon { opacity: 0.10; }

/* 浅紫主题标题（覆盖全局 h1 紫色 !important 规则） */
body .site-shell .apple-hero--light h1,
body .site-shell .apple-hero--light .apple-hero-title {
    color: #4A3A6B !important;
    text-shadow: none;
}
.apple-hero--light .apple-hero-tag {
    border-color: rgba(212, 175, 55, 0.55);
    background: #FFFFFF;
    color: #8A5A00;
}
.apple-hero--light .apple-hero-desc { color: #6B6882; }
.apple-hero--light .apple-hero-badge {
    background: linear-gradient(135deg, #D4AF37 0%, #c4a030 100%);
    border: none;
    color: #4A3A6B;
}
.apple-hero--light .apple-hero-stat {
    border-color: rgba(74, 58, 107, 0.10);
    background: #FFFFFF;
}
.apple-hero--light .apple-hero-stat-num,
.apple-hero--light .apple-hero-stat-txt { color: #4A3A6B; }
.apple-hero--light .apple-hero-stat-label { color: #6B6882; }
.apple-hero--light .apple-hero-btn-ghost {
    border-color: rgba(74, 58, 107, 0.45);
    color: #4A3A6B !important;
}
.apple-hero--light .apple-hero-btn-ghost:hover {
    background: rgba(74, 58, 107, 0.08);
    border-color: #8A5A00;
}

/* —— 通用按钮：品牌紫底（浅紫主题主按钮） —— */
.apple-hero-btn-purple {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 30px;
    border: none;
    border-radius: 999px;
    background: #4A3A6B;
    color: #FFFFFF !important;
    font-size: 15px;
    font-weight: 800;
    font-family: inherit;
    text-decoration: none;
    cursor: pointer;
    box-shadow: 0 10px 26px rgba(74, 58, 107, 0.28);
    transition: transform 0.22s ease, box-shadow 0.22s ease, filter 0.22s ease;
}
.apple-hero-btn-purple:hover {
    transform: translateY(-2px);
    filter: brightness(1.10);
    box-shadow: 0 14px 34px rgba(74, 58, 107, 0.36);
}

/* —— 通用按钮：品牌金底（浅紫主题次按钮 / 金色填充 CTA） —— */
.apple-hero-btn-gold {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 14px 30px;
    border: none;
    border-radius: 999px;
    background: linear-gradient(135deg, #D4AF37 0%, #c4a030 100%);
    color: #4A3A6B !important;
    font-size: 15px;
    font-weight: 800;
    font-family: inherit;
    text-decoration: none;
    cursor: pointer;
    box-shadow: 0 10px 26px rgba(212, 175, 55, 0.32);
    transition: transform 0.22s ease, box-shadow 0.22s ease, filter 0.22s ease;
}
.apple-hero-btn-gold:hover {
    transform: translateY(-2px);
    filter: brightness(1.06);
    box-shadow: 0 14px 34px rgba(212, 175, 55, 0.42);
}

/* —— 金色装饰线（浅紫主题可选装饰） —— */
.apple-hero-goldline {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 22px 0 0;
    max-width: 460px;
}
.apple-hero-goldline::before {
    content: "";
    flex: 1;
    height: 2px;
    background: linear-gradient(90deg, #D4AF37, rgba(212, 175, 55, 0.12));
    border-radius: 2px;
}
.apple-hero-goldline .dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #D4AF37;
    flex-shrink: 0;
}
.apple-hero-goldline .dot.sm { width: 5px; height: 5px; opacity: 0.6; }

/* 移动端细调 */
@media (max-width: 768px) {
    .apple-hero-btn-purple,
    .apple-hero-btn-gold {
        width: 100%;
        justify-content: center;
    }
}

/* —— 金色数字统计（about 页，对应规范「3个金色数字 + 白色标签」） —— */
.apple-hero--gold-stats .apple-hero-stat-num {
    color: #D4AF37;
    text-shadow: 0 2px 16px rgba(212, 175, 55, 0.35);
    font-weight: 800;
}
.apple-hero--gold-stats .apple-hero-stat-label {
    color: rgba(255, 255, 255, 0.78);
}
