/* ------------------ 圣诞专题：黑底电影感，琥珀为唯一强调色 ------------------ */
.xmas-page{--xmas-amber:#f5b04c;--xmas-ember:#e5492f;--xmas-line:#27272a;--xmas-muted:#a3a3a3;width:100%;color:#fafafa;background:#000}
main:has(.xmas-page){width:100%!important;background:#000}
.xmas-shell{width:min(1200px,calc(100% - 48px));margin-inline:auto}
.xmas-page h1,.xmas-page h2,.xmas-page h3,.xmas-page p{margin:0}
.xmas-page h1,.xmas-page h2{font-weight:650;letter-spacing:-.03em;text-wrap:balance}
.xmas-page h2{font-size:clamp(28px,3.4vw,44px);line-height:1.12}

/* ---- 首屏 ---- */
.xmas-hero{position:relative;display:flex;align-items:center;min-height:min(720px,calc(100svh - 72px));overflow:hidden;isolation:isolate}
.xmas-hero-image{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:right center}
.xmas-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#000 0,rgb(0 0 0/82%) 34%,transparent 62%),linear-gradient(0deg,#000 0,transparent 22%)}
.xmas-snow{position:absolute;inset:-100% 0 0;z-index:-1;pointer-events:none;opacity:.5;background-image:radial-gradient(1.5px 1.5px at 14% 22%,#fff 50%,transparent 52%),radial-gradient(2px 2px at 38% 66%,#fff 50%,transparent 52%),radial-gradient(1.3px 1.3px at 61% 34%,#fff 50%,transparent 52%),radial-gradient(2px 2px at 83% 78%,#fff 50%,transparent 52%);background-size:320px 320px;animation:xmas-snow 24s linear infinite}
@keyframes xmas-snow{to{transform:translateY(50%)}}
@media(prefers-reduced-motion:reduce){.xmas-snow{animation:none}}
.xmas-hero-copy{padding-block:64px}
.xmas-eyebrow{margin-bottom:16px!important;color:var(--xmas-amber);font-size:13px;font-weight:650;letter-spacing:.08em}
.xmas-hero h1{max-width:620px;font-size:clamp(40px,5.4vw,72px);line-height:1.03}
.xmas-lead{max-width:430px;margin-top:20px!important;color:#d4d4d4;font-size:17px;line-height:1.65}
.xmas-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.xmas-primary,.xmas-secondary{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:13px 26px;border-radius:8px;font-size:15px;font-weight:650;line-height:1.3;text-decoration:none;transition:background .18s ease,border-color .18s ease}
.xmas-primary{color:#000;background:var(--xmas-amber)}
.xmas-primary:hover{color:#000;background:#ffc56b}
.xmas-secondary{color:#fafafa;border:1px solid #525252;background:rgb(0 0 0/40%)}
.xmas-secondary:hover{color:#fff;border-color:#eee}
.xmas-primary:focus-visible,.xmas-secondary:focus-visible,.xmas-card:focus-visible{outline:2px solid var(--xmas-amber);outline-offset:3px}

/* ---- 通用区块 ---- */
.xmas-section{padding-block:72px}
.xmas-section--line{border-top:1px solid var(--xmas-line)}
.xmas-heading{max-width:640px;margin-bottom:32px}
.xmas-heading p{margin-top:12px;color:var(--xmas-muted);font-size:16px;line-height:1.65}

/* ---- 提示词画廊：卡片本身就是跳转首页的链接 ---- */
.xmas-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:12px}
.xmas-card{position:relative;display:block;grid-column:span 3;aspect-ratio:1/1;overflow:hidden;border-radius:10px;color:#fff;background:#18181b;text-decoration:none}
.xmas-card--wide{grid-column:span 7;aspect-ratio:auto}
.xmas-card--wide+.xmas-card{grid-column:span 5;aspect-ratio:3/2}
.xmas-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.xmas-card:hover img{transform:scale(1.04)}
.xmas-card::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgb(0 0 0/88%) 0,transparent 52%)}
.xmas-card-body{position:absolute;inset:auto 0 0;z-index:1;display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:4px 14px;padding:16px 18px}
.xmas-card-body strong{font-size:17px;font-weight:650;line-height:1.3}
.xmas-card-body em{color:var(--xmas-amber);font-size:13px;font-style:normal;font-weight:600;line-height:1.5}
@media(prefers-reduced-motion:reduce){.xmas-card img{transition:none}.xmas-card:hover img{transform:none}}

/* ---- 用途 ---- */
.xmas-uses{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:48px}
.xmas-uses ol{display:grid;gap:0;margin:0;padding:0;list-style:none}
.xmas-uses li{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:24px;padding-block:22px;border-top:1px solid var(--xmas-line)}
.xmas-uses li:first-child{padding-top:4px;border-top:0}
.xmas-uses h3{font-size:18px;font-weight:650;line-height:1.35}
.xmas-uses li p{color:var(--xmas-muted);font-size:15px;line-height:1.65}

/* ---- 底部行动 ---- */
.xmas-final{padding-block:88px;text-align:center;background:radial-gradient(60% 120% at 50% 100%,rgb(229 73 47/34%),transparent 70%),#000}
.xmas-final p{max-width:520px;margin:14px auto 26px;color:#d4d4d4;font-size:16px;line-height:1.65}

/* ---- RTL：镜像首屏，文案始终落在暗部 ---- */
[dir="rtl"] .xmas-hero-image{transform:scaleX(-1)}
[dir="rtl"] .xmas-hero::before{background:linear-gradient(270deg,#000 0,rgb(0 0 0/82%) 34%,transparent 62%),linear-gradient(0deg,#000 0,transparent 22%)}

@media(max-width:1100px){
  .xmas-hero::before{background:linear-gradient(90deg,#000 0,rgb(0 0 0/86%) 46%,rgb(0 0 0/20%) 78%,transparent 100%),linear-gradient(0deg,#000 0,transparent 22%)}
  [dir="rtl"] .xmas-hero::before{background:linear-gradient(270deg,#000 0,rgb(0 0 0/86%) 46%,rgb(0 0 0/20%) 78%,transparent 100%),linear-gradient(0deg,#000 0,transparent 22%)}
}
@media(max-width:900px){
  .xmas-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .xmas-card{grid-column:auto}
  .xmas-card--wide,.xmas-card--wide+.xmas-card{grid-column:1/-1;aspect-ratio:16/9}
  .xmas-uses{grid-template-columns:minmax(0,1fr);gap:24px}
}
@media(max-width:640px){
  .xmas-shell{width:calc(100% - 32px)}
  .xmas-section{padding-block:52px}
  /* 手机把水晶球留在上方，文案落到下方黑底 */
  .xmas-hero{display:block;min-height:0}
  .xmas-hero-image{position:static;display:block;height:280px;object-position:72% 50%}
  [dir="rtl"] .xmas-hero-image{object-position:28% 50%}
  .xmas-hero::before,[dir="rtl"] .xmas-hero::before{inset:0 0 auto;height:280px;background:linear-gradient(0deg,#000 0,transparent 40%)}
  .xmas-hero-copy{padding-block:8px 36px}
  .xmas-hero h1{font-size:38px}
  .xmas-lead{font-size:15px}
  .xmas-actions a{width:100%}
  .xmas-grid{grid-template-columns:minmax(0,1fr)}
  .xmas-card,.xmas-card--wide,.xmas-card--wide+.xmas-card{aspect-ratio:3/2}
  .xmas-uses li{grid-template-columns:minmax(0,1fr);gap:8px}
  .xmas-final{padding-block:60px}
  .xmas-final .xmas-primary{width:100%}
}