/* ==========================================================================
   敦煌页 · 莫高窟洞窟艺术（3D 封面流轮播 + 年代/题材筛选 + 放大查看）
   cave-gallery.css —— 仅 dunhuang.html 引入（模块 cave-gallery.css / cave-gallery.js）
   风格：国风牌匾标题 + 鎏金细框 + 暖纸底；纯 CSS 变换，无第三方库。
   性能：只对 transform / opacity 做过渡，卡片绝对定位居中。
   ========================================================================== */
.caves{
    --cv-gold:    #C9A15A;
    --cv-gold-lt: #F2DEA8;
    --cv-gold-dk: #8A6A2E;
    --cv-ink:     #33241A;
    --cv-paper:   #F7F1E6;
    --cv-paper-2: #FBF7EF;
    position: relative;
    overflow: hidden;
}
/* 背景：暖纸底 + 极淡云纹（纯 CSS 渐变，无图片请求） */
.caves::before{
    content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
    background:
        radial-gradient(circle at 18% 12%, rgba(201,161,90,.10), transparent 42%),
        radial-gradient(circle at 84% 88%, rgba(25,59,56,.06), transparent 46%),
        repeating-linear-gradient(45deg, rgba(138,106,46,.035) 0 2px, transparent 2px 9px);
}
.caves > .container, .caves__stage, .caves__foot{ position: relative; z-index: 1; }

/* ---------- 牌匾式标题（对应参考图顶部「藏馆文物」） ---------- */
.caves__banner{ text-align: center; margin-bottom: 1.5rem; }
.caves__plaque{
    display: inline-flex; align-items: center; gap: 1.15rem;
    padding: .52rem 1.5rem;
    border: 1px solid rgba(201,161,90,.62);
    border-radius: .3rem;
    background: linear-gradient(180deg, var(--cv-paper-2), var(--cv-paper));
    box-shadow: 0 2px 10px rgba(120,90,40,.10), inset 0 0 0 4px rgba(201,161,90,.10);
    position: relative;
}
.caves__plaque::before, .caves__plaque::after{
    content: ""; width: 7px; height: 7px; transform: rotate(45deg);
    background: var(--cv-gold); box-shadow: 0 0 0 3px rgba(201,161,90,.18);
}
.caves__plaque h2{
    font-family: 'Noto Serif SC', 'Source Han Serif SC', 'Songti SC', STSong, SimSun, serif;
    font-size: clamp(1.25rem, 2.5vw, 1.72rem); font-weight: 700;
    letter-spacing: .3em; text-indent: .3em; color: var(--cv-ink); margin: 0;
}
.caves__sub{
    margin: .95rem auto 0; max-width: 46rem;
    font-size: .88rem; line-height: 1.9; color: var(--gray-600);
}
.caves__sub b{ color: var(--primary); font-weight: 600; }

/* ---------- 筛选（对应参考图「年代 / 材质」下拉） ---------- */
.caves__filters{
    display: flex; flex-wrap: wrap; align-items: center; justify-content: center;
    gap: .9rem 1.1rem; margin: 1.6rem 0 .4rem;
}
.caves__filter{
    display: inline-flex; align-items: center; gap: .5rem;
    padding: .32rem .6rem .32rem .9rem;
    border: 1px solid rgba(201,161,90,.5); border-radius: .3rem;
    background: rgba(255,255,255,.72);
}
.caves__filter > span{
    font-family: 'Noto Serif SC', 'Source Han Serif SC', 'Songti SC', STSong, SimSun, serif; font-size: .92rem;
    letter-spacing: .12em; color: var(--cv-ink); white-space: nowrap;
}
.caves__filter select{
    appearance: none; -webkit-appearance: none;
    border: 0; outline: 0; cursor: pointer;
    font-family: inherit; font-size: .86rem; color: var(--gray-700);
    padding: .3rem 1.5rem .3rem .5rem; border-radius: .22rem;
    background: rgba(201,161,90,.10)
        url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%238A6A2E' stroke-width='1.6'/%3E%3C/svg%3E")
        no-repeat right .5rem center / 11px 7px;
    transition: background-color .25s, color .25s;
}
.caves__filter select:hover{ background-color: rgba(201,161,90,.2); }
.caves__filter select:focus-visible{ box-shadow: 0 0 0 2px rgba(25,59,56,.25); }
.caves__count{
    font-size: .82rem; letter-spacing: .1em; color: var(--gray-500);
    padding-left: .3rem;
}
.caves__count b{ color: var(--primary); font-weight: 600; }

