/* 15 套城市主题（每城一套，颜色由各自地域特征决定） */
/* 15 套城市主题已收敛到深青绿品牌体系：色相保留，饱和度与亮度统一；金色统一为 #D8B474（敦煌保留石青点缀） */
/* ==========================================================================
   城市专题页 · 地域视觉主题  city-theme.css
   --------------------------------------------------------------------------
   用法：生成器在 <body data-city-theme="river-gold|danxia|plateau"> 上挂主题，
        本文件按主题覆盖 gansu.css 的设计变量与几处 Hero / 数据条细节。
   原则：只调「色彩温度 + 版式细节」，不改结构、不改组件语义；
        未挂主题的城市页完全不受影响（选择器都带 body[data-city-theme]）。
   ========================================================================== */

/* ============ 兰州 · 黄河金 ============ */
body[data-city-theme="river-gold"] {
    --primary: #B4552B;          /* 赭石 */
    --primary-dark: #8E3F1E;
    --primary-light: #D07A45;
    --accent: #D9A441;           /* 河金 */
    --shadow-btn: 0 4px 14px rgba(180,85,43,.30);
}
body[data-city-theme="river-gold"] .hero__overlay {
    /* 中性暗色，让照片自己的暖调说话，不再叠加一层橙 */
    background: linear-gradient(180deg, rgba(20,17,14,.58) 0%, rgba(20,17,14,.30) 46%, rgba(12,10,8,.80) 100%);
}
body[data-city-theme="river-gold"] .hero__tagline::after {
    content: ''; display: block; width: 64px; height: 3px; margin: .9rem auto 0;
    background: linear-gradient(90deg, rgba(217,164,65,0), #D9A441 50%, rgba(217,164,65,0));
}
body[data-city-theme="river-gold"] .stats {
    background: linear-gradient(135deg, #7E3B22 0%, #A85A32 52%, #BE8A46 100%);
}
body[data-city-theme="river-gold"] .section--white { background: #FCF7EE; }

/* ============ 张掖 · 丹霞 ============ */
body[data-city-theme="danxia"] {
    --primary: #A83A2E;          /* 丹霞红 */
    --primary-dark: #7E2A21;
    --primary-light: #C96A4E;
    --accent: #E0A14A;           /* 砂岩金 */
    --shadow-btn: 0 4px 14px rgba(168,58,46,.30);
}
body[data-city-theme="danxia"] .hero { height: 100vh; }
body[data-city-theme="danxia"] .hero__title { font-size: clamp(3rem, 8.2vw, 6.2rem); line-height: 1.04; }
body[data-city-theme="danxia"] .hero__overlay {
    background: linear-gradient(180deg, rgba(22,16,13,.52) 0%, rgba(22,16,13,.26) 50%, rgba(14,10,8,.82) 100%);
}
/* 彩丘色带：Hero 底部一条四色细带，呼应丹霞层理 */
body[data-city-theme="danxia"] .hero::after {
    content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 6px; z-index: 3;
    background: linear-gradient(90deg, #8C3B2E 0 25%, #C4643F 25% 50%, #D9944C 50% 75%, #E8C06A 75% 100%);
}
body[data-city-theme="danxia"] .stats { background: linear-gradient(135deg, #7E2A21 0%, #A83A2E 50%, #C4643F 80%, #E0A14A 100%); }
body[data-city-theme="danxia"] .section--white { background: #FBF3E8; }

/* ============ 甘南 · 高原 ============ */
body[data-city-theme="plateau"] {
    --primary: #3F6B5A;          /* 松绿 */
    --primary-dark: #2E5145;
    --primary-light: #6C9282;
    --accent: #C8B07A;           /* 麦金 */
    --shadow-btn: 0 4px 14px rgba(63,107,90,.28);
}
body[data-city-theme="plateau"] .hero__overlay {
    background: linear-gradient(180deg, rgba(18,26,22,.66) 0%, rgba(18,26,22,.34) 52%, rgba(14,20,17,.80) 100%);
}
/* 高原雾感：Hero 下沿一层极淡的纸色雾，接住下方内容 */
body[data-city-theme="plateau"] .hero::after {
    content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 120px; z-index: 2;
    background: linear-gradient(180deg, rgba(243,237,224,0) 0%, rgba(243,237,224,.55) 62%, #F3EDE0 100%);
    pointer-events: none;
}
body[data-city-theme="plateau"] .hero__scroll { z-index: 4; }
body[data-city-theme="plateau"] .stats { background: linear-gradient(135deg, #2E5145 0%, #3F6B5A 55%, #6C9282 100%); }
body[data-city-theme="plateau"] .section--white { background: #F8F6EF; }

/* ============ 嘉峪关 · 边塞夯土 ============ */
body[data-city-theme="great-wall"] {
    --primary: #8A5A3C; --primary-dark: #6B4227; --primary-light: #B07E58; --accent: #D8B474;
    --shadow-btn: 0 4px 14px rgba(138,90,60,.30);
}
body[data-city-theme="great-wall"] .hero__overlay {
    background: linear-gradient(180deg, rgba(24,18,12,.58) 0%, rgba(18,14,10,.30) 50%, rgba(12,10,8,.80) 100%);
}
body[data-city-theme="great-wall"] .stats {
    background: linear-gradient(135deg, #6B4227 0%, #8A5A3C 55%, #B07E58 100%);
}
body[data-city-theme="great-wall"] .hero::after {
    content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 5px; z-index: 3;
    background: linear-gradient(90deg, var(--primary), var(--accent));
}

/* ============ 金昌 · 紫金花城 ============ */
body[data-city-theme="mauve"] {
    --primary: #6F5F7A; --primary-dark: #544661; --primary-light: #94839F; --accent: #C9A96B;
    --shadow-btn: 0 4px 14px rgba(111,95,122,.30);
}
body[data-city-theme="mauve"] .hero__overlay {
    background: linear-gradient(180deg, rgba(20,18,24,.55) 0%, rgba(18,14,10,.30) 50%, rgba(12,10,8,.80) 100%);
}
body[data-city-theme="mauve"] .stats {
    background: linear-gradient(135deg, #544661 0%, #6F5F7A 55%, #94839F 100%);
}
body[data-city-theme="mauve"] .hero::after {
    content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 9px; z-index: 3;
    border-top: 3px solid var(--accent); border-bottom: 1px solid rgba(243,237,224,.55);
    opacity: .92;
}

/* ============ 白银 · 砂砾石林 ============ */
body[data-city-theme="gravel"] {
    --primary: #A2703F; --primary-dark: #7E5428; --primary-light: #C29359; --accent: #D8B474;
    --shadow-btn: 0 4px 14px rgba(162,112,63,.30);
}
body[data-city-theme="gravel"] .hero__overlay {
    background: linear-gradient(180deg, rgba(24,18,12,.55) 0%, rgba(18,14,10,.30) 50%, rgba(12,10,8,.80) 100%);
}
body[data-city-theme="gravel"] .stats {
    background: linear-gradient(135deg, #7E5428 0%, #A2703F 55%, #C29359 100%);
}
body[data-city-theme="gravel"] .hero::after {
    content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 48px; z-index: 3;
    background-image: repeating-linear-gradient(180deg, rgba(243,237,224,.22) 0 1px, transparent 1px 6px);
    mask-image: linear-gradient(180deg, transparent, #000);
    -webkit-mask-image: linear-gradient(180deg, transparent, #000);
}

/* ============ 天水 · 崖壁石窟 ============ */
body[data-city-theme="grotto"] {
    --primary: #9C5A44; --primary-dark: #7A4130; --primary-light: #BE7F63; --accent: #D8B474;
    --shadow-btn: 0 4px 14px rgba(156,90,68,.30);
}
body[data-city-theme="grotto"] .hero__overlay {
    background: linear-gradient(180deg, rgba(24,16,12,.56) 0%, rgba(18,14,10,.30) 50%, rgba(12,10,8,.80) 100%);
}
body[data-city-theme="grotto"] .stats {
    background: linear-gradient(135deg, #7A4130 0%, #9C5A44 55%, #BE7F63 100%);
}
body[data-city-theme="grotto"] .hero::after {
    content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 9px; z-index: 3;
    border-top: 3px solid var(--accent); border-bottom: 1px solid rgba(243,237,224,.55);
    opacity: .92;
}

/* ============ 武威 · 凉州青铜 ============ */
body[data-city-theme="bronze"] {
    --primary: #5F6B52; --primary-dark: #46513C; --primary-light: #86937A; --accent: #B08C4F;
    --shadow-btn: 0 4px 14px rgba(95,107,82,.30);
}
body[data-city-theme="bronze"] .hero__overlay {
    background: linear-gradient(180deg, rgba(20,22,18,.56) 0%, rgba(18,14,10,.30) 50%, rgba(12,10,8,.80) 100%);
}
body[data-city-theme="bronze"] .stats {
    background: linear-gradient(135deg, #46513C 0%, #5F6B52 55%, #86937A 100%);
}
body[data-city-theme="bronze"] .hero::after {
    content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 9px; z-index: 3;
    border-top: 3px solid var(--accent); border-bottom: 1px solid rgba(243,237,224,.55);
    opacity: .92;
}

/* ============ 平凉 · 崆峒云气 ============ */
body[data-city-theme="taoist"] {
    --primary: #45525C; --primary-dark: #333E46; --primary-light: #6E7C87; --accent: #C8A96B;
    --shadow-btn: 0 4px 14px rgba(69,82,92,.30);
}
body[data-city-theme="taoist"] .hero__overlay {
    background: linear-gradient(180deg, rgba(18,22,26,.58) 0%, rgba(18,14,10,.30) 50%, rgba(12,10,8,.80) 100%);
}
body[data-city-theme="taoist"] .stats {
    background: linear-gradient(135deg, #333E46 0%, #45525C 55%, #6E7C87 100%);
}
body[data-city-theme="taoist"] .hero::after {
    content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 130px; z-index: 2;
    background: linear-gradient(180deg, rgba(243,237,224,0), rgba(243,237,224,.5) 64%, #F3EDE0);
    pointer-events: none;
}

/* ============ 酒泉 · 航天深空 ============ */
body[data-city-theme="space"] {
    --primary: #2F4858; --primary-dark: #20333F; --primary-light: #5A7788; --accent: #D8B474;
    --shadow-btn: 0 4px 14px rgba(47,72,88,.30);
}
body[data-city-theme="space"] .hero__overlay {
    background: linear-gradient(180deg, rgba(12,18,24,.66) 0%, rgba(18,14,10,.30) 50%, rgba(12,10,8,.80) 100%);
}
body[data-city-theme="space"] .stats {
    background: linear-gradient(135deg, #20333F 0%, #2F4858 55%, #5A7788 100%);
}
body[data-city-theme="space"] .hero::after {
    content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 9px; z-index: 3;
    border-top: 3px solid var(--accent); border-bottom: 1px solid rgba(243,237,224,.55);
    opacity: .92;
}

/* ============ 庆阳 · 陇东黄土 ============ */
body[data-city-theme="loess"] {
    --primary: #A97C3F; --primary-dark: #845D28; --primary-light: #C79A5C; --accent: #C9A227;
    --shadow-btn: 0 4px 14px rgba(169,124,63,.30);
}
body[data-city-theme="loess"] .hero__overlay {
    background: linear-gradient(180deg, rgba(28,22,12,.56) 0%, rgba(18,14,10,.30) 50%, rgba(12,10,8,.80) 100%);
}
body[data-city-theme="loess"] .stats {
    background: linear-gradient(135deg, #845D28 0%, #A97C3F 55%, #C79A5C 100%);
}
body[data-city-theme="loess"] .hero::after {
    content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 48px; z-index: 3;
    background-image: repeating-linear-gradient(180deg, rgba(243,237,224,.22) 0 1px, transparent 1px 6px);
    mask-image: linear-gradient(180deg, transparent, #000);
    -webkit-mask-image: linear-gradient(180deg, transparent, #000);
}

/* ============ 定西 · 陇中旱塬 ============ */
body[data-city-theme="loess-dry"] {
    --primary: #7D6A52; --primary-dark: #5E4E3B; --primary-light: #A08C71; --accent: #B99A5E;
    --shadow-btn: 0 4px 14px rgba(125,106,82,.30);
}
body[data-city-theme="loess-dry"] .hero__overlay {
    background: linear-gradient(180deg, rgba(24,20,14,.55) 0%, rgba(18,14,10,.30) 50%, rgba(12,10,8,.80) 100%);
}
body[data-city-theme="loess-dry"] .stats {
    background: linear-gradient(135deg, #5E4E3B 0%, #7D6A52 55%, #A08C71 100%);
}
body[data-city-theme="loess-dry"] .hero::after {
    content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 48px; z-index: 3;
    background-image: repeating-linear-gradient(180deg, rgba(243,237,224,.22) 0 1px, transparent 1px 6px);
    mask-image: linear-gradient(180deg, transparent, #000);
    -webkit-mask-image: linear-gradient(180deg, transparent, #000);
}

/* ============ 陇南 · 陇上江南 ============ */
body[data-city-theme="tea"] {
    --primary: #3F6E7A; --primary-dark: #2C525C; --primary-light: #6A97A2; --accent: #C2A46B;
    --shadow-btn: 0 4px 14px rgba(63,110,122,.30);
}
body[data-city-theme="tea"] .hero__overlay {
    background: linear-gradient(180deg, rgba(14,22,24,.55) 0%, rgba(18,14,10,.30) 50%, rgba(12,10,8,.80) 100%);
}
body[data-city-theme="tea"] .stats {
    background: linear-gradient(135deg, #2C525C 0%, #3F6E7A 55%, #6A97A2 100%);
}
body[data-city-theme="tea"] .hero::after {
    content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 9px; z-index: 3;
    border-top: 3px solid var(--accent); border-bottom: 1px solid rgba(243,237,224,.55);
    opacity: .92;
}

/* ============ 临夏 · 河州砖雕 ============ */
body[data-city-theme="brick"] {
    --primary: #7A4A42; --primary-dark: #5C352F; --primary-light: #9E6A60; --accent: #C8A96B;
    --shadow-btn: 0 4px 14px rgba(122,74,66,.30);
}
body[data-city-theme="brick"] .hero__overlay {
    background: linear-gradient(180deg, rgba(24,16,14,.56) 0%, rgba(18,14,10,.30) 50%, rgba(12,10,8,.80) 100%);
}
body[data-city-theme="brick"] .stats {
    background: linear-gradient(135deg, #5C352F 0%, #7A4A42 55%, #9E6A60 100%);
}
body[data-city-theme="brick"] .hero::after {
    content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 9px; z-index: 3;
    border-top: 3px solid var(--accent); border-bottom: 1px solid rgba(243,237,224,.55);
    opacity: .92;
}

/* ============ 敦煌 · 壁画石青 ============ */
body[data-city-theme="mural"] {
    --primary: #8C5A3C; --primary-dark: #6B4128; --primary-light: #B07E58; --accent: #4E6B7A;
    --shadow-btn: 0 4px 14px rgba(140,90,60,.30);
}
body[data-city-theme="mural"] .hero__overlay {
    background: linear-gradient(180deg, rgba(26,18,12,.58) 0%, rgba(18,14,10,.30) 50%, rgba(12,10,8,.80) 100%);
}
body[data-city-theme="mural"] .stats {
    background: linear-gradient(135deg, #6B4128 0%, #8C5A3C 55%, #B07E58 100%);
}
body[data-city-theme="mural"] .hero::after {
    content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 5px; z-index: 3;
    background: linear-gradient(90deg, var(--primary), var(--accent));
}

/* 移动端：丹霞标题略收，避免换行过多 */
@media (max-width: 640px) {
    body[data-city-theme="danxia"] .hero__title { font-size: clamp(2.2rem, 11vw, 3rem); }
    body[data-city-theme="plateau"] .hero::after { height: 90px; }
}


/* 敦煌：首屏用「莫高窟壁纸」（彩塑 + 壁画合成图），压暗左侧保证文字可读 */
body[data-city-theme="mural"] .hero__bg.has-photo {
    background-image: url('../home/city/hero-dunhuang.jpg') !important;
    background-position: 70% center;
    background-size: cover;
}
body[data-city-theme="mural"] .hero__overlay {
    background:
        linear-gradient(90deg, rgba(14,17,15,.84) 0%, rgba(14,17,15,.62) 38%, rgba(14,17,15,.18) 68%, rgba(14,17,15,.14) 100%),
        linear-gradient(180deg, rgba(14,17,15,.40) 0%, rgba(14,17,15,.06) 42%, rgba(14,17,15,.48) 100%);
}

/* 古典壁纸首屏：插画偏亮，遮罩比实景更深，保证标题与按钮可读 */
.hero--classic .hero__overlay {
    background: linear-gradient(180deg, rgba(18, 14, 9, .46) 0%, rgba(18, 14, 9, .24) 42%, rgba(18, 14, 9, .58) 100%);
}
.hero--classic .hero__bg { filter: saturate(.98) contrast(1.02) brightness(1.06); }
