/* 路书自定义样式 */
* { font-family: 'Noto Sans SC', system-ui, sans-serif; }
.font-brand { font-family: 'Noto Serif SC', serif; }

body { scroll-behavior: smooth; }

/* 封面 */
.cover {
    min-height: 92vh;
    display: flex;
    align-items: center;
}
.cover-bg {
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse at 20% 30%, rgba(246, 198, 103, 0.35) 0%, transparent 50%),
        radial-gradient(ellipse at 80% 70%, rgba(58, 143, 183, 0.4) 0%, transparent 55%),
        linear-gradient(135deg, #E94F37 0%, #C23616 40%, #7B2D1A 70%, #2E2E2E 100%);
}
.cover-bg::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(180deg, transparent 0%, transparent 60%, rgba(0,0,0,0.5) 100%),
        repeating-linear-gradient(45deg, transparent 0 20px, rgba(255,255,255,0.02) 20px 21px);
}
/* 丹霞赤壁山形 */
.cover-bg::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0; right: 0;
    height: 45%;
    background:
        linear-gradient(to top, rgba(0,0,0,0.4), transparent),
        url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 400' preserveAspectRatio='none'><path fill='%23c0392b' opacity='0.6' d='M0,400 L0,200 Q100,140 200,180 T400,160 Q500,120 600,200 T800,140 Q900,180 1000,120 T1200,180 L1200,400 Z'/><path fill='%237b2d1a' opacity='0.7' d='M0,400 L0,280 Q150,220 300,260 T600,240 Q750,200 900,260 T1200,240 L1200,400 Z'/></svg>") bottom / cover no-repeat;
}
.cover-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(120deg, rgba(0,0,0,0.35), transparent 60%);
}

