/* ========== 基础重置 ========== */
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family: "Microsoft YaHei", "微软雅黑", sans-serif; color:#333; line-height:1.6; }

.container { max-width:1200px; margin:0 auto; padding:0 15px; }
.site-main { min-height: calc(100vh - 200px); padding: 20px 0; }

/* ========== 顶部条 ========== */
.top-bar { background:#f8edeb; padding:8px 0; font-size:14px; }
.top-bar .container { display:flex; justify-content:space-between; align-items:center; }
.top-bar a { color:#b64a2a; margin-left:15px; text-decoration:none; }

/* ========== 主导航 ========== */
.main-nav { background:#fff; box-shadow:0 2px 15px rgba(0,0,0,0.08); position:sticky; top:0; z-index:100; }
.main-nav .container { display:flex; align-items:center; justify-content:space-between; }
.logo a { display:flex; align-items:center; text-decoration:none; color:#b64a2a; font-size:24px; font-weight:bold; }
.nav-menu { list-style:none; display:flex; gap:20px; }
.nav-menu li a { text-decoration:none; color:#333; padding:15px 10px; transition:color 0.3s; }
.nav-menu li a:hover, .nav-menu li.active a { color:#b64a2a; }
.search-box { display:flex; }
.search-box input { padding:8px 15px; border:1px solid #ccc; border-radius:20px 0 0 20px; outline:none; }
.search-box button { padding:8px 15px; border:1px solid #b64a2a; background:#b64a2a; color:white; border-radius:0 20px 20px 0; cursor:pointer; }

/* ========== 轮播图 ========== */
.hero-banner { background: linear-gradient(135deg, #f6d5e1, #faf0f3); height:400px; display:flex; align-items:center; justify-content:center; position:relative; overflow:hidden; }
.slide { position:absolute; top:0; left:0; width:100%; height:100%; opacity:0; transition:opacity 0.5s; display:flex; align-items:center; justify-content:center; }
.slide.active { opacity:1; }
.slide-content { text-align:center; }
.slide-content h1 { font-size:3rem; color:#b64a2a; margin-bottom:10px; }
.btn-primary, .btn-secondary { display:inline-block; padding:12px 30px; border-radius:30px; text-decoration:none; margin-top:20px; font-weight:bold; }
.btn-primary { background:#b64a2a; color:white; }
.btn-secondary { background:#f8edeb; color:#b64a2a; border:2px solid #b64a2a; }
.slider-prev, .slider-next { position:absolute; top:50%; transform:translateY(-50%); background:rgba(255,255,255,0.8); border:none; font-size:24px; padding:10px; cursor:pointer; border-radius:50%; }
.slider-prev { left:20px; } .slider-next { right:20px; }
.slider-dots { position:absolute; bottom:20px; left:50%; transform:translateX(-50%); display:flex; gap:10px; }
.dot { width:12px; height:12px; border-radius:50%; background:#ccc; cursor:pointer; }
.dot.active { background:#b64a2a; }

/* ========== 服务卡片 ========== */
.section-title { text-align:center; margin:40px 0 30px; }
.service-grid { display:grid; grid-template-columns: repeat(auto-fit, minmax(220px,1fr)); gap:20px; }
.service-card { background:#fff; border-radius:20px; padding:30px 20px; text-align:center; box-shadow:0 5px 20px rgba(0,0,0,0.05); transition:transform 0.3s; text-decoration:none; color:#333; position:relative; }
.service-card:hover { transform:translateY(-5px); }
.service-icon { font-size:3rem; margin-bottom:15px; }
.service-tag { position:absolute; top:10px; right:10px; background:#ff6b6b; color:white; font-size:12px; padding:3px 8px; border-radius:10px; }

/* ========== 工具区 ========== */
.tools-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin:30px 0; }
.tool-card { background:#fff; border-radius:15px; padding:25px; box-shadow:0 5px 15px rgba(0,0,0,0.05); }
.tool-header { display:flex; justify-content:space-between; align-items:center; margin-bottom:20px; }
.countdown-display { display:flex; justify-content:space-around; text-align:center; }
.countdown-number { font-size:2.5rem; font-weight:bold; color:#b64a2a; }
.countdown-label { font-size:14px; color:#666; }
.btn-small { background:#f0f0f0; border:none; padding:5px 15px; border-radius:20px; cursor:pointer; }
.date-picker-wrapper { margin-top:15px; }
.preset-dates { display:flex; gap:10px; margin:10px 0; flex-wrap:wrap; }
.preset-date { background:#f8edeb; border:none; padding:5px 15px; border-radius:20px; cursor:pointer; }

/* ========== 特色模块 ========== */
.modules-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(280px,1fr)); gap:20px; margin:30px 0; }
.module-card { background:#fff; border-radius:15px; padding:20px; box-shadow:0 5px 15px rgba(0,0,0,0.05); }
.module-header { display:flex; align-items:center; gap:10px; margin-bottom:15px; }
.weather-display { display:flex; align-items:center; gap:15px; margin-bottom:15px; }
.weather-icon { font-size:3rem; }
.lunar-display { font-size:14px; color:#555; }
.bazi-input-group { display:flex; flex-direction:column; gap:10px; }
.bazi-input-group input { padding:10px; border:1px solid #ccc; border-radius:5px; }
.map-placeholder { background:#f5f5f5; height:150px; display:flex; flex-direction:column; align-items:center; justify-content:center; border-radius:10px; margin-bottom:15px; }
.map-list { font-size:14px; }
.map-item { margin-bottom:5px; }

/* ========== 评分颜色 ========== */
.testimonial-stars { color: #f39c12; margin-bottom: 10px; }

/* ========== 评价 ========== */
.testimonial-slider { display:flex; gap:20px; flex-wrap:wrap; justify-content:center; }
.testimonial-card { background:#fff; padding:25px; border-radius:15px; box-shadow:0 5px 20px rgba(0,0,0,0.05); width:300px; }
.testimonial-author { display:flex; align-items:center; margin-top:15px; }
.author-avatar { width:45px; height:45px; border-radius:50%; margin-right:10px; object-fit:cover; }

/* ========== 页脚 ========== */
.site-footer { background:#2c3e50; color:#fff; padding:40px 0 20px; }
.footer-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(200px,1fr)); gap:30px; }
.footer-col h4 { margin-bottom:15px; }
.footer-col a, .footer-col p { color:#ccc; text-decoration:none; font-size:14px; line-height:2; }
.footer-social a { margin-right:15px; font-size:20px; color:#fff; }
.footer-bottom { border-top:1px solid rgba(255,255,255,0.1); padding-top:20px; margin-top:30px; text-align:center; font-size:14px; }
.footer-disclaimer { margin-top:8px; font-size:12px; color:rgba(255,255,255,0.45); }

/* ========== 浮动按钮 ========== */
.float-buttons { position:fixed; right:20px; bottom:100px; display:flex; flex-direction:column; gap:10px; }
.float-btn { width:45px; height:45px; border-radius:50%; background:#b64a2a; color:white; border:none; cursor:pointer; position:relative; box-shadow:0 2px 10px rgba(0,0,0,0.2); }
.float-badge { position:absolute; top:-5px; right:-5px; background:red; color:white; font-size:12px; width:20px; height:20px; border-radius:50%; display:flex; align-items:center; justify-content:center; }

/* ========== 表单容器 ========== */
.form-container { max-width:400px; margin:50px auto; background:#fff; padding:30px; border-radius:10px; box-shadow:0 5px 20px rgba(0,0,0,0.1); }
.form-container h2 { text-align:center; margin-bottom:30px; color:#b64a2a; }
.form-group { margin-bottom:20px; }
.form-group label { display:block; margin-bottom:5px; font-weight:bold; }
.form-group input { width:100%; padding:12px; border:1px solid #ddd; border-radius:5px; }
.form-container .btn { width:100%; padding:12px; }

/* ========== 面包屑 ========== */
.breadcrumb { background: #f9f9f9; padding: 10px 0; margin-bottom: 20px; }
/* ========== 页面标题区域 ========== */
.page-banner {
    background: linear-gradient(135deg, #f6d5e1, #faf0f3);
    padding: 60px 0;
    text-align: center;
}
.page-banner h1 {
    font-size: 2.5rem;
    color: #b64a2a;
    margin-bottom: 15px;
}
.page-banner p {
    font-size: 1.2rem;
    color: #666;
}

/* ========== 服务详情 ========== */
.service-detail-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 30px;
    padding: 40px 0;
}
.service-detail-card {
    background: white;
    border-radius: 15px;
    padding: 30px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08);
    transition: transform 0.3s;
}
.service-detail-card:hover {
    transform: translateY(-5px);
}
.service-detail-icon {
    font-size: 3rem;
    margin-bottom: 15px;
}
.service-detail-card h3 {
    color: #b64a2a;
    margin-bottom: 15px;
}
.service-features {
    list-style: none;
    margin: 15px 0;
}
.service-features li {
    padding: 5px 0;
    font-size: 14px;
}

/* ========== 婚俗内容 ========== */
.traditions-content {
    padding: 40px 0;
}
.tradition-item {
    background: white;
    border-radius: 12px;
    padding: 25px;
    margin-bottom: 20px;
    box-shadow: 0 3px 10px rgba(0,0,0,0.06);
    border-left: 4px solid #b64a2a;
}
.tradition-item h3 {
    color: #b64a2a;
    margin-bottom: 10px;
}
.tradition-item p {
    line-height: 1.8;
    color: #555;
}

/* ========== 商家列表 ========== */
.vendor-filters {
    display: flex;
    gap: 10px;
    margin: 30px 0;
    justify-content: center;
    flex-wrap: wrap;
}
.filter-btn {
    padding: 8px 20px;
    border: 2px solid #ddd;
    background: white;
    border-radius: 25px;
    cursor: pointer;
    transition: all 0.3s;
}
.filter-btn.active {
    border-color: #b64a2a;
    background: #b64a2a;
    color: white;
}
.vendor-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 25px;
    padding-bottom: 40px;
}
.vendor-card {
    background: white;
    border-radius: 15px;
    padding: 25px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.08);
}
.vendor-header {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
}
.vendor-type {
    background: #f8edeb;
    color: #b64a2a;
    padding: 3px 12px;
    border-radius: 12px;
    font-size: 13px;
}
.vendor-rating {
    color: #f39c12;
    font-size: 14px;
}
.vendor-detail-badge {
    background: #e8f4f8;
    color: #2980b9;
    padding: 3px 12px;
    border-radius: 12px;
    font-size: 13px;
}
.vendor-card h3 {
    color: #333;
    margin-bottom: 10px;
}
.vendor-description {
    color: #666;
    font-size: 14px;
    line-height: 1.6;
    margin-bottom: 15px;
}
.vendor-info p {
    font-size: 13px;
    color: #888;
    margin-bottom: 5px;
}
.vendor-info i {
    width: 20px;
    color: #b64a2a;
}
/* ========== 案例页面 ========== */
.gallery-section {
    padding: 40px 0;
}

.gallery-filters {
    display: flex;
    gap: 10px;
    margin-bottom: 30px;
    justify-content: center;
    flex-wrap: wrap;
}

.gallery-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
    gap: 25px;
}

.gallery-card {
    background: white;
    border-radius: 15px;
    overflow: hidden;
    box-shadow: 0 5px 15px rgba(0,0,0,0.08);
    transition: transform 0.3s;
}

.gallery-card:hover {
    transform: translateY(-5px);
}

.gallery-image {
    height: 200px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.gallery-icon {
    font-size: 4rem;
}

.gallery-type {
    position: absolute;
    top: 10px;
    right: 10px;
    background: rgba(0,0,0,0.5);
    color: white;
    padding: 5px 12px;
    border-radius: 15px;
    font-size: 13px;
}

.gallery-info {
    padding: 20px;
}

/* 雪山婚礼特色卡片样式 */
.gallery-card.featured-card {
    border: 2px solid #b64a2a;
    animation: pulse 3s ease-in-out infinite;
}

@keyframes pulse {
    0%, 100% {
        box-shadow: 0 5px 15px rgba(74, 144, 194, 0.3);
    }
    50% {
        box-shadow: 0 8px 25px rgba(74, 144, 194, 0.5);
    }
}

.featured-badge {
    position: absolute;
    top: 10px;
    left: 10px;
    background: linear-gradient(135deg, #ff6b6b, #ffa502);
    color: white;
    padding: 6px 12px;
    border-radius: 15px;
    font-size: 12px;
    font-weight: bold;
    display: flex;
    align-items: center;
    gap: 5px;
}

.snow-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    pointer-events: none;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
    opacity: 0.15;
    animation: snowfall 20s linear infinite;
}

@keyframes snowfall {
    0% {
        transform: translateY(-100%);
    }
    100% {
        transform: translateY(100%);
    }
}

.gallery-location {
    font-size: 12px !important;
    color: #666 !important;
    margin: 8px 0 !important;
    font-style: italic;
}

.gallery-highlights {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

.highlight-tag {
    background: linear-gradient(135deg, #1e3a5f, #b64a2a);
    color: white;
    padding: 4px 12px;
    border-radius: 15px;
    font-size: 12px;
}

.gallery-info h3 {
    color: #b64a2a;
    margin-bottom: 8px;
}

.gallery-info p {
    color: #666;
    font-size: 14px;
    line-height: 1.5;
}

.gallery-date {
    color: #999;
    font-size: 13px;
    margin: 5px 0;
}

.gallery-desc {
    color: #777;
    margin-top: 8px;
}

/* ========== 关于我们页面 ========== */
.about-intro {
    padding: 50px 0;
}

.about-content {
    display: grid;
    grid-template-columns: 2fr 1fr;
    gap: 40px;
    align-items: center;
}

.about-text h2 {
    color: #b64a2a;
    margin-bottom: 20px;
}

.about-text p {
    color: #555;
    line-height: 1.8;
    margin-bottom: 15px;
}

.about-stats {
    display: grid;
    gap: 20px;
}

.stat-item {
    background: #f8edeb;
    padding: 20px;
    border-radius: 12px;
    text-align: center;
}

.stat-number {
    display: block;
    font-size: 2rem;
    font-weight: bold;
    color: #b64a2a;
}

.stat-label {
    display: block;
    color: #666;
    margin-top: 5px;
}

/* 团队 */
.about-team {
    background: #f9f9f9;
    padding: 50px 0;
}

.about-team h2 {
    text-align: center;
    color: #b64a2a;
    margin-bottom: 30px;
}

.team-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 25px;
}

.team-card {
    background: white;
    padding: 30px;
    border-radius: 15px;
    text-align: center;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
}

.team-avatar {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    margin: 0 auto 15px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
    color: white;
}

.team-card h3 {
    color: #333;
    margin-bottom: 5px;
}

.team-card p {
    color: #666;
    font-size: 14px;
}

.team-desc {
    margin-top: 10px;
    color: #888;
}

/* 联系我们 */
.about-contact {
    padding: 50px 0;
}

.about-contact h2 {
    text-align: center;
    color: #b64a2a;
    margin-bottom: 30px;
}

.contact-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
}

.contact-card {
    background: #f8edeb;
    padding: 25px;
    border-radius: 12px;
    text-align: center;
}

.contact-card i {
    font-size: 2.5rem;
    color: #b64a2a;
    margin-bottom: 10px;
}

.contact-card h3 {
    color: #333;
    margin-bottom: 8px;
}

.contact-card p {
    color: #666;
}

/* 响应式 */
@media (max-width: 768px) {
    .about-content {
        grid-template-columns: 1fr;
    }
}
/* ========== 风俗查询页面 ========== */
.custom-nav {
    padding: 30px 0;
    position: sticky;
    top: 60px;
    background: white;
    z-index: 50;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
}

.category-tabs {
    display: flex;
    gap: 15px;
    justify-content: center;
    flex-wrap: wrap;
}

.category-btn {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 15px 25px;
    border: 2px solid #eee;
    background: white;
    border-radius: 15px;
    cursor: pointer;
    transition: all 0.3s;
    min-width: 120px;
}

.category-btn:hover,
.category-btn.active {
    border-color: #b64a2a;
    background: #f8edeb;
    transform: translateY(-2px);
}

.category-icon {
    font-size: 2rem;
    margin-bottom: 5px;
}

.category-name {
    font-size: 14px;
    color: #333;
}

.category-btn.active .category-name {
    color: #b64a2a;
    font-weight: bold;
}

/* 风俗详情区域 */
.custom-details {
    padding: 30px 0 60px;
}

.category-section {
    margin-bottom: 50px;
    scroll-margin-top: 150px;
}

.category-section h2 {
    color: #b64a2a;
    font-size: 1.8rem;
    margin-bottom: 25px;
    padding-bottom: 10px;
    border-bottom: 3px solid #f8edeb;
}

.custom-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 20px;
}

.custom-card {
    background: white;
    border-radius: 15px;
    padding: 25px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.06);
    cursor: pointer;
    transition: all 0.3s;
    border: 1px solid #f0f0f0;
}

.custom-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
    border-color: #b64a2a;
}

.custom-card h3 {
    color: #333;
    margin-bottom: 10px;
    font-size: 1.2rem;
}

.custom-card p {
    color: #666;
    line-height: 1.6;
    font-size: 14px;
}

.custom-card-footer {
    margin-top: 15px;
    padding-top: 15px;
    border-top: 1px solid #f0f0f0;
}

.read-more {
    color: #b64a2a;
    font-size: 14px;
    font-weight: bold;
}

/* ========== 酒店列表表格 ========== */
.hotel-table-wrapper {
    overflow-x: auto;
    background: white;
    border-radius: 12px;
    box-shadow: 0 3px 20px rgba(0,0,0,0.06);
    margin-bottom: 20px;
}
.hotel-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    min-width: 900px;
}
.hotel-table th {
    background: #b64a2a;
    color: white;
    padding: 13px 12px;
    text-align: left;
    font-weight: 500;
    white-space: nowrap;
    font-size: 13px;
}
.hotel-table th:first-child { border-radius: 12px 0 0 0; }
.hotel-table th:last-child { border-radius: 0 12px 0 0; }
.hotel-table td {
    padding: 11px 12px;
    border-bottom: 1px solid #f0f0f0;
    color: #555;
    font-size: 13px;
    vertical-align: middle;
}
.hotel-table tbody tr:hover td { background: #fdf8f5; }
.hotel-table tbody tr:last-child td:first-child { border-radius: 0 0 0 12px; }
.hotel-table tbody tr:last-child td:last-child { border-radius: 0 0 12px 0; }

.hotel-region {
    font-weight: 600;
    color: #b64a2a;
    white-space: nowrap;
    text-align: center;
}
.hotel-name {
    font-weight: 600;
    color: #333;
}
.hotel-capacity { white-space: nowrap; }
.hotel-price { white-space: nowrap; color: #e67e22; font-weight: 500; }
.hotel-feature { font-size: 12px; line-height: 1.5; }
.hotel-phone { white-space: nowrap; color: #2471a3; }

/* 酒店推荐 */
.hotel-recommend {
    background: linear-gradient(135deg, #fdf2f0, #fff8f6);
    border-radius: 12px;
    padding: 20px 25px;
    border: 1px solid #f5d5cc;
    margin-top: 20px;
}
.hotel-rec-title {
    font-size: 16px;
    font-weight: 700;
    color: #b64a2a;
    margin-bottom: 12px;
}
.hotel-rec-content {
    color: #555;
    line-height: 1.8;
    font-size: 14px;
}

/* 弹窗样式 */
.modal-overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.6);
    z-index: 1000;
    justify-content: center;
    align-items: center;
}

.modal-overlay.active {
    display: flex;
}

.modal-content {
    background: white;
    border-radius: 20px;
    padding: 40px;
    max-width: 600px;
    width: 90%;
    max-height: 80vh;
    overflow-y: auto;
    position: relative;
    animation: modalIn 0.3s ease;
}

@keyframes modalIn {
    from {
        opacity: 0;
        transform: scale(0.9);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

.modal-close {
    position: absolute;
    top: 15px;
    right: 20px;
    font-size: 2rem;
    background: none;
    border: none;
    cursor: pointer;
    color: #999;
    transition: color 0.3s;
}

.modal-close:hover {
    color: #333;
}

#modalTitle {
    color: #b64a2a;
    margin-bottom: 20px;
    font-size: 1.8rem;
}

#modalContent {
    line-height: 1.8;
    color: #555;
    margin-bottom: 20px;
}

.modal-tips {
    background: #f8edeb;
    padding: 15px 20px;
    border-radius: 10px;
    border-left: 4px solid #b64a2a;
    line-height: 1.6;
    color: #666;
}

.modal-tips strong {
    color: #b64a2a;
}
.custom-search {
    padding: 20px 0;
    background: #f9f9f9;
}

.search-wrapper {
    position: relative;
    max-width: 500px;
    margin: 0 auto;
}

#customSearch {
    width: 100%;
    padding: 12px 20px 12px 45px;
    border: 2px solid #eee;
    border-radius: 30px;
    font-size: 16px;
    transition: border-color 0.3s;
    outline: none;
}

#customSearch:focus {
    border-color: #b64a2a;
}

.search-icon {
    position: absolute;
    left: 15px;
    top: 50%;
    transform: translateY(-50%);
    color: #999;
}
/* 交友模块样式 */
.dating-filters {
    background: #f8f9fa;
    padding: 20px 0;
    margin-bottom: 30px;
}

.filter-form .filter-row {
    display: flex;
    gap: 15px;
    align-items: center;
    flex-wrap: wrap;
}

.filter-form input, .filter-form select {
    padding: 10px 15px;
    border: 1px solid #ddd;
    border-radius: 5px;
    font-size: 14px;
}

.profiles-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 30px;
    margin: 30px 0;
}

.profile-card {
    background: white;
    border-radius: 15px;
    padding: 25px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
    text-align: center;
    transition: transform 0.3s;
    cursor: pointer;
}

.profile-card:hover {
    transform: translateY(-5px);
}

.profile-avatar {
    position: relative;
    width: 120px;
    height: 120px;
    margin: 0 auto 15px;
    border-radius: 50%;
    overflow: hidden;
    border: 3px solid #ff6b6b;
}

.avatar-placeholder {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #ff6b6b, #ee5a24);
    color: white;
    font-size: 42px;
    font-weight: bold;
}

.profile-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.gender-tag {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 35px;
    height: 35px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 18px;
    border: 2px solid white;
}

.gender-tag.male {
    background: #4a90e2;
}

.gender-tag.female {
    background: #ff6b6b;
}

.profile-info {
    display: flex;
    gap: 10px;
    justify-content: center;
    flex-wrap: wrap;
    margin: 10px 0;
}

.profile-info span {
    background: #f0f0f0;
    padding: 3px 10px;
    border-radius: 12px;
    font-size: 12px;
    color: #666;
}

.profile-intro {
    color: #666;
    font-size: 14px;
    line-height: 1.6;
    margin: 10px 0;
}

.btn-contact {
    background: linear-gradient(135deg, #ff6b6b, #ee5a24);
    color: white;
    border: none;
    padding: 10px 25px;
    border-radius: 25px;
    cursor: pointer;
    transition: transform 0.3s;
}

.btn-contact:hover {
    transform: scale(1.05);
}

/* 预算模块样式 */
.budget-stats {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
    gap: 20px;
    margin: 30px 0;
}

.stat-card {
    background: white;
    border-radius: 15px;
    padding: 25px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
    text-align: center;
}

.stat-card h3 {
    color: #666;
    font-size: 16px;
    margin-bottom: 10px;
}

.stat-card .amount {
    font-size: 28px;
    font-weight: bold;
    color: #b64a2a;
}
.stat-card .amount.paid { color: #e74c3c; }
.stat-card .amount.success { color: #27ae60; }
.stat-card .amount.danger { color: #e74c3c; }

.budget-form-section {
    background: #f8f9fa;
    padding: 25px;
    border-radius: 15px;
    margin: 30px 0;
}
.budget-form .form-row {
    display: flex;
    gap: 10px;
    align-items: center;
    flex-wrap: wrap;
}
.budget-form select, .budget-form input[type="text"], .budget-form input[type="number"] {
    padding: 10px 15px;
    border: 1px solid #ddd;
    border-radius: 5px;
    font-size: 14px;
    min-width: 120px;
}
.checkbox-label {
    display: flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
    font-size: 14px;
    color: #666;
}
.budget-card .btn-primary, .form-container .btn-primary, .admin-panel .btn-primary {
    background: linear-gradient(135deg, #b64a2a, #e74c3c);
    color: white;
    border: none;
    padding: 10px 25px;
    border-radius: 5px;
    cursor: pointer;
    font-size: 14px;
    transition: opacity 0.3s;
}
.budget-card .btn-primary:hover, .form-container .btn-primary:hover, .admin-panel .btn-primary:hover { opacity: 0.9; }

.budget-category {
    background: white;
    border-radius: 15px;
    padding: 20px;
    margin-bottom: 20px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}
.category-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 15px;
    border-bottom: 1px solid #eee;
    margin-bottom: 15px;
}
.category-header h3 { color: #b64a2a; font-size: 18px; }
.category-header span { color: #999; font-size: 13px; }
.budget-item {
    display: flex;
    align-items: center;
    padding: 12px 0;
    border-bottom: 1px solid #f5f5f5;
    gap: 15px;
    flex-wrap: wrap;
}
.budget-item:last-child { border-bottom: none; }
.item-name { flex: 1; font-weight: 500; }
.essential-tag {
    background: #e74c3c;
    color: white;
    padding: 2px 8px;
    border-radius: 3px;
    font-size: 11px;
    margin-right: 8px;
}
.item-amount, .item-actual, .item-paid {
    font-size: 14px;
    color: #666;
    min-width: 120px;
}
.btn-delete {
    color: #e74c3c;
    text-decoration: none;
    font-size: 14px;
}
.btn-delete:hover { text-decoration: underline; }
.empty-state {
    text-align: center;
    color: #999;
    padding: 40px 0;
}

/* 费用参考汇总表 */
.budget-reference {
    background: #faf9f8;
    border-radius: 15px;
    margin-top: 30px;
    padding: 40px 20px 50px;
}
.budget-reference h2 {
    text-align: center;
    color: #b64a2a;
    margin-bottom: 10px;
}
.reference-intro {
    text-align: center;
    color: #888;
    font-size: 14px;
    margin-bottom: 25px;
}
.reference-table-wrapper { overflow-x: auto; }
.reference-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    min-width: 700px;
    max-width: 900px;
    margin: 0 auto;
}
.reference-table th {
    background: #b64a2a;
    color: white;
    padding: 12px 16px;
    text-align: left;
    font-weight: 500;
}
.reference-table th:first-child { border-radius: 8px 0 0 0; }
.reference-table th:last-child { border-radius: 0 8px 0 0; }
.reference-table td {
    padding: 12px 16px;
    border-bottom: 1px solid #eee;
    color: #555;
    background: white;
}
.reference-table tbody tr:hover td { background: #fdf8f5; }
.reference-table tbody tr:last-child td:first-child { border-radius: 0 0 0 8px; }
.reference-table tbody tr:last-child td:last-child { border-radius: 0 0 8px 0; }

.ref-num { text-align: center; width: 50px; color: #999; }
.ref-cat { font-weight: 600; color: #333; white-space: nowrap; }
.ref-amount { font-weight: 600; white-space: nowrap; }
.ref-amount.low { color: #27ae60; }
.ref-amount.mid { color: #e67e22; }
.ref-detail { color: #777; font-size: 13px; line-height: 1.5; }

.reference-table tfoot td {
    background: #fdf2f0;
    font-weight: 600;
    border-top: 2px solid #b64a2a;
}
.ref-total-label { color: #b64a2a; font-size: 15px; }
.low-total { color: #27ae60; font-size: 16px; }
.mid-total { color: #e67e22; font-size: 16px; }

/* 清单模块样式 */
.checklist-overview { margin-bottom: 30px; }
.progress-section {
    background: white;
    padding: 25px;
    border-radius: 15px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}
.progress-info {
    display: flex;
    justify-content: space-between;
    margin-bottom: 10px;
    font-size: 14px;
    color: #666;
}
.checklist-progress { display: flex; align-items: center; gap: 10px; }
.progress-bar {
    height: 10px;
    background: #eee;
    border-radius: 5px;
    overflow: hidden;
}
.progress-fill {
    height: 100%;
    background: linear-gradient(90deg, #27ae60, #2ecc71);
    border-radius: 5px;
    transition: width 0.3s;
}
.checklist-tabs {
    display: flex;
    gap: 10px;
    margin: 20px 0;
    flex-wrap: wrap;
}
.tab-btn {
    padding: 10px 20px;
    border: 1px solid #ddd;
    background: white;
    border-radius: 5px;
    cursor: pointer;
    font-size: 14px;
    transition: all 0.3s;
}
.tab-btn.active, .tab-btn:hover {
    background: #b64a2a;
    color: white;
    border-color: #b64a2a;
}
.checklist-items { list-style: none; padding: 0; }
.checklist-item {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 12px 0;
    border-bottom: 1px solid #f5f5f5;
}
.checklist-item:last-child { border-bottom: none; }
.task-priority { font-size: 12px; padding: 2px 8px; border-radius: 3px; }
.task-priority.urgent { background: #fde8e8; color: #e74c3c; }
.task-priority.important { background: #fdf3e8; color: #e67e22; }
.deadline { color: #999; font-size: 12px; }
.checklist-category {
    background: white;
    border-radius: 15px;
    padding: 20px;
    margin-bottom: 15px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}
.checklist-category h4 { color: #b64a2a; margin-bottom: 15px; }
.full-checklist { margin-top: 40px; }
.full-checklist h3 { margin-bottom: 20px; }

/* 后台管理样式 */
.admin-dashboard { margin: 20px 0; }
.admin-tabs {
    display: flex;
    gap: 10px;
    margin: 20px 0;
    flex-wrap: wrap;
}
.admin-tab-btn {
    padding: 10px 20px;
    border: 1px solid #ddd;
    background: white;
    border-radius: 5px;
    cursor: pointer;
    font-size: 14px;
    transition: all 0.3s;
}
.admin-tab-btn.active, .admin-tab-btn:hover {
    background: #b64a2a;
    color: white;
    border-color: #b64a2a;
}
.admin-panel {
    background: white;
    border-radius: 15px;
    padding: 25px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.08);
    margin-bottom: 20px;
    display: none;
}
.admin-panel.active { display: block; }
.admin-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    padding-bottom: 15px;
    border-bottom: 1px solid #eee;
}
.admin-header h3 { color: #b64a2a; font-size: 18px; }
.admin-form {
    background: #f8f9fa;
    padding: 20px;
    border-radius: 10px;
    margin-bottom: 25px;
}
.admin-form .form-group {
    margin-bottom: 15px;
}
.admin-form label {
    display: block;
    margin-bottom: 5px;
    color: #333;
    font-weight: 500;
    font-size: 14px;
}
.admin-form input[type="text"],
.admin-form input[type="number"],
.admin-form textarea,
.admin-form select {
    width: 100%;
    padding: 10px 15px;
    border: 1px solid #ddd;
    border-radius: 5px;
    font-size: 14px;
    font-family: inherit;
}
.admin-form textarea { resize: vertical; min-height: 80px; }
.admin-form input[type="url"],
.admin-form input[type="file"] {
    padding: 10px 15px;
    border: 1px solid #ddd;
    border-radius: 5px;
    font-size: 14px;
    width: 100%;
}
.admin-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 15px;
}
.admin-table th, .admin-table td {
    padding: 12px 15px;
    text-align: left;
    border-bottom: 1px solid #eee;
}
.admin-table th {
    background: #f8f9fa;
    color: #333;
    font-weight: 600;
    font-size: 14px;
}
.admin-table td { font-size: 14px; color: #666; }
.admin-table tr:hover td { background: #fafafa; }
.admin-table .btn-sm {
    padding: 5px 12px;
    border-radius: 3px;
    font-size: 12px;
    text-decoration: none;
    margin-right: 5px;
}
.btn-edit { background: #3498db; color: white; }
.btn-delete-sm { background: #e74c3c; color: white; }
.btn-edit:hover, .btn-delete-sm:hover { opacity: 0.85; }
.admin-login {
    max-width: 400px;
    margin: 60px auto;
    background: white;
    padding: 30px;
    border-radius: 15px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.1);
}
.admin-login h2 { text-align: center; margin-bottom: 25px; color: #b64a2a; }

/* 关于我们样式 */
.about-intro { padding: 60px 0; }
.about-content {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: center;
}
.about-text h2 { color: #b64a2a; margin-bottom: 20px; }
.about-text p { color: #666; line-height: 1.8; margin-bottom: 15px; }
/* 移除重复的 about-stats / stat-item / about-team / team-grid（已合并到上方 L426 ~L465 首个定义中） */
.team-card {
    background: white;
    border-radius: 15px;
    padding: 30px;
    text-align: center;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
    transition: transform 0.3s;
}
.team-card:hover { transform: translateY(-5px); }
.team-avatar {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 28px;
    font-weight: bold;
    margin: 0 auto 15px;
}
.team-card h3 { color: #333; margin-bottom: 8px; }
.team-card p { color: #999; font-size: 14px; margin-bottom: 5px; }
.team-desc { color: #666 !important; font-size: 13px !important; margin-top: 10px !important; }
.about-contact { padding: 60px 0; }
.about-contact h2 { text-align: center; margin-bottom: 40px; color: #b64a2a; }
.contact-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 30px;
}
.contact-card {
    background: white;
    border-radius: 15px;
    padding: 30px;
    text-align: center;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}
.contact-card i { font-size: 32px; color: #b64a2a; margin-bottom: 15px; }
.contact-card h3 { color: #333; margin-bottom: 10px; }
.contact-card p { color: #666; font-size: 14px; }

/* ========== 附加服务区域 ========== */
.additional-services {
    padding: 60px 0;
    background: #fafafa;
}
.additional-services h2 {
    text-align: center;
    color: #b64a2a;
    margin-bottom: 40px;
}
.additional-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 30px;
}
.additional-card {
    background: white;
    border-radius: 15px;
    padding: 30px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.05);
    transition: transform 0.3s;
    text-align: center;
}
.additional-card:hover { transform: translateY(-3px); }
.additional-icon { font-size: 3rem; margin-bottom: 15px; }
.additional-card h3 { color: #333; margin-bottom: 10px; }
.additional-card p { color: #666; font-size: 14px; margin-bottom: 15px; }
.btn-link {
    color: #b64a2a;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    transition: color 0.3s;
}
.btn-link:hover { color: #e74c3c; }

/* ========== 评价头像占位 ========== */
.author-avatar-placeholder {
    width: 45px;
    height: 45px;
    border-radius: 50%;
    background: linear-gradient(135deg, #b64a2a, #e74c3c);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    font-weight: bold;
    margin-right: 10px;
}

/* 移除重复弹窗样式（已合并到上方第一个弹窗样式块中） */

/* 联系弹窗（dating） */
.modal {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.6);
    z-index: 999;
}
.modal .modal-content {
    margin: 15% auto;
    max-width: 400px;
}
.modal .close {
    position: absolute;
    top: 10px;
    right: 15px;
    font-size: 24px;
    cursor: pointer;
}

/* ========== 分页 ========== */
.pagination { display: flex; gap: 8px; justify-content: center; margin: 30px 0; }
.page-link {
    padding: 8px 15px;
    border: 1px solid #ddd;
    border-radius: 5px;
    text-decoration: none;
    color: #333;
    font-size: 14px;
    transition: all 0.3s;
}
.page-link:hover, .page-link.active { background: #b64a2a; color: white; border-color: #b64a2a; }

/* ========== 表单行 ========== */
.form-row {
    display: flex;
    gap: 15px;
}
.form-row .form-group { flex: 1; }
.form-container textarea {
    width: 100%;
    padding: 12px;
    border: 1px solid #ddd;
    border-radius: 5px;
    font-family: inherit;
    resize: vertical;
}
.form-container select {
    width: 100%;
    padding: 12px;
    border: 1px solid #ddd;
    border-radius: 5px;
}
.btn-block { width: 100%; }
.error-message { color: #e74c3c; background: #fde8e8; padding: 10px; border-radius: 5px; margin-bottom: 15px; font-size: 14px; }
.success-message { color: #27ae60; background: #e8f5e9; padding: 10px; border-radius: 5px; margin-bottom: 15px; font-size: 14px; text-align: center; }

/* 移除重复的婚俗分类导航/搜索/卡片样式（已合并到上方对应首个定义中） */

/* ========== 婚俗内容（traditions） ========== */
.traditions-section { padding: 40px 0; }

/* ========== 导航响应式（多菜单项适配） ========== */
.mobile-menu-btn {
    display: none;
    background: #b64a2a;
    color: white;
    border: none;
    padding: 10px 15px;
    border-radius: 8px;
    font-size: 18px;
    cursor: pointer;
}

@media (max-width: 1200px) {
    .nav-menu { gap: 10px; flex-wrap: wrap; }
    .nav-menu li a { padding: 10px 8px; font-size: 14px; }
}
/* 移除重复的 992px/768px/480px 媒体查询块，已分别合并到下方对应综合块中 */

/* ========== 婚礼当日流程安排 ========== */
.schedule-intro { padding: 20px 0; }
.summary-card {
    background: linear-gradient(135deg, #f8edeb, #fdf2f0);
    border-radius: 15px;
    padding: 25px 30px;
    text-align: center;
    border-left: 4px solid #b64a2a;
}
.summary-icon { font-size: 2.5rem; margin-bottom: 10px; }
.summary-card h3 { color: #b64a2a; margin-bottom: 8px; }
.summary-card p { color: #666; font-size: 14px; line-height: 1.6; }

.schedule-timeline { padding: 30px 0 50px; }
.schedule-tabs {
    display: flex;
    gap: 10px;
    justify-content: center;
    margin-bottom: 35px;
    flex-wrap: wrap;
}
.schedule-tab {
    padding: 12px 28px;
    border: 2px solid #eee;
    background: white;
    border-radius: 30px;
    cursor: pointer;
    font-size: 15px;
    transition: all 0.3s;
}
.schedule-tab:hover, .schedule-tab.active {
    border-color: #b64a2a;
    background: #f8edeb;
    color: #b64a2a;
    font-weight: bold;
}

.timeline-container { max-width: 800px; margin: 0 auto; }
.timeline-item {
    display: flex;
    gap: 20px;
    margin-bottom: 25px;
    position: relative;
}
.timeline-time {
    min-width: 120px;
    background: #f8edeb;
    color: #b64a2a;
    padding: 8px 12px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: bold;
    text-align: center;
    height: fit-content;
    margin-top: 8px;
}
.timeline-dot {
    width: 14px;
    height: 14px;
    min-width: 14px;
    border-radius: 50%;
    background: #b64a2a;
    margin-top: 12px;
    position: relative;
    z-index: 1;
}
.timeline-dot::before {
    content: '';
    position: absolute;
    top: 14px;
    left: 6px;
    width: 2px;
    height: calc(100% + 25px);
    background: #e8d5d1;
}
.timeline-item:last-child .timeline-dot::before { display: none; }
.timeline-card {
    flex: 1;
    background: white;
    border-radius: 15px;
    padding: 20px 25px;
    box-shadow: 0 3px 15px rgba(0,0,0,0.06);
    border: 1px solid #f0f0f0;
}
.timeline-card h3 { color: #333; margin-bottom: 8px; font-size: 1.1rem; }
.timeline-card p { color: #666; line-height: 1.6; font-size: 14px; }
.timeline-tips {
    margin-top: 12px;
    padding-left: 18px;
}
.timeline-tips li {
    color: #888;
    font-size: 13px;
    line-height: 1.8;
    position: relative;
    padding-left: 5px;
}
.timeline-tips li::marker { color: #b64a2a; }

/* 婚礼流程表格（动态） */
.schedule-table-wrapper {
    overflow-x: auto;
    background: white;
    border-radius: 12px;
    box-shadow: 0 3px 20px rgba(0,0,0,0.06);
    margin-bottom: 20px;
}
.schedule-table {
    width: 100%;
    border-collapse: collapse;
    min-width: 700px;
}
.schedule-table thead th {
    background: #b64a2a;
    color: white;
    padding: 13px 12px;
    text-align: left;
    font-weight: 500;
    font-size: 14px;
}
.schedule-table thead th:first-child { border-radius: 12px 0 0 0; }
.schedule-table thead th:last-child { border-radius: 0 12px 0 0; }
.schedule-table tbody td {
    padding: 12px;
    border-bottom: 1px solid #f0f0f0;
    font-size: 14px;
    color: #444;
}
.schedule-row:hover { background: #fdf6f4; }
.schedule-row:last-child td { border-bottom: none; }
.schedule-time {
    font-weight: bold;
    color: #b64a2a;
    white-space: nowrap;
}
.schedule-segment {
    font-weight: 600;
    color: #333;
}
.schedule-notes {
    color: #e67e22;
    font-size: 13px;
}
.schedule-period-header td {
    background: #f8edeb;
    padding: 8px 12px;
    border-bottom: 2px solid #e8d5d1;
}
.period-badge {
    font-weight: 600;
    color: #b64a2a;
    font-size: 15px;
}

.schedule-checklist { padding: 40px 0 60px; background: #fafafa; }
.schedule-checklist h2 { text-align: center; color: #b64a2a; margin-bottom: 30px; }
.schedule-checklist-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: 25px;
    max-width: 900px;
    margin: 0 auto;
}
.checklist-category {
    background: white;
    border-radius: 15px;
    padding: 25px;
    box-shadow: 0 3px 15px rgba(0,0,0,0.05);
}
.checklist-category h3 { color: #b64a2a; margin-bottom: 15px; font-size: 1.1rem; }
.checklist-category ul { list-style: none; padding: 0; }
.checklist-category li {
    padding: 8px 0;
    border-bottom: 1px dashed #eee;
    color: #555;
    font-size: 14px;
}
.checklist-category li:last-child { border-bottom: none; }
.checklist-category li::before { content: '☐ '; color: #b64a2a; margin-right: 5px; }

/* ========== 角色分工表 ========== */
.schedule-roles {
    padding: 50px 0;
    background: #fff;
}
.schedule-roles h2 {
    text-align: center;
    color: #b64a2a;
    margin-bottom: 10px;
}
.roles-intro {
    text-align: center;
    color: #888;
    font-size: 14px;
    margin-bottom: 30px;
    max-width: 700px;
    margin-left: auto;
    margin-right: auto;
}
.roles-table-wrapper {
    overflow-x: auto;
    margin-bottom: 20px;
}
.roles-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    min-width: 650px;
}
.roles-table th {
    background: #b64a2a;
    color: white;
    padding: 14px 16px;
    text-align: left;
    font-weight: 500;
    white-space: nowrap;
}
.roles-table th:first-child { border-radius: 10px 0 0 0; }
.roles-table th:last-child { border-radius: 0 10px 0 0; }
.roles-table td {
    padding: 14px 16px;
    border-bottom: 1px solid #f0f0f0;
    color: #555;
    line-height: 1.5;
}
.roles-table tbody tr:hover td { background: #fdf8f5; }
.roles-table tbody tr:last-child td:first-child { border-radius: 0 0 0 10px; }
.roles-table tbody tr:last-child td:last-child { border-radius: 0 0 10px 0; }

.role-badge {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 15px;
    font-size: 13px;
    font-weight: 500;
    white-space: nowrap;
}
.role-chief  { background: #fdecea; color: #c0392b; }
.role-mc     { background: #fef9e7; color: #b7950b; }
.role-groom  { background: #eaf2f8; color: #2471a3; }
.role-bride  { background: #fdedec; color: #c0392b; }
.role-sign   { background: #eafaf1; color: #1e8449; }
.role-money  { background: #fef9e7; color: #b7950b; }
.role-car    { background: #eaf2f8; color: #1a5276; }
.role-item   { background: #f4ecf7; color: #6c3483; }
.role-seat   { background: #eafaf1; color: #1e8449; }
.role-photo  { background: #fdebd0; color: #935116; }
.role-parent { background: #fdedec; color: #b64a2a; }

.editable-cell {
    color: #bbb !important;
    font-style: italic;
}
.roles-tip {
    text-align: center;
    color: #888;
    font-size: 13px;
    margin-top: 15px;
    background: #fafafa;
    padding: 12px 20px;
    border-radius: 10px;
}

/* ========== 父母衣着 ========== */
.attire-intro { padding: 20px 0; }
.attire-intro-card {
    background: linear-gradient(135deg, #fdf2f0, #fff5f3);
    border-radius: 15px;
    padding: 25px 30px;
    text-align: center;
}
.attire-intro-card p { color: #555; line-height: 1.8; font-size: 15px; max-width: 700px; margin: 0 auto; }

.attire-season-tabs { padding: 20px 0 10px; }
.attire-tabs { margin-bottom: 30px; }
.attire-content { padding: 20px 0 40px; }

.attire-role-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
    gap: 30px;
}
.attire-role-card {
    background: white;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08);
}
.attire-role-header {
    padding: 25px;
    display: flex;
    align-items: center;
    gap: 15px;
    color: white;
}
.attire-role-header.mother { background: linear-gradient(135deg, #e8897c, #d4776b); }
.attire-role-header.father { background: linear-gradient(135deg, #5b7fa5, #4a6d8c); }
.attire-role-icon { font-size: 2.5rem; }
.attire-role-header h3 { font-size: 1.3rem; }
.attire-body { padding: 25px; }
.attire-body h4 { color: #b64a2a; margin: 15px 0 10px; font-size: 1rem; }
.attire-body h4:first-child { margin-top: 0; }
.attire-body ul { list-style: none; padding: 0; }
.attire-body li {
    padding: 6px 0;
    color: #555;
    font-size: 14px;
    line-height: 1.6;
}
.attire-body li strong { color: #333; }

.color-palette {
    display: flex;
    gap: 10px;
    margin: 8px 0 15px;
}
.color-dot {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 2px solid #eee;
    cursor: default;
    transition: transform 0.2s;
}
.color-dot:hover { transform: scale(1.2); }

.attire-tips { padding: 40px 0 60px; background: #fafafa; }
.attire-tips h2 { text-align: center; color: #b64a2a; margin-bottom: 30px; }
.attire-tips-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 25px;
}
.attire-tip-card {
    background: white;
    border-radius: 15px;
    padding: 25px;
    text-align: center;
    box-shadow: 0 3px 15px rgba(0,0,0,0.05);
    transition: transform 0.3s;
}
.attire-tip-card:hover { transform: translateY(-3px); }
.tip-icon { font-size: 2.5rem; margin-bottom: 12px; }
.attire-tip-card h3 { color: #333; margin-bottom: 10px; }
.attire-tip-card p { color: #666; font-size: 14px; line-height: 1.6; }

/* ========== 老黄历 ========== */
.almanac-section { padding: 30px 0 60px; }
.almanac-date-picker { text-align: center; margin-bottom: 30px; }
.almanac-form { display: flex; align-items: center; justify-content: center; gap: 15px; flex-wrap: wrap; }
.almanac-input {
    padding: 12px 20px;
    border: 2px solid #ddd;
    border-radius: 30px;
    font-size: 16px;
    outline: none;
    cursor: pointer;
    transition: border-color 0.3s;
}
.almanac-input:focus { border-color: #b64a2a; }
.almanac-arrow {
    display: inline-block;
    width: 40px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    background: #f0f0f0;
    border-radius: 50%;
    text-decoration: none;
    color: #333;
    font-size: 14px;
    transition: all 0.3s;
}
.almanac-arrow:hover { background: #b64a2a; color: white; }
.btn-today {
    display: inline-block;
    padding: 8px 20px;
    background: #f8edeb;
    color: #b64a2a;
    border-radius: 20px;
    text-decoration: none;
    font-size: 14px;
    transition: all 0.3s;
}
.btn-today:hover { background: #b64a2a; color: white; }

.almanac-main-card {
    max-width: 700px;
    margin: 0 auto;
    background: white;
    border-radius: 20px;
    box-shadow: 0 5px 25px rgba(0,0,0,0.1);
    overflow: hidden;
}
.almanac-header {
    background: linear-gradient(135deg, #8B0000, #b64a2a);
    padding: 30px;
    color: white;
    text-align: center;
}
.gregorian-date { margin-bottom: 10px; }
.gregorian-date .year { font-size: 1rem; opacity: 0.8; margin-right: 10px; }
.gregorian-date .month-day { font-size: 2rem; font-weight: bold; }
.gregorian-date .weekday { font-size: 0.9rem; opacity: 0.8; margin-left: 10px; }
.lunar-date .lunar-text { font-size: 1.2rem; }
.jieqi-tag {
    display: inline-block;
    background: rgba(255,255,255,0.25);
    padding: 3px 12px;
    border-radius: 12px;
    margin-left: 10px;
    font-size: 13px;
}

.almanac-ganzhi {
    display: flex;
    justify-content: space-around;
    padding: 20px;
    background: #fdf8f5;
    border-bottom: 1px solid #f0e0d8;
}
.ganzhi-item { text-align: center; }
.ganzhi-label { display: block; font-size: 12px; color: #999; margin-bottom: 5px; }
.ganzhi-value { font-size: 1.3rem; font-weight: bold; color: #333; }
.ganzhi-shengxiao { display: block; font-size: 12px; color: #b64a2a; margin-top: 3px; }

.almanac-yi-ji { padding: 25px; }
.yi-section, .ji-section { margin-bottom: 20px; }
.yi-section h3 { color: #27ae60; margin-bottom: 12px; }
.ji-section h3 { color: #e74c3c; margin-bottom: 12px; }
.yi-ji-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.yi-tag, .ji-tag {
    padding: 6px 16px;
    border-radius: 20px;
    font-size: 14px;
}
.yi-tag { background: #e8f5e9; color: #2e7d32; }
.ji-tag { background: #fde8e8; color: #c62828; }

.almanac-extra {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    padding: 20px 25px;
    background: #fafafa;
    border-top: 1px solid #eee;
    gap: 15px;
}
.extra-item { text-align: center; }
.extra-label { display: block; font-size: 13px; color: #999; margin-bottom: 5px; }
.extra-value { font-size: 14px; color: #555; }

.almanac-tips-section { max-width: 700px; margin: 25px auto 0; }
.almanac-tip-card {
    background: #fdf8f5;
    border-radius: 15px;
    padding: 25px;
    border-left: 4px solid #b64a2a;
}
.almanac-tip-card h3 { color: #b64a2a; margin-bottom: 12px; }
.almanac-tip-card ul { padding-left: 20px; }
.almanac-tip-card li { color: #666; font-size: 14px; line-height: 2; }

/* ========== 天气查询 ========== */
.weather-section { padding: 30px 0 60px; }
.weather-search-area { margin-bottom: 30px; text-align: center; }
.weather-search-form { max-width: 500px; margin: 0 auto; }
.weather-input-group { display: flex; gap: 10px; margin-bottom: 15px; }
.weather-search-input {
    flex: 1;
    padding: 12px 20px;
    border: 2px solid #ddd;
    border-radius: 30px;
    font-size: 16px;
    outline: none;
    transition: border-color 0.3s;
}
.weather-search-input:focus { border-color: #b64a2a; }
.weather-search-btn { margin-top: 0 !important; border-radius: 30px !important; padding: 12px 25px !important; }
.weather-city-tags { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; }
.city-tag {
    padding: 6px 16px;
    border: 1px solid #ddd;
    border-radius: 20px;
    text-decoration: none;
    color: #555;
    font-size: 13px;
    transition: all 0.3s;
}
.city-tag:hover, .city-tag.active { background: #b64a2a; color: white; border-color: #b64a2a; }

.weather-display-area {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 25px;
    max-width: 900px;
    margin: 0 auto;
}
.weather-info-card {
    background: linear-gradient(135deg, #4a90d9, #357abd);
    border-radius: 20px;
    padding: 30px;
    color: white;
}
.weather-card-header { margin-bottom: 20px; }
.weather-card-header h2 { font-size: 1.2rem; margin-bottom: 5px; }
.weather-update-time { font-size: 12px; opacity: 0.7; }
.weather-main-display {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 25px;
}
.weather-icon-big { font-size: 4rem; }
.weather-temp-big { display: flex; align-items: flex-start; }
.temp-number { font-size: 3.5rem; font-weight: bold; line-height: 1; }
.temp-unit { font-size: 1.5rem; margin-top: 5px; }
.weather-desc { font-size: 1.1rem; margin-left: 15px; }

.weather-details {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
    padding-top: 20px;
    border-top: 1px solid rgba(255,255,255,0.2);
}
.weather-detail-item { text-align: center; }
.detail-icon { font-size: 1.5rem; display: block; margin-bottom: 3px; }
.detail-label { font-size: 12px; opacity: 0.7; display: block; }
.detail-value { font-size: 14px; font-weight: bold; }

.weather-forecast-card {
    background: white;
    border-radius: 20px;
    padding: 25px;
    box-shadow: 0 3px 15px rgba(0,0,0,0.08);
}
.weather-forecast-card h3 { color: #333; margin-bottom: 20px; text-align: center; }
.forecast-grid { display: flex; flex-direction: column; gap: 12px; }
.forecast-item {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 12px 15px;
    background: #f9f9f9;
    border-radius: 12px;
}
.forecast-date { font-size: 14px; font-weight: bold; color: #555; min-width: 45px; }
.forecast-icon { font-size: 1.5rem; }
.forecast-temp { margin-left: auto; display: flex; gap: 8px; font-size: 14px; }
.forecast-high { color: #e74c3c; font-weight: bold; }
.forecast-low { color: #4a90d9; }
.forecast-desc { font-size: 13px; color: #888; }

.weather-tips { margin-top: 40px; }
.weather-tips h3 { text-align: center; color: #b64a2a; margin-bottom: 25px; }
.weather-tips-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 20px;
}
.weather-tip-card {
    background: white;
    border-radius: 15px;
    padding: 25px;
    text-align: center;
    box-shadow: 0 3px 15px rgba(0,0,0,0.05);
    transition: transform 0.3s;
}
.weather-tip-card:hover { transform: translateY(-3px); }
.weather-tip-icon { font-size: 2.5rem; margin-bottom: 10px; }
.weather-tip-card h4 { color: #333; margin-bottom: 8px; }
.weather-tip-card p { color: #666; font-size: 13px; line-height: 1.6; }

/* ========== 八字测算 ========== */
.bazi-section { padding: 30px 0 60px; }
.bazi-layout {
    display: grid;
    grid-template-columns: 360px 1fr;
    gap: 30px;
    align-items: start;
}
.bazi-form-card {
    background: white;
    border-radius: 20px;
    padding: 30px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08);
    position: sticky;
    top: 80px;
}
.bazi-form-card h2 { color: #b64a2a; margin-bottom: 25px; text-align: center; }
.bazi-calc-form .form-group { margin-bottom: 18px; }
.bazi-calc-form .form-group label { display: block; margin-bottom: 6px; font-weight: bold; color: #333; font-size: 14px; }
.bazi-calc-form .form-group input,
.bazi-calc-form .form-group select {
    width: 100%;
    padding: 12px 15px;
    border: 1px solid #ddd;
    border-radius: 8px;
    font-size: 15px;
    outline: none;
    transition: border-color 0.3s;
}
.bazi-calc-form .form-group input:focus,
.bazi-calc-form .form-group select:focus { border-color: #b64a2a; }
.form-select { appearance: auto; }
.bazi-submit { width: 100%; margin-top: 10px !important; border-radius: 10px !important; padding: 14px !important; font-size: 16px !important; }
.form-error { background: #fde8e8; color: #e74c3c; padding: 12px; border-radius: 8px; margin-bottom: 15px; font-size: 14px; text-align: center; }

.bazi-result-area {
    background: white;
    border-radius: 20px;
    padding: 30px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08);
}
.bazi-result-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 25px;
    padding-bottom: 15px;
    border-bottom: 2px solid #f0f0f0;
    flex-wrap: wrap;
    gap: 10px;
}
.bazi-result-header h2 { color: #b64a2a; font-size: 1.3rem; }
.bazi-badge {
    background: #f8edeb;
    color: #b64a2a;
    padding: 5px 15px;
    border-radius: 15px;
    font-size: 14px;
}

.bazi-pillars {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
    margin-bottom: 25px;
}
.bazi-pillar {
    text-align: center;
    background: #f9f6f5;
    border-radius: 12px;
    padding: 18px 10px;
    border: 1px solid #eee;
}
.bazi-pillar-master {
    background: #f8edeb;
    border-color: #b64a2a;
    border-width: 2px;
}
.pillar-label { font-size: 12px; color: #999; margin-bottom: 8px; }
.pillar-tg, .pillar-dz {
    font-size: 1.5rem;
    font-weight: bold;
    display: inline-block;
    margin: 0 3px;
}
.pillar-tg { color: #b64a2a; }
.pillar-dz { color: #333; }
.pillar-shishen { font-size: 12px; color: #888; margin-top: 6px; }

.bazi-daymaster {
    text-align: center;
    padding: 15px;
    background: #fdf8f5;
    border-radius: 12px;
    margin-bottom: 25px;
}
.daymaster-label { font-size: 14px; color: #888; }
.daymaster-value { font-size: 1.3rem; font-weight: bold; color: #b64a2a; margin: 0 8px; }
.daymaster-wx { font-size: 14px; font-weight: bold; }

.bazi-wuxing-bar { margin-bottom: 25px; }
.bazi-wuxing-bar h3 { color: #333; margin-bottom: 15px; font-size: 1rem; }
.wuxing-bars { display: flex; flex-direction: column; gap: 10px; }
.wuxing-bar-item {
    display: flex;
    align-items: center;
    gap: 10px;
}
.wuxing-name { min-width: 25px; font-weight: bold; font-size: 14px; }
.wuxing-bar-track {
    flex: 1;
    height: 12px;
    background: #eee;
    border-radius: 6px;
    overflow: hidden;
}
.wuxing-bar-fill {
    height: 100%;
    border-radius: 6px;
    transition: width 0.5s ease;
}
.wuxing-pct { font-size: 13px; color: #888; min-width: 40px; }

.bazi-analysis { display: grid; gap: 15px; }
.analysis-card {
    background: #f9f8f6;
    border-radius: 12px;
    padding: 20px;
    border-left: 4px solid #b64a2a;
}
.analysis-card h3 { color: #b64a2a; margin-bottom: 8px; font-size: 1rem; }
.analysis-card p { color: #555; font-size: 14px; line-height: 1.8; }

/* ========== 父母致辞 ========== */
.speech-tips { padding: 20px 0; }
.speech-tips-card {
    background: linear-gradient(135deg, #fdf2f0, #faf0e6);
    border-radius: 15px;
    padding: 25px 30px;
    max-width: 700px;
    margin: 0 auto;
}
.speech-tips-card h3 { color: #b64a2a; margin-bottom: 12px; }
.speech-tips-card ul { padding-left: 20px; }
.speech-tips-card li { color: #555; font-size: 14px; line-height: 2; }

.speech-content { padding: 30px 0 50px; }
.speech-card {
    max-width: 750px;
    margin: 0 auto 30px;
    background: white;
    border-radius: 20px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08);
    overflow: hidden;
}
.speech-card-simple { border: 2px dashed #b64a2a; }
.speech-header {
    display: flex;
    align-items: center;
    gap: 15px;
    padding: 25px 30px;
    background: linear-gradient(135deg, #f8edeb, #fdf5f3);
    border-bottom: 1px solid #f0e0d8;
}
.speech-icon { font-size: 2.5rem; }
.speech-header h2 { color: #b64a2a; font-size: 1.3rem; margin-bottom: 3px; }
.speech-tag {
    display: inline-block;
    background: #b64a2a;
    color: white;
    padding: 2px 12px;
    border-radius: 12px;
    font-size: 12px;
}
.speech-body { padding: 30px; }
.speech-body p {
    color: #444;
    font-size: 1.05rem;
    line-height: 2.2;
    text-indent: 2em;
    margin-bottom: 4px;
}
.speech-blank {
    display: inline-block;
    min-width: 60px;
    border-bottom: 2px solid #b64a2a;
    color: #b64a2a;
    padding: 0 5px;
    font-weight: bold;
}

.speech-notice { padding: 30px 0 60px; }
.notice-card {
    max-width: 700px;
    margin: 0 auto;
    background: #fdf8f5;
    border-radius: 15px;
    padding: 30px;
    border-left: 4px solid #b64a2a;
}
.notice-card h3 { color: #b64a2a; margin-bottom: 20px; }
.notice-grid { display: grid; gap: 15px; }
.notice-item { display: flex; align-items: center; gap: 15px; }
.notice-num {
    width: 32px;
    height: 32px;
    line-height: 32px;
    text-align: center;
    background: #b64a2a;
    color: white;
    border-radius: 50%;
    font-weight: bold;
    font-size: 14px;
    flex-shrink: 0;
}
.notice-item p { color: #555; font-size: 14px; }

/* ========== 电子请柬 ========== */
.invitation-create { padding: 40px 0 60px; }
.invitation-create-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    align-items: start;
}
.invitation-form-panel,
.invitation-preview-panel {
    background: white;
    border-radius: 15px;
    padding: 30px;
    box-shadow: 0 5px 20px rgba(0,0,0,0.08);
}
.invitation-form-panel h2,
.invitation-preview-panel h2 {
    color: #b64a2a;
    margin-bottom: 25px;
    padding-bottom: 10px;
    border-bottom: 2px solid #f8edeb;
}
.invitation-form .form-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px;
}
.invitation-form .form-group {
    margin-bottom: 18px;
}
.invitation-form .form-group label {
    display: block;
    margin-bottom: 5px;
    font-weight: 500;
    color: #555;
}
.invitation-form .form-group label .required {
    color: #e74c3c;
}
.invitation-form input[type="text"],
.invitation-form input[type="date"],
.invitation-form textarea {
    width: 100%;
    padding: 10px 15px;
    border: 1px solid #ddd;
    border-radius: 8px;
    font-size: 14px;
    font-family: inherit;
    transition: border-color 0.3s;
}
.invitation-form input:focus,
.invitation-form textarea:focus {
    border-color: #b64a2a;
    outline: none;
}
.invitation-form .btn-block {
    width: 100%;
    padding: 14px;
    font-size: 16px;
    border: none;
    cursor: pointer;
}

/* 主题选择器 */
.theme-selector {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
.theme-option {
    cursor: pointer;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    padding: 10px 12px;
    border: 2px solid #eee;
    border-radius: 10px;
    transition: all 0.3s;
    min-width: 70px;
}
.theme-option:hover,
.theme-option.active {
    border-color: #b64a2a;
    background: #fdf5f5;
}
.theme-option input[type="radio"] { display: none; }
.theme-swatch {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: block;
}
.theme-name {
    font-size: 12px;
    color: #666;
}

/* 预览卡片 */
.preview-wrapper {
    display: flex;
    justify-content: center;
}
.preview-card {
    width: 100%;
    max-width: 340px;
    border-radius: 15px;
    overflow: hidden;
    border: 2px solid #eee;
    box-shadow: 0 10px 30px rgba(0,0,0,0.1);
}
.preview-cover {
    width: 100%;
    height: 180px;
    overflow: hidden;
}
.preview-cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.preview-card-top {
    padding: 30px 20px;
    text-align: center;
    color: white;
}
.preview-icon {
    font-size: 2.5rem;
}
.preview-subtitle {
    font-size: 14px;
    margin-top: 5px;
    opacity: 0.9;
}
.preview-card-body {
    padding: 25px 20px;
    text-align: center;
    background: white;
}
.preview-couple {
    font-size: 1.5rem;
    margin-bottom: 5px;
}
.preview-and {
    display: inline-block;
    margin: 0 8px;
    font-size: 1rem;
    color: #999;
}
.preview-title {
    color: #888;
    font-size: 1rem;
    margin-bottom: 15px;
}
.preview-info {
    display: flex;
    gap: 15px;
    justify-content: center;
    flex-wrap: wrap;
    font-size: 14px;
    color: #555;
    margin-bottom: 10px;
}
.preview-venue {
    font-size: 14px;
    color: #555;
}
.preview-address {
    font-size: 12px;
    color: #999;
    margin-top: 3px;
}
.preview-message {
    font-style: italic;
    color: #888;
    margin-top: 12px;
    font-size: 14px;
    border-top: 1px solid #eee;
    padding-top: 12px;
}

/* 分享区域 */
.share-section {
    margin-top: 25px;
    padding-top: 20px;
    border-top: 1px solid #eee;
}
.share-section h3 {
    color: #b64a2a;
    margin-bottom: 10px;
}
.share-link-box {
    display: flex;
    gap: 10px;
    margin-top: 10px;
}
.share-link-box input {
    flex: 1;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 8px;
    font-size: 13px;
    background: #f9f9f9;
}

/* 我的请柬列表 */
.my-invitations {
    margin-top: 50px;
    padding-top: 40px;
    border-top: 2px solid #f0f0f0;
}
.my-invitations h2 {
    color: #b64a2a;
    margin-bottom: 25px;
}
.my-invitation-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
    gap: 20px;
}
.my-invitation-card {
    background: white;
    border-radius: 12px;
    box-shadow: 0 3px 12px rgba(0,0,0,0.06);
    overflow: hidden;
}
.my-invitation-preview {
    padding: 20px;
    background: linear-gradient(135deg, #fdf5f5, #faf0f3);
    text-align: center;
}
.mini-invite {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    color: #555;
    font-size: 14px;
}
.mini-icon { font-size: 2rem; }
.my-invitation-actions {
    display: flex;
    gap: 10px;
    padding: 12px 20px;
    justify-content: center;
}
.btn-sm {
    padding: 6px 16px;
    font-size: 13px;
    border-radius: 6px;
}

/* 提示信息 */
.alert {
    padding: 15px 20px;
    border-radius: 10px;
    margin-bottom: 25px;
    display: flex;
    align-items: center;
}
.alert-success {
    background: #eafaf1;
    color: #1e8449;
    border: 1px solid #a9dfbf;
}
.alert-error {
    background: #fdecea;
    color: #c0392b;
    border: 1px solid #f5b7b1;
}
.current-image {
    font-size: 12px;
    color: #888;
    margin-top: 5px;
}

/* ========== 票务查询模块样式 ========== */
.ticket-search-section {
    background: linear-gradient(135deg, #f8edeb, #faf0f3);
    padding: 40px 0;
}
.search-card {
    background: white;
    border-radius: 20px;
    padding: 30px;
    box-shadow: 0 10px 40px rgba(0,0,0,0.08);
    max-width: 1200px;
    margin: 0 auto;
}
.trip-type-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 25px;
}
.tab-btn {
    padding: 10px 30px;
    border: 2px solid #eee;
    background: white;
    border-radius: 25px;
    cursor: pointer;
    font-size: 15px;
    transition: all 0.3s;
}
.tab-btn.active {
    background: #b64a2a;
    color: white;
    border-color: #b64a2a;
}
.search-form .form-row {
    display: flex;
    gap: 15px;
    align-items: flex-end;
    flex-wrap: wrap;
}
.form-group {
    flex: 1;
    min-width: 150px;
}
.label-icon {
    font-size: 1.2rem;
    margin-right: 8px;
}
.location-input-wrapper {
    display: flex;
    align-items: center;
}
.location-input {
    width: 100%;
    padding: 12px 15px;
    border: 2px solid #eee;
    border-radius: 10px;
    font-size: 15px;
    transition: border-color 0.3s;
    outline: none;
}
.location-input:focus {
    border-color: #b64a2a;
}
.swap-btn {
    background: #f8edeb;
    border: none;
    padding: 12px;
    border-radius: 0 10px 10px 0;
    cursor: pointer;
    margin-left: -5px;
    font-size: 1rem;
}
.location-dropdown {
    position: absolute;
    background: white;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.15);
    z-index: 100;
    width: 100%;
    max-height: 400px;
    overflow-y: auto;
}
.dropdown-header {
    padding: 12px 15px;
    background: #f8f9fa;
    font-weight: bold;
    color: #666;
    font-size: 13px;
}
.dropdown-cities {
    padding: 10px;
}
.dropdown-city {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    cursor: pointer;
    border-radius: 8px;
    transition: background 0.2s;
}
.dropdown-city:hover {
    background: #f8edeb;
}
.city-icon {
    font-size: 1.3rem;
}
.city-name {
    flex: 1;
    font-size: 14px;
}
.city-code {
    color: #999;
    font-size: 12px;
}
.dropdown-divider {
    height: 1px;
    background: #eee;
    margin: 5px 0;
}
.region-group {
    padding: 8px 15px;
}
.region-name {
    font-size: 13px;
    font-weight: bold;
    color: #b64a2a;
    margin-bottom: 8px;
}
.region-cities {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}
.region-city {
    padding: 4px 12px;
    background: #f8f9fa;
    border-radius: 15px;
    font-size: 13px;
    cursor: pointer;
    transition: all 0.2s;
}
.region-city:hover {
    background: #f8edeb;
    color: #b64a2a;
}
.preset-dates {
    display: flex;
    gap: 8px;
    margin-top: 8px;
}
.preset-btn {
    padding: 5px 12px;
    background: #f8edeb;
    border: none;
    border-radius: 15px;
    font-size: 13px;
    cursor: pointer;
    transition: all 0.2s;
}
.preset-btn:hover {
    background: #b64a2a;
    color: white;
}
.type-tabs {
    display: flex;
    gap: 8px;
}
.type-tab {
    padding: 10px 20px;
    border: 2px solid #eee;
    background: white;
    border-radius: 8px;
    cursor: pointer;
    font-size: 14px;
    transition: all 0.3s;
}
.type-tab.active {
    background: #b64a2a;
    color: white;
    border-color: #b64a2a;
}
.search-btn {
    background: linear-gradient(135deg, #b64a2a, #e74c3c);
    color: white;
    border: none;
    padding: 12px 30px;
    border-radius: 10px;
    font-size: 15px;
    font-weight: bold;
    cursor: pointer;
    transition: transform 0.3s;
}
.search-btn:hover {
    transform: scale(1.02);
}
.search-history {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #eee;
}
.history-label {
    color: #999;
    font-size: 13px;
    margin-right: 10px;
}
.history-list {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}
.history-item {
    padding: 6px 12px;
    background: #f8f9fa;
    border-radius: 15px;
    font-size: 13px;
    cursor: pointer;
    transition: all 0.2s;
}
.history-item:hover {
    background: #f8edeb;
    color: #b64a2a;
}

/* 筛选栏 */
.filter-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    padding: 15px 20px;
    background: white;
    border-radius: 10px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.05);
    flex-wrap: wrap;
    gap: 10px;
}
.result-count {
    font-size: 14px;
    color: #666;
}
.sort-select {
    padding: 8px 12px;
    border: 1px solid #eee;
    border-radius: 8px;
    font-size: 14px;
}
.checkbox-label {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 14px;
    color: #666;
}

/* 班次列表 */
.results-list {
    display: grid;
    gap: 20px;
}
.ticket-card {
    background: white;
    border-radius: 15px;
    box-shadow: 0 3px 15px rgba(0,0,0,0.06);
    overflow: hidden;
    transition: transform 0.3s;
}
.ticket-card:hover {
    transform: translateY(-2px);
}
.ticket-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px 20px;
    background: #f8edeb;
    border-bottom: 1px solid #eee;
}
.ticket-operator {
    font-size: 14px;
    color: #666;
}
.ticket-number {
    font-weight: bold;
    color: #b64a2a;
    font-size: 16px;
}
.ticket-type {
    font-size: 13px;
    color: #999;
}
.ticket-body {
    padding: 20px;
}
.route-info {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 15px;
}
.city-block {
    text-align: center;
}
.city-block .city-name {
    font-size: 1.5rem;
    font-weight: bold;
    color: #333;
    margin-bottom: 5px;
}
.city-block .city-time {
    font-size: 1.2rem;
    color: #b64a2a;
    font-weight: bold;
}
.route-arrow {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    color: #b64a2a;
    font-size: 1.5rem;
}
.transit-tag {
    font-size: 11px;
    background: #e74c3c;
    color: white;
    padding: 2px 8px;
    border-radius: 10px;
}
.ticket-info {
    display: flex;
    gap: 20px;
    font-size: 14px;
    color: #666;
}
.ticket-footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 20px;
    background: #fafafa;
    border-top: 1px solid #eee;
    flex-wrap: wrap;
    gap: 15px;
}
.price-section {
    display: flex;
    align-items: baseline;
    gap: 10px;
}
.original-price {
    text-decoration: line-through;
    color: #999;
    font-size: 14px;
}
.current-price {
    font-size: 1.8rem;
    font-weight: bold;
    color: #e74c3c;
}
.discount-tag {
    background: #e74c3c;
    color: white;
    padding: 3px 10px;
    border-radius: 10px;
    font-size: 12px;
    font-weight: bold;
}
.seat-section {
    display: flex;
    gap: 15px;
}
.seat-type {
    font-size: 13px;
    color: #666;
}
.seat-type .available {
    color: #27ae60;
    font-weight: bold;
}
.seat-type .soldout {
    color: #999;
}
.book-btn {
    background: linear-gradient(135deg, #b64a2a, #e74c3c);
    color: white;
    border: none;
    padding: 10px 25px;
    border-radius: 25px;
    font-size: 14px;
    font-weight: bold;
    cursor: pointer;
    transition: transform 0.3s;
}
.book-btn:hover {
    transform: scale(1.05);
}

/* 空状态 */
.empty-results {
    padding: 80px 0;
}
.empty-state {
    text-align: center;
}
.empty-icon {
    font-size: 4rem;
    margin-bottom: 20px;
}
.empty-state h3 {
    color: #333;
    margin-bottom: 10px;
}
.empty-state p {
    color: #666;
    margin-bottom: 20px;
}

/* 功能介绍 */
.ticket-features {
    padding: 50px 0;
}
.features-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 20px;
}
.feature-card {
    background: white;
    border-radius: 12px;
    padding: 25px;
    text-align: center;
    box-shadow: 0 3px 10px rgba(0,0,0,0.05);
    transition: transform 0.3s;
}
.feature-card:hover {
    transform: translateY(-3px);
}
.feature-icon {
    font-size: 2.5rem;
    margin-bottom: 10px;
}
.feature-card h3 {
    color: #333;
    margin-bottom: 10px;
}
.feature-card p {
    color: #666;
    font-size: 14px;
    line-height: 1.6;
}

/* 友情链接 */
.footer-links-section {
    background: #f8f9fa;
    padding: 30px 0;
}
.footer-links-section .container {
    max-width: 1200px;
    margin: 0 auto;
}
.links-title {
    text-align: center;
    margin-bottom: 25px;
    color: #b64a2a;
    font-size: 1.2rem;
}
.links-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 15px;
}
.link-item {
    padding: 8px 20px;
    background: white;
    border: 1px solid #eee;
    border-radius: 20px;
    text-decoration: none;
    color: #666;
    font-size: 14px;
    transition: all 0.3s;
}
.link-item:hover {
    background: #f8edeb;
    border-color: #b64a2a;
    color: #b64a2a;
}

/* 已合并到下面 768px 综合适配块中 */

.pwa-install-banner {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: #fff;
    box-shadow: 0 -4px 20px rgba(0,0,0,0.15);
    z-index: 9999;
    padding: 12px 15px;
    animation: slideUp 0.3s ease;
}
@keyframes slideUp {
    from { transform: translateY(100%); }
    to { transform: translateY(0); }
}
.pwa-banner-content {
    display: flex;
    align-items: center;
    gap: 12px;
    max-width: 1200px;
    margin: 0 auto;
}
.pwa-banner-icon { font-size: 32px; }
.pwa-banner-text { flex: 1; }
.pwa-banner-text strong { display: block; color: #b64a2a; font-size: 14px; }
.pwa-banner-text span { font-size: 12px; color: #666; }
.pwa-install-btn {
    background: #b64a2a;
    color: #fff;
    border: none;
    padding: 8px 20px;
    border-radius: 20px;
    font-size: 14px;
    font-weight: bold;
    cursor: pointer;
    white-space: nowrap;
}
.pwa-dismiss-btn {
    background: none;
    border: none;
    font-size: 18px;
    color: #999;
    cursor: pointer;
    padding: 5px;
}

/* ========== 下载模块样式 ========== */
.section-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
    margin-bottom: 20px;
}
.section-header h2 {
    margin: 0;
}
.section-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
.btn-download-inline {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: linear-gradient(135deg, #b64a2a, #d4756b);
    color: #fff;
    padding: 8px 16px;
    border-radius: 20px;
    text-decoration: none;
    font-size: 13px;
    font-weight: 500;
    transition: all 0.3s;
    white-space: nowrap;
}
.btn-download-inline:hover {
    transform: translateY(-2px);
    box-shadow: 0 4px 15px rgba(182, 74, 42, 0.3);
}
.btn-download-inline.btn-pdf {
    background: linear-gradient(135deg, #e74c3c, #c0392b);
}
.btn-download-inline.btn-roles {
    background: linear-gradient(135deg, #667eea, #764ba2);
}
.download-actions {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    margin-top: 15px;
}
@media (max-width: 768px) {
    .section-header {
        flex-direction: column;
        align-items: flex-start;
    }
    .btn-download-inline {
        padding: 6px 12px;
        font-size: 12px;
    }
}

/* ========== 数字人通用样式 ========== */
.dh-banner {
    background: linear-gradient(135deg, #b64a2a, #d4756b) !important;
}
.dh-banner h1 {
    color: white !important;
}
.dh-banner p {
    color: rgba(255,255,255,0.9) !important;
}

/* ========== 总管数字人模块样式 ========== */
.dh-manager-section {
    padding: 30px 0 50px;
    background: #fafafa;
    overflow: hidden;
}
.dh-manager-section > .container {
    display: grid !important;
    grid-template-columns: 320px 1fr !important;
    gap: 30px !important;
    grid-template-areas: "left right";
}

/* 左侧面板 */
.manager-left-panel {
    display: flex;
    flex-direction: column;
    gap: 20px;
    grid-area: left;
    position: sticky;
    top: 20px;
    align-self: flex-start;
}

/* 数字人卡片 */
.agent-card {
    background: linear-gradient(135deg, #b64a2a, #d4756b);
    border-radius: 20px;
    padding: 30px;
    text-align: center;
    color: white;
    box-shadow: 0 10px 30px rgba(182, 74, 42, 0.3);
}
.agent-avatar {
    width: 100px;
    height: 100px;
    margin: 0 auto 20px;
    background: rgba(255,255,255,0.2);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.avatar-face {
    width: 60px;
    height: 60px;
    background: white;
    border-radius: 50%;
    position: relative;
}
.avatar-eyes {
    position: absolute;
    top: 20px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 12px;
}
.avatar-eyes .eye {
    width: 8px;
    height: 8px;
    background: #333;
    border-radius: 50%;
}
.avatar-mouth {
    position: absolute;
    bottom: 18px;
    left: 50%;
    transform: translateX(-50%);
    width: 20px;
    height: 8px;
    background: #e74c3c;
    border-radius: 0 0 10px 10px;
}
.agent-card h3 {
    font-size: 1.5rem;
    margin-bottom: 5px;
}
.agent-card p {
    opacity: 0.9;
    font-size: 14px;
}

/* 进度卡片 */
.progress-card {
    background: white;
    border-radius: 15px;
    padding: 25px;
    box-shadow: 0 3px 15px rgba(0,0,0,0.06);
}
.progress-card h3 {
    color: #b64a2a;
    margin-bottom: 20px;
    font-size: 1.1rem;
}
.progress-ring {
    position: relative;
    width: 120px;
    height: 120px;
    margin: 0 auto 20px;
}
.progress-ring svg {
    transform: rotate(-90deg);
}
.progress-bg {
    fill: none;
    stroke: #f0f0f0;
    stroke-width: 8;
}
.progress-fill {
    fill: none;
    stroke: url(#progressGradient);
    stroke-width: 8;
    stroke-linecap: round;
    stroke-dasharray: 264;
    stroke-dashoffset: 264;
    transition: stroke-dashoffset 0.5s;
}
.progress-center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-align: center;
}
#progressText {
    font-size: 1.5rem;
    font-weight: bold;
    color: #b64a2a;
}
.progress-stats {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 15px;
}
/* 使用上方 L432 的 .stat-item 基础样式 */
.stat-value {
    display: block;
    font-size: 1.5rem;
    font-weight: bold;
    color: #b64a2a;
}
.stat-label {
    font-size: 12px;
    color: #888;
}

/* 预警卡片 */
.alerts-card {
    background: white;
    border-radius: 15px;
    padding: 20px;
    box-shadow: 0 3px 15px rgba(0,0,0,0.06);
}
.alerts-card .card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}
.alerts-card h3 {
    color: #b64a2a;
    font-size: 1.1rem;
}
.alert-badge {
    background: #e74c3c;
    color: white;
    padding: 3px 10px;
    border-radius: 15px;
    font-size: 12px;
    font-weight: bold;
}
.alerts-list {
    max-height: 200px;
    overflow-y: auto;
}
.no-alerts {
    text-align: center;
    color: #27ae60;
    font-size: 14px;
    padding: 20px;
}
.alert-item {
    padding: 12px;
    border-radius: 10px;
    margin-bottom: 10px;
    font-size: 14px;
}
.alert-item.warning {
    background: #fff8e1;
    border-left: 4px solid #f39c12;
}
.alert-item.error {
    background: #fde8e8;
    border-left: 4px solid #e74c3c;
}
.alert-msg {
    font-weight: 500;
    margin-bottom: 5px;
}
.alert-suggestion {
    font-size: 12px;
    opacity: 0.8;
}

/* 右侧面板 */
.manager-right-panel {
    display: flex;
    flex-direction: column;
    gap: 20px;
    grid-area: right;
}

/* 时间线卡片 */
.timeline-card, .tasks-card, .chat-card {
    background: white;
    border-radius: 15px;
    padding: 25px;
    box-shadow: 0 3px 15px rgba(0,0,0,0.06);
}
.card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
}
.card-header h3 {
    color: #b64a2a;
    font-size: 1.1rem;
}
.btn-refresh, .btn-add {
    padding: 8px 16px;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    font-size: 14px;
    transition: all 0.3s;
}
.btn-refresh {
    background: #f0f0f0;
    color: #666;
}
.btn-refresh:hover {
    background: #e0e0e0;
}
.btn-add {
    background: #b64a2a;
    color: white;
}
.btn-add:hover {
    background: #a54025;
}

/* 时间线容器 */
.timeline-container {
    max-height: 400px;
    overflow-y: auto;
}
.timeline-container .loading {
    text-align: center;
    color: #999;
    padding: 40px;
}
.timeline-item {
    display: flex;
    gap: 15px;
    padding: 15px 0;
    border-bottom: 1px solid #f0f0f0;
    position: relative;
}
.timeline-item:last-child {
    border-bottom: none;
}
.timeline-time {
    min-width: 80px;
    background: #f8edeb;
    color: #b64a2a;
    padding: 6px 12px;
    border-radius: 15px;
    font-size: 12px;
    font-weight: bold;
    text-align: center;
    height: fit-content;
}
.timeline-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #ddd;
    margin-top: 8px;
    flex-shrink: 0;
}
.timeline-dot.completed {
    background: #27ae60;
}
.timeline-dot.in_progress {
    background: #3498db;
}
.timeline-dot.delayed {
    background: #e74c3c;
}
.timeline-info {
    flex: 1;
}
.timeline-name {
    font-weight: 600;
    color: #333;
    margin-bottom: 4px;
}
.timeline-team {
    font-size: 13px;
    color: #888;
    margin-bottom: 10px;
}
.timeline-actions {
    display: flex;
    gap: 8px;
}
.btn-complete, .btn-delay {
    padding: 5px 12px;
    border: none;
    border-radius: 6px;
    cursor: pointer;
    font-size: 12px;
    transition: all 0.3s;
}
.btn-complete {
    background: #e8f5e9;
    color: #27ae60;
}
.btn-complete:hover {
    background: #c8e6c9;
}
.btn-delay {
    background: #fff3e0;
    color: #e67e22;
}
.btn-delay:hover {
    background: #ffe0b2;
}

/* 任务列表 */
.tasks-list {
    max-height: 200px;
    overflow-y: auto;
}
.no-tasks {
    text-align: center;
    color: #999;
    padding: 30px;
}

/* 聊天区域 */
.chat-messages {
    max-height: 200px;
    overflow-y: auto;
    margin-bottom: 15px;
    padding: 10px;
    background: #fafafa;
    border-radius: 10px;
}
.msg {
    padding: 10px 15px;
    border-radius: 15px;
    margin-bottom: 10px;
    max-width: 80%;
}
.msg.user {
    background: #b64a2a;
    color: white;
    margin-left: auto;
}
.msg.agent {
    background: #f0f0f0;
    color: #333;
}
.chat-input-area {
    display: flex;
    gap: 10px;
}
.chat-input-area input {
    flex: 1;
    padding: 12px 15px;
    border: 2px solid #ddd;
    border-radius: 25px;
    font-size: 14px;
    outline: none;
    transition: border-color 0.3s;
}
.chat-input-area input:focus {
    border-color: #b64a2a;
}
.chat-input-area button {
    background: #b64a2a;
    color: white;
    border: none;
    width: 45px;
    height: 45px;
    border-radius: 50%;
    cursor: pointer;
    font-size: 16px;
    transition: all 0.3s;
}
.chat-input-area button:hover {
    background: #a54025;
}

/* 任务表单弹窗 */
/* 使用上方 L738 的 .modal-overlay 基础样式 */
.modal-overlay .modal-content {
    background: white;
    border-radius: 15px;
    padding: 30px;
    width: 90%;
    max-width: 400px;
}
.modal-overlay .modal-content h3 {
    color: #b64a2a;
    margin-bottom: 20px;
}
.modal-overlay .form-group {
    margin-bottom: 15px;
}
.modal-overlay .form-group label {
    display: block;
    margin-bottom: 5px;
    font-weight: 500;
    font-size: 14px;
}
.modal-overlay .form-group input,
.modal-overlay .form-group select {
    width: 100%;
    padding: 10px 12px;
    border: 1px solid #ddd;
    border-radius: 8px;
    font-size: 14px;
    outline: none;
}
.modal-overlay .form-actions {
    display: flex;
    gap: 10px;
    margin-top: 20px;
}
.modal-overlay .form-actions button {
    flex: 1;
    padding: 12px;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    font-size: 14px;
}
#btnCancelTask {
    background: #f0f0f0;
    color: #666;
}
#btnSubmitTask {
    background: #b64a2a;
    color: white;
}

/* 响应式适配 */
@media (max-width: 992px) {
    .dh-manager-section > .container {
        grid-template-columns: 1fr !important;
        grid-template-areas: "right" "left" !important;
    }
    .manager-left-panel {
        position: static;
        align-self: auto;
    }
}

@media (max-width: 768px) {
    .progress-stats {
        grid-template-columns: repeat(2, 1fr);
    }
    .timeline-item {
        flex-wrap: wrap;
    }
    .timeline-actions {
        margin-top: 10px;
    }
}

/* ========== 请柬模板选择弹窗样式 ========== */
.modal {
    display: none;
    position: fixed;
    z-index: 1000;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgba(0,0,0,0.5);
}

/* 使用上方 L755 的 .modal-content 基础样式 */
.modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 25px;
    background: linear-gradient(135deg, #b64a2a, #d4756b);
    color: white;
}

.modal-header h3 {
    margin: 0;
    font-size: 1.25rem;
}

.close-btn {
    background: none;
    border: none;
    color: white;
    font-size: 24px;
    cursor: pointer;
    opacity: 0.8;
    transition: opacity 0.3s;
}

.close-btn:hover {
    opacity: 1;
}

.modal-body {
    padding: 20px 25px;
    max-height: calc(80vh - 100px);
    overflow-y: auto;
}

/* 使用上方 L560 的 .category-tabs 基础样式 */
.category-tab {
    padding: 8px 18px;
    border: 1px solid #ddd;
    border-radius: 20px;
    background: white;
    cursor: pointer;
    font-size: 14px;
    transition: all 0.3s;
}

.category-tab:hover {
    border-color: #b64a2a;
    color: #b64a2a;
}

.category-tab.active {
    background: #b64a2a;
    border-color: #b64a2a;
    color: white;
}

.template-list {
    display: grid;
    gap: 15px;
}

.template-item {
    background: #fafafa;
    border-radius: 10px;
    padding: 18px;
    border: 1px solid #eee;
    transition: all 0.3s;
}

.template-item:hover {
    border-color: #b64a2a;
    box-shadow: 0 2px 10px rgba(182, 74, 42, 0.1);
}

.template-title {
    font-weight: 600;
    color: #333;
    margin-bottom: 8px;
    font-size: 14px;
}

.template-content {
    color: #666;
    font-size: 14px;
    line-height: 1.6;
    margin-bottom: 12px;
    min-height: 48px;
}

.template-item .btn {
    float: right;
}

/* 弹窗响应式 */
@media (max-width: 768px) {
    .modal-content {
        width: 95%;
        margin: 10% auto;
    }
    .modal-header {
        padding: 15px 20px;
    }
    .modal-body {
        padding: 15px 20px;
    }
}

/* ==========================================================================
   移动端适配综合修复
   覆盖所有页面的响应式问题，确保在手机和平板上正确显示
   ========================================================================== */

/* --- iOS Safari 滚动修复 --- */
html {
    -webkit-overflow-scrolling: touch;
    overflow-y: auto;
}
body {
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}

/* --- 通用触摸优化与基础修复 --- */
@media (hover: none) and (pointer: coarse) {
    /* 触摸设备上禁用悬停位移效果，改用轻触反馈 */
    .service-card:hover, .vendor-card:hover, .gallery-card:hover,
    .profile-card:hover, .custom-card:hover, .team-card:hover,
    .service-detail-card:hover, .additional-card:hover, .attire-tip-card:hover,
    .feature-card:hover, .weather-tip-card:hover {
        transform: none !important;
    }
    .service-card:active, .vendor-card:active, .gallery-card:active,
    .profile-card:active, .custom-card:active, .team-card:active,
    .service-detail-card:active {
        transform: translateY(-2px);
    }
    /* 触摸设备上 scrollbar 样式优化 */
    ::-webkit-scrollbar {
        width: 4px;
        height: 4px;
    }
}

/* 防止媒体内容溢出 */
img, video, iframe, embed, object, svg {
    max-width: 100%;
    height: auto;
}

/* 所有溢出滚动容器启用平滑触摸滚动 */
.table-wrapper, [class*="-table-wrapper"], [class*="-scroll"], [class*="overflow"] {
    -webkit-overflow-scrolling: touch;
}

/* 通用文本断词防止溢出 */
p, h1, h2, h3, h4, h5, h6, li, td, th, a, span, div {
    overflow-wrap: break-word;
    word-wrap: break-word;
}

/* --- 992px 中屏断点适配（平板、小屏笔记本） --- */
@media (max-width: 992px) {
    .about-content {
        grid-template-columns: 1fr !important;
        gap: 30px;
    }
    .about-stats {
        grid-template-columns: repeat(3, 1fr);
        gap: 15px;
    }
    .weather-display-area {
        grid-template-columns: 1fr;
    }
    .bazi-layout {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .bazi-form-card {
        position: static;
        top: auto;
    }
    .invitation-create-grid {
        grid-template-columns: 1fr;
        gap: 25px;
    }
    .attire-role-grid {
        grid-template-columns: 1fr;
    }
    .nav-menu {
        gap: 5px;
    }
    .nav-menu li a {
        padding: 10px 8px;
        font-size: 13px;
    }
    .hero-banner {
        height: 300px;
    }
    .slide-content h1 {
        font-size: 2rem;
    }
    .service-grid {
        grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    }
    .modules-grid {
        grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    }
    .top-bar .container {
        flex-direction: column;
        gap: 8px;
        text-align: center;
    }
    .top-bar-left, .top-bar-right {
        justify-content: center;
        flex-wrap: wrap;
    }
}

/* --- 768px 移动端综合适配 --- */
@media (max-width: 768px) {
    /* 容器与基础 */
    .container {
        padding: 0 12px;
    }
    .site-main {
        padding: 15px 0;
    }

    /* 顶部栏响应式 */
    .top-bar { padding: 8px 5px; }
    .top-bar .container { flex-direction: column; gap: 8px; text-align: center; }
    .top-bar-left, .top-bar-right { display: flex; justify-content: center; flex-wrap: wrap; gap: 10px; }
    .top-bar-left .separator { display: none; }
    .top-bar a { margin-left: 10px; }

    /* 主导航栏 Logo 响应式 */
    .main-nav .container { flex-wrap: wrap; align-items: center; position: relative; }
    .logo { flex: 1; }
    .logo-text { font-size: 18px; }
    .logo-sub { display: none; }

    /* 导航改进 */
    .nav-menu {
        flex-direction: column;
        display: none;
        background: white;
        position: absolute;
        top: 100%;
        left: 0;
        width: 100%;
        box-shadow: 0 5px 15px rgba(0,0,0,0.1);
        padding: 10px;
        z-index: 1000;
        max-height: 80vh;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }
    .nav-menu li { margin: 5px 0; }
    .nav-menu li a {
        padding: 14px 20px;
        font-size: 15px;
        min-height: 44px;
        display: flex;
        align-items: center;
        border-radius: 6px;
    }
    .nav-menu li a:hover { background: #f8edeb; }
    .nav-menu.active { display: flex; }
    .mobile-menu-btn { display: block; }
    .search-box input {
        flex: 1;
        min-height: 42px;
        font-size: 14px;
    }
    .search-box button {
        min-height: 42px;
        padding: 8px 18px;
    }
    .search-box {
        order: 3;
        width: 100%;
        margin-top: 10px;
        display: flex;
    }

    /* 页面横幅 */
    .page-banner {
        padding: 25px 15px;
    }
    .page-banner h1 {
        font-size: 1.4rem;
    }
    .page-banner p {
        font-size: 14px;
    }

    /* Hero 横幅 */
    .hero-banner { height: 220px; }
    .slide-content h1 { font-size: 1.5rem; }
    .slide-content p { font-size: 14px; }
    .btn-primary, .btn-secondary { padding: 10px 20px; font-size: 14px; }

    /* 轮播触摸优化 */
    .slider-prev, .slider-next {
        width: 40px;
        height: 40px;
        font-size: 18px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .dot {
        width: 14px;
        height: 14px;
    }

    /* 服务卡片增强 */
    .service-grid { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 12px; }
    .service-card {
        padding: 18px 12px;
    }
    .service-icon {
        font-size: 2rem;
    }
    .service-card h3 { font-size: 14px; }
    .service-card p {
        font-size: 12px;
    }

    /* 特色模块 */
    .modules-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    .module-card {
        padding: 18px;
    }

    /* 工具区 */
    .tools-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    .tool-card {
        padding: 18px;
    }
    .countdown-number {
        font-size: 1.6rem;
    }
    .countdown-display { gap: 10px; }
    .countdown-label { font-size: 12px; }

    /* 评测区 */
    .testimonial-slider { flex-direction: column; align-items: center; }
    .testimonial-card {
        width: 100%;
        max-width: 100%;
    }

    /* 浮动按钮 - 调整位置和大小 */
    .float-buttons {
        right: 12px;
        bottom: 20px;
        gap: 8px;
    }
    .float-btn {
        width: 48px;
        height: 48px;
        font-size: 18px;
        box-shadow: 0 3px 12px rgba(0,0,0,0.25);
    }

    /* 通用按钮触摸尺寸 */
    .btn-primary, .btn-secondary, .btn,
    button, input[type="submit"], input[type="button"] {
        min-height: 44px;
    }
    .btn-small, .filter-btn, .tab-btn, .schedule-tab,
    .category-btn, .preset-date, .city-tag, .preset-btn,
    .page-link, .almanac-arrow, .btn-today {
        min-height: 40px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }

    /* 表单触摸优化 - 防止 iOS 自动缩放 */
    input, select, textarea, button {
        font-size: 16px !important;
    }
    .form-group input,
    .form-group select,
    .form-group textarea {
        min-height: 44px;
        padding: 12px;
        font-size: 16px !important;
    }
    .form-container {
        margin: 15px 12px;
        padding: 20px;
    }
    .form-row {
        flex-direction: column;
        gap: 10px;
    }
    .form-row .form-group {
        flex: none;
        width: 100%;
    }

    /* 弹窗触摸优化 */
    .modal-content {
        padding: 20px;
        margin: 10px auto;
        width: 94%;
        max-height: 85vh;
    }
    .modal-close {
        font-size: 28px;
        min-width: 44px;
        min-height: 44px;
        display: flex;
        align-items: center;
        justify-content: center;
        right: 10px;
        top: 10px;
    }

    /* --- 商家列表 --- */
    .vendor-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    .vendor-filters {
        gap: 8px;
    }
    .filter-btn {
        padding: 8px 16px;
        font-size: 13px;
    }

    /* --- 婚礼案例 --- */
    .gallery-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    .gallery-filters {
        gap: 8px;
    }
    .gallery-image {
        height: 180px;
    }

    /* --- 婚俗内容 --- */
    .tradition-item {
        padding: 18px;
    }

    /* --- 风俗查询 --- */
    .custom-nav {
        position: static;
        top: auto;
        padding: 15px 0;
    }
    .category-tabs {
        gap: 10px;
    }
    .category-btn {
        padding: 10px 16px;
        font-size: 13px;
        min-width: auto;
    }
    .category-icon {
        font-size: 1.5rem;
    }
    .category-section {
        scroll-margin-top: 20px;
    }
    .category-section h2 {
        font-size: 1.3rem;
    }
    .custom-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    .custom-card {
        padding: 18px;
    }
    .search-wrapper {
        max-width: 100%;
        margin: 0 12px;
    }

    /* --- 酒店表格 --- */
    .hotel-table-wrapper {
        margin: 0 -12px;
        border-radius: 0;
    }
    .hotel-table {
        min-width: 600px;
    }
    .hotel-table th,
    .hotel-table td {
        padding: 10px 8px;
        font-size: 12px;
    }
    .hotel-recommend {
        padding: 15px 18px;
    }

    /* --- 费用参考表 --- */
    .reference-table-wrapper {
        margin: 0 -12px;
    }
    .reference-table {
        min-width: 550px;
    }
    .reference-table th,
    .reference-table td {
        padding: 10px 12px;
        font-size: 13px;
    }

    /* --- 预算模块 --- */
    .budget-stats {
        grid-template-columns: 1fr 1fr;
        gap: 12px;
    }
    .stat-card {
        padding: 18px;
    }
    .stat-card .amount {
        font-size: 24px;
    }
    .budget-form-section {
        padding: 18px;
    }
    .budget-form .form-row {
        flex-direction: column;
    }
    .budget-form select,
    .budget-form input[type="text"],
    .budget-form input[type="number"] {
        width: 100%;
        min-width: auto;
    }
    .budget-item {
        flex-direction: column;
        align-items: flex-start;
        gap: 6px;
        padding: 10px 0;
    }
    .item-amount, .item-actual, .item-paid {
        min-width: auto;
        font-size: 13px;
    }

    /* --- 清单模块 --- */
    .checklist-tabs {
        gap: 8px;
    }
    .tab-btn {
        padding: 8px 14px;
        font-size: 13px;
    }
    .checklist-item {
        gap: 10px;
        padding: 10px 0;
        flex-wrap: wrap;
    }

    /* --- 婚礼当日流程 --- */
    .schedule-tabs {
        gap: 8px;
    }
    .schedule-tab {
        padding: 10px 20px;
        font-size: 14px;
    }
    .timeline-container {
        max-width: 100%;
    }
    .timeline-item {
        gap: 12px;
    }
    .timeline-time {
        min-width: 80px;
        font-size: 12px;
        padding: 6px 10px;
    }
    .timeline-dot {
        min-width: 12px;
        width: 12px;
        height: 12px;
    }
    .timeline-card {
        padding: 15px 18px;
    }
    .schedule-table {
        min-width: 550px;
    }

    /* --- 角色分工表 --- */
    .roles-table {
        min-width: 500px;
    }
    .roles-table th,
    .roles-table td {
        padding: 10px 12px;
        font-size: 13px;
    }

    /* --- 父母衣着 --- */
    .attire-role-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .attire-role-header {
        padding: 18px;
    }
    .attire-body {
        padding: 18px;
    }
    .attire-tips-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    .color-palette {
        gap: 8px;
    }
    .color-dot {
        width: 26px;
        height: 26px;
    }

    /* --- 父母致辞 --- */
    .speech-card {
        margin: 0 0 20px;
        border-radius: 15px;
    }
    .speech-header {
        padding: 18px 20px;
    }
    .speech-body {
        padding: 20px;
    }
    .speech-body p {
        font-size: 0.95rem;
        text-indent: 1.5em;
        line-height: 2;
    }

    /* --- 老黄历 --- */
    .almanac-main-card {
        margin: 0;
        border-radius: 15px;
    }
    .almanac-header {
        padding: 20px 15px;
    }
    .gregorian-date .month-day {
        font-size: 1.5rem;
    }
    .gregorian-date .year {
        font-size: 0.9rem;
    }
    .lunar-date .lunar-text {
        font-size: 1rem;
    }
    .almanac-ganzhi {
        padding: 15px;
        gap: 5px;
    }
    .ganzhi-value {
        font-size: 1.1rem;
    }
    .almanac-yi-ji {
        padding: 18px;
    }
    .almanac-extra {
        grid-template-columns: repeat(3, 1fr);
        gap: 12px;
        padding: 15px;
    }
    .almanac-form {
        flex-direction: column;
        align-items: stretch;
    }
    .almanac-input {
        width: 100%;
        font-size: 16px;
    }
    .almanac-nav {
        display: flex;
        justify-content: center;
        gap: 10px;
    }
    .almanac-tip-card {
        padding: 18px;
    }

    /* --- 天气查询 --- */
    .weather-input-group {
        flex-direction: column;
    }
    .weather-search-input {
        font-size: 16px !important;
        min-height: 44px;
    }
    .weather-search-btn {
        width: 100% !important;
        min-height: 44px;
    }
    .weather-display-area {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    .weather-info-card {
        padding: 20px;
    }
    .weather-icon-big {
        font-size: 3rem;
    }
    .temp-number {
        font-size: 2.5rem;
    }
    .weather-forecast-card {
        padding: 18px;
    }
    .forecast-item {
        flex-wrap: wrap;
        gap: 8px;
        padding: 10px 12px;
    }
    .weather-tips-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    .weather-city-tags {
        gap: 6px;
    }

    /* --- 八字测算 --- */
    .bazi-layout {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .bazi-form-card {
        position: static;
        top: auto;
        padding: 20px;
    }
    .bazi-calc-form .form-group input,
    .bazi-calc-form .form-group select {
        font-size: 16px !important;
        min-height: 44px;
    }
    .bazi-pillars {
        grid-template-columns: repeat(4, 1fr);
        gap: 8px;
    }
    .bazi-pillar {
        padding: 12px 6px;
    }
    .pillar-tg, .pillar-dz {
        font-size: 1.2rem;
    }
    .bazi-result-area {
        padding: 20px;
    }
    .bazi-result-header h2 {
        font-size: 1.1rem;
    }
    .analysis-card {
        padding: 15px;
    }

    /* --- 电子请柬 --- */
    .invitation-create-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }
    .invitation-form-panel,
    .invitation-preview-panel {
        padding: 20px;
    }
    .invitation-form .form-row {
        grid-template-columns: 1fr;
    }
    .preview-card {
        max-width: 280px;
    }
    .my-invitation-grid {
        grid-template-columns: 1fr;
    }
    .share-link-box {
        flex-direction: column;
    }
    .share-link-box input {
        min-height: 44px;
        font-size: 14px;
    }

    /* --- 票务模块 --- */
    .search-card {
        padding: 20px;
        border-radius: 15px;
    }
    .search-form .form-row {
        flex-direction: column;
    }
    .form-group {
        min-width: 100%;
    }
    .location-input {
        font-size: 16px !important;
        min-height: 44px;
    }
    .trip-type-tabs {
        gap: 8px;
    }
    .tab-btn {
        padding: 10px 20px;
        font-size: 14px;
    }
    .ticket-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 8px;
        padding: 12px 15px;
    }
    .ticket-body {
        padding: 15px;
    }
    .route-info {
        flex-direction: column;
        gap: 12px;
    }
    .city-block .city-name {
        font-size: 1.2rem;
    }
    .city-block .city-time {
        font-size: 1rem;
    }
    .ticket-info {
        flex-wrap: wrap;
        gap: 10px;
    }
    .ticket-footer {
        flex-direction: column;
        gap: 12px;
        padding: 12px 15px;
    }
    .price-section {
        justify-content: center;
    }
    .seat-section {
        justify-content: center;
        flex-wrap: wrap;
    }
    .book-btn {
        width: 100%;
        min-height: 44px;
    }
    .filter-bar {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }
    .type-tabs {
        flex-wrap: wrap;
    }
    .current-price {
        font-size: 1.4rem;
    }
    .results-list {
        gap: 12px;
    }

    /* --- 婚恋交友 --- */
    .profiles-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    .profile-card {
        padding: 20px;
    }
    .profile-avatar {
        width: 100px;
        height: 100px;
    }
    .filter-form .filter-row {
        flex-direction: column;
        align-items: stretch;
    }
    .filter-form input,
    .filter-form select {
        width: 100%;
        font-size: 16px !important;
        min-height: 44px;
    }

    /* --- 关于我们 --- */
    .about-content {
        grid-template-columns: 1fr;
        gap: 25px;
    }
    .about-stats {
        grid-template-columns: repeat(3, 1fr);
        gap: 10px;
    }
    .stat-item {
        padding: 15px 10px;
    }
    .stat-number {
        font-size: 1.5rem;
    }
    .team-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    .contact-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    .contact-card {
        padding: 20px;
    }

    /* --- 附加服务 --- */
    .additional-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }
    .additional-services {
        padding: 30px 0;
    }
    .additional-services h2 {
        margin-bottom: 25px;
    }
    .features-grid {
        grid-template-columns: 1fr;
        gap: 15px;
    }

    /* --- 后台管理 --- */
    .admin-tabs {
        gap: 8px;
    }
    .admin-tab-btn {
        padding: 8px 14px;
        font-size: 13px;
    }
    .admin-panel {
        padding: 18px;
    }
    .admin-table {
        min-width: 500px;
    }
    .admin-table th,
    .admin-table td {
        padding: 10px;
        font-size: 13px;
    }
    .admin-login {
        margin: 30px 15px;
        padding: 20px;
    }
    .admin-header {
        flex-direction: column;
        gap: 10px;
        align-items: flex-start;
    }

    /* --- 数字人管理模块 --- */
    .dh-manager-section > .container {
        grid-template-columns: 1fr !important;
        grid-template-areas: "right" "left" !important;
        gap: 20px !important;
    }
    .manager-left-panel {
        position: static;
        align-self: auto;
    }
    .agent-card {
        padding: 20px;
    }
    .agent-avatar {
        width: 80px;
        height: 80px;
    }
    .progress-stats {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }
    .timeline-item {
        flex-wrap: wrap;
    }
    .timeline-actions {
        margin-top: 8px;
    }
    .chat-messages {
        max-height: 150px;
    }
    .msg {
        max-width: 90%;
    }

    /* --- 页脚 --- */
    .footer-grid {
        grid-template-columns: 1fr;
        text-align: center;
        gap: 25px;
    }
    .footer-col ul {
        padding: 0;
    }
    .footer-col li {
        list-style: none;
    }
    .footer-col a, .footer-col p {
        font-size: 14px;
    }
    .footer-bottom {
        font-size: 13px;
        padding: 15px 10px 0;
    }
    .footer-disclaimer {
        font-size: 11px;
    }
    .site-footer {
        padding: 30px 0 15px;
    }

    /* --- PWA 安装横幅 --- */
    .pwa-banner-content {
        flex-wrap: wrap;
        gap: 8px;
    }
    .pwa-banner-text {
        flex: 1;
        min-width: 0;
    }
    .pwa-install-btn {
        min-height: 40px;
        padding: 8px 16px;
        font-size: 13px;
    }
    .pwa-dismiss-btn {
        min-height: 40px;
        min-width: 40px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    /* --- 链接网格页脚 --- */
    .links-grid {
        gap: 10px;
    }
    .link-item {
        padding: 6px 14px;
        font-size: 13px;
    }

    /* --- 分类选项卡（弹窗） --- */
    .category-tabs {
        gap: 8px;
    }
    .category-tab {
        padding: 8px 14px;
        font-size: 13px;
    }
    .template-list {
        gap: 12px;
    }
    .template-item {
        padding: 14px;
    }

    /* 分页 */
    .pagination {
        gap: 6px;
        flex-wrap: wrap;
    }
    .page-link {
        padding: 8px 12px;
        font-size: 13px;
    }
}

/* --- 480px 小屏手机专项优化 --- */
@media (max-width: 480px) {
    .container {
        padding: 0 10px;
    }

    /* 轮播 */
    .hero-banner {
        height: 180px;
    }
    .slide-content h1 {
        font-size: 1.2rem;
    }
    .slide-content p {
        font-size: 12px;
    }

    /* 服务卡片 - 2列紧凑布局 */
    .service-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 8px;
    }
    .service-card {
        padding: 12px 8px;
    }
    .service-icon {
        font-size: 1.5rem;
        margin-bottom: 8px;
    }
    .service-card h3 {
        font-size: 12px;
    }
    .service-card p {
        display: none;
    }
    .service-tag {
        font-size: 10px;
        padding: 2px 6px;
    }

    /* 倒计时 */
    .countdown-number {
        font-size: 1.3rem;
    }
    .countdown-label {
        font-size: 10px;
    }

    /* 文字缩小 */
    .section-title h2 {
        font-size: 1.2rem;
    }
    .section-title p {
        font-size: 13px;
    }
    .page-banner h1 {
        font-size: 1.2rem;
    }

    /* 预算 */
    .budget-stats {
        grid-template-columns: 1fr;
        gap: 10px;
    }
    .stat-card .amount {
        font-size: 22px;
    }

    /* 八字 */
    .bazi-pillars {
        grid-template-columns: repeat(2, 1fr);
        gap: 6px;
    }

    /* 老黄历 */
    .almanac-extra {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }
    .almanac-header {
        padding: 15px 10px;
    }
    .gregorian-date .month-day {
        font-size: 1.3rem;
    }
    .almanac-ganzhi {
        flex-wrap: wrap;
        gap: 10px;
    }

    /* 统计数字 */
    .about-stats {
        grid-template-columns: 1fr;
        gap: 10px;
    }
    .stat-number {
        font-size: 1.3rem;
    }

    /* 表单 */
    .form-container {
        margin: 10px 10px;
        padding: 15px;
    }

    /* 弹窗 */
    .modal-content {
        padding: 15px;
        margin: 5px auto;
    }

    /* 按钮 */
    .btn-primary, .btn-secondary {
        padding: 12px 18px;
        font-size: 14px;
    }

    /* 页脚 */
    .footer-bottom {
        font-size: 12px;
    }

    /* 请柬预览 */
    .preview-card {
        max-width: 240px;
    }
    .preview-card-top {
        padding: 20px 15px;
    }
    .preview-card-body {
        padding: 18px 15px;
    }
    .preview-couple {
        font-size: 1.2rem;
    }

    /* 票务 */
    .ticket-number {
        font-size: 14px;
    }
    .current-price {
        font-size: 1.3rem;
    }
    .city-block .city-name {
        font-size: 1.1rem;
    }
    .city-block .city-time {
        font-size: 0.9rem;
    }

    /* 天气 */
    .weather-icon-big {
        font-size: 2.5rem;
    }
    .temp-number {
        font-size: 2rem;
    }
    .weather-info-card {
        padding: 15px;
    }

    /* 时间线 */
    .timeline-item {
        gap: 8px;
    }
    .timeline-time {
        min-width: 65px;
        font-size: 11px;
        padding: 4px 8px;
    }
    .timeline-card {
        padding: 12px 14px;
    }

    /* 供应商筛选 */
    .vendor-filters {
        gap: 6px;
    }
    .filter-btn {
        padding: 6px 12px;
        font-size: 12px;
    }

    /* 特征模块 */
    .features-grid {
        gap: 12px;
    }

    /* 附加服务 */
    .additional-card {
        padding: 20px;
    }

    /* 通用工具样式 */
    .breadcrumb { font-size: 12px; }
    .service-detail-grid { grid-template-columns: 1fr; }
    #modalTitle { font-size: 1.4rem; }
}

/* --- 360px 及以下超小屏适配 --- */
@media (max-width: 360px) {
    .container {
        padding: 0 8px;
    }

    .service-grid {
        gap: 6px;
    }
    .service-card {
        padding: 10px 6px;
    }
    .service-icon {
        font-size: 1.3rem;
    }
    .service-card h3 {
        font-size: 11px;
    }

    .countdown-number {
        font-size: 1.1rem;
    }

    .float-btn {
        width: 42px;
        height: 42px;
        font-size: 16px;
    }

    .bazi-pillars {
        grid-template-columns: repeat(2, 1fr);
    }

    .page-banner {
        padding: 15px 8px;
    }
    .page-banner h1 {
        font-size: 1.1rem;
    }
}