/* ---------- 轮播舞台 ---------- */
.caves__stage{
    position: relative;
    height: clamp(492px, 52vw, 616px);
    margin: 1.4rem auto 0; max-width: 1260px;
    perspective: 1400px;
    touch-action: pan-y;                       /* 允许纵向滚动，横向交给拖拽 */
    outline: none;
}
.caves__track{ position: absolute; inset: 0; }

/* 卡片：绝对定位居中，由 .is-* 类驱动变换 */
.cave-card{
    position: absolute; left: 50%; top: 0;
    width: clamp(252px, 27.5vw, 376px);
    display: flex; flex-direction: column; align-items: center;
    transform: translateX(-50%) scale(.6);
    opacity: 0; pointer-events: none;
    transition: transform .58s var(--ease-expo, cubic-bezier(.16,1,.3,1)),
                opacity .45s ease;
    will-change: transform, opacity;
    backface-visibility: hidden;
}
.cave-card.is-active{ transform: translateX(-50%) translateZ(0) scale(1); opacity: 1; pointer-events: auto; z-index: 30; }
.cave-card.is-prev{ transform: translateX(calc(-50% - 42%)) rotateY(15deg) scale(.8); opacity: .74; pointer-events: auto; z-index: 20; }
.cave-card.is-next{ transform: translateX(calc(-50% + 42%)) rotateY(-15deg) scale(.8); opacity: .74; pointer-events: auto; z-index: 20; }
.cave-card.is-far-prev{ transform: translateX(calc(-50% - 78%)) rotateY(18deg) scale(.62); opacity: 0; z-index: 10; }
.cave-card.is-far-next{ transform: translateX(calc(-50% + 78%)) rotateY(-18deg) scale(.62); opacity: 0; z-index: 10; }
.cave-card.is-prev:hover, .cave-card.is-next:hover{ opacity: .92; }

/* 海报框：3:4 竖幅 + 鎏金细框 */
.cave-card__poster{
    position: relative; width: 100%; aspect-ratio: 3 / 4;
    overflow: hidden; border-radius: .42rem;
    background: #2A1D12;
    border: 1px solid rgba(201,161,90,.65);
    box-shadow: 0 18px 40px -18px rgba(40,24,10,.55), 0 2px 8px rgba(40,24,10,.22);
}
.cave-card__poster::after{                 /* 内描边：国风双框 */
    content: ""; position: absolute; inset: 6px; pointer-events: none;
    border: 1px solid rgba(242,222,168,.28); border-radius: .2rem;
}
.cave-card__poster img{
    width: 100%; height: 100%; object-fit: cover; object-position: center;
    display: block; transition: transform 1.2s var(--ease-expo, ease);
}
.cave-card.is-active .cave-card__poster img{ transform: scale(1.045); }

