/* One gallery room, from the moving exhibition to the last invitation. */
:root{--gallery-gold:#c9ac76;--gallery-muted:#d4d7c4}
body{isolation:isolate;background:var(--olive);color:var(--cream)}
.gallery-room{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;background:var(--olive)}
.gallery-room::before{content:"";position:absolute;inset:0;background:url('assets/olive-wall-v8.webp') center/900px;opacity:.28}
.gallery-room::after{content:"";position:absolute;inset:-30%;background:radial-gradient(ellipse at 35% 28%,#ead5a91c,transparent 56%),radial-gradient(ellipse at 80% 75%,#111a1838,transparent 62%);animation:room-light 26s ease-in-out infinite alternate}
@keyframes room-light{from{transform:translate(-4%,-2%)}to{transform:translate(5%,4%)}}
.header,.hero,.selection,.visit,footer{background:transparent}
.hero h1{z-index:4}
/* Stable gallery placement stays clear of the headline. */
.campaign figure{transform-origin:50% 0}
.campaign{top:max(27svh,220px);left:50%;right:auto;width:min(1120px,86%);height:auto;transform:translateX(-50%);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(32px,5vw,80px)}
.campaign .campaign-blue,.campaign .campaign-pink,.campaign .campaign-green{position:relative;width:100%;left:auto;right:auto;top:0!important;transform:none;z-index:2}
.campaign-pink{width:39svh;left:calc(50% - 19.5svh)}
.hero-bottom{background:#303b27ed;padding:10px 12px}
.art-frame{position:relative;isolation:isolate;aspect-ratio:3/4;overflow:visible;background:none;border:0;padding:0;box-shadow:none}
.frame-blue,.campaign-blue .photo-button{--aperture-left:8.4%;--aperture-top:5.6%;--aperture-width:83.2%;--aperture-height:88%}
.frame-pink,.campaign-pink .photo-button{--aperture-left:8.4%;--aperture-top:5.6%;--aperture-width:83.2%;--aperture-height:88%}
.frame-green,.campaign-green .photo-button{--aperture-left:8.4%;--aperture-top:5.6%;--aperture-width:83.2%;--aperture-height:88%}
.art-frame .garment{position:absolute;left:var(--aperture-left);top:var(--aperture-top);width:var(--aperture-width);height:var(--aperture-height);aspect-ratio:auto;object-fit:cover;object-position:center;z-index:1;filter:none}
.art-frame .frame-art{position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;object-fit:fill;pointer-events:none;z-index:2;filter:drop-shadow(7px 14px 12px #111a0d66);animation:gilded-light 11s ease-in-out infinite alternate}
.frame-green .frame-art{animation-delay:-4s}.frame-blue .frame-art{animation-delay:-7s}
.simple-frame{border:5px solid var(--mount-color,#302d25);background:#e8e0cf;box-shadow:inset 1px 1px 2px #fff7,5px 10px 15px #17201138}
.simple-frame .garment{left:2.5%;top:1.8%;width:95%;height:96.4%}
.blue-story .simple-frame{--mount-color:#33352e}.green-story .simple-frame{--mount-color:#654634}.point-photo .simple-frame{--mount-color:#41453c}
@keyframes gilded-light{from{filter:brightness(.99) drop-shadow(7px 14px 12px #111a0d66)}to{filter:brightness(1.025) drop-shadow(7px 14px 12px #111a0d66)}}
.photo-button img,.photo-button:hover img,.campaign .photo-button:hover img{transform:none;transition:none}
.selection,.point-of-view,.visit{position:relative;isolation:isolate;overflow:hidden}
.selection{background:var(--rose);color:var(--olive);padding:90px 7% 100px}
.selection::after,.point-of-view::after,.visit::after{content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;background:url('assets/olive-wall-v8.webp') center/900px;mix-blend-mode:soft-light;opacity:.22}
.selection::before{content:"";display:block;max-width:1240px;height:1px;background:var(--gallery-gold);opacity:.35;margin:0 auto 78px}
.selection-intro{align-items:center;margin-bottom:80px}
.selection-intro h2{font-size:clamp(56px,7vw,100px)}
.selection-intro h2 em,.story-caption h3 em,.side-copy em{color:#60333f}
.selection-intro p,.story-caption span,.availability{color:#333b2b}
.editorial-grid{grid-template-columns:1.1fr 1fr;gap:14%;align-items:start}
.blue-story{padding:0}.green-story{padding-top:150px}
.side-copy{color:var(--olive);font-size:clamp(32px,3.1vw,44px);margin-bottom:48px}
.story-caption{padding:26px 8% 0}.story-caption h3{font-size:clamp(36px,4vw,56px)}
.story-caption span{font-size:14px;margin-top:15px}
.availability{border-color:#60333f55;margin-top:90px;padding-top:25px}
.point-of-view{padding:95px 7%;gap:8%;grid-template-columns:1fr 1.1fr;background:var(--celery);color:#26311d;border-block:1px solid #c9ac7633}
.point-photo{min-height:0;height:auto;max-width:480px;width:100%;overflow:visible;align-self:center;justify-self:center;transform:rotate(-3deg)}
.point-photo .garment{max-height:none}.point-photo .art-frame{width:100%}
.point-copy{padding:40px 0;gap:32px}.point-copy h2{font-size:clamp(48px,5.5vw,80px)}
.point-copy h2 em{color:#4d352b}.point-copy p{color:#26311d;max-width:420px}
.point-copy .text-link{color:#26311d;border-color:#4d352b}
.text-link{color:var(--cream);border-color:var(--gallery-gold)}
.visit{padding:115px 7% 95px;background:var(--wine);color:var(--cream);gap:9%;grid-template-columns:1.4fr 1fr}
.visit h2{font-size:clamp(48px,5.8vw,84px)}.visit h2 em{color:#d9c392}
.visit>div>p{color:var(--gallery-muted)}
.visit .button{background:#d9c392;color:#283420;padding:18px 26px}.visit .button:hover{background:#ead7b0}
.visit address{border:1px solid #c9ac7659;border-radius:180px 180px 0 0;padding:82px 35px 40px;text-align:center;margin:0}
.visit address>span{color:#d9c392}.visit address p{color:var(--gallery-muted)}
footer{border-top:1px solid #c9ac7633;color:var(--cream);padding:35px 7%}
.footer-line{border-color:#c9ac7633}.footer-line span{font-family:var(--font-display);font-size:24px;letter-spacing:.02em;font-weight:500}footer>p{color:var(--gallery-muted)}
.lightbox{background:#263121;color:var(--cream)}
.gallery-paused .gallery-room::after,.gallery-paused .frame-art,.gallery-hidden .gallery-room::after,.gallery-hidden .frame-art{animation-play-state:paused}
@media(min-width:701px) and (max-width:1050px){.campaign-pink{width:37svh;left:calc(50% - 18.5svh)}.point-of-view{gap:6%}.visit{gap:6%}.visit address{padding:65px 20px 30px}}
@media(max-width:700px){
 .motion-stage{height:auto;min-height:0;padding-bottom:24px}
 .hero h1{position:relative;top:auto;margin:68px 0 52px}
 .campaign{position:relative;inset:auto;transform:none;width:auto;margin:0 24px;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
 .campaign .campaign-pink{order:-1;grid-column:1/-1;width:min(64vw,290px);justify-self:center;margin-bottom:6px}
 .hero-bottom{position:relative;inset:auto;margin:38px 24px 0;padding:10px 0}
 .selection{padding:44px 24px 60px}.selection::before{margin-bottom:52px}
 .selection-intro{margin-bottom:42px}.selection-intro h2{font-size:55px}.selection-intro p{margin-top:26px}
 .blue-story{padding-right:20px}.green-story{padding-top:62px;padding-left:20px}
 .story-caption{padding:22px 8% 0}.story-caption h3{font-size:39px}.side-copy{font-size:36px;margin-bottom:32px}
 .availability{margin-top:52px;font-size:12px}
 .point-of-view{padding:60px 24px;gap:45px}.point-photo{width:88%;height:auto;transform:rotate(-3deg)}
 .point-copy{padding:0;gap:28px}.point-copy h2{font-size:clamp(43px,12vw,48px)}
 .visit{padding:65px 24px}.visit h2{font-size:50px}.visit address{margin-top:50px;padding:65px 23px 32px;border:1px solid #c9ac7659}
 footer{padding:30px 24px}.footer-line{align-items:center}.footer-line span{font-size:17px;letter-spacing:0}
}
@media(prefers-reduced-motion:reduce){.gallery-room::after{animation:none}.art-frame .frame-art{animation-duration:22s}}
@media print{.gallery-room::after,.art-frame .frame-art{animation:none}.gallery-room{position:absolute}}

/* The transparent wordmark sits directly on the gallery wall. */
.header .brand{width:160px}.brand img{aspect-ratio:auto}
.lightbox{width:min(94vw,1000px);height:auto;max-height:96dvh;padding:20px 28px 24px;overflow:auto;background:#263121}
.lightbox-gallery{display:grid;grid-template-columns:48px minmax(0,1fr) 48px;align-items:center;justify-content:center;gap:22px}
.enlarged-frame{width:min(100%,calc(68dvh * .75));justify-self:center}
.enlarged-frame .garment{object-fit:cover;object-position:center;background:none}
.lightbox .frame-art{animation:none}
.gallery-prev,.gallery-next{display:grid;place-items:center;width:48px;height:48px;border:1px solid #c9ac7666;background:transparent;color:var(--cream)}
.gallery-prev:hover,.gallery-next:hover{background:#c9ac7622}
.lightbox .gallery-counter{font-size:15px;margin-top:20px;font-variant-numeric:tabular-nums}
.lightbox .gallery-credit{margin-top:5px;color:#d4d7c4;font-size:12px}
body:has(.lightbox[open]){overflow:hidden}
@media(max-width:1050px) and (min-width:701px){.header .brand{width:140px}}
@media(max-width:700px){.header .brand{width:124px}.header .brand-line{display:none}.lightbox{width:96vw;padding:14px 14px 20px}.lightbox-gallery{grid-template-columns:1fr 1fr;gap:20px 16px}.enlarged-frame{grid-column:1/-1;grid-row:1;width:min(100%,calc(65dvh * .75))}.gallery-prev,.gallery-next{grid-row:2;width:52px;height:44px}.gallery-prev{justify-self:end}.gallery-next{justify-self:start}.lightbox .gallery-counter{margin-top:15px}}

/* Material continuity across every wall, including header, footer and enlarged gallery. */
.selection::after,.point-of-view::after,.visit::after{opacity:.4}
.header,footer{position:relative;isolation:isolate}
.lightbox{position:fixed;inset:0;margin:auto;height:fit-content;max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);isolation:isolate}
.header::before,footer::before,.lightbox::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:url('assets/olive-wall-v8.webp') center/900px;mix-blend-mode:soft-light;opacity:.4}
.hero-bottom{background:transparent}
.art-frame:not(button){cursor:default}
.campaign .photo-button{transition:transform 800ms cubic-bezier(.22,.68,.24,1)!important;transform-origin:center}
@media(hover:hover) and (pointer:fine){.campaign .photo-button:hover{transform:scale(1.045)}}
@media(max-width:700px){
 .motion-stage{display:flow-root;padding-top:0;padding-bottom:24px}
 .hero h1{margin:0 0 52px;padding-top:70px;transform:none}
 .motion-toggle{top:0;left:24px}
 .campaign{width:min(72vw,310px);margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr);gap:64px}
 .campaign .campaign-pink{grid-column:auto;width:100%;margin:0;order:-1}
 .campaign .campaign-blue,.campaign .campaign-green{width:100%}
 .campaign .photo-button{transform:scale(var(--center-scale,1));transition:transform 1100ms cubic-bezier(.22,.68,.24,1)!important}
 .hero-bottom{margin-top:52px;gap:14px}
 .simple-frame{width:100%;aspect-ratio:3/4}
 .enlarged-frame{width:min(100%,calc(61dvh * .75))}
 .close-photo{min-height:44px;align-items:center;padding-bottom:6px}
 .lightbox-gallery{gap:14px 16px}
}

/* The same measured emphasis follows every photograph, with captions kept intact. */
.story-description{font-size:15px;line-height:1.7;color:#333b2b;margin-top:16px;max-width:36ch;text-wrap:pretty}
.simple-frame{transition:transform 800ms cubic-bezier(.22,.68,.24,1)!important;transform-origin:center}
@media(min-width:701px){
 .editorial .simple-frame{width:90%;margin-inline:auto}
 .story-caption{width:90%;margin-inline:auto;padding-inline:0}
 .point-photo{max-width:432px}
}
@media(hover:hover) and (pointer:fine) and (min-width:701px){.simple-frame:hover{transform:scale(1.045)}}
@media(max-width:700px){
 .blue-story{padding-right:0}.green-story{padding-left:0}
 .editorial .simple-frame,.point-photo{width:min(72vw,310px);max-width:100%;margin-inline:auto}
 .point-photo{transform:none}
 .point-photo .simple-frame{width:100%}
 .story-caption{width:min(72vw,310px);max-width:100%;margin-inline:auto;padding:26px 0 0}
 .story-description{font-size:14px;line-height:1.75;max-width:none}
 .simple-frame{transform:scale(var(--center-scale,1));transition:transform 1100ms cubic-bezier(.22,.68,.24,1)!important}
}
