.hex-media-wrapper{width:100%}
.hex-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.hex-card{background:#fff;border:1px solid #e6e6e6;border-radius:12px;overflow:hidden;box-shadow:0 2px 6px rgba(0,0,0,.04);position:relative}
.hex-card video,.hex-card img{width:100%;height:auto;display:block;aspect-ratio:16/9;object-fit:cover;background:#000}
.hex-meta{padding:10px 12px}.hex-title{font-weight:600;margin-bottom:6px}.hex-desc{color:#666;font-size:14px}
.hex-load-more{display:inline-block;margin:16px auto 6px;padding:10px 16px;background:#1a73e8;color:#fff;border:0;border-radius:8px}
.hex-status{margin-top:6px;color:#666;font-size:14px}
.hex-media-wrapper[data-layout="portrait"] .hex-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}
.hex-media-wrapper[data-layout="portrait"] .hex-card video,
.hex-media-wrapper[data-layout="portrait"] .hex-card img{aspect-ratio:9/16;border-radius:12px 12px 0 0}
@media (max-width:768px){
  .hex-media-wrapper[data-layout="portrait"] .hex-grid{grid-template-columns:1fr}
  .hex-media-wrapper[data-layout="portrait"] .hex-card{max-width:480px;margin:0 auto}
}
@media (max-width:768px){
  .hex-media-wrapper.hex-full-bleed{scroll-snap-type:y mandatory}
  .hex-media-wrapper.hex-full-bleed .hex-grid{display:block}
  .hex-media-wrapper.hex-full-bleed .hex-card{height:100svh;scroll-snap-align:start;margin:0 0 8px 0;border:none;border-radius:0;box-shadow:none}
  .hex-media-wrapper.hex-full-bleed .hex-card video,
  .hex-media-wrapper.hex-full-bleed .hex-card img{height:100%;width:100%;aspect-ratio:auto;object-fit:cover}
  .hex-media-wrapper.hex-full-bleed .hex-meta{position:absolute;left:0;right:0;bottom:0;padding:12px 14px;color:#fff;background:linear-gradient(to top,rgba(0,0,0,.55),rgba(0,0,0,0))}
  .hex-media-wrapper.hex-full-bleed .hex-title{color:#fff}
  .hex-media-wrapper.hex-full-bleed .hex-desc{color:#eee}
  .hex-media-wrapper.hex-full-bleed .hex-load-more,
  .hex-media-wrapper.hex-full-bleed .hex-status{display:none}
}