/* 开场动画 + 全屏大图轮播（思路来自 Osmo「Crisp Loading Animation」，本站用 GSAP 重写）。
   没有 JS 时直接显示第一张大图；有 JS 时先播开场（.is-loading），再切到轮播。 */
.crisp{position:relative;z-index:2;height:100vh;height:100dvh;overflow:hidden;color:#FFF3D6;background:#210100;
  --wipe:cubic-bezier(.625,.05,0,1)}
html.crisp-lock,html.crisp-lock body{overflow:hidden}

/* 轮播层 */
.crisp-slider{position:absolute;inset:0}
.crisp-slide{position:absolute;inset:0;overflow:hidden;visibility:hidden}
.crisp-slide.is-current{visibility:visible}
.crisp-inner{width:100%;height:100%;object-fit:cover;display:block;user-select:none}
.crisp::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(33,1,0,.55) 0%,rgba(33,1,0,.05) 35%,rgba(33,1,0,.05) 60%,rgba(33,1,0,.7) 100%)}

/* 开场层：只在 .is-loading 时出现 */
.crisp-loader{display:none;position:absolute;inset:0;z-index:2;background:#210100;align-items:center;justify-content:center;overflow:hidden}
.crisp.is-loading .crisp-loader{display:flex}
.crisp.is-loading .crisp-slider{visibility:hidden}
.crisp-groups{position:relative;display:flex;align-items:center;justify-content:center}
.crisp-group{display:flex;align-items:center;justify-content:center}
.crisp-group.is-trail{position:absolute;inset:0;opacity:.35;filter:blur(1px)}
.crisp-single{display:flex;align-items:center;justify-content:center;width:10em;height:10em;padding:0 .4em;font-size:clamp(11px,1.3vw,16px)}
.crisp-media{position:relative;flex:none;width:10em;height:10em;overflow:hidden;display:flex;align-items:center;justify-content:center}
.crisp-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.crisp-media.is-radius{border-radius:.5em}
.crisp-media.is-center{z-index:2}
.crisp-single:has(.is-center){position:relative;z-index:3}
.crisp-fade{position:absolute;top:0;bottom:0;left:0;width:18vw;z-index:3;pointer-events:none;background:linear-gradient(90deg,#210100,rgba(33,1,0,0))}
.crisp-fade.is-right{left:auto;right:0;transform:scaleX(-1)}

/* 内容层 */
.crisp-content{position:absolute;inset:0;z-index:4;display:flex;flex-direction:column;justify-content:space-between;
  padding:24px 32px clamp(20px,3.5vh,36px);pointer-events:none}
.crisp-content a,.crisp-content button,.crisp-content nav{pointer-events:auto}
.crisp-top .fhead{gap:12px}
.crisp-top{width:100%;max-width:1176px;margin:0 auto}
.crisp-top .logo{width:120px;height:120px}
.crisp-center{flex:1;display:flex;align-items:center;justify-content:center;text-align:center;min-height:0}
/* 1016h：大标题的字体、大小、颜色、排列、背景色块都来自后台（--ih-* 变量 + ih-* class） */
.crisp-h1{margin:0;max-width:var(--ih-width,14em);font-family:var(--ih-font,var(--heading));font-weight:var(--ih-weight,700);
  font-size:calc(clamp(44px,9vw,140px) * var(--ih-size,1));line-height:var(--ih-line,1.05);letter-spacing:var(--ih-spacing,.02em);color:var(--ih-color,#FFF3D6);
  text-shadow:var(--ih-shadow,0 6px 30px rgba(33,1,0,.55));
  text-shadow:0 6px 30px rgba(33,1,0,.55)}
.ih-ln{display:block}
.ih-a-left{justify-content:flex-start;text-align:left}.ih-a-right{justify-content:flex-end;text-align:right}
.ih-v-top{align-items:flex-start;padding-top:2vh}.ih-v-bottom{align-items:flex-end;padding-bottom:2vh}
.ih-d-v .crisp-h1{writing-mode:vertical-rl;text-orientation:mixed;max-width:none;max-height:var(--ih-width,14em)}
.ih-bg-box .crisp-h1{background:var(--ih-bg);padding:var(--ih-pad);border-radius:var(--ih-radius)}
.ih-bg-line .crisp-hl{background:var(--ih-bg);padding:calc(var(--ih-pad) * .25) var(--ih-pad);border-radius:var(--ih-radius);
  -webkit-box-decoration-break:clone;box-decoration-break:clone}
.split-mask{display:inline-block;overflow:hidden;vertical-align:top;margin:-.1em -.05em;padding:.1em .05em}
.crisp-bottom{padding-right:64px;display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px}
.crisp-thumbs{display:flex;gap:8px;overflow:hidden;padding-top:6px}
.crisp-thumb{position:relative;width:3.6em;height:3.6em;padding:0;border:1px solid rgba(254,206,121,.25);border-radius:.4em;background:transparent;
  overflow:hidden;cursor:pointer;font-size:clamp(12px,1.2vw,16px);transition:border-color .75s var(--wipe)}
.crisp-thumb img{width:100%;height:100%;object-fit:cover;display:block;border-radius:.25em;transform:scale(1);transition:transform .75s var(--wipe)}
.crisp-thumb.is-current{border-color:#FECE79}
.crisp-thumb:focus-visible{outline:2px solid #E6A341;outline-offset:2px}
@media (hover:hover) and (pointer:fine){
  .crisp-thumbs:has(.crisp-thumb:hover) img{transform:scale(.825)}
  .crisp-thumbs:has(.crisp-thumb:hover) .crisp-thumb:hover img{transform:scale(1)}
}
.crisp-caps{position:relative;min-height:3em;text-align:right;max-width:min(520px,100%)}
.crisp-cap{position:absolute;right:0;bottom:0;margin:0;display:flex;flex-direction:column;align-items:flex-end;gap:4px;
  opacity:0;transform:translateY(10px);transition:opacity .6s var(--wipe),transform .6s var(--wipe);pointer-events:none;white-space:nowrap}
.crisp-cap.is-current{opacity:1;transform:none;pointer-events:auto}
.crisp-cap a,.crisp-cap strong{font:700 clamp(16px,1.6vw,20px) var(--heading);color:#FECE79;text-decoration:none}
.crisp-cap span{font-size:14px;opacity:.85}
.crisp-down{position:absolute;z-index:5;left:50%;bottom:clamp(20px,3.5vh,36px);transform:translateX(-50%);width:44px;height:44px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;border:1px solid rgba(254,206,121,.5);color:#FECE79;text-decoration:none;font-size:18px}

/* 下划线链接（Osmo underline link 的效果） */
[data-underline-link]{position:relative;text-decoration:none}
[data-underline-link]::before{content:"";position:absolute;left:0;bottom:-.08em;width:100%;height:.07em;background:currentColor;opacity:.6;
  transform-origin:right;transform:scaleX(0);transition:transform .735s var(--wipe,cubic-bezier(.625,.05,0,1))}
@media (hover:hover) and (pointer:fine){[data-underline-link]:hover::before{transform-origin:left;transform:scaleX(1)}}

/* 有开场大图时，原页头不再出现在色块区上方 */
body.has-crisp .shell{padding-top:clamp(56px,10vh,120px)}
@media (max-width:760px){
  .crisp-content{padding:16px 14px 20px}
  .crisp-top .logo{width:96px;height:96px}
  .crisp-bottom{flex-direction:column;align-items:stretch;padding-right:60px}
  .crisp-caps{text-align:left;min-height:3.4em}
  .crisp-cap{left:0;right:auto;align-items:flex-start;white-space:normal}
  .crisp-down{display:none}
}
@media (prefers-reduced-motion:reduce){.crisp-thumb,.crisp-thumb img,.crisp-cap{transition:none}}