/* Case details: the square visual and its story share the first view. */
.seri-project-page{max-width:1440px;margin-inline:auto;padding:0 var(--gutter) 72px}
.seri-project-page>.breadcrumb{padding:24px 0;gap:10px;font-size:11px;margin:0;max-width:none}
.seri-case-layout{display:grid;gap:28px;max-width:680px;margin:12px auto 0}
.seri-case-layout.has-visual{max-width:none;grid-template-columns:minmax(0,1.18fr) minmax(0,1fr);grid-template-rows:auto 1fr;grid-template-areas:"visual heading" "visual details";column-gap:clamp(36px,4.5vw,76px);row-gap:26px;align-items:start}
.seri-case-heading{min-width:0;align-self:end;padding-top:36px}
.has-visual>.seri-case-heading{grid-area:heading}
.seri-case-heading .eyebrow{display:flex;align-items:center;gap:12px;margin:0 0 20px;font-size:10px;line-height:1.7;letter-spacing:.06em}
.seri-case-heading .eyebrow>span{color:var(--muted)}
.seri-case-heading h1{font-size:clamp(34px,3.1vw,48px);line-height:1.24;letter-spacing:-.04em;text-wrap:balance}
.seri-case-lede{font-size:15px;line-height:1.9;color:var(--muted);margin-top:24px;max-width:36em}
.seri-case-media{grid-area:visual;min-width:0;margin:0}
.seri-case-image{position:relative;display:block;aspect-ratio:1;background:#faf4ee;overflow:hidden}
.seri-case-image>img{width:100%;height:100%;object-fit:contain;max-height:none}
.seri-case-zoom{position:absolute;inset-inline-end:18px;bottom:18px;width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;background:var(--paper);color:var(--ink);transition:background .2s ease,color .2s ease}
.seri-case-zoom svg{display:block}
.seri-case-image:hover .seri-case-zoom{background:var(--ink);color:var(--white)}
.seri-case-media figcaption{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:4px 20px;min-height:44px;padding-top:6px;font-size:11px;line-height:1.7;color:var(--muted)}
.seri-case-media figcaption>a{display:inline-flex;align-items:center;gap:10px;min-height:36px;color:var(--ink)}
.seri-case-media figcaption>a:hover{text-decoration:underline;text-underline-offset:4px}
.seri-case-media figcaption>p{flex-basis:100%;margin:0}
.seri-case-details{min-width:0}
.has-visual>.seri-case-details{grid-area:details}
.seri-case-details .seri-project-facts dl>div{padding:19px 0;border-top:1px solid var(--line);display:grid;gap:10px}
.seri-case-details .seri-project-facts dt{font-size:12px;margin:0;color:var(--muted)}
.seri-case-details .seri-project-facts dd{font-size:15px;line-height:1.8;min-width:0}
.seri-case-details .seri-project-tags{gap:8px;margin:0}
.seri-case-details .seri-project-tags li{padding:6px 12px;background:var(--surface);border:0;border-radius:4px;font-size:12px;line-height:1.65}
.seri-case-details .seri-project-client-logo{max-width:140px;object-fit:contain}
.seri-case-actions{margin-top:18px;padding-top:26px;border-top:1px solid var(--line)}
.seri-case-actions>.button{width:100%;min-height:52px;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:13px 20px;font-size:14px}
.seri-case-actions>p{margin-top:14px;font-size:12px;line-height:1.8;color:var(--muted);max-width:34em}
.seri-case-back{display:inline-flex;align-items:center;gap:12px;min-height:44px;font-size:12px;margin-top:16px}
.seri-case-back:hover{text-decoration:underline;text-underline-offset:4px}
.seri-project-page>.seri-project-story{padding:0;margin:60px 0 0;max-width:none;border-top:1px solid var(--line)}
.seri-project-chapter{grid-template-columns:minmax(0,1fr) minmax(0,1.45fr);gap:clamp(24px,5vw,80px);padding:36px 0}
.seri-project-chapter h2{font-size:clamp(26px,2.4vw,34px)}
.seri-project-page>.seri-project-content{padding:42px 0;max-width:800px}
.seri-project-page>.seri-project-gallery{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:clamp(30px,5vw,80px);padding:40px 0 0;margin-top:52px;border-top:1px solid var(--line)}
.seri-project-gallery>header{padding-top:12px}
.seri-project-gallery h2{font-size:clamp(28px,2.7vw,38px);max-width:10em;line-height:1.35}
.seri-project-gallery>div{margin:0;gap:22px;grid-template-columns:repeat(2,minmax(0,1fr))}
.seri-project-gallery>div>figure:only-child{grid-column:1/-1}
.seri-project-gallery figure{min-width:0}
.seri-project-gallery figure>a{display:block}
.seri-project-page>.seri-project-sample-photos{max-width:none;padding:0;margin:48px 0 0}
.seri-project-sample-photos summary{min-height:88px}
.seri-project-sample-photos summary .eyebrow{font-size:10px}
.seri-project-sample-content>div{max-width:900px}
.seri-project-page>.seri-project-return{padding:28px 0 0;margin:48px 0 0;border-top:1px solid var(--line);max-width:none}
@media(min-width:861px){
 .seri-project-page:lang(zh-Hant) .seri-case-heading h1,.seri-project-page:lang(zh-TW) .seri-case-heading h1{max-width:10em}
}
@media(max-width:1100px) and (min-width:861px){
 .seri-case-heading{padding-top:12px}
 .seri-case-heading h1{font-size:34px}
 .seri-case-lede{margin-top:18px;font-size:14px}
 .seri-case-layout.has-visual{column-gap:32px;row-gap:20px}
 .seri-case-actions{margin-top:10px;padding-top:20px}
}
@media(max-width:860px){
 .seri-project-page{max-width:720px;padding-bottom:44px}
 .seri-project-page>.breadcrumb{padding:20px 0 14px;font-size:10px;gap:7px}
 .seri-case-layout.has-visual{grid-template-columns:minmax(0,1fr);grid-template-rows:auto;grid-template-areas:"heading" "visual" "details";gap:22px}
 .seri-case-heading{padding:0}
 .seri-case-heading .eyebrow{font-size:9px;margin-bottom:14px}
 .seri-case-heading h1{font-size:clamp(30px,6vw,42px);max-width:16em;text-wrap:initial}
 .seri-case-lede{margin-top:16px;font-size:14px;line-height:1.8}
 .seri-case-details .seri-project-facts dl>div{padding:16px 0;grid-template-columns:minmax(76px,.3fr) minmax(0,1fr);gap:16px;align-items:start}
 .seri-case-details .seri-project-facts dt{padding-top:6px}
 .seri-case-actions{margin-top:10px;padding-top:20px}
 .seri-case-back{margin-top:10px}
 .seri-project-page>.seri-project-story{margin-top:32px}
 .seri-project-chapter{grid-template-columns:1fr;gap:18px;padding:28px 0}
 .seri-project-page>.seri-project-gallery{grid-template-columns:1fr;gap:24px;margin-top:30px;padding-top:26px}
 .seri-project-gallery>header{padding:0}
 .seri-project-gallery>header .eyebrow{margin-bottom:14px}
 .seri-project-gallery>div{gap:18px}
 .seri-project-page>.seri-project-sample-photos{margin-top:30px}
 .seri-project-page>.seri-project-return{margin-top:30px;padding-top:24px;gap:14px}
}
@media(max-width:400px){
 .seri-case-zoom{inset-inline-end:12px;bottom:12px;width:38px;height:38px}
 .seri-case-media figcaption{font-size:10px;gap:4px 8px}
 .seri-case-details .seri-project-facts dl>div{grid-template-columns:1fr;gap:8px}
 .seri-case-details .seri-project-facts dt{padding-top:0}
 .seri-project-gallery>div{grid-template-columns:1fr}
 .seri-project-return .button{width:100%;justify-content:space-between}
}
@media(prefers-reduced-motion:reduce){.seri-case-zoom{transition:none}}
