/* ---- 온라인 전시 《바람이 형식이 되기까지》 ---- */
.ex-hero h1{max-width:1100px}
.ex-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}
.ex-actions .btn{border-color:rgba(255,255,255,.45);color:#fff;background:transparent}
.ex-actions .btn.solid{background:var(--gold-2);border-color:var(--gold-2)}
.ex-actions .btn:hover{background:var(--gold-2);border-color:var(--gold-2);color:#fff}

/* 장 이동 줄 */
.ex-nav{background:var(--paper);border-bottom:1px solid var(--line);overflow-x:auto;-webkit-overflow-scrolling:touch}
.ex-nav-in{max-width:var(--max);margin:auto;padding:0 var(--gap);display:flex;white-space:nowrap}
.ex-nav a{display:inline-flex;align-items:center;gap:6px;padding:15px 16px 13px;font:500 13px/1 var(--sans);color:var(--ink-2);border-bottom:2px solid transparent}
.ex-nav a b{color:var(--gold);font-weight:600;letter-spacing:.06em}
.ex-nav a:hover{color:var(--gold-2);border-color:var(--gold-2)}

/* 기획 글 */
.ex-statement{display:grid;grid-template-columns:1.25fr .75fr;gap:48px;align-items:start}
.ex-statement h2,.ex-h2{font-size:clamp(28px,3.4vw,50px);line-height:1.1;letter-spacing:-.035em;margin:6px 0 22px}
.ex-copy{font-size:18px;line-height:1.9;color:var(--ink-2);max-width:760px;margin:0}
.ex-manifesto{position:sticky;top:96px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:26px 0;font-size:clamp(22px,2.4vw,34px);line-height:1.35;letter-spacing:-.02em;color:var(--gold-2)}
@media (max-width:900px){.ex-statement{grid-template-columns:1fr}.ex-manifesto{position:static}}

/* 여섯 장 카드 */
.ex-chapters{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
@media (max-width:820px){.ex-chapters{grid-template-columns:1fr}}
.ex-chapter{display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow-s);transition:border-color .15s;scroll-margin-top:96px}
.ex-chapter:hover{border-color:var(--gold)}
.ex-chapter-img{position:relative;min-height:300px;display:flex;flex-direction:column;justify-content:flex-end;padding:26px 28px;color:#fff;background:var(--deep) center/cover no-repeat}
.ex-chapter-img::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,5,3,.05) 20%,rgba(7,5,3,.86) 100%)}
.ex-chapter-img>*{position:relative}
.ex-chapter-img .num{font:600 11px/1 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--gold-soft)}
.ex-chapter-img h3{font-size:clamp(24px,2.4vw,36px);line-height:1.12;letter-spacing:-.03em;margin:12px 0 8px;color:#fff}
.ex-chapter-img .ex-lead{margin:0;font:13px/1.5 var(--sans);color:#e3d9ca;letter-spacing:.02em}
.ex-chapter-body{padding:20px 24px 22px;display:flex;flex-direction:column;gap:16px}
.ex-quote{margin:0;padding:0 0 0 16px;border-left:2px solid var(--gold);font-size:clamp(20px,2.3vw,30px);line-height:1.4;letter-spacing:-.02em;color:var(--gold-2);font-style:normal}
.ex-quote.small{font-size:17px;line-height:1.55;color:var(--ink-2);flex:1}
.ex-thumbs{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
.ex-thumbs img{aspect-ratio:1/1;width:100%;height:auto;object-fit:cover;border:1px solid var(--line-2);background:var(--paper-2);border-radius:6px}
.ex-thumbs .noimg{aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;border:1px dashed var(--line);border-radius:6px;font:600 12px var(--sans);color:var(--gold)}
.ex-chapter .go{color:var(--gold);font:600 12px/1 var(--sans);letter-spacing:.04em}

/* 두 수평선 비교 */
.ex-compare{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:30px 0 18px}
@media (max-width:820px){.ex-compare{grid-template-columns:1fr}}
.ex-compare figure{margin:0;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.ex-compare img{width:100%;aspect-ratio:4/3;object-fit:contain;background:var(--deep);padding:14px}
.ex-compare figcaption{padding:20px 24px 22px}
.ex-compare figcaption h3{font-size:22px;margin:0 0 8px}
.ex-compare figcaption p{color:var(--ink-2);margin:0 0 8px}
.ex-compare figcaption small{font:11px var(--sans);letter-spacing:.14em;color:var(--gold)}
.ex-axes{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin:0;padding:0;list-style:none;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--paper)}
.ex-axes li{padding:22px 24px;border-left:1px solid var(--line-2)}
.ex-axes li:first-child{border-left:0}
.ex-axes strong{display:block;font:600 11px/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--gold);margin-bottom:10px}
.ex-axes p{margin:0;color:var(--ink-2);font-size:16px}
@media (max-width:820px){.ex-axes{grid-template-columns:1fr}.ex-axes li{border-left:0;border-top:1px solid var(--line-2)}.ex-axes li:first-child{border-top:0}}

/* 색의 이동 */
.ex-palette{display:grid;grid-template-columns:repeat(6,1fr);gap:0;margin:26px 0 0;padding:0;list-style:none;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.ex-palette li{position:relative;min-height:280px;padding:22px 20px;display:flex;flex-direction:column;justify-content:flex-end;color:#fff}
.ex-palette li::before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.66),rgba(0,0,0,.04) 70%)}
.ex-palette li>*{position:relative}
.ex-palette span{font:600 10px/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:#f1e6d2}
.ex-palette h3{font-size:21px;line-height:1.2;margin:10px 0 6px;color:#fff}
.ex-palette p{margin:0;font:12px/1.55 var(--sans);color:#efe7d9}
@media (max-width:1100px){.ex-palette{grid-template-columns:repeat(3,1fr)}}
@media (max-width:540px){.ex-palette{grid-template-columns:repeat(2,1fr)}.ex-palette li{min-height:220px}}

/* 반복 도상 탐색 */
.ex-motif-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:16px}
.ex-motif-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-s);overflow:hidden;display:flex;flex-direction:column;transition:border-color .15s}
.ex-motif-card:hover{border-color:var(--gold)}
.ex-motif-card .ph{aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;background:var(--paper-2);overflow:hidden}
.ex-motif-card .ph img{width:100%;height:100%;object-fit:cover}
.ex-motif-card .ph .noimg{color:var(--muted);text-align:center;font:12px var(--sans);padding:12px}
.ex-motif-card .ph .noimg b{display:block;font:600 22px var(--serif);color:var(--gold);margin-bottom:6px}
.ex-motif-card .cb{padding:12px 14px 14px}
.ex-motif-card .cy{font:11px var(--sans);letter-spacing:.12em;color:var(--gold);margin:0 0 4px}
.ex-motif-card h3{font-size:18px;line-height:1.25;margin:0 0 3px}
.ex-motif-card .ce{font:12px var(--sans);color:var(--muted);margin:0}

/* 에필로그 */
.ex-epilogue{background:var(--deep);color:#fff;margin-top:28px}
.ex-epilogue-in{max-width:var(--max);margin:auto;padding:clamp(56px,8vw,110px) var(--gap);display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center}
.ex-epilogue h2{font-size:clamp(40px,6.5vw,96px);line-height:.95;letter-spacing:-.05em;margin:0;color:#fff}
.ex-epilogue p{font-size:19px;line-height:1.8;color:#d8cebe;margin:0 0 26px}
.ex-epilogue .btn{border-color:var(--gold-soft);color:var(--gold-soft);background:transparent}
.ex-epilogue .btn:hover{background:var(--gold-2);border-color:var(--gold-2);color:#fff}
@media (max-width:900px){.ex-epilogue-in{grid-template-columns:1fr;gap:28px}}

/* ---- 장 페이지 ---- */
.ex-chapter-page{padding-top:32px}
.ex-intro{display:grid;grid-template-columns:.9fr 1.1fr;gap:48px;align-items:start;margin:12px 0 48px}
@media (max-width:900px){.ex-intro{grid-template-columns:1fr;gap:24px}}
.ex-stories{display:grid;gap:30px}
.ex-story{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr);margin:0;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow-s)}
.ex-story.flip .ex-media{order:2}
.ex-media{display:flex;align-items:center;justify-content:center;background:var(--deep-2);min-height:420px;padding:18px}
.ex-media img{width:100%;max-height:72vh;object-fit:contain;border:1px solid rgba(255,255,255,.08)}
.ex-media .noimg{color:#cfc4b6;text-align:center;font:13px var(--sans)}
.ex-media .noimg b{display:block;font:600 28px var(--serif);color:var(--gold-soft);margin-bottom:8px}
.ex-story figcaption{padding:clamp(26px,3.6vw,52px);display:flex;flex-direction:column;justify-content:center}
.ex-no{font:600 11px/1 var(--sans);letter-spacing:.22em;color:var(--gold);margin:0 0 14px}
.ex-story h2{font-size:clamp(30px,3.4vw,46px);line-height:1.05;letter-spacing:-.035em;margin:0 0 6px}
.ex-en{font:italic 400 18px/1.3 Georgia,serif;color:var(--muted);margin:0 0 16px}
.ex-caption{font-size:17px;line-height:1.85;color:var(--ink-2);margin:4px 0 20px}
.ex-links{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;margin:0}
.ex-textlink{font:600 13px var(--sans);color:var(--gold-2)}
.ex-bridge{max-width:760px;margin:26px auto 0;text-align:center;font-size:clamp(20px,2.4vw,30px);line-height:1.5;letter-spacing:-.02em;color:var(--gold-2)}
@media (max-width:900px){.ex-story,.ex-story.flip{grid-template-columns:1fr}.ex-story.flip .ex-media{order:0}.ex-media{min-height:0}.ex-media img{max-height:70vh}}