.partnership-section,
.drama-performance,
.drama-library { scroll-margin-top: 108px; }

.partnership-section {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  align-items: center;
  gap: 64px;
}

.partnership-section h2,
.drama-performance h2,
.drama-library h2 {
  font-size: 52px;
  line-height: 1.2;
}

.partnership-copy > p:last-child {
  max-width: 540px;
  margin-top: 24px;
  font-size: 17px;
  color: #c8c0b3;
  line-height: 1.9;
}

.partnership-logos {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 26px;
}

.partnership-logos img {
  width: 40%;
  height: 64px;
  object-fit: contain;
}

.partnership-logos span { color: #8e8b84; font-size: 22px; }
.drama-performance { border-top: 1px solid var(--line); }
.performance-metrics { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; margin: 0 0 36px; }
.performance-metrics > div { padding: 28px 32px; background: #8fa18a; color: #141815; border-radius: 6px; }
.performance-metrics > div:nth-child(2) { background: #b7a57d; color: #1d1911; }
.performance-metrics > div:nth-child(3) { background: #a68d90; color: #201619; }
.performance-metrics dt { font-size: 16px; font-weight: 700; margin-bottom: 24px; }
.performance-metrics dd { margin: 0; font-size: 66px; font-weight: 700; line-height: 1.1; white-space: nowrap; font-variant-numeric: tabular-nums; }
.performance-metrics dd span { font-size: 28px; margin-left: 8px; }
.performance-metrics dd small { font-size: 22px; margin-right: 8px; }
.performance-rows { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.performance-rows h3 { font-size: 18px; margin: 0 0 12px; }
.performance-rows p { color: #bfb7ac; font-size: 14px; margin-bottom: 14px; }
.performance-rows strong { color: var(--white); font-size: 20px; margin-left: 8px; }
.performance-bar { display: block; height: 4px; background: #f5f2eb15; }
.performance-bar::after { content: ''; display: block; width: var(--bar-width); height: 100%; background: var(--bar-color); }
.performance-note { max-width: 920px; margin: 26px 0 0; color: #a49e94; font-size: 13px; line-height: 1.9; }
.drama-library { padding-top: 50px; }
.drama-filters { display: flex; flex-wrap: wrap; gap: 24px; border-bottom: 1px solid var(--line); padding-bottom: 16px; margin-bottom: 44px; }
.drama-filters button { position: relative; border: 0; background: transparent; padding: 10px 0; font: 700 16px 'Microsoft YaHei', '微软雅黑', sans-serif; color: #a49e94; cursor: pointer; }
.drama-filters button[aria-pressed='true'] { color: var(--white); }
.drama-filters button[aria-pressed='true']::after { content: ''; position: absolute; left: 0; bottom: -17px; height: 2px; width: 100%; background: var(--red-2); }
.drama-group { margin-bottom: 80px; }
.drama-group[hidden] { display: none; }
.drama-group-head { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 28px; }
.drama-group-head h3 { margin: 0; font-size: 28px; }
.drama-group-head > span { color: var(--muted); font-size: 14px; }
.drama-project-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 44px 32px; align-items: start; }
.drama-project { min-width: 0; }
.drama-project-images { display: grid; gap: 12px; }
.drama-image-button { display: block; width: 100%; padding: 0; border: 0; background: transparent; cursor: zoom-in; line-height: 0; }
.drama-image-button img { display: block; width: 100%; height: auto; border-radius: 6px; }
.drama-project-copy { padding-top: 22px; }
.drama-project h4 { font-size: 23px; line-height: 1.55; margin: 0 0 14px; font-weight: 700; overflow-wrap: anywhere; }
.drama-project-tags { display: flex; flex-wrap: wrap; gap: 8px 14px; list-style: none; margin: 0 0 18px; padding: 0; font-size: 13px; line-height: 1.7; color: #c69a86; }
.drama-project-tags li + li { position: relative; }
.drama-project-copy > p { font-size: 15px; line-height: 1.95; color: #bdb5a9; margin: 0; }
[data-drama-group='upcoming'] .drama-project-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 48px; }
[data-drama-group='upcoming'] .drama-project-portrait { display: grid; grid-template-columns: 0.9fr 1fr; gap: 24px; }
[data-drama-group='upcoming'] .drama-project-portrait .drama-project-copy { padding-top: 0; }
[data-drama-group='cg'] .drama-project-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 52px 32px; }
[data-drama-group='cg'] .drama-project-images { grid-template-columns: repeat(2, minmax(0, 1fr)); }
[data-drama-group='cg'] .drama-image-button:first-child { grid-column: 1 / -1; }
[data-drama-group='cg'] .drama-image-button:nth-child(2):last-child { grid-column: 1 / -1; }
.case-image-open { overflow: hidden; }
.case-image-dialog { width: 100vw; max-width: none; height: 100dvh; max-height: none; border: none; padding: 52px 24px 24px; margin: 0; background: #080808ed; }
.case-image-dialog[open] { display: flex; align-items: center; justify-content: center; }
.case-image-dialog::backdrop { background: #030303d9; }
.case-image-dialog > img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
.case-image-close { position: absolute; top: 14px; right: 24px; width: 40px; height: 40px; border: none; background: #ffffff10; color: #fff; font-size: 30px; line-height: 1; cursor: pointer; border-radius: 4px; }
.drama-filters button:focus-visible,
.drama-image-button:focus-visible,
.case-image-close:focus-visible { outline: 2px solid var(--red-2); outline-offset: 5px; }
@media (max-width: 1080px) {
  .partnership-section { grid-template-columns: 1fr; gap: 32px; }
  .partnership-logos { justify-content: flex-start; max-width: 480px; }
  .performance-metrics > div { padding: 24px; }
  .performance-metrics dd { font-size: 48px; }
  .performance-metrics dd span { font-size: 22px; }
  .drama-project-grid { gap: 32px 24px; }
  [data-drama-group='upcoming'] .drama-project-portrait { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .partnership-section h2,
  .drama-performance h2,
  .drama-library h2 { font-size: 34px; }
  .partnership-section { padding-top: 64px; }
  .partnership-copy > p:last-child { font-size: 15px; }
  .partnership-logos { gap: 20px; }
  .performance-metrics { gap: 10px; }
  .performance-metrics > div { padding: 18px 12px; }
  .performance-metrics dt { font-size: 12px; line-height: 1.5; min-height: 36px; margin-bottom: 12px; }
  .performance-metrics dd { font-size: 26px; white-space: normal; }
  .performance-metrics dd span { font-size: 14px; margin-left: 2px; }
  .performance-metrics dd small { font-size: 13px; margin-right: 2px; }
  .performance-rows { grid-template-columns: 1fr; gap: 24px; }
  .performance-rows > div { display: grid; grid-template-columns: 1fr auto; gap: 12px; align-items: baseline; }
  .performance-rows h3 { font-size: 15px; margin: 0; }
  .performance-rows p { margin: 0; font-size: 12px; }
  .performance-rows strong { font-size: 16px; margin-left: 4px; }
  .performance-bar { grid-column: 1 / -1; }
  .performance-note { font-size: 12px; }
  .drama-filters { gap: 18px; margin-bottom: 30px; }
  .drama-filters button { font-size: 13px; }
  .drama-group-head h3 { font-size: 24px; }
  .drama-project-grid,
  [data-drama-group='upcoming'] .drama-project-grid,
  [data-drama-group='cg'] .drama-project-grid { grid-template-columns: 1fr; gap: 44px; }
  .drama-project-portrait .drama-image-button img { width: auto; max-width: 100%; max-height: 480px; margin: 0 auto; }
  [data-drama-group='upcoming'] .drama-project-portrait { grid-template-columns: 1fr; gap: 20px; }
  .drama-project h4 { font-size: 22px; }
}
