/* The approved cinematic theme, with bilingual navigation and readable capability guides. */
:root { --font: 'DM Sans','Noto Sans SC','Microsoft YaHei',Arial,sans-serif; --display: 'Space Grotesk','Noto Sans SC','Microsoft YaHei',Arial,sans-serif; }
.language-switch { display:flex; gap:2px; padding:3px; border:1px solid #ffffff45; border-radius:4px; flex-shrink:0; }
.language-switch button { min-width:36px; min-height:36px; padding:5px 7px; font-size:12px; color:#cbd0da; border-radius:2px; }
.language-switch button[aria-pressed="true"] { background:#f5f5f3; color:#08090b; }
.language-switch button:hover { box-shadow:inset 0 0 0 1px #f04a3a; }
.site-header { gap:24px; }
.desktop-nav { gap:28px; }
.header-cta { gap:16px; }
.selected-work { scroll-margin-top:100px; }
.work-intro h2 { max-width:780px; }
.work-tabs { grid-template-columns:repeat(4,minmax(0,1fr)); }
.work-tabs button { min-height:58px; padding:16px 18px; font-size:15px; line-height:1.4; border-color:#ffffff50; }
.work-tabs button[aria-selected="true"] { color:#fff; border-color:#f04a3a; background:#f04a3a16; }
.work-panel { grid-template-columns:minmax(0,1fr); gap:32px; }
.work-copy { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:36px; align-items:start; }
.work-copy h3 { font-size:clamp(30px,3.2vw,50px); max-width:630px; margin:0; line-height:1.16; }
.work-copy .work-description { max-width:640px; margin:0; font-size:17px; line-height:1.75; }
.work-copy .text-link { margin-top:18px; }
.work-category { color:#f5aaa1; font-size:12px; margin-bottom:14px; }
.work-features { margin-top:18px; }
.capability-figure { border-color:#8995a5; background:#0d151e; }
.capability-link { display:block; overflow:hidden; }
.capability-link:after { display:none; }
.capability-link img { display:block; width:100%; height:auto; aspect-ratio:8/5; object-fit:contain; object-position:center; transform:none!important; }
.capability-view { display:flex; align-items:center; justify-content:flex-end; gap:12px; min-height:48px; padding:12px 20px; border-top:1px solid #728296; color:#f5f7fa; font-size:14px; }
.capability-link:hover .capability-view,.capability-link:focus-visible .capability-view { background:#233347; color:#fff; text-decoration:underline; }
.capability-figure figcaption { padding:14px 20px; gap:16px; flex-wrap:wrap; color:#b8c2d0; line-height:1.6; }
.capability-figure figcaption a { color:#f3f6fb; text-decoration:underline; text-underline-offset:4px; min-height:30px; }
.capability-figure figcaption a:hover { color:#ff9b8f; }
.work-disclosure { max-width:900px; }
#work-lightbox { width:min(1500px,calc(100vw - 40px)); max-height:calc(100svh - 40px); padding:0; border:1px solid #8995a5; background:#0b1119; }
.lightbox-bar { position:sticky; top:0; background:#0b1119; z-index:1; padding:18px 24px; }
.lightbox-bar h2 { color:#f6f7fa; font-size:20px; letter-spacing:0; }
.lightbox-bar p { color:#b7c4d3; }
.lightbox-body { overflow:auto; }
#lightbox-image { display:block; width:auto; max-width:100%; height:auto; max-height:calc(100svh - 210px); margin:auto; object-fit:contain; }
.lightbox-actions { display:flex; gap:16px; justify-content:space-between; align-items:center; padding:16px 24px; border-top:1px solid #536579; color:#b9c4d1; font-size:13px; line-height:1.6; }
.lightbox-actions a { display:inline-flex; gap:12px; align-items:center; min-height:44px; color:#fff; text-decoration:underline; text-underline-offset:4px; flex-shrink:0; }
.site-footer nav { display:flex; flex-wrap:wrap; gap:14px 24px; }
.site-footer nav a { min-height:32px; display:inline-flex; align-items:center; }
.enquiry-intro .back-link { display:flex; width:fit-content; }
html[lang="zh-CN"] .scene h1,html[lang="zh-CN"] .scene h2 { font-size:clamp(58px,5.6vw,100px); line-height:1.2; letter-spacing:0; font-weight:450; }
html[lang="zh-CN"] .work-intro h2,html[lang="zh-CN"] .enquiry h2 { letter-spacing:0; line-height:1.2; }
html[lang="zh-CN"] .work-copy h3 { letter-spacing:0; }
html[lang="zh-CN"] .eyebrow { letter-spacing:.08em; }
@media(max-width:900px) {
 .desktop-nav { gap:18px; font-size:13px; }
 .site-header { gap:16px; }
 .work-tabs button { font-size:13px; padding:14px 12px; }
 .work-copy { grid-template-columns:1fr; gap:20px; }
 .work-copy h3 { font-size:36px; }
}
@media(max-width:700px) {
 .site-header { gap:10px; }
 .wordmark img { width:112px; }
 .language-switch { margin-left:auto; }
 .language-switch button { min-width:31px; min-height:36px; padding:4px; }
 .header-cta { margin-left:0; padding:9px 10px; gap:10px; min-height:44px; }
 .header-cta span { font-size:17px; }
 .work-intro { gap:22px; }
 .work-tabs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); overflow:visible; gap:8px; }
 .work-tabs button { min-width:0; min-height:52px; font-size:13px; }
 .work-copy h3 { font-size:30px; }
 .work-copy .work-description { font-size:16px; line-height:1.75; }
 .work-panel { gap:24px; }
 .capability-view { padding:10px 14px; font-size:13px; }
 .capability-figure figcaption { padding:12px 14px; font-size:11px; gap:8px; }
 #work-lightbox { width:calc(100vw - 16px); max-height:calc(100svh - 24px); }
 .lightbox-bar { padding:14px; }
 .lightbox-bar h2 { font-size:17px; line-height:1.4; }
 .lightbox-actions { padding:12px 14px; flex-wrap:wrap; gap:4px; }
 .lightbox-actions a { width:100%; }
 .site-footer { align-items:flex-start; gap:24px; }
 .site-footer nav { gap:8px 20px; }
 html[lang="zh-CN"] .scene h1,html[lang="zh-CN"] .scene h2 { font-size:clamp(40px,10.5vw,65px); line-height:1.2; }
 html[lang="zh-CN"] .work-intro h2,html[lang="zh-CN"] .enquiry h2 { font-size:clamp(37px,10vw,54px); }
}
@media(max-width:380px) {
 .site-header { padding-inline:16px; gap:8px; }
 .wordmark img { width:100px; }
 .header-cta { font-size:11px; padding:9px; }
 .header-cta span { display:none; }
 .language-switch button { min-width:30px; }
}
@media(max-height:520px) and (orientation:landscape) {
 html[lang="zh-CN"] .scene h1,html[lang="zh-CN"] .scene h2 { font-size:clamp(32px,5vw,48px); }
}