/* Image-only archive and 4:3 project presentation. */
.archive .archive-main{width:calc(100% - 64px);max-width:none;padding:140px 0 100px}
.archive-heading{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:48px;gap:24px}
.archive .archive-heading h1{font-size:clamp(48px,5vw,84px);line-height:1.1;letter-spacing:-.055em;margin:0}
.archive-heading>span{font-size:12px;color:#999;letter-spacing:.08em}
.archive .archive-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:20px 16px}
.archive .project-card{display:block;min-width:0}
.archive .project-image{position:relative;aspect-ratio:4/3;background:#111;border-radius:0;overflow:hidden}
.archive .project-image .project-cover,.archive .project-card:hover .project-cover,.archive .project-card:focus-visible .project-cover{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:1;transform:none}
.archive .project-card:focus-visible{outline:2px solid #fff;outline-offset:4px}
.interview-badge{position:absolute;right:8px;top:8px;padding:6px 8px;background:#111c;color:#fff;font-size:11px;z-index:2}
.portfolio-preview{position:fixed;z-index:10000;pointer-events:none;visibility:hidden;opacity:0;aspect-ratio:auto;background:#111;box-shadow:0 16px 48px #0009;border-radius:4px;overflow:hidden;transition:opacity .15s ease}
.portfolio-preview.is-visible{visibility:visible;opacity:1}
.portfolio-preview img{display:block;width:100%;height:100%;object-fit:contain;object-position:center}
.archive .project-editorial{max-width:1200px;margin:auto}
.project-back{display:inline-block;font-size:13px;color:#aaa;padding:12px 0;margin-bottom:24px}
.archive .project-title-image{width:100%;aspect-ratio:4/3;margin:0 0 64px;overflow:hidden;background:#111}
.archive .project-title-image img,.archive .project-editorial .project-gallery img{display:block;width:100%;height:100%;max-height:none;object-fit:cover;object-position:center}
.archive .project-editorial-heading{position:static;display:block;height:auto;background:none;backdrop-filter:none;padding:0;width:min(900px,100%);margin:0 auto 72px;color:#eee;z-index:auto}
.project-brand-names{display:flex;align-items:baseline;flex-wrap:wrap;gap:12px 24px}
.archive .project-editorial-heading h1{flex:0 1 auto;min-width:0;max-width:100%;font-size:clamp(38px,4.6vw,70px);font-weight:600;letter-spacing:-.045em;margin:0;line-height:1.1;overflow-wrap:anywhere;text-wrap:balance}
.project-brand-korean{font-size:15px;font-weight:400;color:#aaa;line-height:1.6;word-break:keep-all}
.archive .project-editorial-heading .project-brand-intro{font-size:15px;line-height:1.8;font-weight:400;color:#aaa;margin:20px 0 0;word-break:keep-all}
.archive .project-editorial-heading .project-design-note{font-size:17px;line-height:1.9;font-weight:400;color:#ddd;border-top:1px solid #ffffff29;padding-top:24px;margin:28px 0 0;word-break:keep-all;text-wrap:pretty}
.archive .project-editorial .project-gallery{display:grid;grid-template-columns:1fr;gap:24px;margin:0 0 64px}
.archive .project-editorial .project-gallery figure{width:100%;aspect-ratio:4/3;margin:0;overflow:hidden;background:#111}
.project-next-actions{display:flex;justify-content:space-between;gap:24px;line-height:1.6;word-break:keep-all}
@media(min-width:1900px){.archive .archive-grid{grid-template-columns:repeat(8,minmax(0,1fr))}}
@media(max-width:1000px){.archive .archive-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:760px){
 .archive .archive-main{width:calc(100% - 32px);padding:104px 0 64px}
 .archive .archive-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 10px}
 .archive-heading{margin-bottom:32px}
 .interview-badge{font-size:10px;top:6px;right:6px;padding:5px 7px}
 .archive .project-title-image{margin-bottom:32px}
 .archive .project-editorial-heading{margin-bottom:40px}
 .project-brand-names{display:block}
 .archive .project-editorial-heading h1{font-size:clamp(34px,9vw,54px)}
 .project-brand-korean{display:block;font-size:13px;margin-top:12px}
 .archive .project-editorial-heading .project-brand-intro{font-size:14px;margin-top:16px}
 .archive .project-editorial-heading .project-design-note{font-size:15px;padding-top:20px;margin-top:22px}
 .archive .project-editorial .project-gallery{gap:16px;margin-bottom:40px}
 .project-next-actions{flex-direction:column;align-items:flex-start;font-size:13px;gap:18px}
}
@media(prefers-reduced-motion:reduce){.portfolio-preview{transition:none}}


/* Match header brand and consultation edges. */
.archive .archive-main{width:91%;margin-inline:auto}@media(max-width:760px){.archive .archive-main{width:calc(100% - 40px)}}

/* Introduction decks: frame follows original 2.png, always 1 → 2 → 3 → 4. */
.archive .intro-deck .project-title-image,.archive .intro-deck .project-gallery figure{aspect-ratio:var(--deck-ratio)}
.archive .intro-deck .project-title-image img,.archive .intro-deck .project-gallery img{object-fit:cover}
.archive .intro-deck .project-gallery figure:first-child img{object-fit:contain}

.archive .project-editorial-heading{width:100%;margin:0 0 56px}.project-brand-names{gap:12px 24px;margin-bottom:36px}
.project-overview{display:grid;grid-template-columns:180px minmax(0,1fr);gap:24px 32px;margin:0;max-width:1100px}.project-overview dt{font-size:15px;color:#999;line-height:1.8}.project-overview dd{margin:0;min-width:0}.project-service-tags{display:flex;gap:8px;flex-wrap:wrap}.service-tag{display:inline-block;background:#303a33;color:#e6ece7;padding:5px 10px;border-radius:5px;font-size:13px;line-height:1.5}
.archive .project-overview .project-brand-intro{margin:0;font-size:17px;color:#eee}.archive .project-overview .project-design-note{margin:16px 0 0;padding:0;border:0;font-size:16px;color:#aaa}
.archive .native-artwork .project-title-image,.archive .native-artwork .project-gallery figure{aspect-ratio:auto;background:transparent}.archive .native-artwork .project-title-image img,.archive .native-artwork .project-gallery img{width:100%;height:auto;object-fit:contain}
@media(max-width:700px){.project-overview{grid-template-columns:76px minmax(0,1fr);gap:20px 16px}.project-brand-names{margin-bottom:28px}.archive .project-editorial-heading{margin-bottom:36px}.archive .project-overview .project-brand-intro,.archive .project-overview .project-design-note{font-size:14px}.project-overview dt{font-size:13px}}

/* v5 · project pager: thumbnail cards + one clear "all works" button */
.project-pager{display:grid;grid-template-columns:1fr auto 1fr;align-items:stretch;gap:16px;margin-top:96px;padding-top:32px;border-top:1px solid #333}
.pager-card{display:flex;align-items:center;gap:18px;min-height:112px;padding:14px;border:1px solid #2e2e2e;border-radius:10px;color:#fff;text-decoration:none;transition:background .2s,border-color .2s}
.pager-card:hover,.pager-card:focus-visible{background:#1a1a1a;border-color:#555}
.pager-next{justify-content:flex-end;text-align:right}
.pager-thumb{flex:0 0 auto;width:112px;aspect-ratio:4/3;border-radius:6px;overflow:hidden;background:#1c1c1c}
.pager-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.pager-text{display:grid;gap:6px;min-width:0}
.pager-text small{font-size:13px;color:#9a9a9a;letter-spacing:.02em}
.pager-text strong{font-size:18px;line-height:1.3;letter-spacing:-.02em;overflow-wrap:anywhere}
.pager-all{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;min-width:120px;padding:14px 20px;border-radius:10px;background:#fff;color:#111;font-size:15px;font-weight:700;text-decoration:none;transition:transform .2s}
.pager-all:hover{transform:translateY(-2px)}
.pager-grid{display:grid;grid-template-columns:repeat(2,8px);gap:3px}
.pager-grid i{width:8px;height:8px;background:#111;border-radius:2px}
.project-pager a:focus-visible{outline:2px solid #fff;outline-offset:3px}
@media(max-width:760px){
 .project-pager{grid-template-columns:1fr 1fr;gap:10px;margin-top:64px}
 .pager-all{grid-column:1/-1;grid-row:2;flex-direction:row;min-height:56px}
 .pager-card{flex-direction:column;align-items:stretch;gap:12px;padding:10px 10px 14px;min-height:0}
 .pager-next{text-align:left}
 .pager-next .pager-thumb{order:-1}
 .pager-thumb{width:100%}
 .pager-text strong{font-size:15px}
 .pager-text small{font-size:12px}
}
@media(prefers-reduced-motion:reduce){.pager-card,.pager-all{transition:none}}