/* 澜奢汇 - 全站视觉特效层 */

/* ===== 全局背景 ===== */
.site-bg {
    position: fixed;
    inset: 0;
    z-index: -1;
    overflow: hidden;
    pointer-events: none;
}
.site-bg__gradient {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 80% 60% at 20% 10%, rgba(201,169,110,0.12) 0%, transparent 55%),
        radial-gradient(ellipse 60% 50% at 85% 80%, rgba(166,139,75,0.08) 0%, transparent 50%),
        linear-gradient(180deg, #0a0a0a 0%, #111 40%, #0d0d0d 100%);
}
.site-bg__pattern {
    position: absolute;
    inset: 0;
    opacity: 0.35;
    background-image: url('/static/images/bg/pattern.svg');
    background-size: 120px 120px;
    animation: patternDrift 60s linear infinite;
}
.site-bg__glow {
    position: absolute;
    border-radius: 50%;
    filter: blur(80px);
    animation: glowPulse 8s ease-in-out infinite;
}
.site-bg__glow--1 {
    width: 400px; height: 400px;
    top: -100px; left: -100px;
    background: rgba(201,169,110,0.15);
}
.site-bg__glow--2 {
    width: 350px; height: 350px;
    bottom: -80px; right: -80px;
    background: rgba(166,139,75,0.1);
    animation-delay: -4s;
}
.site-bg__particles {
    position: absolute;
    inset: 0;
}
.particle {
    position: absolute;
    width: 3px; height: 3px;
    background: var(--gold);
    border-radius: 50%;
    opacity: 0;
    animation: particleFloat linear infinite;
}

@keyframes patternDrift {
    from { background-position: 0 0; }
    to { background-position: 120px 120px; }
}
@keyframes glowPulse {
    0%, 100% { opacity: 0.6; transform: scale(1); }
    50% { opacity: 1; transform: scale(1.1); }
}
@keyframes particleFloat {
    0% { opacity: 0; transform: translateY(100vh) scale(0); }
    10% { opacity: 0.6; }
    90% { opacity: 0.3; }
    100% { opacity: 0; transform: translateY(-10vh) scale(1); }
}

.site-main { position: relative; z-index: 1; }

/* ===== 页头滚动特效 ===== */
.site-header {
    transition: background 0.4s ease, box-shadow 0.4s ease, border-color 0.4s ease;
}
.site-header.scrolled {
    background: rgba(8,8,8,0.92);
    box-shadow: 0 8px 32px rgba(0,0,0,0.5);
    border-bottom-color: rgba(201,169,110,0.25);
}

/* ===== 页面 Hero 背景图 ===== */
.page-hero--bg {
    position: relative;
    overflow: hidden;
    background: transparent;
    border-bottom: 1px solid rgba(201,169,110,0.15);
}
.page-hero--bg::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image: var(--page-hero-bg, none);
    background-size: cover;
    background-position: center;
    transform: scale(1.05) translateY(var(--hero-parallax, 0));
    transition: transform 8s ease;
}
.page-hero--bg:hover::before {
    transform: scale(1.08);
}
.page-hero--bg::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(10,10,10,0.88) 0%, rgba(10,10,10,0.55) 50%, rgba(10,10,10,0.82) 100%);
}
.page-hero--bg .container {
    position: relative;
    z-index: 2;
}
.page-hero--bg h1 {
    text-shadow: 0 2px 20px rgba(0,0,0,0.5);
}
.page-hero--bg h1::after {
    content: '';
    display: block;
    width: 60px;
    height: 2px;
    background: linear-gradient(90deg, var(--gold), transparent);
    margin-top: 12px;
}

/* ===== 滚动入场动画 ===== */
.reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.7s ease, transform 0.7s ease;
}
.reveal.visible {
    opacity: 1;
    transform: translateY(0);
}
.reveal-delay-1 { transition-delay: 0.1s; }
.reveal-delay-2 { transition-delay: 0.2s; }
.reveal-delay-3 { transition-delay: 0.3s; }
.reveal-delay-4 { transition-delay: 0.4s; }

