.case-page{background:var(--paper)}
.case-page .site-header{background:rgba(6,25,35,.95)}
.case-hero{padding:160px 0 88px;background:linear-gradient(135deg,#061923,#113843);color:#fff}
.case-breadcrumb{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:48px;color:#c9d9db;font-size:14px}
.case-breadcrumb a:hover{color:#deb26e}
.case-label{margin:0 0 14px;color:#deb26e;font-weight:700;letter-spacing:.06em}
.case-hero h1{max-width:1050px;margin:0;font-size:clamp(39px,5.6vw,72px);line-height:1.22}
.case-summary{max-width:850px;margin:25px 0;color:#e1e9e7;font-size:19px;line-height:1.9}
.case-date{margin:25px 0 0;color:#c9d9db;font-size:14px;line-height:1.8}
.case-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,325px);gap:78px;align-items:start;padding-top:88px;padding-bottom:110px}
.case-content section+section{margin-top:72px;padding-top:65px;border-top:1px solid var(--line-light)}
.case-content h2{margin:0 0 23px;font-size:clamp(30px,3vw,42px);line-height:1.3}
.case-content p{margin:0 0 18px;color:#334850;font-size:17px;line-height:1.95}
.case-content a{color:#087a9b;text-decoration:underline;text-underline-offset:4px}
.case-steps{list-style:decimal;margin:0;padding-left:27px}
.case-steps li{padding:0 0 24px 10px}
.case-steps strong{display:block;margin-bottom:7px;font-size:21px}
.case-steps li p{margin:0}
.case-qa{margin-top:24px;padding:23px 26px;background:#f1eee5;border-left:3px solid var(--gold)}
.case-qa h3{margin:0 0 10px;font-size:20px}
.case-qa p{margin:0}
.case-side{position:sticky;top:110px;padding:31px 29px;background:#e9e6dc;border-top:4px solid var(--gold)}
.case-side h2{margin:0 0 20px;font-size:25px}
.case-side dl{margin:0 0 24px}
.case-side dl div{padding:15px 0;border-bottom:1px solid #cfcac0}
.case-side dt{font-size:13px;color:#586d72}
.case-side dd{margin:7px 0 0;font-size:17px;line-height:1.6;font-weight:700}
@media(max-width:860px){.case-layout{grid-template-columns:1fr;gap:48px}.case-side{position:static}}
@media(max-width:600px){.case-hero{padding:126px 0 62px}.case-breadcrumb{margin-bottom:36px}.case-summary{font-size:16px}.case-layout{padding-top:63px;padding-bottom:75px}.case-content section+section{margin-top:50px;padding-top:48px}.case-content p{font-size:16px}.case-qa{padding:20px}}
.case-opening{margin-top:36px;margin-bottom:0}
.case-opening img,.case-picture img,.case-gallery img{display:block;width:100%;height:auto}
.case-opening figcaption,.case-picture figcaption,.case-gallery figcaption,.case-rehearsal figcaption{margin-top:12px;color:#51666d;font-size:14px;line-height:1.7}
.case-picture{margin:34px 0 0}
.case-gallery{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}
.case-gallery figure{margin:0}
.case-rehearsal{margin:35px 0 0}
.case-rehearsal video{display:block;width:auto;max-width:100%;max-height:540px;background:#061923}
@media(max-width:600px){.case-opening{margin-top:20px}.case-gallery{grid-template-columns:1fr}.case-rehearsal video{margin:auto}}

.case-related-links{display:grid;gap:11px;margin-top:22px}
.case-related-links a{display:flex;justify-content:space-between;gap:16px;padding:15px 19px;background:#edf2ef;color:#0a4653;text-decoration:none;border-left:3px solid var(--gold);font-weight:700}
.case-related-links a:hover{background:#e1e9e4}
/* National Day case pages */
.oct-case-opening{margin:38px auto 0}.oct-case-opening img{display:block;width:100%;height:auto;border-radius:7px}
.oct-case-opening figcaption,.oct-case-video figcaption{color:#51666d;font-size:14px;line-height:1.7;margin-top:12px}
.oct-case-video{margin:30px 0 0}.oct-case-video video{display:block;width:100%;height:auto;max-width:920px;background:#061923;border-radius:7px}
.oct-case-related{display:grid;gap:12px;margin-top:28px}.oct-case-related a{display:block;padding:12px 16px;background:#f1eee5;border-radius:5px}
.oct-case-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
@media(max-width:600px){.oct-case-opening{margin-top:22px}.oct-case-cta .button{width:100%;text-align:center}}
/* Mobile video frame refresh 2026-10-07 */
.oct-case-video video,.case-rehearsal video{border-radius:0;clip-path:none;-webkit-clip-path:none;object-fit:contain;-webkit-touch-callout:none}
.oct-case-video video.oct-video-active,.case-rehearsal video.oct-video-active{transform:translateZ(0);-webkit-transform:translateZ(0)}
.oct-video-fullscreen{display:inline-block;margin-left:8px;padding:5px 10px;border:1px solid #087a9b;border-radius:4px;background:transparent;color:#087a9b;font:700 14px/1.4 system-ui,"Microsoft YaHei",sans-serif;cursor:pointer}
@media(max-width:600px){.oct-video-fullscreen{display:block;margin:10px 0 0}}
