/* Separate composition study. The original Work page remains untouched. */
body{overflow-x:clip}
/* A shared measured size keeps all six bilingual captions on one line. */
.card h2.bilingual-title{display:flex;align-items:baseline;flex-wrap:nowrap;column-gap:.35em;white-space:nowrap;font-size:var(--caption-size,20px)}
.bilingual-title .title-en{flex:none}
.card a[href="./statement-columns.html#iii"] .title-en{font-size:.92em}
.bilingual-title .title-ko{display:inline-flex;flex:none;align-items:baseline;gap:.55em;font:400 .6em/1.5 Maru,serif;letter-spacing:0;color:#b6aa8e;white-space:nowrap}
.bilingual-title .title-divider{font-family:Arial,sans-serif;font-weight:400;color:#756f61;font-size:.9em}
header,main,footer{max-width:1680px;margin-left:auto;margin-right:auto}
header{padding:12px 0}.name img{width:54px;height:54px}
main{padding:18px 0 64px}
.compare-bar{display:flex;justify-content:space-between;font:10px/1.6 Arial,sans-serif;color:#99968c;letter-spacing:.03em;margin-bottom:22px}
.compare-bar a{border-bottom:1px solid #555044;padding-bottom:3px}
.feature-link{display:block;min-height:0;overflow:hidden;background:#000}
.feature{width:100vw;margin-left:calc(50% - 50vw)}
/* Requested comparison: only the lamb panorama extends beyond the shared frame. */
@media(min-width:701px){main>.feature{width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}main>.feature .feature-copy{left:max(20px,calc((100% - 1151px)/2));right:max(20px,calc((100% - 1151px)/2))}}
.feature-link:before{display:block;inset:0;background:radial-gradient(ellipse at 17% 26%,rgba(0,0,0,.32) 0%,rgba(0,0,0,.18) 23%,transparent 43%),linear-gradient(90deg,rgba(0,0,0,.48) 0%,rgba(0,0,0,.18) 30%,transparent 49%);z-index:1}
.feature .hero{display:block;width:100%;height:auto;aspect-ratio:3120/1080;object-fit:contain;min-height:0;scale:1!important}
.feature-copy{position:absolute;top:16%;left:3%;right:3%;text-align:left;text-shadow:0 2px 16px #0008;padding:0;z-index:2}
.feature-copy h1{font-size:clamp(28px,2.8vw,44px);font-weight:400;line-height:1.08;letter-spacing:-.015em;max-width:none;margin:0 0 12px;color:#f1eee6}
.feature-copy .keywords{font:14px/1.7 Arial,sans-serif;max-width:none;margin:0;color:#d0c6b1;text-shadow:0 1px 8px #000}
.card h2{color:#e9e5dc}
.card p{color:#b6aa8e}
.grid{margin-top:30px;padding-top:30px;border-top:1px solid #49453c;column-gap:24px;row-gap:34px}
.card{min-width:0}.card>a{display:block;min-width:0}
/* One continuous divider in the middle of the desktop row gap. */
@media(min-width:1051px){
 .grid>.card:nth-child(4){position:relative}
 .grid>.card:nth-child(4):before{content:"";position:absolute;top:-17px;left:0;width:calc(300% + 48px);height:1px;background:#302e29;pointer-events:none}
}
.card-frame{width:100%;height:auto;aspect-ratio:1.6;background:#000;display:block}
.card-frame img{width:100%;height:100%;object-fit:cover;transform:none;max-width:100%}
.card h2{font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;font-size:clamp(23px,2.1vw,33px);line-height:1.15;margin:10px 0 5px;letter-spacing:-.015em}
.card p{font-size:12px;color:#b6aa8e;line-height:1.7}
.early-detail{width:100%;height:auto;aspect-ratio:1.6;margin:0;background:#000}
.early-detail img{position:absolute;width:400%;max-width:none;height:auto;left:-212%;top:-376%;object-fit:initial}
.card:last-child{display:block}
.card:last-child h2{margin-top:10px}
footer{display:flex;justify-content:space-between;gap:20px;line-height:1.6}
@media(min-width:701px) and (max-width:1050px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:1800px){header,main,footer{margin-left:3%;margin-right:3%}}
@media(max-width:1000px) and (min-width:701px){.card h2{font-size:23px}.feature-copy h1{font-size:28px}.grid{column-gap:18px}}
@media(max-width:700px){
 header{padding:10px 0}main{padding-top:16px}.compare-bar{font-size:9px;margin-bottom:20px}
 .feature-link{display:block;min-height:0}
 .feature-copy{position:relative;top:auto;left:auto;right:auto;padding:16px 5% 0;text-align:left}.feature-copy h1{font-size:clamp(24px,5vw,28px);margin-bottom:10px;max-width:none}
 .feature-copy .keywords{font-size:11px;margin:0;max-width:280px}
 /* Mobile frames the central window; desktop retains the complete panorama. */
 .feature .hero{height:auto;aspect-ratio:4/5;width:100%;object-fit:cover;object-position:50% 50%}
 .feature-link:before{display:none}
 .grid{margin-top:24px;padding-top:24px;grid-template-columns:1fr;row-gap:28px}
 .card-frame{height:auto;min-height:0;aspect-ratio:1.6}
 .card h2{font-size:27px;margin-top:10px}.card p{font-size:12px}
 .card:last-child{display:block}.early-detail{top:auto;translate:none;width:100%;aspect-ratio:1.6;margin:0}
 footer{flex-direction:column;gap:8px}footer span:last-child{font-size:10px}
}