/* Room galleries (2026-10-24): each room page is a wall to wander along. Prints hang on the room's wall colour,
   broken up by furniture and plants; a click shows the print on its own. */
.rg { --wall: #efe7dc; --ink: #2a1a12; --muted: rgba(42, 26, 18, .66); --cap-bg: transparent;
  margin: clamp(28px, 4vw, 48px) calc(-1 * var(--gutter)); padding: clamp(36px, 5vw, 72px) var(--gutter) clamp(48px, 6vw, 88px);
  background: var(--wall); color: var(--ink);
  background-image: radial-gradient(ellipse at 18% 0%, rgba(255, 255, 255, .35), transparent 60%), radial-gradient(ellipse at 92% 100%, rgba(0, 0, 0, .06), transparent 55%); }
.rg--dark { --ink: #f3ece0; --muted: rgba(243, 236, 224, .7); }
.rg__grid { display: grid; grid-template-columns: repeat(12, 1fr); gap: clamp(14px, 2vw, 28px); max-width: 1320px; margin: 0 auto; grid-auto-flow: dense; }
.rg__grid > * { margin: 0; position: relative; min-width: 0; }
.rg .s3 { grid-column: span 3 } .rg .s4 { grid-column: span 4 } .rg .s5 { grid-column: span 5 } .rg .s6 { grid-column: span 6 } .rg .s8 { grid-column: span 8 }
.rg__vig img, .rg__scene img { display: block; width: 100%; height: 100%; object-fit: cover; border-radius: 3px; }
/* a print hanging on the wall */
.rg__art { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: clamp(18px, 4vw, 56px) 0; background: none; border: 0; cursor: zoom-in; color: inherit; font: inherit; text-align: center; }
.rg__frame { display: inline-block; padding: var(--fw, 11px); box-shadow: 0 1px 0 rgba(255, 255, 255, .35) inset, 0 22px 34px -14px rgba(30, 20, 10, .5), 0 6px 10px -4px rgba(30, 20, 10, .25); transition: transform .35s ease, box-shadow .35s ease; }
.rg__frame--natural { background: linear-gradient(135deg, #d9bb8f, #c9a77a 35%, #a8845a 70%, #c49f6e); }
.rg__frame--black { background: linear-gradient(135deg, #3a3633, #1d1b19 45%, #121110); }
.rg__frame--white { background: linear-gradient(135deg, #ffffff, #f1eee9 50%, #e3dfd8); }
.rg__mount { display: block; background: #fbfaf6; padding: 9%; box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .06), inset 0 3px 6px rgba(0, 0, 0, .08); }
.rg__mount img { display: block; width: 100%; height: auto; }
.rg__art:hover .rg__frame, .rg__art:focus-visible .rg__frame { transform: translateY(-4px); box-shadow: 0 1px 0 rgba(255, 255, 255, .35) inset, 0 30px 44px -14px rgba(30, 20, 10, .55), 0 8px 12px -4px rgba(30, 20, 10, .25); }
.rg__art:focus-visible { outline: 2px solid currentColor; outline-offset: 6px; }
.rg__cap { margin-top: 16px; font-size: .9rem; line-height: 1.35; max-width: 22em; }
.rg__cap b { display: block; font-weight: 600; }
.rg__cap span { color: var(--muted); }
.rg .w-l .rg__frame { width: min(80%, 360px) } .rg .w-m .rg__frame { width: min(68%, 290px) } .rg .w-sq .rg__frame { width: min(72%, 300px) } .rg .w-land .rg__frame { width: min(90%, 460px) }
.rg__quote { display: flex; align-items: center; padding: 20px 0; }
.rg__quote p { font-size: clamp(1.3rem, 2.3vw, 1.9rem); line-height: 1.25; margin: 0; letter-spacing: -.01em; max-width: none; }
.rg__hint { max-width: 1320px; margin: 0 auto 22px; font-size: .95rem; color: var(--muted); }
h2.rg-buy { margin-top: 0; }
/* the print on its own */
.rg-lb { position: fixed; inset: 0; z-index: 60; background: var(--lbwall, #efe7dc); color: var(--lbink, #2a1a12); display: none; grid-template-columns: 1fr minmax(260px, 360px); align-items: center; gap: 40px; padding: 40px clamp(16px, 5vw, 80px); }
.rg-lb.on { display: grid; }
.rg-lb__art { display: flex; justify-content: center; align-items: center; height: calc(100vh - 80px); }
.rg-lb__art .rg__frame { --fw: 18px; }
.rg-lb__art .rg__mount img { max-height: calc(100vh - 220px); width: auto; max-width: 100%; }
.rg-lb__info h2 { font-size: clamp(1.6rem, 2.6vw, 2.2rem); line-height: 1.05; margin: 0 0 .5rem; }
.rg-lb__info p { margin: 0 0 .4rem; opacity: .75; }
.rg-lb__info .rg-lb__price { opacity: 1; font-size: 1.1rem; margin: 1.1rem 0; }
.rg-lb__info .btn { margin: .3rem .4rem 0 0; }
.rg-lb .btn--outline { color: inherit; border-color: currentColor; }
.rg-lb__x, .rg-lb__nav { position: absolute; background: none; border: 0; font-size: 30px; line-height: 1; color: inherit; cursor: pointer; padding: 12px; }
.rg-lb__x { top: 12px; right: 16px; } .rg-lb__prev { left: 6px; top: 50%; } .rg-lb__next { right: 6px; top: 50%; }
@media (max-width: 900px) {
  .rg__grid { grid-template-columns: repeat(6, 1fr); }
  .rg .s3, .rg .s4 { grid-column: span 3 } .rg .s5, .rg .s6, .rg .s8 { grid-column: span 6 }
  .rg__art { padding: 14px 0; }
  .rg__quote { padding: 4px 0 8px; }
  .rg-lb { grid-template-columns: 1fr; align-content: center; gap: 14px; overflow: auto; padding: 56px 20px 28px; }
  .rg-lb__art { height: auto; } .rg-lb__art .rg__mount img { max-height: 52vh; }
}
@media (prefers-reduced-motion: reduce) { .rg__frame { transition: none; } }
@media (max-width: 900px) { .rg-lb__prev, .rg-lb__next { top: 12px; } .rg-lb__prev { left: 10px; } .rg-lb__next { right: auto; left: 56px; } }
