@import url('./folio-history.css');
@font-face{font-family:FolioSerif;src:url('./assets/projects/folio/folio-serif.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:FolioSerif;src:url('./assets/projects/folio/folio-serif-italic.woff2') format('woff2');font-weight:400;font-style:italic;font-display:swap}
.exhibit.exhibit--folio{--folio-paper:#f6f3ec;--folio-ink:#393a32;--folio-terra:#a3543b;--folio-line:#d9d1c3;--folio-serif:FolioSerif,'SimSun',serif;grid-column:1/-1;border:1px solid #d8c9b6;border-radius:9px;background:var(--folio-paper);color:var(--folio-ink);box-shadow:0 18px 70px #0003;isolation:isolate}
.exhibit--folio:hover{border-color:#c89d82;box-shadow:0 24px 90px #0004}
.folio-masthead{display:flex;justify-content:space-between;gap:20px;margin:0 34px;padding:21px 0;border-bottom:1px solid var(--folio-line);font:400 .75rem/1.6 var(--mono);letter-spacing:1.6px;color:#777265}
.folio-masthead i{font-style:normal;margin:0 10px;color:#bc9d88}
.folio-open{display:grid;grid-template-columns:.92fr 1.4fr;width:100%;padding:0;text-align:left;background:none;border:0;color:inherit;overflow:hidden;cursor:pointer}
.folio-open:focus-visible{outline:2px solid var(--folio-terra);outline-offset:-6px}
.folio-intro{padding:43px 0 40px 38px;position:relative;z-index:1}
.folio-brand-line{display:flex;align-items:center;gap:28px}
.folio-wordmark{font:italic 400 clamp(5rem,8.8vw,8rem)/.9 var(--folio-serif);letter-spacing:-.045em}
.folio-wordmark>span{color:var(--folio-terra)}
.folio-edition{border-left:1px solid #cbbda8;padding-left:17px;font:400 .75rem/1.9 var(--mono);color:#847565;letter-spacing:1px}
.folio-edition b{font-weight:400;color:var(--folio-terra)}
.folio-title-line{display:flex;align-items:center;gap:22px;margin-top:25px}
.folio-title-line h3{font-family:var(--folio-serif);font-size:1.1rem;font-weight:400;letter-spacing:4px}
.folio-title-line>span{color:#87796c;font:400 .75rem/1.5 var(--mono);letter-spacing:.4px}
.folio-intro h4{font:400 clamp(1.5rem,2.4vw,2rem)/1.65 var(--folio-serif);letter-spacing:.02em;margin:42px 0 13px;max-width:390px;color:#473e32}
.folio-intro>p{max-width:330px;font-size:1rem;line-height:1.95;color:#736858;padding-right:15px}
.folio-explore{display:inline-flex;gap:36px;align-items:center;margin-top:27px;padding-bottom:9px;border-bottom:1px solid #b3876d;font-size:.875rem;color:#985138}
.folio-explore>span{transition:transform .35s}
.folio-open:hover .folio-explore>span{transform:translate(4px,-3px)}
.folio-stage{position:relative;align-self:stretch;padding:35px 34px 32px 45px;background:radial-gradient(ellipse at 60% 55%,#e4d0bc80,transparent 70%);display:flex;flex-direction:column;justify-content:center;perspective:1200px}
.folio-stage-heading{display:flex;align-items:center;justify-content:space-between;margin:0 6px 22px 9px;font:400 .75rem/1.5 var(--mono);letter-spacing:1px;color:#88725b}
.folio-asterisk{font-size:2.4rem;line-height:1;color:#b7785c;transition:transform 1s}
.folio-window{position:relative;background:#e7ddd0;border:1px solid #cbbcaa;padding:7px;box-shadow:10px 19px 45px #63472626,4px 4px 0 #f6f3ec,5px 5px 0 #d4c5b1,9px 9px 0 #ece6da,10px 10px 0 #d4c5b1;transform:rotate(-3deg);transition:transform .65s cubic-bezier(.2,.75,.3,1),box-shadow .65s;overflow:hidden}
.folio-window-bar{display:flex;justify-content:space-between;gap:12px;padding:5px 8px 12px;font:400 .75rem/1.4 var(--folio-serif);color:#796751}
.folio-window-bar i{font-style:normal;color:#bda890;padding:0 6px}
.folio-window img{display:block;width:100%;height:auto;border:1px solid #d9d1c3}
.folio-light{position:absolute;inset:0;background:linear-gradient(115deg,transparent 35%,#fff7 49%,transparent 65%);transform:translateX(-120%);pointer-events:none}
.folio-open:hover .folio-window,.folio-open:focus-visible .folio-window{transform:rotate(-.7deg) translateY(-7px);box-shadow:12px 28px 50px #6347262d,4px 4px 0 #f6f3ec,5px 5px 0 #d4c5b1,9px 9px 0 #ece6da,10px 10px 0 #d4c5b1}
.folio-open:hover .folio-light{animation:folio-light 1.5s ease-out}
.folio-open:hover .folio-asterisk{transform:rotate(90deg)}
.folio-margin-note{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;margin:33px 10px 0}
.folio-margin-note em{font:italic 400 1.7rem/.96 var(--folio-serif);color:#9d6950;transform:rotate(-4deg)}
.folio-margin-note>span{color:#8b7a68;font-size:.75rem;letter-spacing:.6px;text-align:right}
.folio-index{display:flex;flex-wrap:wrap;align-items:center;gap:30px;border-top:1px solid var(--folio-line);border-bottom:1px solid var(--folio-line);margin:10px 34px 0;padding:18px 0;color:#706451;font-size:.875rem}
.folio-index>span{display:flex;gap:13px;align-items:center}
.folio-index b{font:italic 400 1.35rem var(--folio-serif);color:#a36549}
.folio-index .folio-index-end{margin-left:auto;font:400 .75rem var(--mono);color:#8c816e;letter-spacing:1px}
.folio-actions{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:24px 34px}
.folio-actions>p{font-size:.875rem;color:#85735e;line-height:1.6}
.folio-actions>div{display:flex;align-items:center;gap:27px}
.folio-source{font-size:.875rem;color:#695841}
.folio-source:hover{color:#9c5038}
.folio-download{display:inline-flex;align-items:center;gap:29px;padding:14px 20px;background:#a4583e;color:#fff7e9;border-radius:2px;font-size:.9375rem;transition:background .2s,transform .25s,box-shadow .25s;white-space:nowrap}
.folio-download:hover{background:#8e4630;transform:translateY(-2px);box-shadow:0 5px 15px #7b41222a}
.folio-download:focus-visible,.folio-source:focus-visible{outline:2px solid #985138;outline-offset:5px}
@keyframes folio-light{to{transform:translateX(120%)}}
.exhibition-dialog.folio-dialog{--folio-serif:FolioSerif,'SimSun',serif;background:#f6f3ec;color:#393a32;border-color:#d4c5b2;max-width:1000px}
.folio-dialog .dialog-close{background:#e7ddd0;color:#685640;border-color:#d4c5b2}
.folio-detail-heading{padding:35px 40px 26px}
.folio-overline{font:400 .75rem/1.5 var(--mono);letter-spacing:1px;color:#9a6d51}
.folio-detail-heading h2{font:italic 400 5.7rem/1 var(--folio-serif);letter-spacing:-3px;margin:15px 0}
.folio-detail-heading h2>span{color:#a4583e}
.folio-detail-heading h2 small{display:inline-block;font:400 1.2rem var(--folio-serif);letter-spacing:4px;margin-left:24px}
.folio-detail-heading>p{font:400 1.4rem/1.5 var(--folio-serif);color:#78654f}
.folio-reader{margin:0 30px}
.folio-tabs{display:flex;gap:8px;border-bottom:1px solid #d8cdbd;margin-bottom:20px}
.folio-tabs button{background:none;border:0;border-bottom:2px solid transparent;display:flex;align-items:center;gap:12px;padding:13px 18px;color:#7b6c56;font-size:.875rem}
.folio-tabs button>span{font:italic 400 1.3rem var(--folio-serif);color:#aa8264}
.folio-tabs button[aria-pressed=true]{border-bottom-color:#a4583e;color:#974a33;background:#e9dfd233}
.folio-tabs button:focus-visible{outline:2px solid #a4583e;outline-offset:-3px}
.folio-reader figure{margin:0}
.folio-view-frame{background:#e9e3d8;aspect-ratio:3/2;overflow:hidden;border:1px solid #d8cdbd}
.folio-view-frame img{display:block;width:100%;height:100%;object-fit:contain;animation:folio-image-in .5s ease-out}
.folio-reader figcaption{display:flex;gap:20px;align-items:baseline;margin-top:14px;color:#87735d;font-size:.8125rem;line-height:1.6}
.folio-reader figcaption span:first-child{flex-shrink:0;font:italic 400 1.3rem var(--folio-serif);color:#ab6b4c}
.folio-detail-copy{display:grid;grid-template-columns:1fr 175px;gap:35px;padding:33px 40px 25px}
.folio-detail-copy h3{font:400 1.6rem/1.5 var(--folio-serif);margin:13px 0;color:#493e32}
.folio-detail-copy p{font-size:1rem;color:#796956;line-height:1.9}
.folio-detail-copy dl{border-left:1px solid #d8cdbd;padding-left:24px;margin:0}
.folio-detail-copy dl>div+div{margin-top:18px}
.folio-detail-copy dt{font-size:.75rem;color:#97816b}
.folio-detail-copy dd{margin:7px 0 0;font-size:.875rem;color:#675744;line-height:1.6}
.folio-detail-note{margin:0 40px 3px;padding:17px 0;border-top:1px solid #d8cdbd;color:#8c775f;font-size:.8125rem;line-height:1.8}
.folio-dialog .folio-actions{padding:21px 40px 32px}
@keyframes folio-image-in{from{opacity:.3;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:1000px){.folio-open{grid-template-columns:1fr 1.1fr}.folio-intro{padding-left:28px}.folio-stage{padding-left:27px;padding-right:28px}.folio-brand-line{gap:16px}.folio-wordmark{font-size:6rem}.folio-index{gap:22px}.folio-index .folio-index-end{display:none}.folio-edition{padding-left:12px}}
@media(max-width:700px){.folio-masthead{margin:0 23px;font-size:.75rem;letter-spacing:.7px;padding:18px 0}.folio-masthead>span:last-child{font-size:0}.folio-masthead>span:last-child i{display:none}.folio-masthead>span:last-child::after{content:'02 / 1.1';font-size:.75rem;white-space:nowrap}.folio-open{grid-template-columns:1fr}.folio-intro{padding:31px 25px 5px}.folio-brand-line{justify-content:space-between}.folio-wordmark{font-size:6.9rem}.folio-edition{margin-right:8px}.folio-title-line{margin-top:18px;gap:20px}.folio-title-line h3{font-size:1rem}.folio-intro h4{font-size:1.65rem;margin-top:29px}.folio-intro>p{max-width:100%;padding-right:0}.folio-explore{margin-top:23px}.folio-stage{padding:28px 28px 30px;min-height:0}.folio-stage-heading{font-size:.75rem;letter-spacing:.4px;gap:10px}.folio-stage-heading>span:first-child{max-width:205px}.folio-asterisk{font-size:2rem}.folio-window{transform:rotate(-2deg)}.folio-window-bar{font-size:.75rem;padding:3px 3px 8px;gap:6px}.folio-window-bar>span:last-child{display:none}.folio-margin-note{margin-top:26px;margin-left:2px;gap:10px}.folio-margin-note em{font-size:1.4rem}.folio-margin-note>span{max-width:110px;font-size:.75rem;line-height:1.7}.folio-index{margin:0 24px;gap:12px;justify-content:space-between;padding:13px 0}.folio-index>span{gap:5px;font-size:.75rem}.folio-index b{font-size:1.1rem}.folio-actions{padding:21px 24px 25px;flex-direction:column;align-items:stretch;gap:15px}.folio-actions>div{justify-content:space-between;gap:16px}.folio-actions>p{font-size:.8125rem}.folio-download{padding:13px 17px;gap:20px}.folio-detail-heading{padding:30px 23px 20px}.folio-detail-heading h2{font-size:4.5rem}.folio-detail-heading h2 small{font-size:1rem;letter-spacing:2px;margin-left:15px}.folio-reader{margin:0 16px}.folio-tabs{gap:0}.folio-tabs button{flex:1;justify-content:center;gap:6px;padding:12px 4px;font-size:.75rem}.folio-tabs button span{font-size:1rem}.folio-detail-copy{grid-template-columns:1fr;padding:27px 24px 22px;gap:24px}.folio-detail-copy dl{display:flex;justify-content:space-between;gap:14px;border-left:0;border-top:1px solid #d8cdbd;padding:19px 0 0}.folio-detail-copy dl>div+div{margin-top:0}.folio-detail-note{margin:0 24px}.folio-dialog .folio-actions{padding:22px 24px 27px}.folio-reader figcaption{gap:13px;font-size:.75rem}.folio-detail-heading>p{font-size:1.2rem}}
@media(prefers-reduced-motion:reduce){.folio-window,.folio-asterisk,.folio-explore>span,.folio-download{transition:none}.folio-open:hover .folio-window,.folio-open:focus-visible .folio-window{transform:rotate(-3deg)}.folio-open:hover .folio-asterisk{transform:none}.folio-open:hover .folio-light,.folio-view-frame img{animation:none}}