/* ===== 历史的温度 - 东方美学增强版 ===== */
/* 风格方向：故宫博物院 & 苏州博物馆 —— 高级、克制、有历史厚重感的现代东方美学 */

:root {
    /* 东方古画色调 - 优化版 */
    --primary: #6B2D2D;        /* 暗红 */
    --primary-light: #8B3A3A; /* 浅暗红 */
    --secondary: #1E3A5F;     /* 藏青 */
    --accent: #2C4A6E;        /* 深蓝 */
    --gold: #B8960C;          /* 假金 */
    --gold-light: #D4AF37;    /* 亮金 */
    --purple: #5C3A5C;        /* 绛紫 */
    --silver: #8A9BA8;        /* 假银 */
    --silver-light: #A8B5C2;  /* 亮银 */

    --dark: #1A1510;          /* 墨黑 */
    --light: #FAF6F0;         /* 绢白 */
    --text: #2D2420;          /* 墨色文字 */
    --text-light: #6B5D52;    /* 淡墨 */
    --bg-cream: #F5F0E8;      /* 宣纸色 */
    --border: #DDD5C8;        /* 淡墨线 */

    /* 古画辅助色 */
    --jade: #2D5A4A;          /* 玉色 */
    --verditer: #4A7A8A;      /* 石青 */
    --ochre: #8B6914;         /* 赭石 */
    
    /* ========== 东方美学新配色 ========== */
    /* 米白 / 月白 / 浅赭 / 松烟墨 - 哑光质感 */
    --orient-cream: #F7F3EE;      /* 米白 - 主底色 */
    --orient-moon: #EDE8E0;       /* 月白 - 次底色 */
    --orient-ochre: #C4A882;      /* 浅赭 - 暖调点缀 */
    --orient-ink: #3D3530;       /* 松烟墨 - 深色文字/装饰 */
    --orient-gold-muted: #B89A6A; /* 暗金 - 低调奢华 */
    --orient-pattern: rgba(180, 155, 120, 0.08); /* 纹理透明色 */
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'Noto Sans SC', -apple-system, BlinkMacSystemFont, sans-serif;
    line-height: 1.8;
    color: var(--text);
    background: var(--orient-cream);
    overflow-x: hidden;
    position: relative;
}

/* ========== 全局宣纸纹理背景 ========== */
body::before {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* 宣纸纹理 + 绢布纹理的合成效果 */
    background:
        /* 宣纸纤维纹理 - 极淡 */
        url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400"><filter id="n"><feTurbulence type="fractalNoise" baseFrequency="0.04" numOctaves="5" stitchTiles="stitch"/><feColorMatrix type="saturate" values="0"/></filter><rect width="400" height="400" filter="url(%23n)" opacity="0.03"/></svg>'),
        /* 淡墨晕染 - 极低透明度 */
        radial-gradient(ellipse at 20% 20%, rgba(180,160,140,0.06) 0%, transparent 50%),
        radial-gradient(ellipse at 80% 80%, rgba(160,140,120,0.05) 0%, transparent 50%),
        /* 吉祥暗纹叠加 */
        url('assets/patterns/auspicious-pattern.png') repeat;
    opacity: 1;
    pointer-events: none;
    z-index: -1;
}

/* ========== 全局淡墨山水装饰层 ========== */
body::after {
    content: '';
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /* 淡墨山水线条 - 极低透明度点缀 */
    background:
        /* 左上角淡墨山水 */
        url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 600 400" opacity="0.04"><path d="M0,400 Q150,300 200,350 Q250,250 300,300 Q350,200 400,280 Q450,180 500,250 Q550,150 600,200 L600,400 Z" fill="%23C4A882" opacity="0.3"/><path d="M0,400 Q100,320 180,360 Q260,280 340,340 Q420,220 500,300 Q560,200 600,260 L600,400 Z" fill="%23B89A6A" opacity="0.2"/></svg>') no-repeat top left / 40% auto,
        /* 右上角云纹 */
        url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 100" opacity="0.035"><path d="M20,80 Q40,40 60,60 Q80,30 100,50 Q120,20 140,45 Q160,15 180,40 L180,100 L20,100 Z" fill="%23C4A882" opacity="0.4"/><path d="M0,90 Q30,60 60,75 Q90,50 120,70 Q150,45 180,65 Q200,50 200,55 L200,100 L0,100 Z" fill="%23B89A6A" opacity="0.3"/></svg>') no-repeat top right / 30% auto,
        /* 底部窗棂暗纹 */
        url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" opacity="0.03"><rect x="10" y="10" width="80" height="80" fill="none" stroke="%23B89A6A" stroke-width="1"/><line x1="10" y1="50" x2="90" y2="50" stroke="%23B89A6A" stroke-width="0.5"/><line x1="50" y1="10" x2="50" y2="90" stroke="%23B89A6A" stroke-width="0.5"/><rect x="25" y="25" width="50" height="50" fill="none" stroke="%23B89A6A" stroke-width="0.5"/></svg>') repeat-x bottom / 15% auto;
    pointer-events: none;
    z-index: -1;
}

