/* Page-specific styles for /about-us (=live glow.team/team), ported from that
   page's inline <style>. Kept surgical: only the rules our shared CSS lacks.
   Deliberately excludes live's nav/bottom-bar gradient (.blur-span/.radial-blur)
   rules — those are owned by our nav-gradient.js system (see DEC-0010). */

/* Insights tabs — vertical dividers between tab items (All | Prompt | ...) */
.blog-tabs-menu-item { position: relative; }
.blog-tabs-menu-item:not(:last-child)::after {
  content: "";
  position: absolute;
  right: -1px;
  top: 50%;
  transform: translateY(-50%);
  width: 2px;
  height: 1rem;
  border-radius: .5rem;
  background: #EEEEEE;
}
.blog-tabs-menu-item.w--current::after { opacity: 0; }
.blog-tabs-menu-item:has(+ .w--current)::after { opacity: 0; }

/* Insights carousel progress bar (the swiper progressbar next to the arrows) */
.blog-swiper-pagination { position: relative; height: 2px !important; }
.swiper-pagination-progressbar-fill { background: #19191B !important; }

/* Hover effects that live drives with Webflow IX2 (we don't load IX2 → do them
   in CSS 1:1). */

/* Hover badges that fade in (opacity:0 by default): the award medal over its
   thumbnail, and the careers-card badge. Live pairs them in one IX2 rule. */
.awards-item:hover .awards-badge,
.careers-item:hover .careers-card-badge { opacity: 1; }

/* "See how we Glow!" circle — the video zooms ~1.2× inside its round frame on
   hover (live grows the <video> 80→96px). */
.video-wrapper-about-us video { transition: transform .3s ease; }
.video-wrapper-about-us:hover video { transform: scale(1.2); }

/* Team photo collage (Mission section) — "focus" hover. Live drives it with
   Webflow IX2; recreate 1:1 in CSS: hovering the album blurs every photo, and
   the one actually under the cursor goes dark-sepia instead (film look). The
   .photo-block already carries `transition: filter .2s`. */
.mission-album:hover .photo-block { filter: blur(4px); }
.mission-album .photo-block:hover { filter: brightness(.7) sepia(1); }
