/* Gallery: landing page section, popup and the /gallery/ pages. */

[hidden]{display:none!important}

.gal{padding:48px 0;overflow:hidden;background:linear-gradient(180deg,#fff,var(--bg))}
.gal-head{text-align:center}
.gal-head h2{font-size:clamp(1.8rem,4vw,2.5rem);line-height:1.12;font-weight:800;letter-spacing:-.015em;color:var(--navy)}
.gal-head .kicker{margin-bottom:8px}
.gal-tabs{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:18px 0 8px}
.gal-tabs button,.g-filters a{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border-radius:999px;font-weight:700;color:var(--navy);background:#fff;box-shadow:inset 0 0 0 1.5px var(--line);transition:background .2s,color .2s}
.gal-tabs button[aria-pressed=true],.g-filters a[aria-current]{color:#fff;background:linear-gradient(100deg,var(--navy),var(--blue));box-shadow:none}

/* Coverflow: position comes from each card's offset from the centre */
.gal-stage{position:relative;height:300px;margin-top:12px;perspective:1300px;touch-action:pan-y}
.gal-card{--o:0;--a:0;position:absolute;left:50%;top:50%;width:min(76vw,560px);aspect-ratio:16/10;padding:0;overflow:hidden;border-radius:20px;background:var(--navy);box-shadow:var(--shadow);transform:translate(-50%,-50%) translateX(calc(var(--o)*62%)) translateZ(calc(var(--a)*-190px)) rotateY(calc(var(--o)*-34deg));opacity:calc(1 - var(--a)*.28);cursor:pointer;transition:transform .7s var(--ease),opacity .5s;will-change:transform}
.gal-card.far{opacity:0;visibility:hidden;pointer-events:none}
.gal-card img{display:block;width:100%;height:100%;object-fit:cover}
.gal-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(8,28,76,.9))}
.gal-cap{position:absolute;left:18px;right:18px;bottom:14px;z-index:1;color:#fff;text-align:left}
.gal-cap small{display:block;font-size:.74rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--lime)}
.gal-cap strong{display:block;font-size:1.08rem;line-height:1.25}
.gal-card:not(.on) .gal-cap{opacity:0;transition:opacity .3s}
.g-play{position:absolute;left:50%;top:50%;z-index:1;width:64px;height:64px;margin:-32px;border-radius:50%;background:rgba(255,255,255,.92);box-shadow:0 8px 22px -6px rgba(0,0,0,.6)}
.g-play::after{content:"";position:absolute;left:25px;top:20px;border-style:solid;border-width:12px 0 12px 20px;border-color:transparent transparent transparent var(--navy)}

.gal-ctrl{display:flex;align-items:center;justify-content:center;gap:6px;margin-top:14px}
.gal-ctrl button{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;color:var(--navy)}
.gal-ctrl button:hover{color:var(--blue)}
.gal-ctrl .i{width:22px;height:22px;stroke-width:2.2}
#gal-pause .ic-play,#gal-pause[aria-pressed=true] .ic-pause{display:none}
#gal-pause[aria-pressed=true] .ic-play{display:block}
.gal-count{min-width:64px;text-align:center;font-weight:700;color:var(--navy);font-variant-numeric:tabular-nums}
.gal-more{margin-top:14px;text-align:center}
.gal-more a{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:700;color:#2f8a12}
.gal-empty{display:none;margin:30px 0;text-align:center;color:var(--muted)}
.gal-none .gal-empty{display:block}
.gal-none .gal-stage,.gal-none .gal-ctrl{display:none}

/* Leadership team: columns fill the row, so a new department adds a column */
.team{position:relative;padding-block:0 48px}
.team-title{margin-bottom:18px;padding-top:30px;border-top:1px solid rgba(255,255,255,.18);font-size:clamp(1.4rem,3vw,1.8rem);font-weight:800;color:#fff}
.team-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:18px}
.tm-col{padding:18px;border-radius:18px;background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.tm-col h4{margin:0 0 12px;padding-bottom:10px;border-bottom:2px solid var(--lime);font-size:1.05rem;font-weight:800;color:var(--lime)}
.tm-col ul{display:grid;gap:12px;margin:0;padding:0;list-style:none}
.tm{display:flex;align-items:center;gap:12px;min-width:0}
.tm img{flex:none;width:64px;height:64px;border-radius:50%;object-fit:cover;background:var(--navy-2);box-shadow:0 0 0 2px rgba(255,255,255,.75)}
.tm div{min-width:0}
.tm strong{display:block;line-height:1.25;color:#fff;overflow-wrap:anywhere}
.tm span{display:block;font-size:.88rem;line-height:1.3;color:#dbe6fa;overflow-wrap:anywhere}

/* Popup */
.gal-box{width:min(960px,calc(100% - 24px));max-height:calc(100dvh - 24px);padding:0;overflow:auto;border:0;border-radius:18px;color:#fff;background:var(--navy-2);box-shadow:0 30px 70px -20px rgba(0,0,0,.8)}
.gal-box::backdrop{background:rgba(5,16,44,.86);backdrop-filter:blur(4px)}
.gal-box[open]{animation:gal-in .3s var(--ease)}
@keyframes gal-in{from{opacity:0;transform:perspective(900px) rotateX(10deg) translateY(24px) scale(.96)}}
#gal-box-media{display:grid;place-items:center;aspect-ratio:16/9;background:#000}
#gal-box-media img,#gal-box-media video,#gal-box-media iframe{display:block;width:100%;height:100%;border:0;object-fit:contain}
.gal-box-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 16px;padding:12px 16px}
.gal-box-foot h3{font-size:1.05rem;font-weight:700}
.gal-box-foot a{display:inline-flex;align-items:center;min-height:44px;color:var(--lime);font-weight:700}
.gal-box-btn{position:absolute;z-index:2;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;color:#fff;background:rgba(5,16,44,.72)}
.gal-box-btn .i{width:22px;height:22px;stroke-width:2.2}
#gal-box-close{right:8px;top:8px}
#gal-box-prev{left:8px;top:calc(50% - 44px)}
#gal-box-next{right:8px;top:calc(50% - 44px)}

/* /gallery/ pages */
.g-page .site-head{position:sticky}
.g-main{padding-block:32px 56px;min-height:60vh}
.g-main h1{margin-bottom:14px;font-size:clamp(1.8rem,4.5vw,2.8rem)}
.g-main h1 em{display:inline}
.g-filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px}
.g-empty{padding:40px 0;text-align:center;color:var(--muted)}
.g-grid{display:grid;gap:18px}
.g-grid a{display:block}
.g-thumb{position:relative;display:block;aspect-ratio:16/10;overflow:hidden;border-radius:16px;background:var(--navy);box-shadow:var(--shadow)}
.g-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease)}
.g-grid a:hover img{transform:scale(1.05)}
.g-grid strong{display:block;margin-top:10px;color:var(--navy);line-height:1.3}
.g-grid small{color:var(--muted)}
.g-crumbs{margin-bottom:10px;font-size:.9rem;color:var(--muted)}
.g-crumbs a{text-decoration:underline}
.g-media{overflow:hidden;border-radius:18px;background:#000;box-shadow:var(--shadow)}
.g-media img,.g-media video,.g-media iframe{display:block;width:100%;aspect-ratio:16/9;border:0;object-fit:contain}
.g-meta{margin-top:14px;font-weight:700;color:var(--navy)}
.g-desc{max-width:72ch;margin-top:10px;color:var(--muted)}

@media (min-width:640px){
  .gal-stage{height:400px}
  .g-grid{grid-template-columns:repeat(2,1fr)}
}
@media (min-width:960px){
  .gal{padding:72px 0}
  .gal-stage{height:440px}
  .g-grid{grid-template-columns:repeat(3,1fr)}
}
@media (prefers-reduced-motion:reduce){
  .gal-card:not(.on){opacity:0;visibility:hidden}
  .gal-card{transform:translate(-50%,-50%);transition:opacity .5s!important}
  .gal-box[open]{animation:none}
}
