.popup-report { background: #e8e8e1; color: var(--ink); padding: clamp(88px, 12vw, 184px) clamp(22px, 5vw, 88px) 0; }
.popup-report__intro { display: grid; grid-template-columns: .55fr 1.75fr .65fr; gap: 28px; align-items: end; max-width: 1320px; margin: 0 auto clamp(52px, 7vw, 104px); }
.popup-report__issue { margin: 14px 0 0; font: 700 .64rem/1.5 'DM Mono', monospace; letter-spacing: .05em; }
.popup-report__intro h2 { margin: 0; font-size: clamp(2.9rem, 4vw, 4.6rem); line-height: .94; letter-spacing: -.095em; text-align: center; }
.popup-report__lede { margin: 0 0 4px; font-size: clamp(1rem, 1.35vw, 1.28rem); line-height: 1.8; font-weight: 700; text-align: right; }
.popup-report__lead-image { max-width: 1320px; margin: 0 auto; }
.popup-report__lead-image img { display: block; width: 100%; aspect-ratio: 16 / 8.7; object-fit: cover; }
.popup-report__lead-image figcaption { margin-top: 11px; color: #585954; font: 500 .67rem/1.5 'DM Mono', 'Noto Sans KR', sans-serif; letter-spacing: .015em; }
.popup-report__lead-image figcaption a { display: inline-block; margin-top: 5px; color: var(--ink); text-decoration: underline; text-underline-offset: 3px; }
.popup-report__body { max-width: 1050px; margin: clamp(72px, 10vw, 150px) auto; display: grid; grid-template-columns: .6fr 1.4fr; gap: clamp(32px, 8vw, 125px); }
.popup-report__label { margin: 10px 0 0; font: 700 .68rem/1.4 'DM Mono', monospace; letter-spacing: .08em; }
.popup-report__copy { max-width: 680px; }
.popup-report__copy p { margin: 0 0 25px; font-size: clamp(1rem, 1.35vw, 1.24rem); line-height: 2; letter-spacing: -.025em; }
.popup-report__copy .popup-report__standfirst { margin-bottom: 34px; font-size: clamp(1.25rem, 1.85vw, 1.7rem); line-height: 1.75; font-weight: 800; }
.popup-report__metrics { max-width: 1320px; margin: 0 auto; padding: 30px 0 34px; border-top: 1px solid #1a1b20; border-bottom: 1px solid #1a1b20; display: grid; grid-template-columns: repeat(3, 1fr); }
.popup-report__metrics div { min-height: 124px; padding: 2px clamp(18px, 3vw, 50px); border-left: 1px solid #a6a7a0; }
.popup-report__metrics div:first-child { border-left: 0; padding-left: 0; }
.popup-report__metrics strong { display: block; font-size: clamp(3.3rem, 5.5vw, 6.6rem); line-height: .85; letter-spacing: -.11em; }
.popup-report__metrics strong span { font-size: .4em; letter-spacing: -.05em; vertical-align: top; }
.popup-report__metrics p { margin: 19px 0 0; font: 700 .66rem/1.5 'DM Mono', monospace; letter-spacing: .06em; }
.popup-report__moment { max-width: 1320px; margin: clamp(86px, 12vw, 180px) auto 0; }
.popup-report__moment-heading { display: grid; grid-template-columns: .68fr 1.32fr; gap: 28px; align-items: start; margin-bottom: 46px; }
.popup-report__moment-heading h3 { margin: 0; font-size: clamp(2.15rem, 4.25vw, 5.45rem); line-height: .95; letter-spacing: -.09em; }
.popup-report__photo-grid { display: grid; grid-template-columns: 1.12fr .88fr; grid-template-rows: 1fr 1fr; gap: 14px; }
.popup-report__photo-grid figure { margin: 0; overflow: hidden; background: #d6d6ce; }
.popup-report__photo-grid img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.popup-report__photo-grid figure:hover img { transform: scale(1.035); }
.popup-report__photo-a { grid-row: span 2; aspect-ratio: .92 / 1; }
.popup-report__photo-b, .popup-report__photo-c { aspect-ratio: 1.45 / 1; }
.popup-report__outro { max-width: 1050px; margin: clamp(90px, 12vw, 185px) auto 0; padding: 0 0 clamp(75px, 10vw, 145px); border-bottom: 1px solid #1a1b20; display: grid; grid-template-columns: .6fr 1.4fr; gap: clamp(32px, 8vw, 125px); }
.popup-report__outro > p:nth-child(2) { margin: 0; max-width: 680px; font-size: clamp(1.45rem, 2.15vw, 2.25rem); line-height: 1.58; letter-spacing: -.055em; font-weight: 800; }
.popup-report__outro span { grid-column: 2; margin-top: 18px; font: 700 .65rem/1.5 'DM Mono', monospace; letter-spacing: .065em; }
@media (max-width: 760px) { .popup-report__intro, .popup-report__body, .popup-report__moment-heading, .popup-report__outro { display: block; } .popup-report__intro h2 { margin: 42px 0 28px; } .popup-report__lede { max-width: 430px; } .popup-report__lead-image img { aspect-ratio: 1 / 1; } .popup-report__body { margin: 72px auto; } .popup-report__label { margin-bottom: 30px; } .popup-report__metrics { grid-template-columns: 1fr; padding: 0; } .popup-report__metrics div, .popup-report__metrics div:first-child { min-height: 0; padding: 28px 0; border-left: 0; border-top: 1px solid #a6a7a0; } .popup-report__metrics div:first-child { border-top: 0; } .popup-report__metrics strong { font-size: 4.4rem; } .popup-report__moment-heading { margin-bottom: 32px; } .popup-report__moment-heading .eyebrow { margin-bottom: 26px; } .popup-report__photo-grid { grid-template-columns: 1fr; grid-template-rows: auto; } .popup-report__photo-a, .popup-report__photo-b, .popup-report__photo-c { grid-row: auto; aspect-ratio: 1 / .86; } .popup-report__outro > p:nth-child(2) { margin-top: 30px; } .popup-report__outro span { display: block; margin-top: 28px; } }
