/* Compact making story. Photographs retain their complete frame and open larger. */
.story-page{--story-paper:var(--brand-ivory);--story-ink:var(--brand-black);--story-quiet:var(--brand-muted-dark);--story-line:var(--brand-line-dark);background:var(--brand-black);color:var(--brand-ivory);-webkit-font-smoothing:antialiased}
.story-page a:hover{color:inherit;text-decoration:underline;text-underline-offset:5px}
.story-page a:focus-visible,.story-page summary:focus-visible{outline:2px solid currentColor;outline-offset:5px}
.story-wrap{width:min(1120px,90%);margin-inline:auto}
.story-skip{position:absolute;left:20px;top:-100px;z-index:30;background:var(--story-paper);color:var(--story-ink);padding:16px}
.story-skip:focus{top:16px}
.story-page .story-header{padding:22px 5%;gap:18px;position:relative;z-index:1}
.story-header .wordmark{gap:13.5px;line-height:0}
.story-header .header-logo{width:57px;height:57px}
.story-header .work-wordmark-name{width:168px;height:22.5px;text-shadow:none}
.story-header nav{gap:18px;font-size:17px}
.story-header [aria-current=page]{border-color:var(--brand-sage)}
.story-hero{display:grid;grid-template-columns:.8fr 1.2fr;gap:55px;align-items:center;padding-block:28px 42px}
.story-back{font-size:14px;display:inline-block;margin-bottom:25px;color:var(--brand-muted-light)}
.story-page .story-eyebrow{font-size:11px;line-height:1.5;letter-spacing:1.5px;text-transform:uppercase;margin:0 0 13px;color:var(--brand-sage)}
.story-page h1{font-size:clamp(40px,4.2vw,58px);font-weight:400;line-height:1.08;letter-spacing:-1.4px;margin:0 0 20px}
.story-deck{font-size:21px;line-height:1.5;max-width:340px;margin:0 0 15px}
.story-provenance{font-size:14px;line-height:1.7;color:var(--brand-muted-light);margin:0}
.story-photo{margin:0;min-width:0}
.story-photo>a{display:flex;align-items:center;justify-content:center;cursor:zoom-in}
.story-photo img{display:block;width:100%;height:300px;max-height:44svh;object-fit:contain}
.story-hero .story-photo img{height:auto;max-height:360px}
.story-photo figcaption{font-size:12px;line-height:1.5;color:var(--story-quiet);margin-top:10px;text-align:center}
.story-paper{background:var(--story-paper);color:var(--story-ink)}
.story-paper .story-eyebrow{color:var(--brand-muted-dark)}
.story-making{padding-block:10px 30px}
.story-step{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px;align-items:center;padding-block:34px}
.story-step+.story-step{border-top:1px solid var(--story-line)}
.story-page h2{font-size:31px;line-height:1.2;font-weight:400;letter-spacing:-.6px;margin:0 0 17px}
.story-copy>p:not(.story-eyebrow){font-size:17px;line-height:1.7;max-width:47ch;color:var(--story-quiet);margin:0 0 14px}
.story-copy>p:last-child{margin-bottom:0}
.story-pair{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:center;min-width:0}
.story-extras{border-top:1px solid var(--story-line);margin-top:5px}
.story-extras summary{display:flex;align-items:center;justify-content:space-between;gap:20px;list-style:none;font-size:15px;line-height:1.5;padding-block:18px;cursor:pointer}
.story-extras summary::-webkit-details-marker{display:none}
.story-extras summary span{font-size:22px}
.story-extras[open] summary span{transform:rotate(45deg)}
.story-extra-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;padding-block:10px 20px}
.story-extra-grid img{height:225px;max-height:34svh}
.story-commission{--ink:var(--story-ink);--quiet:var(--story-quiet);--line:var(--brand-line-dark);background:var(--brand-calamine);color:var(--story-ink);padding-block:38px}
.story-commission .story-eyebrow{color:var(--brand-muted-dark)}
.story-commission-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:100px;align-items:start}
.story-commission h3{font-size:23px;line-height:1.3;font-weight:400;margin:0 0 14px}
.story-commission p:not(.story-eyebrow){font-size:17px;line-height:1.7;max-width:49ch;color:var(--story-quiet);margin:0 0 14px}
.story-commission aside{border-left:1px solid var(--brand-line-dark);padding-left:35px}
.story-existing{min-width:0}
.story-existing .project-gallery{margin:18px 0 20px}
.story-existing .project-gallery-slide>a{height:300px;aspect-ratio:auto}
.story-existing .project-gallery-slide img{height:100%;max-height:300px;aspect-ratio:auto;object-fit:contain;background:transparent}
.story-text-link{display:inline-block;border-bottom:1px solid currentColor;padding-block:6px;font-size:16px;line-height:1.5}
.story-text-link span{margin-left:10px}
.story-end{padding-block:23px;font-size:14px}
@media(max-width:1000px){.story-step{gap:35px}.story-hero{gap:35px}.story-page .story-header{align-items:flex-start;flex-direction:column;gap:15px}.story-commission-grid{gap:50px}}
@media(max-width:700px){.story-wrap{width:calc(100% - 40px)}.story-page .story-header{padding:17px 16px;gap:12px}.story-header .wordmark{gap:12px}.story-header .header-logo{width:48px;height:48px}.story-header .work-wordmark-name{width:151.5px;height:20.25px}.story-header nav{font-size:15px;gap:8px 4px;width:100%;justify-content:space-between}.story-hero{grid-template-columns:1fr;gap:24px;padding-block:18px 28px}.story-back{margin-bottom:23px}.story-page h1{font-size:43px;letter-spacing:-1px;margin-bottom:16px}.story-deck{font-size:20px;max-width:340px;margin-bottom:12px}.story-provenance{font-size:13px}.story-hero .story-photo img{height:auto;max-height:240px}.story-step{grid-template-columns:1fr;gap:22px;padding-block:27px}.story-page h2{font-size:28px;margin-bottom:14px}.story-copy>p:not(.story-eyebrow){font-size:16px;line-height:1.7;max-width:none}.story-pair{gap:16px}.story-photo img{height:220px;max-height:35svh}.story-photo figcaption{font-size:11px;line-height:1.45;margin-top:8px}.story-extra-grid{grid-template-columns:1fr 1fr;gap:20px 16px}.story-extra-grid img{height:200px}.story-making{padding-bottom:12px}.story-commission{padding-block:28px}.story-commission-grid{grid-template-columns:1fr;gap:28px}.story-commission p:not(.story-eyebrow){font-size:16px}.story-commission aside{border-left:0;border-top:1px solid var(--brand-line-dark);padding:24px 0 0}.story-end{padding-block:20px}}
@media(max-height:600px) and (min-width:701px){.story-photo img{max-height:60svh}.story-hero .story-photo img{max-height:65svh}}

