:root{--paper:#eae6da;--ink:#262925;--red:#793d34}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:15px/1.5 Georgia,serif}body:before{content:'';position:fixed;inset:0;background:url('assets/image-001.jpg');opacity:.025;pointer-events:none;z-index:9}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button,a{touch-action:manipulation}button:focus-visible,a:focus-visible{outline:2px solid var(--red);outline-offset:5px}header{padding:24px 4vw;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #26292533;font:12px Arial,sans-serif;text-transform:uppercase;letter-spacing:.13em}.brand span{opacity:.5}nav{display:flex;gap:30px}nav span{color:var(--red)}footer{padding:25px 4vw;border-top:1px solid #26292533;display:flex;justify-content:space-between;font:10px Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase}main{min-height:80vh}.eyebrow{font:11px Arial,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:var(--red)}hero{display:block;position:relative;min-height:80vh;padding:7vh 6vw;overflow:hidden}.hero-copy{position:relative;z-index:2;max-width:590px}h1{font-weight:normal;font-size:clamp(60px,9vw,145px);letter-spacing:-.065em;line-height:.91;margin:35px 0}h1 em{display:block;font-weight:normal}hero .hero-art{position:absolute;right:-7%;top:6%;height:90%;width:65%;object-fit:cover;mix-blend-mode:multiply;mask-image:linear-gradient(to right,transparent,black 25%);opacity:.8}hero p{max-width:300px;margin:30px 0;color:#53574f}.enter{background:var(--ink);color:var(--paper);border:0;border-radius:50%;width:108px;height:108px;font:11px Arial,sans-serif;letter-spacing:.12em;line-height:2;transition:transform .3s}.enter:hover{transform:rotate(-10deg);background:var(--red)}.hero-meta{position:absolute;bottom:25px;right:4vw;font:11px Arial,sans-serif;text-align:right}.index{padding:6vw}.index h2{font-size:60px;font-weight:normal;margin:20px 0}.project-row{padding:28px 0;border-top:1px solid #26292555;display:grid;grid-template-columns:60px 1fr 200px;align-items:center}.project-row strong{font-size:32px;font-weight:normal}.project-row .status{font:11px Arial,sans-serif;letter-spacing:.08em}.project-row.available:hover{color:var(--red)}.project-shell{display:grid;grid-template-columns:240px 1fr;gap:4vw;padding:42px 4vw;animation:arrival 1s ease}.sidebar{position:sticky;top:25px;height:fit-content}.sidebar h2{font-size:34px;line-height:1;font-weight:normal;margin:18px 0 35px}.tabs{display:flex;flex-direction:column;gap:8px}.tabs button{border:0;background:none;text-align:left;padding:10px 0;font:12px Arial,sans-serif;color:#6a6a60}.tabs button.active{color:var(--red)}.tabs button.active:before{content:'● ';font-size:9px}.side-note{font:11px/1.7 Arial,sans-serif;color:#79796f;margin-top:40px;max-width:190px}.section-head{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin-bottom:22px}.section-head h2{font-size:38px;line-height:1.1;font-weight:normal;margin:0}.section-head span{font:10px Arial,sans-serif;text-transform:uppercase;letter-spacing:.12em}.intro{font-size:21px;max-width:760px;margin:28px 0 35px;line-height:1.7}.gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}.gallery figure{margin:0}.image-button{border:0;padding:0;display:block;width:100%;background:#ddd8cb;position:relative;overflow:hidden}.image-button img{display:block;width:100%;height:340px;object-fit:contain;transition:transform .5s}.image-button:hover img{transform:scale(1.025)}img{user-select:none;-webkit-user-drag:none}.gallery figcaption{font:11px/1.5 Arial,sans-serif;letter-spacing:.03em;margin-top:10px}.map{display:grid;grid-template-columns:repeat(6,1fr);gap:4px;background:#333;padding:5px}.map button{border:0;padding:0;position:relative;background:#242424;overflow:hidden;aspect-ratio:.82}.map img{width:100%;height:100%;object-fit:cover;filter:saturate(.6);transition:.3s}.map button:hover img{transform:scale(1.08);filter:saturate(1)}.map span{position:absolute;bottom:8px;left:8px;color:#fff;background:#282820aa;padding:2px 5px;font:10px Arial,sans-serif}.map-note{font:11px/1.6 Arial,sans-serif;color:#68695e;margin:15px 0}.text-columns{display:grid;grid-template-columns:1fr 1fr;gap:35px;margin:35px 0}.text-columns h3{font-weight:normal;font-size:24px}.text-columns p{line-height:1.8;color:#575b52}.specs{font:11px/1.8 Arial,sans-serif;letter-spacing:.05em;border-top:1px solid #26292544;padding-top:20px}dialog{border:0;background:#171b18;color:var(--paper);max-width:none;max-height:none;width:100vw;height:100dvh;padding:20px 4vw}dialog::backdrop{background:#171b18e8}.viewer-bar,.viewer-bottom{display:flex;align-items:center;justify-content:space-between;gap:15px;font:12px Arial,sans-serif;height:45px}dialog button{border:1px solid #ffffff55;color:var(--paper);background:transparent;padding:9px 14px}.viewer-image{height:calc(100% - 100px);position:relative;text-align:center}.viewer-image img{width:100%;height:100%;object-fit:contain}.watermark{position:absolute;bottom:30px;right:8%;color:#fff9;font:10px Arial,sans-serif;letter-spacing:.2em;pointer-events:none}.transition{position:fixed;inset:0;z-index:20;background:#222824;display:grid;place-items:center;color:#eee8dc;animation:dive 1s forwards;pointer-events:none}.transition span{font-size:60px;font-style:italic}@keyframes dive{0%{opacity:0;clip-path:circle(0 at 30% 65%)}40%{opacity:1;clip-path:circle(150% at 30% 65%)}80%{opacity:1}100%{opacity:0}}@keyframes arrival{from{opacity:0;transform:translateY(25px)}to{opacity:1;transform:none}}@media(max-width:800px){header{padding:20px 5vw}nav{gap:15px}.brand span{display:none}hero{min-height:82vh;padding:8vh 6vw}hero .hero-art{width:110%;right:-40%;opacity:.5;top:15%}.hero-copy{max-width:85%}.hero-meta{max-width:150px}.project-shell{grid-template-columns:1fr}.sidebar{position:static}.sidebar h2{margin:10px 0 20px}.tabs{flex-direction:row;overflow-x:auto;white-space:nowrap;gap:20px}.side-note{display:none}.gallery{gap:16px}.image-button img{height:220px}.map{grid-template-columns:repeat(3,1fr)}.text-columns{grid-template-columns:1fr}.project-row{grid-template-columns:35px 1fr 95px}.project-row strong{font-size:23px}.project-row .status{font-size:9px}.section-head{display:block}.section-head h2{margin-bottom:12px}footer{gap:25px}.viewer-bottom p{font-size:10px}.viewer-bottom button{font-size:10px;padding:8px}.intro{font-size:18px}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* Original lettering and small, material-led interactions. */
.art-title{width:min(620px,70vw);margin:54px 0 48px;line-height:0;letter-spacing:normal}
.art-title img{width:100%;height:auto;display:block}
.hero-copy{max-width:650px}
.side-title{max-width:205px;line-height:0!important;margin:22px 0 35px!important}
.side-title img{width:100%;height:auto}
.index-title img{display:block;width:min(320px,100%);height:auto}
hero p{font-size:13px;line-height:1.65;max-width:285px}
.intro{font-size:19px;line-height:1.7}
.text-columns p{font-size:13px}
.side-note{font-size:10px}
.map-note,.specs{font-size:10px}
.gallery figcaption{font-size:10px}
.hero-meta{font-size:10px}
nav a,.tabs button,.project-row.available strong{position:relative}
nav a:after,.tabs button:after,.project-row.available strong:after{content:'';position:absolute;left:0;bottom:-7px;width:100%;height:7px;background:url('assets/charcoal-stroke.svg') center/100% 100% no-repeat;opacity:0;transform:scaleX(.2);transform-origin:left;transition:opacity .18s,transform .28s;pointer-events:none}
.tabs button:after{bottom:1px;width:92%}
nav a:hover:after,nav a:focus-visible:after,.tabs button:hover:after,.tabs button:focus-visible:after,.tabs button.active:after,.project-row.available:hover strong:after{opacity:.85;transform:scaleX(1)}
.click-splash{position:fixed;width:240px;height:240px;transform:translate(-50%,-50%);z-index:100;pointer-events:none;animation:splash-bloom .78s ease-out forwards}
.click-splash img{width:100%;height:100%}
@keyframes splash-bloom{0%{opacity:0;transform:translate(-50%,-50%) scale(.08) rotate(-18deg)}22%{opacity:.9}55%{opacity:.65;transform:translate(-50%,-50%) scale(1) rotate(8deg)}100%{opacity:0;transform:translate(-50%,-50%) scale(1.3) rotate(13deg)}}
@media (hover:hover) and (pointer:fine){html,body,body *{cursor:url('assets/sardine-cursor.svg') 4 12,auto}a,button,a *,button *{cursor:url('assets/sardine-cursor.svg') 4 12,pointer}}
@media(max-width:800px){.art-title{width:min(590px,86vw);margin:52px 0 45px}.hero-copy{max-width:95%}.side-title{max-width:230px}.intro{font-size:16px}.click-splash{width:190px;height:190px}.index-title img{max-width:230px}}
@media(prefers-reduced-motion:reduce){.click-splash{display:none}}
hero .hero-art{mask-image:linear-gradient(to bottom,transparent 0%,transparent 18%,#0003 43%,#000 78%)}
.art-title{position:relative;z-index:3}

/* A larger original title and the physical book as the opening image. */
.portfolio-hero{padding:38px 4vw 42px;min-height:0;isolation:isolate}
.portfolio-hero>.eyebrow{position:relative;z-index:2}
.portfolio-hero .art-title{width:min(1320px,92vw);margin:26px 0 22px;max-width:none}
.hero-stage{position:relative;z-index:2;display:grid;grid-template-columns:minmax(180px,230px) minmax(0,1fr);gap:4vw;align-items:center}
.hero-note p{font-size:13px;max-width:210px;margin:0 0 30px}
.hero-details{font:10px/1.8 Arial,sans-serif;margin-top:30px;color:#6c6b61}
.hero-photograph{margin:0;max-width:1100px}
.hero-photograph>img{width:100%;height:auto;display:block;aspect-ratio:3/2;object-fit:contain;box-shadow:0 10px 30px #29292212}
.hero-photograph figcaption{font:10px/1.6 Arial,sans-serif;letter-spacing:.04em;margin-top:12px;display:flex;justify-content:space-between;color:#65665e}
.ambient{position:absolute;inset:0;z-index:0;pointer-events:none}
.ambient img{width:100%;height:100%;object-fit:fill}
.ambient-paper{opacity:.65}
.ambient-bubbles{opacity:.42}
.project-shell{position:relative;isolation:isolate}
.project-decoration{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.42}
.project-decoration img{width:100%;height:100%;object-fit:cover;object-position:bottom}
.side-title{max-width:235px;margin:24px 0 38px!important}
@media(max-width:800px){.portfolio-hero{padding:30px 5vw}.portfolio-hero .art-title{width:90vw;margin:35px 0 28px}.hero-stage{grid-template-columns:minmax(140px,180px) 1fr;gap:25px}.hero-note p{font-size:12px}.hero-details{font-size:9px}.hero-photograph figcaption{font-size:9px;gap:15px}.hero-photograph>img{aspect-ratio:3/2;object-fit:contain}}
@media(max-width:580px){.hero-stage{grid-template-columns:1fr;gap:28px}.hero-photograph{grid-row:1}.hero-note{display:grid;grid-template-columns:1fr 105px;gap:16px;align-items:center}.hero-note p{max-width:260px;margin:0}.hero-details{margin-top:0;grid-column:1/-1}.hero-note .enter{width:96px;height:96px}.portfolio-hero .art-title{margin:34px 0 30px}.hero-photograph figcaption{flex-wrap:wrap}.ambient-paper{opacity:.45}}

.enter{position:relative;width:220px;height:152px;border-radius:0;background:transparent url('assets/enter-paint.svg') center/contain no-repeat;color:var(--ink);font-size:11px;letter-spacing:.11em;filter:drop-shadow(0 1px 1px #393a2520);transform:rotate(-4deg)}
.enter span{position:absolute;right:24px;bottom:28px;line-height:1.85;width:125px;text-align:center}
.enter:hover{background:transparent url('assets/enter-paint.svg') center/contain no-repeat;transform:rotate(1deg) scale(1.04);color:#793d34}
@media(max-width:800px){.enter{width:180px;height:126px}.enter span{right:15px;bottom:21px;width:112px;font-size:10px}}
@media(max-width:580px){.hero-note{grid-template-columns:1fr 155px}.hero-note .enter{width:155px;height:110px}.enter span{right:7px;bottom:16px;width:112px;font-size:10px}}
/* Keep the lettering prominent without spanning the entire page. */
.portfolio-hero .art-title{width:min(900px,74vw);margin:26px 0 28px}
@media(max-width:800px){.portfolio-hero .art-title{width:76vw;margin:30px 0 28px}}
@media(max-width:580px){.portfolio-hero .art-title{width:76vw;margin:30px 0 28px}}
.portfolio-hero .art-title{width:min(740px,62vw)}
@media(max-width:800px){.portfolio-hero .art-title{width:65vw}}