/* ========== Hero区 - 高级东方美学 ========== */
.hero {
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 8rem 5% 4rem;
    position: relative;
    overflow: hidden;
    /* 新的东方美学背景 - 米白底 + 淡墨晕染 + 宣纸纹理 */
    background:
        /* 柔和的渐变遮罩 - 温润不刺眼 */
        linear-gradient(165deg, 
            rgba(247,243,238,0.95) 0%, 
            rgba(237,232,224,0.92) 30%,
            rgba(230,222,210,0.95) 70%,
            rgba(224,215,202,0.98) 100%
        ),
        /* 淡墨山水底纹 - 极低透明度 */
        url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 800"><defs><linearGradient id="g1" x1="0%25" y1="0%25" x2="100%25" y2="100%25"><stop offset="0%25" stop-color="%23C4A882" stop-opacity="0.06"/><stop offset="50%25" stop-color="%23B89A6A" stop-opacity="0.04"/><stop offset="100%25" stop-color="%23A08060" stop-opacity="0.05"/></linearGradient></defs><rect fill="url(%23g1)" width="1200" height="800"/></svg>'),
        /* 宣纸纹理叠加 */
        url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="300" height="300"><filter id="n"><feTurbulence type="fractalNoise" baseFrequency="0.05" numOctaves="4" stitchTiles="stitch"/><feColorMatrix type="saturate" values="0"/></filter><rect width="300" height="300" filter="url(%23n)" opacity="0.025"/></svg>');
    background-color: var(--orient-cream);
}

/* 淡墨山水装饰元素 - Hero区专属 */
.hero::before {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 40%;
    background: 
        /* 淡墨远山 - 层次感 */
        linear-gradient(to top, 
            rgba(196,168,130,0.08) 0%, 
            transparent 100%
        );
    pointer-events: none;
}

/* 古典窗棂暗纹 - 局部点缀 */
.hero-decoration {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    pointer-events: none;
    opacity: 0.12;
    /* 窗棂轮廓 */
    background: 
        url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" opacity="0.15"><rect x="5" y="5" width="90" height="90" fill="none" stroke="%23B89A6A" stroke-width="0.8"/><rect x="20" y="20" width="60" height="60" fill="none" stroke="%23B89A6A" stroke-width="0.5"/><line x1="50" y1="5" x2="50" y2="95" stroke="%23B89A6A" stroke-width="0.5"/><line x1="5" y1="50" x2="95" y2="50" stroke="%23B89A6A" stroke-width="0.5"/></svg>') no-repeat;
    background-size: 200px 200px;
    background-position: 10% 20%;
}

/* 浮动的装饰元素 - 降为淡雅 */
.floating-item {
    position: absolute;
    font-size: 1.8rem;
    opacity: 0.08;
    animation: float 8s ease-in-out infinite;
    color: var(--orient-gold-muted);
}

.floating-item:nth-child(1) { top: 15%; left: 10%; animation-delay: 0s; }
.floating-item:nth-child(2) { top: 25%; right: 15%; animation-delay: 1.5s; }
.floating-item:nth-child(3) { bottom: 20%; left: 20%; animation-delay: 3s; }
.floating-item:nth-child(4) { bottom: 30%; right: 10%; animation-delay: 4.5s; }
.floating-item:nth-child(5) { top: 40%; left: 5%; animation-delay: 6s; }

@keyframes float {
    0%, 100% { transform: translateY(0) rotate(0deg); opacity: 0.08; }
    50% { transform: translateY(-15px) rotate(3deg); opacity: 0.12; }
}

/* ========== 导航栏 - 温润质感 ========== */
.main-nav {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    /* 米白底色 + 极淡金边 */
    background: rgba(247,243,238,0.92);
    backdrop-filter: blur(16px);
    padding: 1rem 5%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    z-index: 1000;
    /* 极淡阴影 - 温润不突兀 */
    box-shadow: 0 1px 12px rgba(107,45,45,0.06);
    border-bottom: 1px solid rgba(221,213,200,0.35);
}

.logo {
    font-family: 'Noto Serif SC', serif;
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--primary);
    display: flex;
    align-items: center;
    gap: 0.5rem;
    text-decoration: none;
}

.logo-icon {
    width: 36px;
    height: 36px;
    /* 暗红到藏青的渐变 - 哑光质感 */
    background: linear-gradient(135deg, var(--primary), var(--secondary));
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 1rem;
}

