.visor-cover { position: absolute; z-index: 0; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.visor-media .media-chip { z-index: 2; }
.visor-media { background-position: center; }
.info-preview .visor-media { width: 100%; min-height: 250px; height: clamp(250px, 31vw, 390px); border-radius: 14px; }
.info-preview .visor-cover { object-fit: cover; }
.info-preview .media-chip { font-size: .67rem; }
.viewer-media-section { max-width: 1160px; margin: 0 auto; padding: 2rem clamp(1.25rem, 5vw, 4rem) 4rem; }
.viewer-media-section > .eyebrow { color: var(--blue); font-size: .69rem; font-weight: 700; letter-spacing: .15em; }
.viewer-media-section h2 { margin: .3rem 0 1.5rem; color: #16334b; font-size: clamp(1.5rem, 3vw, 2.2rem); font-weight: 500; letter-spacing: -.04em; }
.viewer-demo-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.2rem; }
.viewer-demo { min-width: 0; margin: 0; overflow: hidden; border: 1px solid #dce7ee; border-radius: 12px; background: #f5f8fa; }
.viewer-demo video, .viewer-video-frame { display: block; width: 100%; aspect-ratio: 16 / 9; background: #10263a; }
.viewer-demo video { object-fit: contain; }
.viewer-video-frame iframe { width: 100%; height: 100%; border: 0; }
.viewer-demo figcaption { padding: .8rem .9rem; color: #40566a; font-size: 1rem; font-weight: 600; }
@media (max-width: 680px) { .viewer-demo-grid { grid-template-columns: 1fr; } .info-preview .visor-media { min-height: 210px; height: 58vw; } }