/* 竖排大字标题（右） */
.cave-card__title{
    position: absolute; right: .55rem; top: .95rem;
    writing-mode: vertical-rl; text-orientation: upright;
    font-family: 'Noto Serif SC', 'Source Han Serif SC', 'Songti SC', STSong, SimSun, serif; font-weight: 700;
    font-size: clamp(1.1rem, 1.9vw, 1.5rem); letter-spacing: .26em;
    color: #FAF0D6; text-shadow: 0 2px 8px rgba(0,0,0,.75), 0 0 2px rgba(0,0,0,.9);
}
.cave-card__en{
    position: absolute; right: 2.6rem; top: 1.05rem;
    writing-mode: vertical-rl;
    font-size: .56rem; letter-spacing: .3em; color: rgba(242,222,168,.78);
    text-shadow: 0 1px 4px rgba(0,0,0,.7);
}
/* 底部信息条（对应参考图海报下方文字块） */
.cave-card__cap{
    position: absolute; left: 0; right: 0; bottom: 0;
    padding: 1.9rem .85rem .8rem;
    background: linear-gradient(180deg, rgba(24,14,7,0) 0%, rgba(24,14,7,.72) 38%, rgba(22,13,6,.9) 100%);
    color: #F6EBD3; text-align: left;
}
.cave-card__name{
    font-family: 'Noto Serif SC', 'Source Han Serif SC', 'Songti SC', STSong, SimSun, serif; font-size: 1.02rem; font-weight: 700;
    letter-spacing: .12em; color: var(--cv-gold-lt);
}
.cave-card__meta{ font-size: .68rem; letter-spacing: .1em; color: rgba(246,235,211,.75); margin-top: .2rem; }
.cave-card__dl{ margin: .5rem 0 0; display: grid; gap: .18rem; }
.cave-card__dl > div{ display: flex; gap: .5rem; font-size: .66rem; line-height: 1.5; }
.cave-card__dl dt{ color: rgba(242,222,168,.62); flex: 0 0 2.2rem; letter-spacing: .1em; }
.cave-card__dl dd{ margin: 0; color: rgba(246,235,211,.92); }