/* ===== 玻璃拟态卡片 ===== */
.glass-card,
.category-card,
.product-card,
.news-card,
.news-list-item,
.channel-card,
.service-card,
.credential-card,
.guarantee-item,
.case-card,
.channel-detail-card,
.sidebar-card,
.contact-info-card,
.contact-form-card,
.store-nap-card,
.store-promo,
.stat-item {
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    background: rgba(20,20,20,0.75) !important;
    box-shadow: 0 4px 24px rgba(0,0,0,0.3), inset 0 1px 0 rgba(201,169,110,0.06);
}

/* ===== 卡片悬停光效 ===== */
.category-card,
.product-card,
.news-card,
.news-list-item,
.channel-card,
.service-card,
.case-card,
.credential-card,
.guarantee-item {
    position: relative;
    overflow: hidden;
}
.category-card::before,
.product-card::before,
.news-card::before,
.news-list-item::before,
.channel-card::before,
.service-card::before,
.case-card::before {
    content: '';
    position: absolute;
    top: 0; left: -100%;
    width: 60%; height: 100%;
    background: linear-gradient(90deg, transparent, rgba(201,169,110,0.08), transparent);
    transition: left 0.6s ease;
    pointer-events: none;
    z-index: 1;
}
.category-card:hover::before,
.product-card:hover::before,
.news-card:hover::before,
.news-list-item:hover::before,
.channel-card:hover::before,
.service-card:hover::before,
.case-card:hover::before {
    left: 120%;
}

/* ===== 图片缩放悬停 ===== */
.category-img,
.product-img,
.news-img,
.case-img,
.store-img,
.article-hero-img,
.product-detail-img {
    transition: transform 0.6s ease;
    overflow: hidden;
}
.category-card:hover .category-img,
.product-card:hover .product-img,
.news-card:hover .news-img,
.case-card:hover .case-img {
    transform: scale(1.06);
}

/* ===== Section 交替背景 ===== */
.section--alt {
    position: relative;
}
.section--alt::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(201,169,110,0.03) 0%, transparent 50%, rgba(201,169,110,0.02) 100%);
    pointer-events: none;
}
.section--alt .container { position: relative; z-index: 1; }

/* ===== 区块标题增强 ===== */
.section-header h2 {
    background: linear-gradient(135deg, #fff 0%, var(--gold-light) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
.section-header h2::after {
    background: linear-gradient(90deg, transparent, var(--gold), transparent);
    width: 80px;
    height: 2px;
}

/* ===== Hero 轮播增强 ===== */
.hero-carousel {
    margin-top: calc(-1 * (var(--header-h) + 30px));
    padding-top: calc(var(--header-h) + 30px);
}
.hero-slide.active {
    animation: kenBurns 12s ease forwards;
}
@keyframes kenBurns {
    from { transform: scale(1); }
    to { transform: scale(1.06); }
}
.hero-overlay {
    background: linear-gradient(135deg, rgba(10,10,10,0.82) 0%, rgba(10,10,10,0.35) 60%, rgba(10,10,10,0.7) 100%);
}
.hero-content h1 {
    background: linear-gradient(135deg, #fff 20%, var(--gold-light) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
.hero-dots .dot {
    border-radius: 2px;
    transition: all 0.4s ease;
}
.hero-dots .dot.active {
    box-shadow: 0 0 12px rgba(201,169,110,0.6);
}

/* ===== 按钮光效 ===== */
.btn-primary {
    position: relative;
    overflow: hidden;
    box-shadow: 0 4px 15px rgba(201,169,110,0.3);
}
.btn-primary::after {
    content: '';
    position: absolute;
    top: -50%; left: -50%;
    width: 200%; height: 200%;
    background: linear-gradient(45deg, transparent 40%, rgba(255,255,255,0.15) 50%, transparent 60%);
    transform: translateX(-100%);
    transition: transform 0.6s ease;
}
.btn-primary:hover::after {
    transform: translateX(100%);
}
.btn-primary:hover {
    box-shadow: 0 6px 25px rgba(201,169,110,0.45);
    transform: translateY(-2px);
}

/* ===== 品牌标签动画 ===== */
.brand-tag {
    transition: all 0.3s ease;
}
.brand-tag:hover {
    background: rgba(201,169,110,0.1);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(201,169,110,0.15);
}

/* ===== 高亮列表 ===== */
.highlight-list li {
    transition: all 0.3s ease;
    border-left-width: 3px;
}
.highlight-list li:hover {
    background: rgba(201,169,110,0.1);
    transform: translateX(6px);
    border-left-width: 5px;
}

/* ===== FAQ 手风琴增强 ===== */
.faq-item {
    transition: background 0.3s ease;
    border-radius: 4px;
    padding: 0 12px;
}
.faq-item:hover {
    background: rgba(201,169,110,0.04);
}
.faq-item[open] {
    background: rgba(201,169,110,0.06);
    border-left: 3px solid var(--gold);
}

/* ===== CTA 区块 ===== */
.cta-section {
    position: relative;
    overflow: hidden;
}
.cta-section::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse at center, rgba(201,169,110,0.1) 0%, transparent 70%);
    pointer-events: none;
}
.cta-section .container { position: relative; z-index: 1; }

/* ===== 页脚增强 ===== */
.site-footer {
    position: relative;
    background: linear-gradient(180deg, rgba(26,26,26,0.95) 0%, rgba(10,10,10,0.98) 100%) !important;
}
.site-footer::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--gold), transparent);
}

