/* Native gallery shares the existing service cards and destination palette. */
.slt-gallery-card { position: relative; }
.slt-gallery-card__count { display: inline-flex; align-items: center; gap: 12px; position: absolute; inset-inline-start: 16px; top: 16px; z-index: 3; padding: 7px 12px; border-radius: 999px; color: #fff; background: rgba(0,35,72,.78); font-size: 13px; }
.slt-gallery-card__count > span { display: inline-flex; align-items: center; gap: 6px; }
.slt-gallery-card__count i { color: #FFB703; }
.slt-gallery-card .details h3 { overflow-wrap: anywhere; }
.slt-gallery-intro { max-width: 860px; margin-bottom: 30px; }
.slt-gallery-back { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; color: #8ECAE6; margin-bottom: 16px; }
[dir="rtl"] .slt-gallery-back i { transform: rotate(180deg); }
.slt-gallery-description { color: #C9DEEC; line-height: 1.8; overflow-wrap: anywhere; }
.slt-gallery-description p { margin-bottom: 16px; line-height: 1.8; }
.slt-gallery-description img { max-width: 100%; height: auto; }
.slt-gallery-tools { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 26px; flex-wrap: wrap; }
.slt-gallery-filters { display: flex; gap: 8px; flex-wrap: wrap; }
.slt-gallery-filters[hidden], .slt-media-tile[hidden], .slt-gallery-empty[hidden] { display: none !important; }
.slt-gallery-filters button { min-height: 44px; padding: 9px 22px; border-radius: 999px; color: #C9DEEC; background: transparent; border: 1px solid rgba(142,202,230,.3); line-height: 1.4; font: inherit; }
.slt-gallery-filters button[aria-pressed="true"] { color: #003060; background: #8ECAE6; border-color: #8ECAE6; }
.slt-gallery-filters button:focus-visible, .slt-media-link:focus-visible, .slt-gallery-back:focus-visible { outline: 2px solid #FFB703; outline-offset: 4px; }
.slt-gallery-count { color: #C9DEEC; font-size: 14px; }
.slt-media-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; }
.slt-media-tile { margin: 0; min-width: 0; background: #0A416F; border: 1px solid rgba(142,202,230,.19); border-radius: 18px; overflow: hidden; }
.slt-media-link { position: relative; display: block; aspect-ratio: 4 / 3; overflow: hidden; background: #002348; }
.slt-media-link img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .45s ease; }
.slt-media-link::after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg,rgba(0,35,72,.65),transparent 58%); pointer-events: none; }
.slt-media-kind { position: absolute; inset-inline-start: 14px; bottom: 14px; z-index: 2; padding: 6px 12px; border: 1px solid rgba(142,202,230,.3); border-radius: 999px; background: rgba(0,35,72,.7); font-size: 13px; }
.slt-media-open { display: inline-flex; align-items: center; justify-content: center; width: 52px; height: 52px; position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: 2; border-radius: 50%; background: rgba(0,48,96,.78); color: #FFB703; border: 1px solid rgba(142,202,230,.5); font-size: 19px; }
.slt-media-tile[data-gallery-kind="image"] .slt-media-open { opacity: 0; transition: opacity .25s ease; }
.slt-media-link:hover img { transform: scale(1.045); }
.slt-media-link:hover .slt-media-open, .slt-media-link:focus .slt-media-open { opacity: 1; }
.slt-media-tile figcaption { padding: 15px 18px; font-size: 15px; line-height: 1.7; color: #C9DEEC; overflow-wrap: anywhere; }
.slt-gallery-empty { padding: 30px; border: 1px solid rgba(142,202,230,.25); border-radius: 16px; background: #0A416F; line-height: 1.7; }
.fancybox-container .fancybox-button { background: #003060; color: #fff; }
.fancybox-container .fancybox-caption { background: linear-gradient(0deg,rgba(0,35,72,.96),transparent); }
@media (max-width: 1099px) { .slt-media-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px; } }
@media (max-width: 599px) {
    .slt-media-grid { grid-template-columns: minmax(0,1fr); gap: 18px; }
    .slt-gallery-filters { width: 100%; }
    .slt-gallery-filters button { padding-inline: 20px; }
    .slt-gallery-intro { margin-bottom: 24px; }
    .slt-media-tile[data-gallery-kind="image"] .slt-media-open { opacity: 1; width: 44px; height: 44px; font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) { .slt-media-link img, .slt-media-open { transition: none !important; } .slt-media-link:hover img { transform: none; } }
