.datify-ux .datify-bento-images{display:grid;grid-auto-rows:160px;gap:16px}.datify-ux .datify-bento-images figure{overflow:hidden;border-radius:24px}.datify-ux .datify-bento-images .datify-image{width:100%;height:100%;object-fit:cover}.datify-ux .datify-span-tall{grid-row:span 2}
.datify-ux.datify-full-width-image .datify-image{border-radius:0;width:100%;object-fit:cover}.datify-ux .datify-height-sm .datify-image{height:224px}.datify-ux .datify-height-md .datify-image{height:288px}.datify-ux .datify-height-lg .datify-image{height:384px}.datify-ux.datify-full-width-image figcaption{max-width:1180px;margin:auto;padding:12px 24px;color:var(--datify-muted);font-size:14px}
.datify-ux .datify-carousel-track{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth}.datify-ux .datify-carousel-track>li{flex:0 0 80%;scroll-snap-align:start}.datify-ux .datify-carousel-track .datify-image{aspect-ratio:4/3;object-fit:cover}.datify-ux .datify-carousel-controls{display:flex;gap:8px;align-items:center;margin-top:20px}.datify-ux .datify-carousel-controls button{background:var(--datify-card);color:var(--datify-foreground);border-color:var(--datify-border);width:40px;padding:8px}.datify-ux .datify-carousel-status{font-size:14px;color:var(--datify-muted);margin-left:8px}.datify-ux.datify-video-section video{display:block;width:100%;aspect-ratio:16/9;border-radius:24px;background:var(--datify-wine)}.datify-ux.datify-video-section .datify-image{aspect-ratio:16/9;object-fit:cover}.datify-ux.datify-video-section figcaption{font-size:14px;color:var(--datify-muted);margin-top:12px}
@media(min-width:640px){.datify-ux .datify-bento-images{grid-template-columns:repeat(3,minmax(0,1fr))}.datify-ux .datify-span-wide{grid-column:span 2}.datify-ux .datify-carousel-track>li{flex-basis:40%}.datify-ux .datify-height-sm .datify-image{height:288px}.datify-ux .datify-height-md .datify-image{height:384px}.datify-ux .datify-height-lg .datify-image{height:512px}}
@media(min-width:1024px){.datify-ux .datify-bento-images{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){.datify-ux .datify-carousel-track{scroll-behavior:auto}}
