/* ============ V9 — UI/UX polish pass ============
   Gallery rebuilt as a photo journal: every photo at its true ratio
   (no hard crops), the caption always visible under the photo, a clear
   enlarge badge, generous tap areas. Hero Founder/Secretary names are
   now tappable photo links opening the same lightbox. Site-wide: 48px
   tap targets, visible keyboard focus, a smoother lightbox with a
   photo counter and swipe, soft page changes, tighter small-screen
   rhythm. White minimal design and all content unchanged. */
html{-webkit-tap-highlight-color:rgba(232,112,10,.18)}
:focus-visible{outline:3px solid rgba(30,64,201,.6);outline-offset:2px}
.btn{min-height:48px}
#topnav nav a{display:inline-flex;align-items:center;min-height:40px}
#stickyCta a{min-height:52px}
.faq-item summary{min-height:56px}
@media (max-width:640px){.sec{padding:62px 0}}

/* page change — a soft fade instead of a hard cut */
[data-page]{animation:pageIn .38s ease}
@keyframes pageIn{from{opacity:0}to{opacity:1}}

/* ---------- GALLERY — photo journal ---------- */
.gal{display:block;column-count:2;column-gap:24px}
.gal button{display:block;width:100%;margin:0 0 24px;padding:0;break-inside:avoid;background:#fff;
  border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:var(--shadow);
  font:inherit;text-align:left;cursor:pointer;transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease}
.gal button::after{content:none;display:none}
.gal button:hover,.gal button:focus-visible{border-color:var(--line-strong);box-shadow:0 16px 34px rgba(29,26,22,.13)}
.gal button:active{transform:scale(.995)}
.gal .gal-ph{display:block;position:relative;overflow:hidden;background:var(--bg2)}
.gal img{width:100%;height:auto;object-fit:unset;display:block;transition:transform .55s ease}
@media (hover:hover){.gal button:hover img{transform:scale(1.025)}}
.gal-zoom{position:absolute;top:10px;right:10px;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;
  background:rgba(255,255,255,.94);color:#1d1a16;box-shadow:0 4px 14px rgba(29,26,22,.25);border:1px solid rgba(29,26,22,.08)}
.gal-cap{display:block;padding:13px 16px 15px;border-top:1px solid var(--line);
  font-size:.99rem;font-weight:600;line-height:1.55;color:var(--ink)}
@media (max-width:680px){.gal{column-count:1}.gal button{margin-bottom:18px}}

/* ---------- hero leader names — clearly tappable photo links ---------- */
.hero-leaders .hl-item{transition:border-color .2s ease,box-shadow .2s ease}
.hero-leaders .hl-item:hover{border-color:var(--saffron);box-shadow:0 12px 28px rgba(29,26,22,.12)}
.hero-leaders .hl-link{background:none;border:0;padding:2px 4px;margin:0;cursor:pointer;border-radius:8px;width:100%}
.hero-leaders .hl-link>span{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px;text-decoration-color:var(--board)}
.hero-leaders .hl-item:nth-child(2) .hl-link>span{text-decoration-color:var(--saffron)}
.hero-leaders .hl-link:hover>span{color:var(--board)}
.hero-leaders .hl-item:nth-child(2) .hl-link:hover>span{color:var(--saffron-deep)}
.hl-ico{display:inline-block;vertical-align:-3px;margin-left:9px;color:var(--board)}
.hero-leaders .hl-item:nth-child(2) .hl-ico{color:var(--saffron-deep)}
@media (max-width:640px){.hero-leaders .hl-item{flex:1 1 100%}.hero-leaders .hl-link{min-height:34px}}

/* ---------- lightbox — smoother, clearer, thumb-friendly ---------- */
#lightbox.open img{animation:lbIn .3s ease}
#lightbox.zoomed img{animation:none}
@keyframes lbIn{from{opacity:0;transform:scale(.98)}to{opacity:1;transform:none}}
.lb-btn{width:52px;height:52px;font-size:1.5rem}
#lb-zoom{width:auto;height:52px;padding:0 20px;border-radius:999px}
#lb-count{position:absolute;top:22px;left:16px;z-index:2;color:#f5ead2;background:rgba(20,16,10,.55);
  border:1px solid rgba(246,234,210,.35);padding:5px 14px;border-radius:999px;font-weight:700;font-size:.92rem}
#lb-count:empty{display:none}
#lb-cap{background:rgba(20,16,10,.55);padding:9px 18px;border-radius:12px;line-height:1.55}
@media (max-width:640px){#lb-prev{left:6px}#lb-next{right:6px}.lb-btn{width:48px;height:48px}#lb-zoom{height:48px}}

/* social + press cards — clearer press feedback */
.soc-card{transition:transform .2s ease,box-shadow .2s ease}
.soc-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.press-card:active{transform:scale(.99) !important}
@media (prefers-reduced-motion: reduce){
  [data-page]{animation:none}
  #lightbox.open img{animation:none}
}