:root{--case-paper:#fff;--case-ink:#111;--case-line:rgba(17,17,17,.2);--case-mono:'DM Mono',monospace;--case-sans:'Manrope',Arial,sans-serif;--case-serif:Georgia,serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0}
.upcycled-page{overflow:visible!important;background:var(--case-paper);color:var(--case-ink);font-family:var(--case-sans)}
.upcycled-page a{color:inherit;text-decoration:none}
.upcycled-page button,.upcycled-page input,.upcycled-page textarea{font:inherit}
.upcycled-page .contact-trigger,.upcycled-page .contact-close{border:0;background:none;padding:0;color:inherit;cursor:pointer;font:inherit}
.case-header{position:fixed;inset:0 0 auto;z-index:20;height:64px;padding:0 2.3vw;color:#fff;mix-blend-mode:difference;font:500 9px/1.35 var(--case-mono);pointer-events:none}
.case-header a,.case-header button{pointer-events:auto}
.case-brand{position:absolute;left:2.3vw;top:15px;font:700 14px/1.05 Arial,sans-serif;letter-spacing:-.07em}
.case-brand small{display:block;margin-top:3px;font:500 7px/1.2 var(--case-mono);letter-spacing:.015em}
.case-nav-works{position:absolute;left:50%;top:17px;transform:translateX(-50%);white-space:nowrap}
.case-nav-right{position:absolute;right:2.3vw;top:15px;display:flex;flex-direction:column;align-items:flex-end;gap:3px}
.case-header .contact-trigger{color:inherit;font:inherit}
.case-hero{height:min(92svh,1120px);min-height:620px;position:relative;padding:0 1.2vw 17px;display:flex;align-items:stretch;overflow:hidden;background:#fff}
.image-open{display:block;border:0;border-radius:0;padding:0;color:inherit;background:transparent;text-align:inherit;cursor:zoom-in}
.image-open:focus-visible{outline:1px solid var(--case-ink);outline-offset:4px}
.case-hero-image{position:relative;width:100%;height:100%;overflow:hidden;background:#ddd}
.case-hero-image img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 43%;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.case-hero-image:hover img{transform:scale(1.025)}
.case-hero-label{position:absolute;z-index:2;left:3vw;right:3vw;bottom:35px;display:flex;justify-content:space-between;color:#fff;font:500 8px var(--case-mono);letter-spacing:.055em;text-shadow:0 1px 7px #0008;pointer-events:none}
.case-hero-index{position:absolute;right:3vw;top:84px;color:#fff;font:500 8px var(--case-mono);letter-spacing:.06em;mix-blend-mode:difference}
.case-intro{padding:66px 7vw 108px;display:grid;grid-template-columns:.62fr 1.38fr;gap:6vw;align-items:start}
.case-intro-spacer{min-height:120px;padding:0}
.case-intro h1{margin:0;font:600 11px/1.5 var(--case-mono);letter-spacing:.035em}
.case-intro h1 span{font-weight:400;color:#777}
.case-intro-copy{max-width:670px;justify-self:end;font:400 clamp(16px,2vw,23px)/1.5 var(--case-sans);letter-spacing:-.045em}
.case-intro-copy p{margin:0 0 21px}
.case-intro-copy a{font:500 8px var(--case-mono);letter-spacing:.05em;border-bottom:1px solid var(--case-line);padding-bottom:5px}
.case-gallery{padding:96px 3vw 120px;scroll-margin-top:72px}
.gallery-heading{display:flex;justify-content:space-between;padding:0 5vw 37px;font:500 8px var(--case-mono);letter-spacing:.06em}
.case-photo{margin:0}
.photo-frame{display:block;position:relative;overflow:hidden;width:100%;background:#eee}
.photo-frame img{display:block;width:100%;height:100%;object-fit:cover;transition:transform 1.15s cubic-bezier(.2,.7,.2,1)}
.photo-frame.centered-subjects img{object-position:center center}
.case-photo:hover .photo-frame img{transform:scale(1.035)}
.case-photo figcaption{display:flex;justify-content:space-between;gap:12px;padding-top:9px;font:500 7px var(--case-mono);letter-spacing:.055em;color:#444}
.case-photo-lead{width:min(70vw,980px);margin:0 5vw 100px auto}
.case-photo-lead-spaced{margin-top:100px}
.case-photo-lead .photo-frame{height:min(88vw,790px)}
.case-photo-pair{display:grid;grid-template-columns:1fr 1fr;gap:9vw;align-items:start;padding:0 8vw;margin:0 auto 120px;max-width:1500px}
.case-photo-pair .photo-frame{height:min(65vw,700px)}
.case-photo-pair .pair-offset{margin-top:13vw}
.case-photo-pair .pair-offset .photo-frame{height:min(56vw,620px)}
.case-photo-trio{display:grid;grid-template-columns:.85fr 1.1fr .85fr;gap:2.2vw;align-items:start;padding:0 4vw;max-width:1600px;margin:0 auto}
.case-photo-trio .photo-frame{height:min(42vw,560px)}
.case-photo-trio .trio-tall{margin-top:8vw}
.case-photo-trio .trio-tall .photo-frame{height:min(53vw,700px)}
.case-photo-pair.case-photo-additional,.case-photo-trio.case-photo-additional{margin-top:110px;margin-bottom:0}
.case-contact{min-height:215px;background:#111;color:#fff;padding:32px 3vw 18px;display:grid;grid-template-columns:1fr auto;align-content:space-between;gap:30px;margin-top:70px;font:500 8px var(--case-mono);letter-spacing:.05em}
.case-contact>span{color:#bbb}
.case-contact-button{grid-column:2;grid-row:1/3;align-self:center;border:1px solid #777;padding:13px 17px;color:#fff;font:500 8px var(--case-mono);letter-spacing:.06em;cursor:pointer;background:transparent;transition:background .25s,color .25s}
.case-contact-button:hover{background:#fff;color:#111}
.case-contact footer{grid-column:1/-1;border-top:1px solid #555;padding-top:11px;display:flex;justify-content:space-between;gap:20px;color:#aaa}
.case-contact footer a{color:#fff}
.upcycled-page .contact-dialog{width:min(534px,calc(100vw - 28px));height:342px;max-height:calc(100svh - 28px);border:0;padding:27px 26px 20px;background:#fff;color:var(--case-ink);box-shadow:0 8px 35px #0002}
.upcycled-page .contact-dialog::backdrop{background:rgba(0,0,0,.72)}
.upcycled-page .dialog-heading{display:flex;justify-content:space-between;align-items:center;font:400 13px var(--case-serif)}
.upcycled-page .contact-close{font:700 9px var(--case-sans)}
.upcycled-page .contact-form{display:grid;grid-template-rows:40px 40px 1fr 34px;height:270px;margin-top:17px}
.upcycled-page .contact-form input,.upcycled-page .contact-form textarea{width:100%;border:0;border-bottom:1px solid var(--case-ink);border-radius:0;background:transparent;padding:9px 0 5px;outline:none;color:var(--case-ink);font:400 10px var(--case-sans)}
.upcycled-page .contact-form textarea{height:100%;resize:none;padding-top:17px}
.upcycled-page .contact-form input::placeholder,.upcycled-page .contact-form textarea::placeholder{color:#777;opacity:1}
.upcycled-page .contact-form>button{border:0;background:none;padding:12px 0 0;cursor:pointer;font:700 10px var(--case-sans);text-align:center}
.upcycled-page .contact-form>button:hover{opacity:.55}
.upcycled-page.dialog-open{overflow:hidden}
.image-dialog{position:fixed;inset:0;width:100vw;height:100svh;max-width:none;max-height:none;margin:0;border:0;padding:58px 70px 42px;background:rgba(0,0,0,.96);color:#fff;overflow:hidden}
.image-dialog::backdrop{background:rgba(0,0,0,.94)}
.image-dialog figure{width:100%;height:100%;margin:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px}
.image-dialog-content{display:block;max-width:100%;max-height:calc(100% - 24px);width:auto;height:auto;object-fit:contain}
.image-dialog-caption{align-self:flex-start;font:500 8px var(--case-mono);letter-spacing:.06em;color:#ddd}
.image-close,.image-step{position:absolute;z-index:1;border:0;background:transparent;color:#fff;cursor:pointer}
.image-close{right:22px;top:15px;font:300 31px/1 Arial,sans-serif}
.image-step{top:50%;transform:translateY(-50%);font:300 27px/1 Arial,sans-serif;padding:12px}
.image-previous{left:15px}.image-next{right:15px}
.has-motion .reveal{opacity:0;transform:translateY(25px);transition:opacity .85s ease,transform .85s cubic-bezier(.2,.7,.2,1)}
.has-motion .reveal.is-visible{opacity:1;transform:translateY(0)}
.has-motion .case-hero-image img{clip-path:inset(0 0 100% 0);transition:clip-path 1.15s cubic-bezier(.65,0,.25,1),transform 1.2s cubic-bezier(.2,.7,.2,1)}
.has-motion .case-hero-image.is-visible img{clip-path:inset(0 0 0 0)}
.has-motion .case-photo .photo-frame{clip-path:inset(0 0 100% 0);transition:clip-path 1s cubic-bezier(.65,0,.25,1)}
.has-motion .case-photo.is-visible .photo-frame{clip-path:inset(0 0 0 0)}
.has-motion .case-photo img{transform:scale(1.04)}
.has-motion .case-photo.is-visible img{transform:scale(1)}
@media(max-width:760px){
  .case-header{height:52px;padding:0 4vw}.case-brand{left:4vw;top:12px;font-size:12px}.case-brand small{font-size:6px}.case-nav-works{top:14px;font-size:7px}.case-nav-right{right:4vw;top:12px;font-size:7px}
  .case-hero{height:72svh;min-height:470px;max-height:740px;padding:0 2vw 9px}.case-hero-image img{object-position:center 40%}.case-hero-label{left:4vw;right:4vw;bottom:20px;font-size:6px}.case-hero-index{top:68px;right:4vw;font-size:6px}
  .case-intro{padding:39px 6vw 68px;grid-template-columns:1fr;gap:19px}.case-intro-spacer{min-height:84px;padding:0}.case-intro h1{font-size:8px}.case-intro-copy{justify-self:start;font-size:17px;max-width:100%}.case-intro-copy a{font-size:7px}
  .case-gallery{padding:74px 5vw 72px;scroll-margin-top:54px}.gallery-heading{padding:0 0 25px;font-size:6px}.case-photo-lead{width:88vw;margin:0 0 57px 7vw}.case-photo-lead .photo-frame{height:112vw;max-height:620px}.case-photo figcaption{font-size:6px;padding-top:7px}.case-photo-pair{padding:0;gap:5vw;margin-bottom:76px}.case-photo-pair .photo-frame{height:70vw}.case-photo-pair .pair-offset{margin-top:16vw}.case-photo-pair .pair-offset .photo-frame{height:62vw}.case-photo-trio{padding:0;grid-template-columns:1fr 1fr;gap:27px 10px}.case-photo-trio .photo-frame{height:66vw}.case-photo-trio .trio-tall{grid-column:1/-1;grid-row:1;margin:0 9vw 0 0}.case-photo-trio .trio-tall .photo-frame{height:112vw;max-height:610px}.case-photo-trio .case-photo:nth-child(3){margin-top:14vw}.case-photo-pair.case-photo-additional,.case-photo-trio.case-photo-additional{margin-top:70px;margin-bottom:0}
  .case-contact{min-height:185px;margin-top:44px;padding:25px 5vw 14px;gap:25px;font-size:6px}.case-contact-button{padding:11px 13px;font-size:7px}.case-contact footer{font-size:6px}.upcycled-page .contact-dialog{height:342px;padding:23px 20px 18px}
  .image-dialog{padding:55px 38px 32px}.image-close{right:13px;top:10px}.image-step{font-size:20px;padding:8px}.image-previous{left:3px}.image-next{right:3px}.image-dialog-content{max-width:100%;max-height:calc(100% - 30px)}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}.has-motion .reveal,.has-motion .case-photo .photo-frame{opacity:1;transform:none;clip-path:none;transition:none}.has-motion .case-hero-image img{clip-path:none}}
@media(max-width:760px){.case-photo-lead-spaced{margin-top:64px}}
.upcycled-page .case-hero-image img{object-position:center 45%}
.upcycled-page .case-photo-lead{width:min(46vw,640px);margin:0 12vw 100px auto}
.upcycled-page .case-photo-lead .photo-frame{height:auto;aspect-ratio:1364 / 1803}
.upcycled-page .case-photo-pair .photo-frame{height:auto;aspect-ratio:2 / 3}
.upcycled-page .case-photo-pair .pair-offset{margin-top:10vw}
@media(max-width:760px){
  .upcycled-page .case-photo-lead{width:84vw;margin:0 0 64px 7vw}
  .upcycled-page .case-photo-lead .photo-frame{height:auto;max-height:none;aspect-ratio:1364 / 1803}
  .upcycled-page .case-photo-pair .photo-frame,.upcycled-page .case-photo-pair .pair-offset .photo-frame{height:auto;aspect-ratio:2 / 3}
  .upcycled-page .case-photo-pair .pair-offset{margin-top:16vw}
}
