/* Theme C gallery page */
.rg-page .site-header:not(.is-scrolled) { color: var(--ivory); }

/* Hero: a framed landscape sheet with one line of copy */
.rg-hero { position: relative; isolation: isolate; display: flex; align-items: flex-end; min-height: clamp(560px, 92svh, 940px); margin: var(--sheet-inset); padding: 0 var(--gutter) clamp(56px, 8vh, 96px); overflow: clip; color: var(--ivory); border-radius: var(--sheet-r); background: var(--forest-deep); }
.rg-hero-media, .rg-hero-media img { position: absolute; z-index: -2; inset: 0; width: 100%; height: 100%; }
.rg-hero-media img { object-fit: cover; object-position: 50% 60%; }
.rg-hero::after { position: absolute; z-index: -1; inset: 0; content: ''; background: linear-gradient(0deg, rgb(23 34 25 / 88%), rgb(23 34 25 / 35%) 45%, rgb(23 34 25 / 10%) 70%), linear-gradient(180deg, rgb(23 34 25 / 55%), transparent 25%); }
.rg-hero-copy { max-width: 760px; }
.rg-hero .eyebrow { margin-bottom: 22px; color: var(--blush); }
.rg-hero h1 { font-size: clamp(48px, 7vw, 112px); line-height: .98; letter-spacing: -.06em; }
.rg-hero h1 em { color: var(--blush); }
.rg-hero-copy > p:not(.eyebrow) { max-width: 460px; margin-top: 22px; font-size: 18px; line-height: 1.5; color: #e2e6dc; }
.rg-hero-cue { position: absolute; right: var(--gutter); bottom: clamp(56px, 8vh, 96px); padding-block: 12px; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--ivory); border-bottom: 1px solid rgb(245 239 231 / 50%); }
@supports (animation-timeline: view()) { @media (prefers-reduced-motion: no-preference) {
 .rg-hero-media img { animation: rg-hero linear both; animation-timeline: view(); animation-range: exit 0% exit 100%; }
 @keyframes rg-hero { to { transform: scale(1.08) translateY(4%); } }
} }

/* Sticky filter chips; one scrollable row on phones */
.rg-filterbar { position: sticky; z-index: 30; top: var(--hdr, 80px); transition: top .5s var(--ease); padding-block: 16px; background: rgb(245 239 231 / 92%); backdrop-filter: blur(10px); border-bottom: 1px solid var(--line); }
.rg-page:has(.site-header.is-hidden) .rg-filterbar { top: 0; }
.rg-filters { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.rg-filters::-webkit-scrollbar { display: none; }
.rg-filters button { flex: none; display: inline-flex; align-items: baseline; gap: 6px; min-height: 44px; padding: 10px 20px; color: var(--ink); background: transparent; border: 1px solid var(--line); border-radius: 999px; font: inherit; font-size: 14px; cursor: pointer; transition: color .4s var(--ease-out), background-color .4s var(--ease-out), border-color .4s var(--ease-out); }
.rg-filters button sup { font-size: 10px; color: var(--muted); }
.rg-filters button:hover { border-color: var(--wine); color: var(--wine); }
.rg-filters button[aria-pressed="true"] { color: var(--ivory); background: var(--wine); border-color: var(--wine); }
.rg-filters button[aria-pressed="true"] sup { color: var(--blush); }

/* Photo book grid */
.rg-archive { padding-bottom: 120px; }
.rg-grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: clamp(36px, 4vw, 64px) clamp(16px, 2vw, 28px); padding-top: clamp(48px, 6vw, 88px); view-transition-name: rg-grid; }
.rg-item { margin: 0; }
.rg-open { display: block; width: 100%; padding: 0; overflow: hidden; background: var(--sand); border: 0; border-radius: 6px; cursor: pointer; }
.rg-open img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease-out); }
.rg-open:hover img, .rg-open:focus-visible img { transform: scale(1.03); }
.rg-open:focus-visible { outline: 2px solid var(--wine); outline-offset: 4px; }
.rg-item figcaption { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; padding-top: 14px; color: var(--ink); font-size: 15px; line-height: 1.4; }
.rg-item figcaption span { color: var(--wine); font-size: 10.5px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; }
.rg-big { grid-column: span 7; } .rg-big .rg-open { aspect-ratio: 4 / 5; }
.rg-open img { object-position: var(--fp, 50% 35%); }
.rg-side { grid-column: span 5; align-self: end; } .rg-side .rg-open { aspect-ratio: 4 / 5; }
.rg-third { grid-column: span 4; } .rg-third .rg-open { aspect-ratio: 3 / 4; }
.rg-half { grid-column: span 6; } .rg-half .rg-open { aspect-ratio: 4 / 5; }
.rg-wide { grid-column: 1 / -1; } .rg-wide .rg-open { aspect-ratio: 21 / 9; }
.rg-third:nth-child(3n + 2) { margin-top: 64px; }
@supports (animation-timeline: view()) { @media (prefers-reduced-motion: no-preference) {
 .rg-item { animation: rg-rise linear both; animation-timeline: view(); animation-range: entry 0% entry 60%; }
 @keyframes rg-rise { from { opacity: 0; transform: translateY(60px); } to { opacity: 1; transform: none; } }
} }
::view-transition-old(rg-grid), ::view-transition-new(rg-grid) { animation-duration: .45s; }

