/* ============================================================
   modern.css — 长安墓园官网现代化叠加样式（不改动原样式文件）
   仅做叠加增强，桌面端视觉与原站一致；配合 responsive.css 使用
   ============================================================ */

:root {
    --cy-primary: #2c5530;   /* 品牌绿 */
    --cy-primary-dark: #096b33;
    --cy-gold: #7a5c2e;      /* 品牌棕金 */
    --cy-shadow: 0 2px 8px rgba(44, 85, 48, 0.08);
    --cy-shadow-lg: 0 8px 24px rgba(44, 85, 48, 0.14);
    --cy-radius: 14px;
    --cy-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
}

/* ---------- 全局字体与排版 ---------- */
body {
    font-family: -apple-system, BlinkMacSystemFont, "PingFang SC",
        "HarmonyOS Sans SC", "Microsoft YaHei", "Segoe UI", system-ui, sans-serif;
    line-height: 1.75;
}

/* ---------- 主视觉 Hero ---------- */
.hero-section {
    height: 600px;
    display: flex;
    align-items: center;
    color: #fff;
    position: relative;
    overflow: hidden;
}

.hero-section .container {
    position: relative;
    z-index: 2;
}

/* Hero 文字渐入动画 */
.hero-section h1,
.hero-section p.lead,
.hero-section .btn {
    animation: cyFadeUp 0.9s var(--cy-ease) both;
}
.hero-section p.lead { animation-delay: 0.15s; }
.hero-section .btn   { animation-delay: 0.3s; }

@keyframes cyFadeUp {
    from { opacity: 0; transform: translateY(28px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ---------- 标题现代化 ---------- */
.section-title {
    letter-spacing: 2px;
}

/* 居中双语标题（用于 text-center 的 section-title） */
.section-title.text-center { text-align: center; }
.section-title.text-center::after {
    left: 50%;
    transform: translateX(-50%);
}
.section-title.text-center::before {
    content: '';
    position: absolute;
    bottom: -10px;
    left: 50%;
    transform: translateX(calc(-50% - 42px));
    width: 14px;
    height: 3px;
    background-color: rgba(122, 92, 46, 0.45);
    border-radius: 2px;
}
.section-title.text-center::after {
    transform: translateX(calc(-50% + 28px));
}

/* ---------- 卡片现代化 ---------- */
.feature-box,
.news-card {
    border-radius: var(--cy-radius);
    box-shadow: var(--cy-shadow);
    transition: transform 0.35s var(--cy-ease), box-shadow 0.35s var(--cy-ease);
}

.feature-box:hover,
.news-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--cy-shadow-lg);
}

/* 新闻卡片图片 hover 缩放 */
.news-card .card-img-top {
    transition: transform 0.5s var(--cy-ease);
}
.news-card > div:first-child,
.news-card .img-wrapper { overflow: hidden; }
.news-card:hover .card-img-top { transform: scale(1.05); }

/* 首页三卡（园区概况/视频/墓型）*/
.cy-card {
    border-radius: var(--cy-radius);
    overflow: hidden;
    transition: transform 0.35s var(--cy-ease), box-shadow 0.35s var(--cy-ease);
}
.cy-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--cy-shadow-lg);
}
.cy-card img { transition: transform 0.5s var(--cy-ease); }
.cy-card:hover img { transform: scale(1.06); }

/* 视频播放按钮 hover 放大 */
.cy-play { transition: transform 0.3s var(--cy-ease), opacity 0.3s; }
.cy-card:hover .cy-play { transform: translate(-50%, -50%) scale(1.15); opacity: 1; }

/* ---------- 按钮现代化 ---------- */
.btn { transition: all 0.25s var(--cy-ease); }

.btn-dark {
    background: linear-gradient(135deg, #1f3d23, var(--cy-primary));
    border: none;
    border-radius: 10px;
}
.btn-dark:hover {
    background: linear-gradient(135deg, var(--cy-primary), var(--cy-primary-dark));
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(44, 85, 48, 0.3);
}

.btn-outline-success {
    border-radius: 10px;
}
.btn-outline-success:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 14px rgba(25, 135, 84, 0.25);
}

.btn-light:hover { transform: translateY(-2px); }

/* ---------- 滚动渐入动画 ---------- */
.reveal {
    opacity: 0;
    transform: translateY(30px);
    transition: opacity 0.8s var(--cy-ease), transform 0.8s var(--cy-ease);
}
.reveal.reveal-visible {
    opacity: 1;
    transform: translateY(0);
}
.reveal-delay-1 { transition-delay: 0.12s; }
.reveal-delay-2 { transition-delay: 0.24s; }

/* 无 JS 时兜底显示 */
.no-js .reveal { opacity: 1; transform: none; }

/* ---------- 数字滚动 ---------- */
.cy-num { font-variant-numeric: tabular-nums; }

/* ---------- 页脚现代化 ---------- */
footer {
    background: linear-gradient(180deg, #1c3a20, #142b17) !important;
    color: #d9d9d9;
}
footer h5 {
    color: #fff;
    letter-spacing: 1px;
    margin-bottom: 1.2rem;
    position: relative;
    padding-bottom: 10px;
}
footer h5::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 36px;
    height: 2px;
    background: var(--cy-gold);
    border-radius: 2px;
}
footer a.text-white { transition: color 0.2s, padding-left 0.2s; }
footer a.text-white:hover { color: #e8c88a !important; padding-left: 4px; }

/* 电话一键拨打（移动端） */
footer a[href^="tel:"] { color: #fff; }
footer a[href^="tel:"]:hover { text-decoration: none; }

/* ---------- 返回顶部按钮 ---------- */
#kt_scrolltop {
    border-radius: 50%;
    transition: background 0.25s, transform 0.25s;
}
#kt_scrolltop:hover { transform: translateY(-4px); }

/* ---------- 表单现代化（contact / form_post） ---------- */
.form-control, .form-select {
    border-radius: 10px;
    border: 1px solid #dde2d8;
    padding: 0.65rem 1rem;
    transition: border-color 0.2s, box-shadow 0.2s;
}
.form-control:focus, .form-select:focus {
    border-color: var(--cy-primary);
    box-shadow: 0 0 0 0.2rem rgba(44, 85, 48, 0.12);
}

/* ---------- 图片通用 ---------- */
.img-fluid { border-radius: var(--cy-radius); }

/* ---------- 列表页现代化 ---------- */
.article-title a { transition: color 0.2s; }
.article-title a:hover { color: var(--cy-primary) !important; }