.rng-gallery-shell {
  --rng-navy: #123f6d;
  --rng-navy-deep: #071c31;
  --rng-teal: #24a8b7;
  --rng-paper: #fffdf9;
  --rng-page: min(1180px, calc(100vw - 80px));
  width: 100%;
}
.rng-gallery-shell,
.rng-gallery-shell * { box-sizing: border-box; }
.rng-gallery { width: var(--rng-page); margin: 0 auto; display: grid; grid-template-columns: repeat(12,minmax(0,1fr)); grid-auto-flow: row; gap: 14px; }
.rng-gallery__tile { grid-column: span 4; height: 330px; position: relative; padding: 0; border: 0; border-radius: 0; overflow: hidden; background: var(--rng-navy); color: #fff; cursor: zoom-in; text-align: left; appearance: none; font: inherit; }
.rng-gallery__tile--wide { grid-column: span 8; }
.rng-gallery__tile--tall { grid-column: span 4; grid-row: span 2; height: 674px; }
.rng-gallery--count-1 .rng-gallery__tile { grid-column: 1 / -1; height: clamp(420px,58vw,720px); }
.rng-gallery__tile img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform .45s ease, filter .45s ease; }
.rng-gallery__tile::after { content: ""; position: absolute; inset: 35% 0 0; background: linear-gradient(transparent,rgba(6,25,43,.78)); pointer-events: none; }
.rng-gallery__tile > span { position: absolute; z-index: 1; left: 24px; right: 24px; bottom: 22px; display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; pointer-events: none; }
.rng-gallery__tile b { font-family: Oswald,"Arial Narrow",sans-serif; font-size: 24px; line-height: 1.08; font-weight: 500; text-transform: uppercase; letter-spacing: .01em; }
.rng-gallery__tile small { max-width: 170px; color: rgba(255,255,255,.8); font-size: 9px; line-height: 1.5; text-align: right; text-transform: uppercase; letter-spacing: .1em; }
.rng-gallery__tile:hover img { transform: scale(1.035); filter: saturate(1.05); }
.rng-gallery__tile:focus-visible { outline: 3px solid var(--rng-teal); outline-offset: 3px; }
.rng-gallery--mode-swipe { --rng-swipe-card: clamp(340px,47vw,560px); display: flex; grid-template-columns: none; gap: 14px; overflow-x: auto; overscroll-behavior-inline: contain; scroll-behavior: smooth; scroll-snap-type: x mandatory; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.rng-gallery--mode-swipe::-webkit-scrollbar { display: none; }
.rng-gallery--mode-swipe::after { content: ""; flex: 0 0 max(0px,calc(100% - var(--rng-swipe-card) - 14px)); }
.rng-gallery--mode-swipe .rng-gallery__tile,
.rng-gallery--mode-swipe .rng-gallery__tile--wide,
.rng-gallery--mode-swipe .rng-gallery__tile--tall,
.rng-gallery--mode-swipe.rng-gallery--count-1 .rng-gallery__tile { flex: 0 0 var(--rng-swipe-card); width: var(--rng-swipe-card); height: clamp(380px,40vw,560px); grid-column: auto; grid-row: auto; scroll-snap-align: start; scroll-snap-stop: always; }
.rng-gallery__controls { width: var(--rng-page); margin: 18px auto 0; display: flex; align-items: center; justify-content: flex-end; gap: 10px; color: var(--rng-navy-deep); }
.rng-gallery__controls button { width: 44px; height: 44px; padding: 0; border: 1px solid rgba(7,28,49,.24); border-radius: 50%; display: inline-grid; place-items: center; background: transparent; color: currentColor; cursor: pointer; font: 18px/1 Arial,sans-serif; transition: border-color .2s ease,background-color .2s ease,color .2s ease; }
.rng-gallery__controls button:hover,
.rng-gallery__controls button:focus-visible { border-color: var(--rng-navy-deep); background: var(--rng-navy-deep); color: #fff; }
.rng-gallery__controls button:disabled { opacity: .32; cursor: default; }
.rng-gallery__controls span { min-width: 70px; color: currentColor; font-size: 10px; line-height: 1; text-align: center; letter-spacing: .12em; }
.rng-lightbox { width: min(1120px,calc(100vw - 48px)); max-width: none; max-height: calc(100svh - 48px); padding: 0; border: 0; border-radius: 0; overflow: hidden; background: var(--rng-navy-deep); color: #fff; box-shadow: 0 30px 120px rgba(0,0,0,.55); }
.rng-lightbox::backdrop { background: rgba(3,16,27,.9); backdrop-filter: blur(8px); }
.rng-lightbox figure { margin: 0; display: grid; }
.rng-lightbox figure > img { width: 100%; height: auto; max-height: calc(100svh - 105px); display: block; object-fit: contain; }
.rng-lightbox figcaption { min-height: 64px; padding: 14px 82px 14px 22px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.rng-lightbox figcaption span { display: flex; align-items: baseline; gap: 18px; }
.rng-lightbox figcaption b { font-family: Oswald,"Arial Narrow",sans-serif; font-size: 18px; text-transform: uppercase; }
.rng-lightbox figcaption small { color: rgba(255,255,255,.7); font-size: 10px; text-transform: uppercase; letter-spacing: .1em; }
.rng-lightbox figcaption i { color: rgba(255,255,255,.55); font-size: 10px; font-style: normal; letter-spacing: .12em; }
.rng-lightbox__close { position: absolute; z-index: 3; top: 12px; right: 12px; width: 44px; height: 44px; padding: 0; border: 1px solid rgba(255,255,255,.35); border-radius: 50%; background: rgba(7,28,49,.82); color: #fff; cursor: pointer; font-size: 28px; line-height: 1; }
.rng-lightbox__nav { position: absolute; z-index: 2; top: 50%; width: 48px; height: 64px; padding: 0; border: 0; transform: translateY(-50%); background: rgba(7,28,49,.74); color: #fff; cursor: pointer; font-size: 38px; line-height: 1; }
.rng-lightbox__nav--prev { left: 0; border-radius: 0; }
.rng-lightbox__nav--next { right: 0; border-radius: 0; }
.rng-gallery-notice { padding: 18px 20px; border-left: 4px solid var(--rng-teal,#24a8b7); background: #fff; }
@media (max-width: 820px) {
  .rng-gallery-shell { --rng-page: calc(100vw - 40px); }
  .rng-gallery { gap: 10px; }
  .rng-gallery--mode-swipe { --rng-swipe-card: min(68vw,500px); }
  .rng-gallery__tile,.rng-gallery__tile--tall { grid-column: span 6; grid-row: auto; height: 290px; }
  .rng-gallery__tile--wide { grid-column: span 12; }
  .rng-gallery--mode-swipe .rng-gallery__tile,
  .rng-gallery--mode-swipe .rng-gallery__tile--wide,
  .rng-gallery--mode-swipe .rng-gallery__tile--tall,
  .rng-gallery--mode-swipe.rng-gallery--count-1 .rng-gallery__tile { flex-basis: var(--rng-swipe-card); width: var(--rng-swipe-card); height: clamp(360px,72vw,520px); }
}
@media (max-width: 560px) {
  .rng-gallery { width: 100%; padding: 0 18px 12px; display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-inline: contain; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
  .rng-gallery--mode-swipe { --rng-swipe-card: 82vw; }
  .rng-gallery::-webkit-scrollbar { display: none; }
  .rng-gallery__tile,.rng-gallery__tile--wide,.rng-gallery__tile--tall,.rng-gallery--count-1 .rng-gallery__tile { flex: 0 0 82vw; width: 82vw; height: clamp(340px,112vw,430px); grid-column: auto; grid-row: auto; border-radius: 0; scroll-snap-align: center; }
  .rng-gallery--mode-swipe .rng-gallery__tile,
  .rng-gallery--mode-swipe .rng-gallery__tile--wide,
  .rng-gallery--mode-swipe .rng-gallery__tile--tall,
  .rng-gallery--mode-swipe.rng-gallery--count-1 .rng-gallery__tile { flex-basis: var(--rng-swipe-card); width: var(--rng-swipe-card); height: clamp(340px,112vw,430px); scroll-snap-align: center; }
  .rng-gallery__controls { width: calc(100% - 36px); margin-top: 12px; }
  .rng-gallery__controls { display: none; }
  .rng-gallery__tile > span { left: 18px; right: 18px; bottom: 18px; align-items: flex-start; flex-direction: column; gap: 4px; }
  .rng-gallery__tile b { font-size: 17px; line-height: 1.15; letter-spacing: .008em; }
  .rng-gallery__tile small { max-width: none; text-align: left; }
  .rng-lightbox { width: calc(100vw - 20px); max-height: calc(100svh - 20px); border-radius: 0; }
  .rng-lightbox figure > img { max-height: calc(100svh - 104px); }
  .rng-lightbox figcaption { min-height: 84px; padding: 12px 58px 12px 16px; align-items: flex-start; flex-direction: column; gap: 3px; }
  .rng-lightbox figcaption span { align-items: flex-start; flex-direction: column; gap: 0; }
  .rng-lightbox figcaption b { font-size: 16px; }
  .rng-lightbox figcaption small { font-size: 8px; }
  .rng-lightbox__nav { width: 42px; height: 56px; font-size: 32px; }
}
@media (prefers-reduced-motion: reduce) {
  .rng-gallery__tile img { transition: none; }
  .rng-gallery__tile:hover img { transform: none; }
}