/* ===== 悬浮栏增强 ===== */
.float-item {
    backdrop-filter: blur(10px);
    box-shadow: 0 4px 16px rgba(0,0,0,0.3);
    transition: all 0.3s ease;
}
.float-item:hover {
    transform: scale(1.08);
    box-shadow: 0 6px 24px rgba(201,169,110,0.3);
}

/* ===== 价格框光晕 ===== */
.price-box {
    position: relative;
    overflow: hidden;
}
.price-box::before {
    content: '';
    position: absolute;
    top: -50%; right: -50%;
    width: 100%; height: 100%;
    background: radial-gradient(circle, rgba(201,169,110,0.08) 0%, transparent 70%);
    pointer-events: none;
}

/* ===== 统计数字 ===== */
.stat-item {
    transition: all 0.4s ease;
}
.stat-item:hover {
    transform: translateY(-4px);
    border-color: var(--gold);
    box-shadow: 0 8px 24px rgba(201,169,110,0.15);
}
.stat-item strong {
    transition: transform 0.3s ease;
}
.stat-item:hover strong {
    transform: scale(1.1);
}

/* ===== 资讯列表增强 ===== */
.news-list-item .news-img {
    border-radius: 4px;
    transition: transform 0.5s ease;
}
.news-list-item:hover .news-img {
    transform: scale(1.03);
}

/* ===== 门店画廊 ===== */
.store-img {
    transition: all 0.4s ease;
    overflow: hidden;
}
.store-img:hover {
    transform: scale(1.02);
    box-shadow: 0 8px 24px rgba(0,0,0,0.4);
}

/* ===== 主题色微调 ===== */
.theme-home .site-bg__glow--1 { background: rgba(201,169,110,0.18); }
.theme-store .site-bg__glow--2 { background: rgba(201,169,110,0.14); }
.theme-recycle .site-bg__glow--1 { background: rgba(180,150,90,0.14); }
.theme-news .site-bg__glow--2 { background: rgba(160,130,80,0.12); }

/* ===== 图片加载失败时的渐变兜底 ===== */
.category-img, .product-img, .news-img, .case-img, .hero-slide,
.product-detail-img, .article-hero-img, .store-img {
    background-color: #141414;
}
.category-img:not([style*="url"]), .product-img:not([style*="url"]),
.news-img:not([style*="url"]), .case-img:not([style*="url"]) {
    background-image: linear-gradient(135deg, rgba(201,169,110,0.12) 0%, #141414 50%, rgba(166,139,75,0.08) 100%);
}

.area-tag {
    transition: all 0.3s ease;
}
.area-tag:hover {
    border-color: var(--gold);
    color: var(--gold);
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(201,169,110,0.12);
}

@media (prefers-reduced-motion: reduce) {
    .reveal { opacity: 1; transform: none; transition: none; }
    .hero-slide.active { animation: none; }
    .site-bg__pattern { animation: none; }
    .site-bg__glow { animation: none; }
    .particle { display: none; }
}