.stat-card {
    background: rgba(255,255,255,0.15);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255,255,255,0.25);
    border-radius: 1rem;
    padding: 1.25rem;
    color: white;
    transition: transform 0.3s, background 0.3s;
}
.stat-card:hover { transform: translateY(-4px); background: rgba(255,255,255,0.22); }
.stat-icon { font-size: 1.6rem; color: #F6C667; }
.stat-val { font-family: 'Noto Serif SC', serif; font-size: 2rem; font-weight: 900; line-height: 1.1; margin-top: 0.35rem; }
.stat-label { font-size: 0.85rem; opacity: 0.85; }

/* 时间轴 */
.timeline {
    position: relative;
}
.timeline::before {
    content: '';
    position: absolute;
    left: 50%;
    top: 0; bottom: 0;
    width: 3px;
    background: linear-gradient(180deg, #E94F37, #F6C667, #2E7D5B, #3A8FB7);
    border-radius: 3px;
    transform: translateX(-50%);
}
.tl-item {
    position: relative;
    width: 50%;
    padding: 1.25rem 2rem;
    box-sizing: border-box;
}
.tl-item.left { left: 0; text-align: right; }
.tl-item.right { left: 50%; text-align: left; }
.tl-dot {
    position: absolute;
    top: 1.5rem;
    width: 1.35rem; height: 1.35rem;
    border-radius: 50%;
    background: white;
    border: 3px solid #E94F37;
    z-index: 2;
    box-shadow: 0 0 0 4px rgba(233,79,55,0.15);
}
.tl-item.left .tl-dot { right: -0.675rem; }
.tl-item.right .tl-dot { left: -0.675rem; }
.tl-card {
    background: white;
    padding: 1.25rem 1.5rem;
    border-radius: 1rem;
    box-shadow: 0 8px 30px rgba(0,0,0,0.06);
    border: 1px solid rgba(0,0,0,0.04);
    transition: transform 0.3s;
}
.tl-card:hover { transform: translateY(-3px); box-shadow: 0 12px 40px rgba(0,0,0,0.1); }
.tl-date { color: #E94F37; font-weight: 700; font-size: 0.85rem; letter-spacing: 1px; }
.tl-title { font-family: 'Noto Serif SC'; font-size: 1.35rem; font-weight: 900; margin-top: 0.25rem; }
.tl-desc { color: #555; font-size: 0.9rem; margin-top: 0.5rem; line-height: 1.6; }
.tl-tags { margin-top: 0.75rem; display: flex; flex-wrap: wrap; gap: 0.35rem; justify-content: inherit; }
.tl-item.left .tl-tags { justify-content: flex-end; }
.tl-tag {
    background: #FBF7F0;
    color: #E94F37;
    padding: 0.15rem 0.6rem;
    border-radius: 999px;
    font-size: 0.72rem;
    border: 1px solid rgba(233,79,55,0.2);
}
@media (max-width: 768px) {
    .timeline::before { left: 1rem; }
    .tl-item { width: 100%; left: 0 !important; text-align: left !important; padding-left: 2.5rem; padding-right: 0.5rem; }
    .tl-item .tl-dot { left: 0.325rem !important; right: auto !important; }
    .tl-item.left .tl-tags { justify-content: flex-start; }
}

/* Day Tab */
.day-tab {
    padding: 0.6rem 1.25rem;
    border-radius: 999px;
    background: #F2EDE5;
    color: #555;
    cursor: pointer;
    font-weight: 500;
    font-size: 0.95rem;
    transition: all 0.25s;
    border: 2px solid transparent;
}
.day-tab:hover { background: #EAE0CE; }
.day-tab.active {
    background: #E94F37;
    color: white;
    box-shadow: 0 8px 20px rgba(233,79,55,0.3);
}

.day-block { display: none; animation: fadeUp 0.4s ease-out; }
.day-block.active { display: block; }
@keyframes fadeUp { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }

.day-header {
    background: linear-gradient(135deg, #E94F37, #F6A62E);
    padding: 1.5rem 2rem;
    border-radius: 1.25rem 1.25rem 0 0;
    color: white;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 1rem;
}
.day-header.forest { background: linear-gradient(135deg, #2E7D5B, #3A8FB7); }
.day-header.lake { background: linear-gradient(135deg, #3A8FB7, #2E7D5B); }
.day-header.sunset { background: linear-gradient(135deg, #E94F37, #7B2D1A); }

.schedule-list { list-style: none; padding: 0; margin: 0; }
.schedule-item {
    display: flex;
    gap: 1.25rem;
    padding: 1.25rem 0;
    border-bottom: 1px dashed #EAE0CE;
}
.schedule-item:last-child { border-bottom: none; }
.schedule-time {
    flex-shrink: 0;
    width: 80px;
    color: #E94F37;
    font-weight: 700;
    font-family: 'Noto Serif SC';
    font-size: 1.05rem;
}
.schedule-icon {
    flex-shrink: 0;
    width: 44px; height: 44px;
    border-radius: 50%;
    background: #FBF7F0;
    color: #E94F37;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.2rem;
    border: 2px solid rgba(233,79,55,0.2);
}
.schedule-body h4 { font-weight: 700; font-size: 1.1rem; margin-bottom: 0.25rem; }
.schedule-body p { color: #666; font-size: 0.92rem; line-height: 1.7; }
.schedule-meta { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.5rem; font-size: 0.8rem; color: #888; }
.schedule-meta span { display: inline-flex; align-items: center; gap: 0.25rem; background: #F6F2EB; padding: 0.2rem 0.6rem; border-radius: 999px; }

/* Highlight cards */
.hl-card {
    border-radius: 1.25rem;
    overflow: hidden;
    background: white;
    box-shadow: 0 8px 30px rgba(0,0,0,0.06);
    transition: transform 0.35s, box-shadow 0.35s;
    cursor: pointer;
}
.hl-card:hover { transform: translateY(-6px); box-shadow: 0 16px 50px rgba(0,0,0,0.12); }
.hl-illustration {
    height: 180px;
    position: relative;
    overflow: hidden;
}
.hl-body { padding: 1.25rem 1.5rem; }
.hl-body h3 { font-family: 'Noto Serif SC'; font-size: 1.35rem; font-weight: 900; }
.hl-tag { display: inline-block; font-size: 0.72rem; color: #E94F37; background: #FBEEEA; padding: 0.15rem 0.6rem; border-radius: 999px; margin-bottom: 0.5rem; }
.hl-body p { color: #666; font-size: 0.9rem; line-height: 1.6; margin-top: 0.5rem; }

/* 插画：丹霞 */
.illust-danxia {
    background:
        radial-gradient(ellipse at 30% 20%, #FFD447 0%, transparent 50%),
        linear-gradient(180deg, #FFB073 0%, #E94F37 60%, #7B2D1A 100%);
}
.illust-danxia::after {
    content: '';
    position: absolute; inset: 0;
    background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 180' preserveAspectRatio='none'><path fill='%23c0392b' d='M0,180 L0,90 L40,80 L60,100 L80,70 L110,85 L130,50 L160,80 L200,45 L230,85 L260,60 L290,90 L320,55 L360,85 L400,70 L400,180 Z'/><path fill='%237b2d1a' opacity='0.8' d='M0,180 L0,130 L50,120 L80,140 L120,115 L160,135 L200,110 L250,130 L300,115 L350,135 L400,120 L400,180 Z'/></svg>") bottom / cover no-repeat;
}
/* 插画：韶关古城 */
.illust-shaoguan {
    background: linear-gradient(180deg, #FBC687 0%, #E67E22 100%);
}
.illust-shaoguan::after {
    content: '';
    position: absolute; inset: 0;
    background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 180'><rect x='160' y='60' width='80' height='90' fill='%238B4513'/><polygon points='155,60 200,25 245,60' fill='%235C3317'/><rect x='175' y='90' width='15' height='25' fill='%23FFD700'/><rect x='210' y='90' width='15' height='25' fill='%23FFD700'/><rect x='192' y='125' width='16' height='25' fill='%232C1810'/><rect x='80' y='100' width='50' height='50' fill='%23A0522D'/><polygon points='75,100 105,75 135,100' fill='%235C3317'/><rect x='270' y='100' width='50' height='50' fill='%23A0522D'/><polygon points='265,100 295,75 325,100' fill='%235C3317'/></svg>") bottom / contain no-repeat;
}
/* 插画：东江湖晨雾 */
.illust-dongjiang {
    background: linear-gradient(180deg, #F5E6D3 0%, #B8D8E8 40%, #6FA7C5 100%);
}
.illust-dongjiang::after {
    content: '';
    position: absolute; inset: 0;
    background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 180' preserveAspectRatio='none'><path fill='%23507a8f' opacity='0.7' d='M0,110 L60,90 L120,105 L200,85 L280,100 L360,85 L400,95 L400,140 L0,140 Z'/><ellipse cx='200' cy='155' rx='250' ry='25' fill='%233a6580'/><rect x='180' y='115' width='40' height='8' fill='%234a2f1a'/><rect x='195' y='100' width='2' height='15' fill='%234a2f1a'/><path d='M195,100 L215,108 L195,115 Z' fill='%23d4a574'/><ellipse cx='100' cy='125' rx='80' ry='10' fill='white' opacity='0.5'/><ellipse cx='280' cy='118' rx='100' ry='8' fill='white' opacity='0.6'/></svg>") bottom / cover no-repeat;
}
/* 插画：莽山 */
.illust-mangshan {
    background: linear-gradient(180deg, #A8D8B9 0%, #2E7D5B 70%, #1a4d36 100%);
}
.illust-mangshan::after {
    content: '';
    position: absolute; inset: 0;
    background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 180' preserveAspectRatio='none'><path fill='%231a4d36' d='M0,180 L0,110 L50,60 L90,95 L140,40 L190,80 L240,30 L290,75 L340,50 L400,90 L400,180 Z'/><path fill='%232E7D5B' opacity='0.85' d='M0,180 L0,140 L40,120 L80,145 L130,115 L170,140 L220,110 L270,135 L320,115 L380,140 L400,130 L400,180 Z'/></svg>") bottom / cover no-repeat;
}
/* 插画：温泉 */
.illust-spring {
    background: linear-gradient(180deg, #2d3561 0%, #5d4e75 60%, #E94F37 100%);
}
.illust-spring::after {
    content: '';
    position: absolute; inset: 0;
    background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 180' preserveAspectRatio='none'><ellipse cx='200' cy='150' rx='180' ry='30' fill='%23f6c667' opacity='0.6'/><circle cx='120' cy='115' r='15' fill='white' opacity='0.4'/><circle cx='150' cy='100' r='8' fill='white' opacity='0.5'/><circle cx='250' cy='105' r='12' fill='white' opacity='0.4'/><circle cx='290' cy='95' r='7' fill='white' opacity='0.5'/><path d='M100,150 Q110,130 100,110 Q90,95 105,80' stroke='white' stroke-width='3' fill='none' opacity='0.5'/><path d='M200,150 Q215,125 200,100 Q185,80 205,60' stroke='white' stroke-width='3' fill='none' opacity='0.6'/><path d='M300,150 Q310,125 300,100 Q290,85 305,70' stroke='white' stroke-width='3' fill='none' opacity='0.5'/></svg>") bottom / cover no-repeat;
}
/* 插画：风采楼 */
.illust-fengcai {
    background: linear-gradient(180deg, #FFD447 0%, #E94F37 100%);
}
.illust-fengcai::after {
    content: '';
    position: absolute; inset: 0;
    background: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 400 180'><rect x='170' y='70' width='60' height='80' fill='%237b2d1a'/><polygon points='160,70 200,30 240,70' fill='%23c0392b'/><polygon points='165,72 200,50 235,72' fill='%23FFD447'/><rect x='185' y='90' width='8' height='20' fill='%23FFD700'/><rect x='205' y='90' width='8' height='20' fill='%23FFD700'/><rect x='196' y='125' width='8' height='25' fill='%23000'/></svg>") bottom / contain no-repeat;
}

/* Budget */
.budget-card {
    background: rgba(255,255,255,0.08);
    border: 1px solid rgba(255,255,255,0.15);
    padding: 1.25rem;
    border-radius: 1rem;
    transition: background 0.3s;
}
.budget-card:hover { background: rgba(255,255,255,0.14); }
.budget-icon { font-size: 1.6rem; color: #F6C667; }
.budget-title { font-size: 0.85rem; opacity: 0.8; margin-top: 0.4rem; }
.budget-val { font-family: 'Noto Serif SC'; font-weight: 900; font-size: 1.75rem; margin-top: 0.2rem; }

/* Tips */
.tip-card {
    background: white;
    border-radius: 1rem;
    padding: 1.25rem;
    box-shadow: 0 4px 20px rgba(0,0,0,0.04);
    border-top: 3px solid #E94F37;
    transition: transform 0.3s;
}
.tip-card:hover { transform: translateY(-3px); }
.tip-card h4 { font-weight: 700; font-size: 1.05rem; margin: 0.5rem 0; }
.tip-card p { color: #666; font-size: 0.87rem; line-height: 1.65; }
.tip-icon { font-size: 1.75rem; color: #E94F37; }

/* Checklist */
.check-group {
    background: white;
    border-radius: 1.25rem;
    padding: 1.5rem;
    box-shadow: 0 6px 25px rgba(0,0,0,0.05);
}
.check-group h4 {
    font-family: 'Noto Serif SC';
    font-size: 1.25rem;
    font-weight: 900;
    margin-bottom: 1rem;
    padding-bottom: 0.5rem;
    border-bottom: 2px solid #F6C667;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.check-item {
    padding: 0.5rem 0;
    display: flex;
    align-items: center;
    gap: 0.65rem;
    font-size: 0.92rem;
    color: #444;
}
.check-item::before {
    content: '\2713';
    color: #2E7D5B;
    font-weight: 900;
}

/* ========== 📱 每日详情移动端优化 ========== */
@media (max-width: 768px) {
    /* Day Tab 横向滚动条 */
    #day-tabs {
        flex-wrap: nowrap;
        overflow-x: auto;
        justify-content: flex-start;
        padding: 0.25rem 0.5rem 0.75rem;
        margin-left: -1rem;
        margin-right: -1rem;
        padding-left: 1rem;
        padding-right: 1rem;
        gap: 0.5rem;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
    }
    #day-tabs::-webkit-scrollbar { display: none; }
    .day-tab {
        flex-shrink: 0;
        padding: 0.5rem 1rem;
        font-size: 0.82rem;
        white-space: nowrap;
    }

    /* Day Header 紧凑化 */
    .day-header {
        padding: 1.1rem 1.1rem;
        border-radius: 1rem 1rem 0 0;
        flex-direction: column;
        align-items: flex-start;
        gap: 0.65rem;
    }
    .day-header h3 { font-size: 1.3rem !important; line-height: 1.3; }
    .day-header p { font-size: 0.82rem !important; }
    .day-header > div:last-child {
        padding: 0.4rem 0.7rem !important;
        font-size: 0.72rem !important;
        line-height: 1.4;
        width: 100%;
        word-break: break-all;
    }

    /* Day Block 内容区 */
    .day-block .bg-white {
        padding: 1rem 1rem !important;
        border-radius: 0 0 1rem 1rem;
    }

    /* Schedule 行程项：重排为卡片式 */
    .schedule-item {
        display: grid;
        grid-template-columns: auto 1fr;
        grid-template-areas:
            "time  icon"
            "body  body";
        gap: 0.5rem 0.75rem;
        padding: 1rem 0;
        align-items: center;
    }
    .schedule-time {
        grid-area: time;
        width: auto;
        font-size: 0.95rem;
        background: #FBEEEA;
        padding: 0.2rem 0.7rem;
        border-radius: 999px;
        border: 1px solid rgba(233,79,55,0.18);
    }
    .schedule-icon {
        grid-area: icon;
        width: 36px;
        height: 36px;
        justify-self: start;
        font-size: 1rem;
    }
    .schedule-body {
        grid-area: body;
        padding-top: 0.15rem;
    }
    .schedule-body h4 {
        font-size: 1rem;
        line-height: 1.4;
        margin-bottom: 0.3rem;
    }
    .schedule-body p {
        font-size: 0.86rem;
        line-height: 1.7;
        color: #555;
    }

    /* stays 入住信息换行友好 */
    .day-block .mt-6.pt-5 {
        font-size: 0.88rem;
        line-height: 1.6;
        word-break: break-all;
    }
}

/* 超小屏 (iPhone SE) */
@media (max-width: 380px) {
    .day-tab { padding: 0.45rem 0.85rem; font-size: 0.78rem; }
    .day-header h3 { font-size: 1.15rem !important; }
    .schedule-time { font-size: 0.88rem; padding: 0.15rem 0.55rem; }
    .schedule-body h4 { font-size: 0.95rem; }
    .schedule-body p { font-size: 0.82rem; }
}