/* Captions follow their actual dark or light surface. */
.story-hero .story-photo figcaption{color:var(--brand-muted-light)}
.story-paper .story-eyebrow,.story-commission .story-eyebrow{color:var(--brand-muted-dark)}

/* Finished pieces lead into the making story; the final panel is for commissions. */
.story-product{--ink:var(--brand-ivory);--quiet:var(--brand-muted-light);--line:var(--brand-line-light);grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:18px 55px;align-items:start;padding-bottom:44px}
.story-product-title{grid-column:1;grid-row:1;min-width:0}
.story-product-title .story-deck{margin-bottom:0;max-width:25ch}
.story-product>.project-gallery{grid-column:2;grid-row:1 / 3;align-self:center;width:100%;min-width:0}
.story-product .project-gallery-slide>a{height:clamp(300px,34vw,460px);aspect-ratio:auto}
.story-product .project-gallery-slide img{height:100%;aspect-ratio:auto;object-fit:contain}
.story-product-details{grid-column:1;grid-row:2;min-width:0;font-size:16px;line-height:1.65;color:var(--brand-muted-light)}
.story-product-details>p{margin:0 0 18px}
.story-product .portfolio-specs{margin:20px 0 14px;border-top:1px solid var(--brand-line-light);font-size:14px;line-height:1.6}
.story-product .portfolio-specs>div{display:grid;grid-template-columns:105px minmax(0,1fr);gap:12px;padding:10px 0;border-bottom:1px solid var(--brand-line-light)}
.story-product .portfolio-specs dt{color:var(--brand-muted-light);font-size:12px;font-weight:400;letter-spacing:0;text-transform:none}
.story-product .portfolio-specs dd{margin:0;color:var(--brand-ivory);font-size:14px}
.story-product-details .story-text-link{color:var(--brand-ivory)}
.story-product-details .story-provenance{margin:15px 0 0;font-size:13px}
.story-page .story-making-label{padding-top:25px;margin-bottom:0}
.story-commission-copy{text-align:center;max-width:640px}
.story-commission-copy p:not(.story-eyebrow){max-width:none;margin-inline:auto}
@media(max-width:1000px){.story-product{gap:18px 30px}}
@media(max-width:700px){.story-product{grid-template-columns:minmax(0,1fr);gap:22px;padding-bottom:30px}.story-product-title,.story-product>.project-gallery,.story-product-details{grid-column:1;grid-row:auto}.story-product .project-gallery-slide>a{height:clamp(220px,65vw,340px)}.story-product .portfolio-specs>div{grid-template-columns:100px minmax(0,1fr);gap:10px}.story-product .story-back{margin-bottom:20px}.story-page .story-making-label{padding-top:18px}}