/* 管理展示采用左图右文，与 TSAD 形成相反的阅读节奏 */
.management-section { --management-pattern-opacity: .42; position: relative; isolation: isolate; overflow: clip; padding: calc(54 * var(--u)) 0 calc(49 * var(--u)); border-top: 1px solid #eef4f8; background: linear-gradient(145deg, #ffffff, #fbfdff 65%, #f7fbfe); font-family: var(--font); }
.management-section::before { content: ""; position: absolute; z-index: -1; inset: 0; background: linear-gradient(28deg, transparent 27%, #d7ebfa99 27%, #e4f3fc80 46%, transparent 46%); opacity: var(--management-pattern-opacity); pointer-events: none; }
.management-section::after { content: ""; position: absolute; z-index: -1; inset: 0; background: linear-gradient(154deg, transparent 78%, #ddf0fc99 78%, #edf8fe66 93%, transparent 93%); opacity: .32; pointer-events: none; }
.management-inner { width: var(--content-width); margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1.42fr) minmax(0, .98fr); grid-template-areas: "visual copy"; align-items: center; gap: calc(44 * var(--u)); }
.management-copy { grid-area: copy; min-width: 0; }
.management-copy h2 { color: var(--ink); font-size: var(--section-title); line-height: 1.4; font-weight: 700; letter-spacing: 0; }
.management-copy h2 span { display: block; white-space: nowrap; }
.management-intro { margin-top: var(--heading-subtitle-gap); color: var(--body-ink); font-size: var(--section-subtitle); line-height: 1.7; font-weight: 400; letter-spacing: 0; text-wrap: pretty; }
.management-guides { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); justify-content: center; gap: calc(6 * var(--u)); width: max-content; max-width: 100%; margin: calc(22 * var(--u)) auto 0; padding: calc(2 * var(--u)); border: 1px solid #ffffffb8; border-radius: calc(6 * var(--u)); background: #f8fcffd1; box-shadow: 0 3px 13px #275c7c09; backdrop-filter: blur(7px); }
.management-guide { display: inline-flex; align-items: center; justify-content: center; min-width: 0; min-height: calc(27 * var(--u)); padding: calc(4 * var(--u)) calc(11 * var(--u)); border: 1px solid transparent; border-radius: calc(4 * var(--u)); color: #597b93; background: transparent; font-family: var(--font); font-size: var(--regulation-body-size); font-weight: 500; line-height: 1.5; letter-spacing: .015em; transition: color 250ms ease, background 250ms ease, border-color 250ms ease; }
.management-guide:hover, .management-guide[aria-pressed="true"] { color: #075174; border-color: #cce3f0; background: #ffffffd9; }
.management-guide:focus-visible { outline: 2px solid #4f99bd; outline-offset: 2px; }
.management-guide-heading { display: inline-flex; align-items: center; justify-content: center; gap: calc(5 * var(--u)); min-width: 0; }
.management-guide-icon { flex-shrink: 0; width: 1.1em; height: 1.1em; fill: none; stroke: currentColor; stroke-width: 2.24; stroke-linecap: round; stroke-linejoin: round; }
.management-guide-title { display: block; color: inherit; font: inherit; white-space: nowrap; }
.management-phrase { display: inline-block; white-space: nowrap; }
.management-visual { grid-area: visual; min-width: 0; position: relative; }
.management-visual::before { content: ""; position: absolute; left: 5%; right: 7%; bottom: calc(5 * var(--u)); height: calc(24 * var(--u)); border-radius: 50%; background: radial-gradient(ellipse, #164a6c1c, transparent 70%); filter: blur(calc(9 * var(--u))); pointer-events: none; }
.management-stack { position: relative; width: 100%; aspect-ratio: 1.45; perspective: calc(1000 * var(--u)); }
.management-stack-card { position: absolute; z-index: var(--card-order, 1); left: var(--card-left); top: var(--card-top); width: 80%; padding: 0; border: 0; background: transparent; color: var(--blue-900); text-align: left; font: inherit; }
.management-stack-card:nth-child(1) { --card-order: 3; }
.management-stack-card:nth-child(2) { --card-order: 2; }
.management-card-surface { position: relative; display: block; padding: calc(5 * var(--u)); border: 1px solid #d7e6ef; border-radius: calc(10 * var(--u)); background: linear-gradient(140deg, #ffffff, #eaf2f8); box-shadow: 2px 3px 0 #b8ccd855, 0 calc(7 * var(--u)) calc(19 * var(--u)) #164e7418, inset 0 0 0 1px white; transform: perspective(calc(900 * var(--u))) rotateY(-16deg); transform-origin: 100% 50%; transition: transform 850ms cubic-bezier(.16,1,.3,1), box-shadow 700ms ease, border-color 500ms ease; pointer-events: none; }
.management-stack-card.is-front .management-card-surface { transform: translate(calc(-5 * var(--u)), calc(-10 * var(--u))) perspective(calc(900 * var(--u))) rotateY(-2deg); border-color: #b6d6e8; box-shadow: 2px 4px 0 #a9c4d45c, 0 calc(13 * var(--u)) calc(27 * var(--u)) #164e7426, inset 0 0 0 1px white; }
.management-stack-card.is-before .management-card-surface { transform: perspective(calc(900 * var(--u))) rotateY(-6deg); }
.management-card-heading { position: relative; display: flex; align-items: center; height: calc(22 * var(--u)); padding: 0 calc(7 * var(--u)) calc(3 * var(--u)); color: #698297; font-size: calc(var(--type-aux-size) * var(--u)); font-weight: 500; line-height: 1.4; letter-spacing: .02em; }
.management-card-heading::before { content: ""; flex: 0 0 calc(3 * var(--u)); width: calc(3 * var(--u)); height: .85em; margin-right: .6em; border-radius: 2px; background: #b8d0de; }
.management-stack-card.is-front .management-card-heading { color: #084f73; }
.management-stack-card.is-front .management-card-heading::before { background: #087599; }
.management-card-image { position: relative; display: block; width: 100%; aspect-ratio: 1672 / 941; overflow: hidden; border: 1px solid #dce7ef; border-radius: calc(5 * var(--u)); background: #f5f9fd; }
.management-card-image img { display: block; width: 100%; height: 100%; object-fit: contain; }
.management-card-side { position: absolute; top: 37%; right: calc(6 * var(--u)); display: block; padding: .7em .35em; border: 1px solid #d7e7f0; border-radius: calc(4 * var(--u)); background: #f8fcfff2; color: #426e89; font-size: calc(9 * var(--u)); line-height: 1.3; letter-spacing: .1em; writing-mode: vertical-rl; box-shadow: 0 2px 5px #164e7409; transition: opacity 350ms ease; }
.management-stack-card.is-before .management-card-side { left: calc(6 * var(--u)); right: auto; }
.management-stack-card.is-front .management-card-side { opacity: 0; }
.management-stack-card:focus-visible { outline: 2px solid #4f99bd; outline-offset: 4px; border-radius: calc(10 * var(--u)); }
.management-region { position: absolute; z-index: 2; pointer-events: none; opacity: 0; border: 1px solid #2096b9a6; border-radius: calc(4 * var(--u)); background: #5dbbd805; box-shadow: 0 0 0 2px #41a6c00a; }
[data-management-view="overall"] .management-region { left: 14.7%; top: 16.4%; width: 83.9%; height: 14.1%; }
[data-management-view="changes"] .management-region { left: 14.7%; top: 32%; width: 53.4%; height: 35.3%; }
[data-management-view="attention"] .management-region { left: 14.7%; top: 30.1%; width: 51.3%; height: 64.9%; }
[data-management-view="report"] .management-region { left: 14.7%; top: 17%; width: 83.9%; height: 21.6%; }
@media (max-width: 700px) {
  .management-section { padding: 40px 0 43px; }
  .management-inner { width: calc(100% - 44px); grid-template-columns: minmax(0, 1fr); grid-template-areas: "copy" "visual"; gap: 25px; }
  .management-copy h2 { font-size: var(--section-title); line-height: 1.4; }
  .management-intro { font-size: var(--section-subtitle); line-height: 1.7; }
  .management-guides { margin-top: 20px; gap: 2px; }
  .management-guide { min-height: 34px; padding: 5px 8px; }
  .management-stack { aspect-ratio: 1.32; perspective: 800px; }
  .management-card-surface { padding: 3px; border-radius: 7px; }
  .management-card-heading { font-size: 9px; height: 22px; padding-bottom: 3px; }
  .management-card-side { font-size: 9px; right: 4px; }
  .management-stack-card.is-before .management-card-side { left: 4px; }
  .management-stack-card.is-front .management-card-surface { transform: translate(-2px, -7px) perspective(800px) rotateY(-2deg); }
}
@media (prefers-reduced-motion: reduce) { .management-card-surface, .management-card-side, .management-guide { transition: none; } }
