.gallery-page { background: #fffdf8; }
.gallery-page-hero { text-align: center; padding: 65px 0 55px; background: radial-gradient(ellipse at center, #eaf4df, #f8fbf4); }
.gallery-page-hero h1 { font-size: clamp(2.6rem, 5vw, 4.6rem); line-height: 1.08; letter-spacing: -.035em; margin: 18px 0; }
.gallery-page-hero h1 span { color: #287748; }
.gallery-page-hero p { color: #586b5b; }
.gallery-page-photos { padding: 40px 0 70px; }
.gallery-page-filters { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; }
.gallery-page-filters button { cursor: pointer; border: 1px solid #dce5d8; border-radius: 30px; padding: 11px 20px; background: white; color: #334e39; font-weight: 800; overflow-wrap: anywhere; max-width: 100%; }
.gallery-page-filters button[aria-pressed="true"] { color: white; background: #176c42; border-color: #176c42; }
.gallery-page-filters button span { opacity: .8; margin-left: 7px; }
.gallery-page-count { margin: 24px 0 16px; color: #62755f; font-size: .85rem; }
.gallery-page-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.gallery-page-photo { display: block; border-radius: 20px; overflow: hidden; border: 1px solid #e1e8dd; background: white; }
.gallery-page-photo img { width: 100%; height: auto; aspect-ratio: 5 / 4; object-fit: cover; transition: transform .2s; }
.gallery-page-photo:hover img { transform: scale(1.025); }
.gallery-page-photo > span { display: flex; justify-content: space-between; gap: 12px; padding: 16px 20px; font-weight: 800; overflow-wrap: anywhere; }
.gallery-page-photo > span i { color: #287748; }
.gallery-page-empty { padding: 65px 20px; text-align: center; border: 1px dashed #cadbc0; border-radius: 20px; }
.gallery-page-empty > i { color: #287748; font-size: 36px; }
.gallery-page-empty p { color: #62755f; }
.gallery-page-cta { display: flex; justify-content: space-between; align-items: center; gap: 24px; margin-top: 48px; padding: 30px; background: #edf4e5; border-radius: 24px; }
.gallery-page-cta h2 { font-size: 1.8rem; }
.gallery-page-cta p { color: #62755f; }
.gallery-page [hidden] { display: none !important; }
.gallery-page main :focus-visible { outline: 3px solid #287748; outline-offset: 4px; }
@media (max-width: 980px) { .gallery-page-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .gallery-page-grid { grid-template-columns: 1fr; gap: 18px; } .gallery-page-hero { padding: 40px 0; } .gallery-page-cta { align-items: flex-start; flex-direction: column; padding: 24px; } }
@media (prefers-reduced-motion: reduce) { .gallery-page-photo img { transition: none; } }

/* Category folders */
.gallery-folder-cover { position: relative; aspect-ratio: 5 / 4; background: #eaf2e2; display: grid; place-items: center; overflow: hidden; }
.gallery-folder-cover > i { font-size: 70px; color: #55935c; }
.gallery-folder-cover img { width: 100%; height: 100%; object-fit: cover; }
.gallery-folder-badge { position: absolute; left: 16px; bottom: 16px; padding: 8px 12px; border-radius: 12px; background: #fffffff2; color: #246b40; font-weight: 800; font-size: .8rem; }
.gallery-folder-back { display: inline-flex; align-items: center; gap: 8px; color: #246b40; font-weight: 800; margin-bottom: 15px; }
.gallery-page-hero h1 { overflow-wrap: anywhere; }

/* Category photo slider */
.gallery-slider { position: fixed; inset: 0; margin: auto; width: min(1180px, 96vw); max-width: 96vw; max-height: 94vh; max-height: 94dvh; padding: 18px; border: 1px solid #ffffff24; border-radius: 20px; background: #122219; color: white; overflow: auto; }
.gallery-slider::backdrop { background: #06110bee; }
.gallery-slider-toolbar, .gallery-slider-footer { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.gallery-slider-toolbar { margin-bottom: 12px; }
.gallery-slider-count { font-weight: 800; }
.gallery-slider button { display: grid; place-items: center; flex-shrink: 0; width: 44px; height: 44px; border: 1px solid #ffffff40; border-radius: 50%; background: #ffffff14; color: white; cursor: pointer; font-size: 32px; line-height: 1; }
.gallery-slider button:hover { background: #ffffff30; }
.gallery-slider-stage { display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; gap: 12px; align-items: center; }
.gallery-slider-image { grid-column: 2; width: 100%; height: min(65vh, 720px); height: min(65dvh, 720px); object-fit: contain; min-width: 0; user-select: none; }
.gallery-slider-prev { grid-column: 1; grid-row: 1; }
.gallery-slider-next { grid-column: 3; grid-row: 1; }
.gallery-slider-footer { margin-top: 14px; font-size: .85rem; }
.gallery-slider-caption { overflow-wrap: anywhere; }
.gallery-slider-original { flex-shrink: 0; text-decoration: underline; color: #dbedb4; }
.gallery-slider-error { padding: 12px; color: #ffe0a6; }
.gallery-slider [hidden] { display: none !important; }
.gallery-slider :focus-visible { outline: 3px solid #dcf4a4; outline-offset: 3px; }
@media (max-width: 600px) {
  .gallery-slider { padding: 12px; }
  .gallery-slider-stage { grid-template-columns: 1fr 1fr; gap: 12px; }
  .gallery-slider-image { grid-column: 1 / -1; grid-row: 1; height: 55vh; height: 55dvh; }
  .gallery-slider-prev, .gallery-slider-next { grid-row: 2; justify-self: center; }
  .gallery-slider-prev { grid-column: 1; }
  .gallery-slider-next { grid-column: 2; }
  .gallery-slider-footer { align-items: flex-start; flex-direction: column; gap: 8px; }
}

button.gallery-folder { width: 100%; text-align: left; padding: 0; font: inherit; color: inherit; cursor: pointer; }
button.gallery-folder:disabled { cursor: default; opacity: .65; }

/* Keep mobile navigation above the photo and easy to tap. */
.gallery-slider-stage { position: relative; }
.gallery-slider-prev, .gallery-slider-next { position: relative; z-index: 2; pointer-events: auto; touch-action: manipulation; }
.gallery-slider-image { touch-action: pan-y pinch-zoom; }
@media (max-width: 600px) {
  .gallery-slider-stage { grid-template-columns: 1fr 1fr; }
  .gallery-slider .gallery-slider-prev, .gallery-slider .gallery-slider-next { width: 56px; height: 48px; border-radius: 14px; background: #285439; }
}

/* Fullscreen lightbox with a filmstrip and mobile-safe controls. */
.gallery-slider{width:100%;max-width:100%;height:100vh;height:100dvh;max-height:100vh;max-height:100dvh;margin:0;padding:16px 24px;border:0;border-radius:0;background:rgba(8,10,9,.94);overflow:hidden;box-sizing:border-box}
.gallery-slider[open]{display:grid;grid-template-rows:48px minmax(0,1fr) auto auto;gap:12px}
.gallery-slider::backdrop{background:#0009}
.gallery-slider-toolbar{position:relative;margin:0;justify-content:center;padding-right:0}
.gallery-slider-count{background:#ffffff12;border-radius:22px;padding:6px 16px;font-size:.9rem}
.gallery-slider-close{position:absolute;right:0;top:0}
.gallery-slider-stage{display:flex;justify-content:center;align-items:center;min-height:0;padding:12px 64px}
.gallery-slider-image{width:auto;max-width:100%;height:auto;max-height:100%;object-fit:contain;border-radius:12px;grid-column:auto;grid-row:auto}
.gallery-slider .gallery-slider-prev,.gallery-slider .gallery-slider-next{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:48px;border:0;border-radius:50%;background:#ffffff18;grid-column:auto;grid-row:auto}
.gallery-slider-prev{left:0}.gallery-slider-next{right:0}
.gallery-slider-thumbnails{display:flex;gap:8px;overflow-x:auto;max-width:100%;width:max-content;margin:0 auto;padding:5px;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:#666 transparent;min-height:0}
.gallery-slider-thumbnails button{width:60px;height:60px;border-radius:9px;padding:0;overflow:hidden;border:2px solid transparent;opacity:.55}
.gallery-slider-thumbnails button[aria-current="true"]{border-color:white;opacity:1}.gallery-slider-thumbnails button:hover{opacity:1}
.gallery-slider-thumbnails img{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}
.gallery-slider-footer{margin:0;justify-content:center;font-size:.75rem;gap:18px;color:#ccc;min-width:0}
.gallery-slider-caption{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:70%}.gallery-slider-original{color:#ddd}
.gallery-slider-error{position:absolute;top:76px;left:50%;transform:translateX(-50%);z-index:3;background:#252525;border-radius:12px;width:min(80%,440px);font-size:.85rem}
.gallery-slider button{touch-action:manipulation}
@media(max-width:600px){
 .gallery-slider{padding: max(12px,env(safe-area-inset-top)) 12px max(12px,env(safe-area-inset-bottom))}
 .gallery-slider[open]{gap:10px;grid-template-rows:48px minmax(0,1fr) auto auto}
 .gallery-slider-stage{padding:0 0 60px}
 .gallery-slider-image{border-radius:8px;max-width:100%;max-height:100%}
 .gallery-slider .gallery-slider-prev,.gallery-slider .gallery-slider-next{top:auto;bottom:0;transform:none;width:52px;height:48px;border-radius:16px;background:#ffffff20}
 .gallery-slider-prev{left:calc(50% - 64px)}.gallery-slider-next{right:calc(50% - 64px)}
 .gallery-slider-thumbnails button{width:50px;height:50px}
 .gallery-slider-footer{flex-direction:row;align-items:center;justify-content:space-between;gap:8px;font-size:.7rem}
 .gallery-slider-caption{max-width:60%}
}
@media(max-height:500px) and (orientation:landscape){.gallery-slider[open]{grid-template-rows:40px minmax(0,1fr) 48px;gap:6px}.gallery-slider-footer{display:none}.gallery-slider-thumbnails button{width:38px;height:38px}.gallery-slider-stage{padding:0 60px}.gallery-slider .gallery-slider-prev,.gallery-slider .gallery-slider-next{top:50%;bottom:auto;transform:translateY(-50%);border-radius:50%}.gallery-slider-prev{left:0}.gallery-slider-next{right:0}}

/* Use all available stage space while preserving the complete photo. */
.gallery-slider-stage{overflow:hidden;padding:0 56px;min-width:0;min-height:0}
.gallery-slider-image{display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;transition:opacity .15s}
.gallery-slider-image.is-loading{opacity:0}
.gallery-image-loading{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;pointer-events:none}
.gallery-image-loading>span{width:42px;height:42px;border:3px solid #ffffff25;border-top-color:#a8d883;border-radius:50%;animation:gallery-photo-spin .8s linear infinite}
.gallery-image-loading small{color:#eee;font-size:.85rem}
.gallery-slider-thumbnails button{width:72px;height:64px}
@keyframes gallery-photo-spin{to{transform:rotate(360deg)}}
@media(max-width:600px){.gallery-slider-stage{padding:0 0 56px}.gallery-slider-thumbnails button{width:58px;height:54px}}
@media(max-height:500px) and (orientation:landscape){.gallery-slider-stage{padding:0 56px}.gallery-slider-thumbnails button{width:38px;height:38px}}
@media(prefers-reduced-motion:reduce){.gallery-image-loading>span{animation:none}.gallery-slider-image{transition:none}}

.gallery-albums{margin-top:40px}.gallery-albums>h2{font-size:1.8rem}.gallery-albums>p{color:#62755f;margin-bottom:20px}.gallery-album{border:1px solid #dce5d7;border-radius:16px;margin:12px 0;background:white;overflow:hidden}.gallery-album summary{padding:18px;cursor:pointer;font-weight:800}.gallery-album summary span{font-size:.8rem;color:#62755f;margin-left:12px}.gallery-album-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding:18px}.gallery-album-grid figure{margin:0;min-width:0}.gallery-album-grid img{width:100%;height:auto;aspect-ratio:5/4;object-fit:cover;border-radius:12px}.gallery-album-grid figcaption{font-size:.8rem;padding:8px 0;color:#50654e}@media(max-width:600px){.gallery-album-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:12px}}