@media (max-width: 900px) {
 .rg-big, .rg-side, .rg-half { grid-column: span 6; }
 .rg-third { grid-column: span 6; } .rg-third:nth-child(3n + 2) { margin-top: 0; }
 .rg-wide .rg-open { aspect-ratio: 16 / 9; }
}
@media (max-width: 700px) {
 .rg-filterbar { top: var(--hdr, 84px); padding-block: 12px; }
 .rg-grid { grid-template-columns: 1fr; gap: 40px; }
 .rg-big, .rg-side, .rg-half, .rg-third, .rg-wide { grid-column: 1 / -1; }
 .rg-big .rg-open, .rg-side .rg-open, .rg-half .rg-open, .rg-third .rg-open { aspect-ratio: 4 / 5; }
 .rg-wide .rg-open { aspect-ratio: 3 / 2; }
 .rg-hero { align-items: flex-end; min-height: 82svh; }
 .rg-hero-media img { object-position: 62% 60%; }
 .rg-hero-cue { position: static; display: inline-block; margin-top: 24px; }
 .rg-hero { flex-direction: column; justify-content: flex-end; align-items: flex-start; }
}

/* Closing call to action: full-width burgundy chapter; the footer slides over it */
.rg-archive { padding-bottom: clamp(72px, 8vw, 110px); }
.rg-cta { position: relative; z-index: 1; padding-block: clamp(80px, 9vw, 130px) calc(clamp(80px, 9vw, 130px) + var(--sheet-r)); color: var(--ivory); border-radius: var(--sheet-r) var(--sheet-r) 0 0; background: var(--burgundy); }
.rg-cta-inner { display: grid; grid-template-columns: 1.15fr .85fr; align-items: center; gap: 48px clamp(40px, 7vw, 120px); }
.rg-cta .eyebrow { margin-bottom: 22px; color: var(--blush); }
.rg-cta h2 { color: var(--ivory); font-size: clamp(48px, 6vw, 100px); line-height: .98; letter-spacing: -.06em; }
.rg-cta h2 em { color: var(--blush); }
.rg-cta-copy > p:not(.eyebrow) { max-width: 480px; margin-top: 26px; color: #e4cdc8; font-size: 17px; line-height: 1.6; }
.rg-cta-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; margin-top: 36px; }
.rg-cta .button { color: var(--wine-dark); background: var(--ivory); border-color: var(--ivory); --fill: var(--forest); }
.rg-cta .button:hover { color: var(--ivory); border-color: var(--forest); }
.rg-cta .text-link { color: var(--ivory); }
.rg-cta-photo { margin: 0; transform: rotate(2deg); }
.rg-cta-photo img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; border-radius: 6px; box-shadow: 0 40px 80px -40px rgb(0 0 0 / 70%); }
.rg-cta-photo figcaption { margin-top: 12px; color: #cfaaa4; font-family: Fraunces, var(--brand-serif); font-size: 16px; font-style: italic; font-weight: 300; }
.rg-page .site-footer { margin-top: calc(var(--sheet-r) * -1); }
@media (max-width: 800px) {
 .rg-cta-inner { grid-template-columns: 1fr; }
 .rg-cta-photo { order: -1; width: 78%; margin-inline: auto; transform: rotate(2deg); }
 .rg-cta-actions .button { flex: 1 1 100%; justify-content: center; }
 .rg-cta-actions .text-link { margin-inline: auto; }
}

/* Lightbox */
.rg-lightbox { width: 100%; max-width: none; height: 100%; max-height: none; margin: 0; padding: 0; color: var(--ivory); background: rgb(23 18 20 / 96%); border: 0; }
.rg-lightbox[open] { display: grid; grid-template-columns: 80px 1fr 80px; align-items: center; }
.rg-lightbox::backdrop { background: rgb(23 18 20 / 70%); }
.rg-lb-figure { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; margin: 0; padding: 72px 0 24px; }
.rg-lb-figure picture { display: contents; }
.rg-lb-figure img { max-width: 100%; max-height: calc(100svh - 190px); object-fit: contain; border-radius: 4px; }
.rg-lb-figure figcaption { display: flex; align-items: end; justify-content: space-between; gap: 20px; width: min(100%, 980px); margin-top: 18px; }
.rg-lb-figure .eyebrow { display: block; margin-bottom: 6px; color: var(--rose); }
.rg-lb-title { font-family: Fraunces, var(--brand-serif); font-size: 22px; font-style: italic; font-weight: 300; }
.rg-lb-side { display: flex; align-items: center; gap: 22px; }
.rg-lb-cta { padding: 10px 18px; color: var(--wine-dark); background: var(--ivory); border-radius: 999px; font-size: 13px; white-space: nowrap; }
.rg-lb-cta:hover { background: var(--blush); }
.rg-lb-count { color: #b9a9a6; font-size: 12px; letter-spacing: .1em; }
.rg-lb-close { position: absolute; z-index: 2; top: 16px; right: 20px; min-height: 44px; color: var(--ivory); background: none; border: 0; font-size: 13px; cursor: pointer; }
.rg-lb-close span { margin-left: 8px; font-size: 22px; }
.rg-lb-nav { justify-self: center; width: 52px; height: 52px; color: var(--ivory); background: none; border: 1px solid rgb(245 239 231 / 30%); border-radius: 50%; font-size: 18px; cursor: pointer; transition: background .3s, border-color .3s; }
.rg-lb-nav:hover { background: var(--wine); border-color: var(--wine); }
@media (max-width: 700px) {
 .rg-lightbox[open] { grid-template-columns: 1fr; }
 .rg-lb-nav { position: absolute; bottom: 18px; width: 48px; height: 48px; }
 .rg-lb-prev { left: 16px; } .rg-lb-next { right: 16px; }
 .rg-lb-figure { padding: 64px 16px 84px; }
 .rg-lb-figure img { max-height: calc(100svh - 260px); }
 .rg-lb-figure figcaption { flex-direction: column; align-items: flex-start; }
}

/* ---------- Mobile pass (13 Nov) ---------- */
@media (max-width: 700px) {
 /* Chips: fade at the edge so the row reads as swipeable */
 .rg-filters { margin-right: calc(var(--gutter) * -1); padding-right: 40px; -webkit-mask-image: linear-gradient(90deg, #000 82%, transparent); mask-image: linear-gradient(90deg, #000 82%, transparent); }
 /* Photo book on a phone: big and wide photos stay full width, the rest pair up two by two */
 .rg-grid { grid-template-columns: 1fr 1fr; gap: 32px 12px; }
 .rg-third, .rg-half { grid-column: span 1; }
 .rg-third .rg-open, .rg-half .rg-open { aspect-ratio: 3 / 4; }
 .rg-item figcaption { padding-top: 10px; font-size: 13px; line-height: 1.35; }
 .rg-item figcaption span { font-size: 10px; letter-spacing: .14em; }
 .rg-big, .rg-side, .rg-wide { grid-column: 1 / -1; }
}
@media (max-width: 700px) { .rg-item.rg-solo { grid-column: 1 / -1; } .rg-solo .rg-open { aspect-ratio: 4 / 5 !important; } }