/* 「点击进入」按钮 */
.cave-card__btn{
    margin-top: .8rem; cursor: pointer;
    font-family: inherit; font-size: .78rem; letter-spacing: .18em;
    color: var(--cv-gold-lt); background: rgba(30,20,10,.72);
    border: 1px solid rgba(201,161,90,.6); border-radius: 999px;
    padding: .42rem 1.35rem;
    transition: background .3s, color .3s, transform .3s, border-color .3s;
}
.cave-card__btn:hover{ background: var(--primary); border-color: var(--primary); color: #fff; transform: translateY(-1px); }
.cave-card:not(.is-active) .cave-card__btn{ opacity: .5; }

/* 左右切换按钮 */
.caves__nav{
    position: absolute; top: 42%; z-index: 40;
    width: 46px; height: 62px; display: grid; place-items: center; cursor: pointer;
    font-family: 'Noto Serif SC', 'Source Han Serif SC', 'Songti SC', STSong, SimSun, serif; font-size: 1.7rem; line-height: 1;
    color: var(--cv-gold-dk); background: rgba(255,255,255,.72);
    border: 1px solid rgba(201,161,90,.6); border-radius: .3rem;
    box-shadow: 0 6px 18px rgba(60,40,15,.14);
    transition: background .3s, color .3s, transform .3s, opacity .3s;
}
.caves__nav:hover{ background: var(--cv-gold); color: #fff; transform: scale(1.04); }
.caves__nav:disabled{ opacity: .32; cursor: default; transform: none; }
.caves__nav--prev{ left: max(.6rem, 2.5vw); }
.caves__nav--next{ right: max(.6rem, 2.5vw); }

/* 底部提示行 */
.caves__foot{
    display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
    gap: .8rem; margin-top: .6rem; padding-top: 1.1rem;
    border-top: 1px dashed rgba(201,161,90,.45);
}
.caves__hint{ font-size: .82rem; letter-spacing: .1em; color: var(--gray-500); }
.caves__more{
    font-size: .86rem; letter-spacing: .1em; color: var(--primary);
    text-decoration: none; border-bottom: 1px solid rgba(25,59,56,.35);
    padding-bottom: 2px; transition: border-color .3s, color .3s;
}
.caves__more:hover{ border-color: var(--primary); }

/* ---------- 放大查看（灯箱） ---------- */
.cave-lb{
    position: fixed; inset: 0; z-index: 9500; display: none;
    background: rgba(16,10,5,.9);
    padding: max(1.2rem, 4vh) max(1.2rem, 4vw);
    opacity: 0; transition: opacity .32s ease;
}
.cave-lb.is-open{ display: grid; place-items: center; }
.cave-lb.is-on{ opacity: 1; }
.cave-lb__inner{
    position: relative; display: grid; gap: 1rem; justify-items: center;
    max-width: min(1180px, 92vw); max-height: 92vh;
}
.cave-lb__img{
    max-width: 100%; max-height: 74vh; object-fit: contain; border-radius: .4rem;
    border: 1px solid rgba(201,161,90,.55);
    background: #1a1008; box-shadow: 0 30px 70px -30px rgba(0,0,0,.8);
}
.cave-lb__bar{
    width: 100%; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
    gap: .6rem 1.2rem; color: #F6EBD3;
}
.cave-lb__name{ font-family: 'Noto Serif SC', 'Source Han Serif SC', 'Songti SC', STSong, SimSun, serif; font-size: 1.12rem; letter-spacing: .14em; color: var(--cv-gold-lt); }
.cave-lb__meta{ font-size: .78rem; letter-spacing: .08em; color: rgba(246,235,211,.75); }
.cave-lb__nav{ display: flex; gap: .6rem; }
.cave-lb__btn{
    cursor: pointer; font-family: inherit; font-size: .82rem; letter-spacing: .12em;
    color: var(--cv-gold-lt); background: rgba(255,255,255,.06);
    border: 1px solid rgba(201,161,90,.5); border-radius: 999px; padding: .4rem 1rem;
    transition: background .3s, color .3s;
}
.cave-lb__btn:hover{ background: var(--primary); border-color: var(--primary); color: #fff; }
.cave-lb__close{
    position: absolute; top: -1rem; right: -.4rem; z-index: 2;
    width: 2.4rem; height: 2.4rem; border-radius: 50%; cursor: pointer;
    color: #F6EBD3; background: rgba(60,36,16,.9);
    border: 1px solid rgba(201,161,90,.55); font-size: 1.1rem; line-height: 1;
    display: grid; place-items: center; transition: background .3s, transform .3s;
}
.cave-lb__close:hover{ background: var(--primary); transform: scale(1.06); }
html.lb-lock, html.lb-lock body{ overflow: hidden !important; }

/* ---------- 响应式 ---------- */
@media (max-width: 1024px){
    .caves__stage{ height: clamp(400px, 62vw, 520px); }
    .cave-card{ width: clamp(214px, 30vw, 280px); }
    .cave-card.is-prev{ transform: translateX(calc(-50% - 38%)) rotateY(15deg) scale(.8); }
    .cave-card.is-next{ transform: translateX(calc(-50% + 38%)) rotateY(-15deg) scale(.8); }
}
@media (max-width: 720px){
    .caves__stage{ height: 430px; }
    .cave-card{ width: min(64vw, 250px); }
    .cave-card.is-prev{ transform: translateX(calc(-50% - 46%)) rotateY(16deg) scale(.74); opacity: .5; }
    .cave-card.is-next{ transform: translateX(calc(-50% + 46%)) rotateY(-16deg) scale(.74); opacity: .5; }
    .cave-card.is-far-prev, .cave-card.is-far-next{ opacity: 0; }
    .caves__nav{ width: 36px; height: 48px; font-size: 1.35rem; top: 38%; opacity: .82; background: rgba(255,255,255,.86); }
    .caves__nav:active{ opacity: 1; }
    .caves__filter{ padding-left: .7rem; }
    .caves__foot{ justify-content: center; text-align: center; }
}
/* 尊重「减弱动效」偏好 */
@media (prefers-reduced-motion: reduce){
    .cave-card, .cave-card__poster img, .cave-lb{ transition: none !important; }
    .cave-card.is-active .cave-card__poster img{ transform: none; }
}

/* 空筛选提示 */
.caves__empty{
    position: absolute; inset: 0; display: grid; place-items: center;
    font-family: 'Noto Serif SC', 'Source Han Serif SC', 'Songti SC', STSong, SimSun, serif; font-size: .98rem; letter-spacing: .16em;
    color: var(--gray-500);
}
.caves__empty span{ padding: .8rem 1.4rem; border: 1px dashed rgba(201,161,90,.6); border-radius: .4rem; background: rgba(255,255,255,.6); }

/* 来源与版权说明 */
.caves__credit{
    margin: 1.1rem auto 0; max-width: 58rem;
    font-size: .74rem; line-height: 1.95; color: var(--gray-500);
    padding: .85rem 1.1rem; border-left: 3px solid rgba(201,161,90,.55);
    background: rgba(255,255,255,.55); border-radius: .25rem;
}
.caves__credit b{ color: var(--cv-ink); font-weight: 600; }