/* The living rare-book gallery: existing brand type and colours, fewer frames. */
:root { --gallery-green: oklch(27% .055 170); --gallery-paper: oklch(97% .015 85); --gallery-ink: oklch(23% .03 169); --gallery-gold: oklch(77% .09 80); }
html { scroll-padding-top: 110px; }
body.gallery-page { background: var(--gallery-paper); color: var(--gallery-ink); }
body.gallery-page::before { display: none; }
.gallery-page a { color: inherit; }
.gallery-page img { box-shadow: none; filter: none; }
.gallery-catalogue-heading { padding: 70px clamp(24px,6vw,104px) 40px; }
.gallery-catalogue-heading h1 { font: 400 clamp(40px,5vw,72px)/1.1 var(--display); margin-bottom: 22px; letter-spacing: -.035em; }
.gallery-catalogue-heading > p:last-child { font: 400 16px/1.7 var(--sans); }
.gallery-catalogue-tools { display: flex; gap: 24px; align-items: end; flex-wrap: wrap; margin: 0 0 45px; font: 400 13px/1.6 var(--sans); }
.gallery-catalogue-tools label { display: grid; gap: 8px; flex: 1; min-width: 210px; }
.gallery-catalogue-tools input, .gallery-catalogue-tools select { min-height: 48px; border: 1px solid var(--gold-dark); border-radius: 0; padding: 12px; background: transparent; color: var(--gallery-ink); font: inherit; }
.gallery-catalogue-tools > p { padding-bottom: 12px; }.catalogue-empty { font: 400 18px/1.6 var(--sans); }
.gallery-header { position: sticky; top: 0; z-index: 50; display: flex; align-items: center; gap: 40px; padding: 16px clamp(22px,4vw,72px); min-height: 88px; background: var(--gallery-paper); border-bottom: 1px solid oklch(23% .03 169 / .14); }
.gallery-brand { display: flex; align-items: center; gap: 13px; text-decoration: none; margin-right: auto; flex-shrink: 0; }
.gallery-brand img { width: 48px; height: 48px; object-fit: contain; }
.gallery-brand span { font: 500 20px/1.05 var(--display); }
.gallery-brand small { display: block; margin-top: 6px; font: 500 10px/1 var(--sans); text-transform: uppercase; letter-spacing: .21em; }
.gallery-header nav { display: flex; gap: clamp(22px,3vw,44px); }
.gallery-header nav a, .gallery-store { font: 500 13px/1.4 var(--sans); text-decoration: none; padding: 10px 0; }
.gallery-header nav a { border-bottom: 1px solid transparent; }
.gallery-header nav a { min-height: 44px; display: flex; align-items: center; }
.gallery-header nav a:hover, .gallery-header nav a[aria-current="page"] { border-color: currentColor; }
.gallery-store { border-left: 1px solid oklch(23% .03 169 / .2); padding-left: 30px; }
.gallery-hero { position: relative; display: grid; grid-template-columns: 1.06fr 1fr; column-gap: clamp(20px,5vw,80px); padding: 48px clamp(28px,6vw,104px) 0; min-height: min(800px,calc(100svh - 88px)); color: var(--gallery-paper); background: var(--gallery-green); }
.gallery-hero-copy { align-self: center; padding: 35px 0 70px; }
.gallery-eyebrow { font: 500 11px/1.6 var(--sans); letter-spacing: .14em; text-transform: uppercase; margin-bottom: 25px; }
.gallery-hero h1 { font: 400 clamp(64px,7.8vw,128px)/.98 var(--display); letter-spacing: -.045em; margin: 0 0 28px; }
.gallery-hero h1 em { font-style: normal; color: var(--gallery-gold); }
.gallery-lead { max-width: 410px; font: 400 clamp(15px,1.3vw,18px)/1.8 var(--sans); color: oklch(92% .015 85); }
.gallery-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 24px; margin-top: 30px; }
.gallery-button { display: inline-flex; align-items: center; justify-content: space-between; gap: 28px; padding: 17px 24px; min-height: 52px; color: var(--gallery-paper) !important; background: var(--gallery-green); font: 500 13px/1.4 var(--sans); text-decoration: none; border: 1px solid transparent; transition: background .2s, transform .3s; }
.gallery-button:hover { background: var(--green-800); transform: translateY(-2px); }
.gallery-button--light { color: var(--gallery-green) !important; background: var(--gallery-paper); }
.gallery-button--light:hover { background: var(--ivory-200); }
.gallery-link { font: 500 13px/1.6 var(--sans); padding: 8px 0; text-decoration: none; border-bottom: 1px solid currentColor; display: inline-block; }
.gallery-hero-object { display: flex; flex-direction: column; min-width: 0; padding-bottom: 30px; }
.gallery-object-index { display: flex; justify-content: space-between; font: 400 10px/1.4 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--gallery-gold); }
.gallery-book-host { position: relative; display: grid; place-items: center; height: clamp(390px,43vw,600px); min-width: 0; }
.gallery-book-host > img { display: block; max-height: 86%; height: 86%; max-width: 90%; width: auto; object-fit: contain; box-shadow: none; }
.gallery-book-host.book-3d--ready > img { opacity: 0; }
.gallery-book-host .book-3d { inset: 0; }
.gallery-object-caption { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin: 0 16px; padding-top: 18px; border-top: 1px solid oklch(97% .015 85 / .23); font: 400 21px/1.3 var(--display); text-decoration: none; }
.gallery-object-caption small { display: block; font: 400 11px/1.5 var(--sans); margin-top: 8px; color: oklch(87% .02 85); }
.gallery-hero-bottom { grid-column: 1/-1; display: flex; justify-content: space-between; gap: 20px; padding: 21px 0; border-top: 1px solid oklch(97% .015 85 / .2); font: 400 11px/1.5 var(--sans); color: oklch(87% .02 85); }
.gallery-hero-bottom a { text-decoration: none; }.gallery-hero-bottom a span { margin-left: 22px; }
.gallery-collection { padding: clamp(65px,8vw,130px) clamp(24px,6vw,104px); scroll-margin-top: 30px; }
.gallery-section-head { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: end; margin-bottom: 64px; }
.gallery-section-head h2, .gallery-family h2, .gallery-invitation h2 { font: 400 clamp(38px,4.2vw,67px)/1.08 var(--display); letter-spacing: -.025em; }
.gallery-section-head > div:last-child { justify-self: end; max-width: 370px; }
.gallery-section-head p:not(.gallery-eyebrow), .gallery-family-copy > p:not(.gallery-eyebrow), .gallery-invitation > p:not(.gallery-eyebrow) { font: 400 16px/1.8 var(--sans); margin-bottom: 18px; }
.gallery-shelf { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: clamp(28px,5vw,82px); }
.gallery-shelf-cover { display: flex; align-items: flex-end; justify-content: center; height: clamp(270px,30vw,460px); padding: 0 10px; }
.gallery-shelf-cover img { max-height: 100%; max-width: 100%; height: 100%; width: auto; object-fit: contain; transition: transform .5s var(--ease-luxury); }
.gallery-shelf-cover:hover img { transform: translateY(-9px); }
.gallery-book-label { margin-top: 25px; padding-top: 18px; border-top: 1px solid oklch(23% .03 169 / .2); }
.gallery-book-label h3 { font: 400 24px/1.2 var(--display); margin-bottom: 8px; }.gallery-book-label h3 a { text-decoration: none; }
.gallery-book-label p { font: 400 12px/1.5 var(--sans); margin-bottom: 15px; }.gallery-book-label > a { font: 500 12px/1.5 var(--sans); text-underline-offset: 4px; }
.gallery-family { display: grid; grid-template-columns: .9fr 1.1fr; gap: 50px; align-items: center; padding: clamp(60px,7vw,110px) clamp(24px,6vw,104px); background: oklch(93.5% .025 70); }
.gallery-family-copy { max-width: 440px; }.gallery-family h2 { margin-bottom: 24px; }
.gallery-family-books { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; align-items: center; padding: 10px 0 40px; }
.gallery-family-books a:first-child { transform: translateY(25px) rotate(-4deg); }.gallery-family-books a:last-child { transform: translateY(-20px) rotate(4deg); }.gallery-family-books img { width: 100%; height: auto; }
.gallery-invitation { text-align: center; padding: clamp(70px,9vw,140px) 24px; }.gallery-invitation > p:not(.gallery-eyebrow) { max-width: 540px; margin: 25px auto 0; }.gallery-invitation .gallery-actions { justify-content: center; }
.gallery-footer { background: var(--gallery-green); color: var(--gallery-paper); padding: 50px clamp(24px,6vw,104px) 30px; display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.gallery-footer-brand { text-decoration: none; font: 400 25px/1.2 var(--display); }.gallery-footer > p { font: 400 13px/1.5 var(--sans); justify-self: end; }
.gallery-footer nav { display: flex; gap: 24px; flex-wrap: wrap; font: 400 12px/1.6 var(--sans); }.gallery-footer nav a { text-decoration: none; }.gallery-footer > small { font: 400 10px/1.6 var(--sans); justify-self: end; align-self: end; }
.gallery-page :focus-visible { outline: 2px solid var(--gold-dark); outline-offset: 5px; }.gallery-hero :focus-visible, .gallery-footer :focus-visible { outline-color: var(--gallery-gold); }
@media(min-width:1700px) { .gallery-hero { padding-inline: max(6vw,calc((100vw - 1500px)/2)); } }
@media(max-width:960px) {
 .gallery-header { gap: 22px; padding: 13px 24px; }.gallery-store { display: none; }.gallery-hero { padding: 36px 32px 0; gap: 20px; }.gallery-hero h1 { font-size: 70px; }.gallery-book-host { height: 470px; }.gallery-hero-copy { padding-bottom: 35px; }.gallery-hero .gallery-actions { gap: 20px; }.gallery-section-head { gap: 30px; }.gallery-family { gap: 30px; }
}
@media(max-width:680px) {
 html { scroll-padding-top: 120px; }.gallery-header { display: grid; grid-template-columns: 1fr; gap: 10px; padding: 12px 22px 8px; }.gallery-brand { justify-self: center; margin-right: 0; }.gallery-brand img { width: 35px; height: 35px; }.gallery-brand span { font-size: 18px; }.gallery-brand small { font-size: 8px; margin-top: 4px; }.gallery-header nav { justify-content: center; gap: 32px; }.gallery-header nav a { font-size: 12px; padding: 8px 0; }
 .gallery-hero { grid-template-columns: 1fr; padding: 40px 24px 0; }.gallery-hero-copy { padding: 0; }.gallery-hero h1 { font-size: clamp(61px,14vw,88px); }.gallery-eyebrow { font-size: 9px; margin-bottom: 20px; }.gallery-lead { font-size: 14px; max-width: 380px; }.gallery-actions { margin-top: 24px; }.gallery-button { padding: 15px 19px; font-size: 12px; }
 .gallery-hero-object { margin-top: 16px; padding-bottom: 14px; }.gallery-object-index { display: none; }.gallery-book-host { height: 400px; }.gallery-object-caption { margin: 0; font-size: 22px; }.gallery-hero-bottom { padding: 18px 0; }.gallery-hero-bottom > span { max-width: 160px; }.gallery-hero-bottom a { align-self: center; }
 .gallery-section-head { grid-template-columns: 1fr; gap: 20px; margin-bottom: 42px; }.gallery-section-head > div:last-child { justify-self: start; }.gallery-section-head h2,.gallery-family h2,.gallery-invitation h2 { font-size: 40px; }.gallery-shelf { grid-template-columns: 1fr; gap: 44px; }.gallery-shelf article { display: grid; grid-template-columns: .85fr 1fr; gap: 24px; align-items: center; }.gallery-shelf-cover { padding: 0; height: auto; }.gallery-shelf-cover img { height: auto; }.gallery-book-label { margin: 0; padding-top: 16px; }.gallery-book-label h3 { font-size: 25px; }
 .gallery-family { grid-template-columns: 1fr; padding-bottom: 70px; gap: 65px; }.gallery-family-books { gap: 26px; max-width: 430px; padding-inline: 10px; }.gallery-footer { grid-template-columns: 1fr; padding-top: 38px; }.gallery-footer > p,.gallery-footer > small { justify-self: start; }.gallery-footer nav { margin: 12px 0; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior: auto !important; }.gallery-page *, .gallery-page *::before { animation: none !important; transition: none !important; }.gallery-book-host.book-3d--ready > img { opacity: 1; } }