/* ========== 特性卡片 - 高级哑光质感 ========== */
.feature-card {
    position: relative;
    overflow: hidden;
    /* 米白底 + 极淡边框 */
    background: rgba(255,255,255,0.92);
    border: 1px solid rgba(221,213,200,0.4);
    /* 哑光质感阴影 */
    box-shadow: 0 4px 20px rgba(107,45,45,0.04);
    transition: all 0.4s ease;
}

.feature-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 40px rgba(107,45,45,0.08);
    border-color: rgba(184,154,106,0.3);
}

/* 顶部金色细线 - 悬停时淡入 */
.feature-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: linear-gradient(90deg, var(--orient-gold-muted), var(--orient-ochre), var(--orient-gold-muted));
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.6s ease;
    opacity: 0.7;
}

.feature-card:hover::before {
    transform: scaleX(1);
}

/* ========== 价格卡片 ========== */
.price-card {
    position: relative;
    overflow: hidden;
    background: rgba(255,255,255,0.95);
    border: 1px solid rgba(221,213,200,0.45);
    box-shadow: 0 4px 20px rgba(107,45,45,0.04);
    transition: all 0.4s ease;
}

.price-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 35px rgba(107,45,45,0.08);
}

.price-card.featured {
    border: 1px solid rgba(184,154,106,0.5);
}

/* ========== 用户评价卡片 ========== */
.testimonial-card {
    background: rgba(255,255,255,0.95);
    border-radius: 18px;
    padding: 2rem;
    box-shadow: 0 8px 30px rgba(107,45,45,0.04);
    border: 1px solid rgba(221,213,200,0.35);
    transition: all 0.4s ease;
}

.testimonial-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 15px 45px rgba(107,45,45,0.08);
}

/* ========== 新闻卡片 ========== */
.news-card {
    background: rgba(255,255,255,0.95);
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 8px 30px rgba(107,45,45,0.04);
    transition: all 0.4s ease;
    border: 1px solid rgba(221,213,200,0.35);
}

.news-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 18px 50px rgba(107,45,45,0.09);
}

/* ========== FAQ ========== */
.faq-item {
    background: rgba(255,255,255,0.95);
    border-radius: 14px;
    padding: 1.5rem;
    margin-bottom: 1rem;
    box-shadow: 0 4px 15px rgba(107,45,45,0.04);
    cursor: pointer;
    transition: all 0.4s ease;
    border: 1px solid rgba(221,213,200,0.35);
}

.faq-item:hover {
    box-shadow: 0 8px 25px rgba(107,45,45,0.08);
    border-color: rgba(184,154,106,0.25);
}

/* ========== 品牌故事区 - 深色高级感 ========== */
.section-dark {
    background: linear-gradient(135deg, 
        rgba(61,53,48,0.97) 0%, 
        rgba(45,40,35,0.98) 50%, 
        rgba(35,30,25,0.99) 100%
    ),
    /* 淡墨纹理叠加 */
    url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="200" height="200"><filter id="n"><feTurbulence type="fractalNoise" baseFrequency="0.03" numOctaves="4"/><feColorMatrix type="saturate" values="0"/></filter><rect width="200" height="200" filter="url(%23n)" opacity="0.03"/></svg>');
    color: white;
    position: relative;
}

/* 品牌故事区 - 暗纹装饰 */
.section-dark::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    /* 淡金暗纹 */
    background:
        radial-gradient(ellipse at 30% 50%, rgba(184,154,106,0.05) 0%, transparent 50%),
        radial-gradient(ellipse at 70% 30%, rgba(196,168,130,0.04) 0%, transparent 40%);
    pointer-events: none;
}

/* ========== 注册区 ========== */
.register-section {
    background: 
        /* 极淡的暖色渐变 */
        linear-gradient(135deg, 
            rgba(247,243,238,0.9) 0%, 
            rgba(237,228,216,0.85) 50%, 
            rgba(230,220,205,0.9) 100%
        ),
        /* 宣纸纹理 */
        url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100"><filter id="n"><feTurbulence type="fractalNoise" baseFrequency="0.06" numOctaves="4"/><feColorMatrix type="saturate" values="0"/></filter><rect width="100" height="100" filter="url(%23n)" opacity="0.02"/></svg>');
    padding: 6rem 5%;
    text-align: center;
    position: relative;
}

/* ========== 合作伙伴区域 ========== */
.partners-section {
    background: var(--dark);
    padding: 4rem 5%;
    text-align: center;
    position: relative;
}

/* 合作伙伴区 - 暗金点缀 */
.partners-section::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: 
        radial-gradient(ellipse at 50% 0%, rgba(184,154,106,0.06) 0%, transparent 50%);
    pointer-events: none;
}

