:root { --ink:#141414; --nav-height:64px; }
* { box-sizing:border-box; }
[hidden] { display:none!important; }
html,body { margin:0; min-height:100%; }
body { color:var(--ink); background:#fff; font-family:Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
img { display:block; }
.dock { position:fixed; z-index:10; bottom:0; left:0; width:100%; height:var(--nav-height); display:flex; align-items:center; justify-content:center; gap:clamp(16px,2.8vw,36px); padding:12px 20px; background:#fff; }
.dock a { font-family:Inter,Arial,sans-serif; font-size:clamp(14px,1.7vw,20px); font-weight:800; letter-spacing:.14em; white-space:nowrap; }
.dock a:hover,.dock a:focus-visible { text-decoration:underline; text-underline-offset:4px; }
.carousel { height:calc(100vh - var(--nav-height)); height:calc(100dvh - var(--nav-height)); position:relative; overflow:hidden; }
.marquee { position:absolute; inset:0; overflow:hidden; }
.marquee-track { display:flex; align-items:center; gap:22px; height:100%; width:max-content; padding:0 11px; }
.marquee-track img { height:100%; width:auto; flex:none; }
.logo { position:absolute; z-index:1; inset:0; display:grid; place-items:center; pointer-events:none; }
.logo img { width:min(54vw,800px); height:auto; }
.page main { padding-bottom:var(--nav-height); }
.page-title { margin:0; padding:8vh 5vw 4vh; font-family:Inter,Arial,sans-serif; font-size:clamp(40px,7vw,100px); font-weight:800; letter-spacing:-.05em; text-transform:uppercase; }
.collection-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; width:100%; padding:10px 10px 74px; }
.collection-card { position:relative; display:block; min-width:0; overflow:hidden; font-family:Inter,Arial,sans-serif; background:#f2f2f2; }
.collection-card img { width:100%; aspect-ratio:4 / 3; object-fit:cover; }
.collection-card::after { content:""; position:absolute; inset:0; background:rgba(0,0,0,.28); opacity:0; transition:opacity .18s; }
.collection-card h2 { position:absolute; z-index:1; inset:0; display:grid; place-items:center; margin:0; padding:20px; color:#fff; text-align:center; font-size:clamp(22px,3vw,48px); font-weight:800; letter-spacing:-.035em; line-height:1.05; opacity:0; transition:opacity .18s; }
.collection-card:hover::after,.collection-card:hover h2,.collection-card:focus-visible::after,.collection-card:focus-visible h2 { opacity:1; }
.collection-card:focus-visible { outline:2px solid var(--ink); outline-offset:5px; }
.collection-header { max-width:1400px; margin:auto; padding:18px 5vw 0; }
.collection-header .page-title { padding:20px 0 16px; font-size:clamp(36px,5vw,72px); }
.collection-back { font-family:Inter,Arial,sans-serif; font-size:13px; font-weight:800; letter-spacing:.12em; }
.collection-back:hover,.collection-back:focus-visible { text-decoration:underline; text-underline-offset:4px; }
.viewer { min-height:calc(100dvh - var(--nav-height)); display:flex; flex-direction:column; align-items:center; justify-content:center; padding:55px 50px 20px; }
.v-stage { margin:0; text-align:center; }
.v-stage img { max-width:calc(100vw - 110px); max-height:calc(100dvh - 180px); width:auto; height:auto; margin:auto; }
.v-stage figcaption { padding-top:14px; font-family:Inter,Arial,sans-serif; font-size:13px; font-weight:800; letter-spacing:.1em; overflow-wrap:anywhere; }
.v-prev,.v-next { position:fixed; top:50%; z-index:3; transform:translateY(-50%); background:none; border:0; padding:18px; font-size:36px; font-weight:800; cursor:pointer; }
.v-prev { left:0; } .v-next { right:0; }
.v-index { position:fixed; top:14px; left:22px; z-index:3; border:0; background:#fff; padding:8px; font-family:Inter,Arial,sans-serif; font-size:14px; font-weight:800; letter-spacing:.14em; cursor:pointer; }
.portrait-gallery-open .dock,.portrait-gallery-open .v-prev,.portrait-gallery-open .v-next { display:none; }
.portrait-gallery-open main { padding-bottom:0; }
.portrait-gallery-open .v-stage figcaption { visibility:hidden; }
.gallery-grid { columns:3; column-gap:10px; max-width:1400px; margin:auto; padding:70px 16px 100px; }
.collection-gallery .gallery-grid { padding-top:0; }
.portrait-gallery .gallery-grid { display:block; columns:auto; max-width:1300px; padding:48px 150px 80px 130px; }
.portrait-row { display:grid; align-items:center; gap:clamp(16px,2.5vw,36px); margin:0 0 clamp(40px,5vw,72px); }
.portrait-row-1 { grid-template-columns:1fr; }
.portrait-row-2 { grid-template-columns:repeat(2,minmax(0,1fr)); max-width:1100px; }
.portrait-row .grid-item { margin:0; cursor:default; }
.portrait-row .grid-item img { width:auto; height:auto; max-width:100%; object-fit:contain; margin:0; }
.portrait-row .grid-item:hover img { opacity:1; }
.portrait-row-1 .grid-item img { max-height:min(95dvh,1000px); }
.portrait-row-2 .grid-item img { max-height:min(82dvh,850px); }
.grid-item { display:block; width:100%; margin:0 0 10px; padding:0; border:0; background:none; break-inside:avoid; cursor:pointer; }
.grid-item img { width:100%; height:auto; }
.grid-item:hover img { opacity:.8; }
.info-page { min-height:calc(100dvh - var(--nav-height)); display:grid; place-items:center; padding:clamp(48px,8vw,120px) 24px; }
.info-copy { width:min(100%,650px); font-family:Inter,Arial,sans-serif; font-size:clamp(20px,2.2vw,29px); font-weight:400; line-height:1.42; }
.info-copy p { margin:0 0 1.6em; }
.info-copy p:last-child { margin-bottom:0; }
.info-copy p:nth-child(2) { font-size:.72em; line-height:1.55; }
.info-signature { font-size:.78em; }
@media(max-width:800px) { .gallery-grid { columns:2; } }
@media(max-width:640px) { .dock { gap:clamp(10px,3vw,20px); padding:12px 10px; } .dock a { font-size:clamp(11px,3vw,15px); letter-spacing:.06em; } .logo img { width:82vw; } .collection-grid { grid-template-columns:1fr; } .collection-header { padding-top:16px; } .portrait-gallery .gallery-grid { padding:48px 20px 70px; } .portrait-row { gap:14px; margin-bottom:38px; } }
@media(hover:none) { .collection-card::after { top:auto; height:35%; background:linear-gradient(transparent,rgba(0,0,0,.6)); opacity:1; } .collection-card h2 { inset:auto 0 0; display:block; padding:24px 12px 12px; font-size:clamp(18px,5vw,28px); opacity:1; } }
.visually-hidden { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }