/* Fitness & Accomplishments gallery (2026-10-14).
   Every tile takes the photo's own shape, so nothing is cropped.
   New file on purpose: assets/* is cached for a year, so editing styles.css
   would need a cache-bust. Bump ?v= on the <link> if this file ever changes. */

/* Press feature: the Women's Health spreads */
.press-feature{margin:0 0 clamp(18px,3vw,28px)}
.press-feature .kicker{margin-bottom:14px}
.press-strip{display:grid;gap:12px;grid-template-columns:repeat(3,1fr)}
@media (max-width:820px){.press-strip{grid-template-columns:1fr;gap:9px}}

/* Masonry: columns instead of a fixed grid */
.gallery{columns:3;column-gap:12px}
@media (max-width:820px){.gallery{columns:2;column-gap:9px}}
.gallery .figure,.press-strip .figure{
  break-inside:avoid;margin:0 0 12px;display:block;
  cursor:zoom-in;padding:0;border:0;width:100%;text-align:left;
}
.press-strip .figure{margin:0}
@media (max-width:820px){.gallery .figure{margin-bottom:9px}}
.gallery .figure img,.press-strip .figure img{
  width:100%;height:auto;display:block;object-fit:contain;
}
.gallery .figure:focus-visible,.press-strip .figure:focus-visible{outline:2px solid var(--paper);outline-offset:2px}

/* Full-view overlay: the whole photo, in colour */
.lightbox{
  position:fixed;inset:0;z-index:1000;display:none;
  align-items:center;justify-content:center;flex-direction:column;gap:12px;
  padding:clamp(16px,4vw,48px);background:rgba(0,0,0,.94);
}
.lightbox.open{display:flex}
.lightbox img{max-width:100%;max-height:calc(100vh - 110px);width:auto;height:auto;object-fit:contain}
.lightbox .lb-cap{
  font-family:var(--font-cond);font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--ash);text-align:center;max-width:60ch
}
.lightbox button{
  position:absolute;background:none;border:1px solid var(--hair);color:var(--paper);
  font-family:var(--font-cond);font-size:13px;letter-spacing:.12em;text-transform:uppercase;
  min-width:44px;min-height:44px;padding:0 14px;cursor:pointer
}
.lightbox button:hover{border-color:var(--paper)}
.lightbox .lb-x{top:16px;right:16px}
.lightbox .lb-prev{left:16px;top:50%;transform:translateY(-50%)}
.lightbox .lb-next{right:16px;top:50%;transform:translateY(-50%)}
@media (max-width:560px){
  .lightbox .lb-prev,.lightbox .lb-next{top:auto;bottom:16px;transform:none}
}

/* TV feature: E! Just Jillian clips */
.tv-strip{display:grid;gap:12px;grid-template-columns:repeat(2,1fr);margin-top:12px}
@media (max-width:820px){.tv-strip{grid-template-columns:1fr;gap:9px}}
.tv-strip figure{margin:0;background:var(--panel-2)}
.tv-strip video{display:block;width:100%;height:auto;aspect-ratio:480/272;background:#000}
.tv-strip figcaption{
  padding:10px 2px 0;font-family:var(--font-cond);font-size:11px;
  letter-spacing:.16em;text-transform:uppercase;color:var(--ash)
}