/* ========== 轮播区域 - 东方韵味 ========== */
.gallery-section {
    position: relative;
    padding: 5rem 0;
    background: 
        linear-gradient(180deg, 
            rgba(247,243,238,0) 0%, 
            rgba(237,232,224,0.5) 20%, 
            rgba(237,232,224,0.5) 80%, 
            rgba(247,243,238,0) 100%
        );
}

/* 轮播装饰 - 云纹 */
.carousel-decoration {
    position: absolute;
    width: 150px;
    height: 150px;
    opacity: 0.06;
    pointer-events: none;
}

.carousel-decoration.left {
    left: 3%;
    top: 50%;
    transform: translateY(-50%);
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path d="M10,70 Q30,30 50,50 Q70,20 90,45" fill="none" stroke="%23B89A6A" stroke-width="1.5" opacity="0.5"/><path d="M10,80 Q40,40 60,60 Q80,30 100,55" fill="none" stroke="%23C4A882" stroke-width="1" opacity="0.3"/></svg>') no-repeat;
}

.carousel-decoration.right {
    right: 3%;
    top: 50%;
    transform: translateY(-50%);
    background: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path d="M0,45 Q20,20 40,50 Q60,30 90,70" fill="none" stroke="%23B89A6A" stroke-width="1.5" opacity="0.5"/><path d="M0,55 Q30,30 50,60 Q70,40 100,80" fill="none" stroke="%23C4A882" stroke-width="1" opacity="0.3"/></svg>') no-repeat;
}

/* 轮播卡片 - 哑光质感 */
.carousel-card {
    background: rgba(255,255,255,0.95);
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 15px 50px rgba(107,45,45,0.08);
    border: 1px solid rgba(221,213,200,0.4);
    transition: all 0.5s ease;
}

.carousel-card:hover {
    transform: scale(1.02);
    box-shadow: 0 20px 60px rgba(107,45,45,0.12);
}

/* ========== 按钮 - 高级哑光质感 ========== */
.btn-primary {
    background: linear-gradient(135deg, var(--primary), var(--primary-light));
    color: #FAF6F0;
    box-shadow: 0 4px 15px rgba(107,45,45,0.2);
}

.btn-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(107,45,45,0.28);
}

.btn-secondary {
    background: linear-gradient(135deg, var(--secondary), var(--accent));
    color: #FAF6F0;
    box-shadow: 0 4px 15px rgba(30,58,95,0.2);
}

.btn-secondary:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(30,58,95,0.28);
}

.btn-gold {
    background: linear-gradient(135deg, var(--gold), var(--gold-light));
    color: #1A1510;
    box-shadow: 0 4px 15px rgba(184,150,12,0.18);
}

.btn-gold:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(184,150,12,0.26);
}

.btn-purple {
    background: linear-gradient(135deg, var(--purple), #7A4A7A);
    color: #FAF6F0;
    box-shadow: 0 4px 15px rgba(92,58,92,0.2);
}

.btn-purple:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(92,58,92,0.28);
}

.btn-silver {
    background: linear-gradient(135deg, var(--silver), var(--silver-light));
    color: #1A1510;
    box-shadow: 0 4px 15px rgba(138,155,168,0.18);
}

.btn-silver:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(138,155,168,0.26);
}

/* ========== 表单 ========== */
.register-form input:focus {
    outline: none;
    border-color: var(--primary);
    box-shadow: 0 0 0 4px rgba(107,45,45,0.08);
}

.register-form button:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(107,45,45,0.28);
}

/* ========== 页脚 ========== */
footer {
    background: var(--dark);
    color: white;
    padding: 4rem 5% 2rem;
    position: relative;
}

/* 页脚装饰 - 暗金边 */
footer::before {
    content: '';
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 60px;
    height: 60px;
    background: linear-gradient(135deg, var(--primary), var(--gold));
    border-radius: 50%;
    /* 极淡阴影 */
    box-shadow: 0 -4px 20px rgba(139,69,19,0.25);
}

/* ========== 响应式优化 ========== */
@media (max-width: 768px) {
    .hero {
        padding: 7rem 4% 3rem;
    }
    
    .floating-item {
        display: none;
    }
    
    .carousel-decoration {
        display: none;
    }
}

/* ========== 辅助动画 ========== */
@keyframes fadeInUp {
    from { opacity: 0; transform: translateY(30px); }
    to { opacity: 1; transform: translateY(0); }
}

@keyframes fadeInDown {
    from { opacity: 0; transform: translateY(-30px); }
    to { opacity: 1; transform: translateY(0); }
}

/* 淡入动画 */
.fade-in {
    opacity: 0;
    transform: translateY(30px);
    animation: fadeInUp 0.8s ease forwards;
}

.delay-1 { animation-delay: 0.2s; }
.delay-2 { animation-delay: 0.4s; }
.delay-3 { animation-delay: 0.6s; }