#detailModal {
            position: fixed;
            inset: 0;
            margin: auto;
            width: min(920px, calc(100% - 32px));
            max-width: 920px;
            max-height: min(88vh, 900px);
            padding: 0;
            border: 0;
            border-radius: 16px;
            overflow: hidden;
        }
        #detailModal[open] {
            display: block;
        }
        #detailModal::backdrop {
            background: rgba(15, 23, 42, 0.68);
            backdrop-filter: blur(3px);
        }
        .card-focus:focus-visible {
            outline: 3px solid rgba(37, 99, 235, 0.35);
            outline-offset: 3px;
        }

.works-list { min-height: 60vh; }
.works-list img, #detailModal img { height: 100%; }

/* Generated illustrative event photo; replace with an approved project photo when available. */
.works-hero{
    min-height:340px;
    display:flex;
    align-items:center;
    color:#fff;
    background-color:var(--ink);
    background-image:linear-gradient(90deg,rgba(6,19,37,.45),rgba(6,19,37,.18)),url('works-hero.png');
    background-position:center;
    background-size:cover;
}
.works-hero-inner{width:100%;max-width:1152px;margin:0 auto;padding:48px 24px}
.works-page-en{font-family:Impact,"Arial Narrow","Helvetica Neue",sans-serif;font-size:64px;font-weight:900;letter-spacing:.035em;line-height:1.05;margin:0 0 8px}
.works-hero h1{font-size:26px;font-weight:700;letter-spacing:.12em;line-height:1.5;margin:0 0 24px}
.works-page-description{font-size:15px;line-height:1.9;letter-spacing:.035em;margin:0;text-shadow:0 1px 4px #061325}
.works-breadcrumb{max-width:1152px;margin:0 auto;padding:20px 24px 0;font-size:12px;color:#657385}
.works-breadcrumb ol{display:flex;align-items:center;flex-wrap:wrap;gap:12px;list-style:none;padding:0;margin:0}
.works-breadcrumb li+li::before{content:'›';color:#8795a6;margin-right:12px}
.works-breadcrumb a{color:var(--blue);transition:color .2s}
.works-breadcrumb a:hover{text-decoration:underline;text-underline-offset:3px}
@media(max-width:760px){
    .works-hero{min-height:300px;background-position:62% center;background-image:linear-gradient(90deg,rgba(6,19,37,.8),rgba(6,19,37,.45)),url('works-hero.png')}
    .works-hero-inner{padding:36px 24px}
    .works-page-en{font-size:48px}
    .works-hero h1{font-size:22px;margin-bottom:20px}
    .works-page-description{font-size:13px;line-height:1.9}
    .works-page-description br{display:none}
    .works-breadcrumb{padding:18px 16px 2px}
}