@charset "UTF-8";

:root {
  --event-ink: #241c21;
  --event-plum: #642f4a;
  --event-blue: #a9d8ec;
  --event-blue-deep: #457f9b;
  --event-paper: #fff;
  --event-soft: #f3f8fa;
  --event-line: #d9e5e9;
}

html { scroll-behavior: smooth; }
body { margin: 0; background: var(--event-paper); color: var(--event-ink); font-family: "Segoe UI", "Microsoft YaHei", sans-serif; }
a { color: inherit; text-decoration: none; }
.site-header { min-height: 82px; padding: 0 6.2%; display: flex; align-items: center; justify-content: space-between; gap: 28px; border-bottom: 1px solid var(--event-line); background: rgba(255,255,255,.96); }
.brand { display: inline-flex; align-items: center; gap: 12px; flex: 0 0 auto; }
.brand-mark { width: 42px; height: 42px; display: grid; place-items: center; background: var(--event-plum); color: white; font-family: Georgia, serif; font-size: 13px; letter-spacing: 1px; }
.brand-copy { display: grid; gap: 3px; }
.brand-copy strong { color: var(--event-plum); font-size: 15px; font-weight: 600; letter-spacing: 2px; }
.brand-copy small { color: #7a7377; font-size: 9px; letter-spacing: 1.8px; }
.site-nav { display: flex; align-items: center; gap: 34px; color: #494248; font-size: 13px; }
.site-nav a { padding: 10px 0; border-bottom: 1px solid transparent; transition: color .2s ease, border-color .2s ease; }
.site-nav a:hover, .site-nav a[aria-current="page"] { color: var(--event-plum); border-color: var(--event-plum); }
.language-control { display: inline-flex; align-items: center; gap: 8px; }
.language-label { color: #746a70; font-size: 10px; font-weight: 600; letter-spacing: .12em; }
.language-control select { min-width: 88px; padding: 8px 24px 8px 10px; border: 1px solid var(--event-line); border-radius: 0; background: white; color: var(--event-ink); font: inherit; font-size: 12px; }
.page-intro { position: relative; min-height: 360px; padding: 70px 10.5% 30px; display: flex; flex-direction: column; justify-content: center; overflow: hidden; background: #82dce5; }
.page-intro::after { position: absolute; top: 0; right: 12%; width: 1px; height: 70%; content: ""; background: var(--event-blue); }
.intro-copy { position: relative; z-index: 1; max-width: 780px; animation: rise-in .65s ease both; }
.eyebrow { display: flex; align-items: center; gap: 12px; margin: 0 0 22px; color: var(--event-blue-deep); font-size: 10px; font-weight: 600; letter-spacing: 2.6px; }
.eyebrow span:first-child { width: 35px; height: 1px; background: var(--event-plum); }
.page-intro h1 { margin: 0; color: var(--event-plum); font-family: Georgia, "Songti SC", serif; font-size: 66px; font-weight: 400; line-height: 1.12; }
.intro-description { max-width: 590px; margin: 18px 0 0; color: #5d565a; font-size: 16px; line-height: 1.9; }
.index-link { position: absolute; z-index: 1; right: 10.5%; bottom: 65px; display: inline-flex; align-items: center; gap: 14px; color: var(--event-plum); font-size: 12px; letter-spacing: .5px; }
.index-link span:last-child { display: grid; width: 32px; height: 32px; place-items: center; border: 1px solid var(--event-blue-deep); border-radius: 50%; font-size: 16px; transition: color .2s, background .2s; }
.index-link:hover span:last-child { color: white; background: var(--event-blue-deep); }
.intro-rule { position: relative; z-index: 1; display: flex; justify-content: space-between; margin-top: 54px; padding-top: 13px; border-top: 1px solid var(--event-line); color: #7c7479; font-size: 9px; letter-spacing: 2px; }
.event-section { padding: 86px 10.5% 98px; }
.sharing-section { background: #f3f8fa; }
.workshop-section { background: #fff; }
.other-section { background: #f7f3f5; }
.section-heading { display: grid; grid-template-columns: 185px minmax(0,1fr) auto; align-items: end; gap: 28px; margin-bottom: 36px; }
.section-number { align-self: start; padding-top: 11px; color: var(--event-blue-deep); font-size: 10px; font-weight: 600; letter-spacing: 2px; white-space: nowrap; }
.section-number span { padding: 0 5px; color: var(--event-plum); }
.section-title-wrap h2 { margin: 0; color: var(--event-plum); font-family: Georgia, "Songti SC", serif; font-size: 40px; font-weight: 400; line-height: 1.25; }
.section-title-wrap p { max-width: 620px; margin: 10px 0 0; color: #625a60; font-size: 14px; line-height: 1.9; }
.image-count { padding-bottom: 8px; color: #8b8187; font-size: 9px; letter-spacing: 1.5px; white-space: nowrap; }
.exhibition-gallery { width: 130%; margin-inline: -15%; display: grid; grid-template-columns: repeat(24, minmax(0,1fr)); grid-auto-rows: auto; gap: 14.625px; }
.exhibition-item, .sharing-gallery figure, .workshop-gallery figure, .other-feature { position: relative; min-width: 0; margin: 0; overflow: hidden; background: white; }
.exhibition-item { width: 70%; justify-self: center; }
.exhibition-item img { width: 100%; height: auto; display: block; object-fit: contain; background: #fff; transition: transform .55s cubic-bezier(.2,.65,.3,1); }
.exhibition-item:hover img, .sharing-gallery figure:hover img, .other-feature:hover img { transform: scale(1.025); }
.exhibition-item figcaption, .sharing-gallery figcaption, .workshop-gallery figcaption { position: absolute; right: 0; bottom: 0; left: 0; display: flex; justify-content: space-between; align-items: center; padding: 10px 12px; background: linear-gradient(transparent, rgba(30,20,28,.62)); color: white; font-size: 10px; letter-spacing: 1.1px; opacity: 0; transition: opacity .25s ease; }
.exhibition-item:hover figcaption, .sharing-gallery figure:hover figcaption, .workshop-gallery figure:hover figcaption { opacity: 1; }
.exhibition-item figcaption span, .sharing-gallery figcaption span, .workshop-gallery figcaption span { font-size: 8px; letter-spacing: 1px; }
.exhibition-item:nth-child(1) { grid-area: 1 / 7 / auto / span 3; }
.exhibition-item:nth-child(2) { grid-area: 1 / 10 / auto / span 3; }
.exhibition-item:nth-child(3) { grid-area: 1 / 13 / auto / span 3; }
.exhibition-item:nth-child(4) { grid-area: 1 / 16 / auto / span 3; }
.exhibition-item:nth-child(5) { grid-area: 2 / 7 / auto / span 4; }
.exhibition-item:nth-child(6) { grid-area: 2 / 11 / auto / span 4; }
.exhibition-item:nth-child(7) { grid-area: 2 / 15 / auto / span 4; }
.sharing-gallery { columns: 4 210px; column-gap: 21px; }
.sharing-gallery figure { display: inline-block; width: 80%; margin: 0 10% 21px; break-inside: avoid; }
.sharing-gallery img { width: 100%; height: auto; max-height: 540px; display: block; object-fit: contain; background: white; transition: transform .55s cubic-bezier(.2,.65,.3,1); }
.sharing-gallery .sharing-image-full img { max-height: none; }
.workshop-gallery { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 24px; align-items: start; }
.workshop-gallery figure { display: flex; flex-direction: column; }
.workshop-gallery figure:nth-child(2), .workshop-gallery figure:nth-child(3) { width: 80%; justify-self: center; }
.workshop-gallery img { width: 100%; height: auto; display: block; object-fit: contain; background: white; }
.workshop-gallery figcaption { position: static; padding: 12px 2px 0; background: none; color: var(--event-ink); opacity: 1; }
.image-unavailable { display: grid; min-height: 400px; place-items: center; background: #e7f2f7; }
.image-unavailable img { display: none; }
.image-unavailable::after { max-width: 80%; color: var(--event-plum); content: "图片暂时无法显示"; font-family: Georgia, "Songti SC", serif; font-size: 22px; line-height: 1.8; text-align: center; white-space: pre-line; }
.other-feature { display: grid; grid-template-columns: minmax(0,1.55fr) minmax(220px,.65fr); align-items: stretch; background: var(--event-plum); }
.other-feature img { width: 100%; height: 540px; display: block; object-fit: cover; transition: transform .55s cubic-bezier(.2,.65,.3,1); }
.other-feature figcaption { display: flex; flex-direction: column; justify-content: space-between; gap: 30px; padding: 30px; color: white; }
.other-feature figcaption span:first-child { color: #b9deee; font-size: 10px; letter-spacing: 2px; }
.other-feature figcaption span:last-child { max-width: 240px; font-family: Georgia, "Songti SC", serif; font-size: 28px; line-height: 1.55; }
.site-footer { min-height: 90px; padding: 22px 10.5%; display: flex; align-items: center; justify-content: space-between; gap: 20px; border-top: 1px solid var(--event-line); color: #746a70; font-size: 10px; letter-spacing: 1px; }
.footer-home { color: var(--event-plum); font-family: Georgia, "Songti SC", serif; font-size: 16px; }
.site-footer > a:last-child { color: var(--event-blue-deep); }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
@keyframes rise-in { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }

@media (max-width: 900px) {
  .site-header { min-height: auto; flex-wrap: wrap; gap: 8px 20px; padding: 10px 5%; }
  .site-nav { order: 3; width: 100%; justify-content: space-between; gap: 17px; }
  .language-control { margin-left: auto; }
  .page-intro, .event-section { padding-right: 6%; padding-left: 6%; }
  .index-link { right: 6%; }
  .section-heading { grid-template-columns: 130px minmax(0,1fr) auto; gap: 18px; }
  .exhibition-gallery { width: 100%; margin-inline: 0; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }
  .exhibition-item:nth-child(n) { grid-column: span 1; grid-row: auto; }
  .sharing-gallery { columns: 3 190px; column-gap: 21px; }
}
@media (max-width: 640px) {
  .site-header { min-height: 68px; flex-wrap: wrap; gap: 8px 14px; padding: 10px 5%; }
  .brand-mark { width: 36px; height: 36px; }
  .brand-copy strong { font-size: 13px; }
  .brand-copy small { font-size: 8px; }
  .site-nav { order: 3; width: 100%; justify-content: space-between; gap: 10px; overflow-x: auto; font-size: 11px; }
  .language-control { margin-left: auto; }
  .language-control select { min-width: 78px; padding: 7px 16px 7px 7px; font-size: 11px; }
  .page-intro { min-height: 320px; padding: 54px 7% 24px; }
  .page-intro::after { right: 8%; height: 54%; }
  .page-intro h1 { font-size: 48px; }
  .intro-description { max-width: 90%; font-size: 14px; }
  .intro-rule { margin-top: 38px; font-size: 8px; letter-spacing: 1px; }
  .index-link { right: 7%; bottom: 74px; font-size: 10px; }
  .index-link span:last-child { width: 28px; height: 28px; }
  .event-section { padding: 62px 7% 68px; }
  .section-heading { grid-template-columns: 1fr auto; gap: 12px; margin-bottom: 26px; }
  .section-number { grid-column: 1 / -1; padding: 0; }
  .section-title-wrap h2 { font-size: 34px; }
  .section-title-wrap p { margin-top: 7px; font-size: 13px; }
  .image-count { align-self: start; padding-top: 6px; font-size: 8px; }
  .exhibition-gallery { width: 100%; margin-inline: 0; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 9.75px; }
  .exhibition-item:nth-child(n) { grid-column: span 1; }
  .exhibition-item:nth-child(n) { grid-row: auto; }
  .exhibition-item figcaption, .sharing-gallery figcaption, .workshop-gallery figcaption { opacity: 1; padding: 8px; font-size: 9px; }
  .sharing-gallery { columns: 2; column-gap: 14px; }
  .sharing-gallery figure { margin-bottom: 14px; }
  .workshop-gallery { grid-template-columns: 1fr; gap: 24px; }
  .image-unavailable { min-height: 270px; }
  .other-feature { grid-template-columns: 1fr; }
  .other-feature img { height: 340px; }
  .other-feature figcaption { min-height: 150px; padding: 20px; }
  .other-feature figcaption span:last-child { font-size: 24px; }
  .site-footer { min-height: 80px; padding: 20px 7%; flex-wrap: wrap; font-size: 9px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}