@font-face { font-family: "DM Sans"; src: url("/static/fonts/dm-sans-latin.woff2") format("woff2"); font-display: swap; }

:root { color-scheme: dark; --video-bg: #09090b; --video-panel: #18181b; --video-text: #fafafa; --video-muted: #c4c4cc; --video-link: #a5b4fc; --video-border: rgba(255,255,255,.15); }
* { box-sizing: border-box; }
body { margin: 0; background: var(--video-bg); color: var(--video-text); font: 16px/1.65 "DM Sans", system-ui, sans-serif; }
a { color: var(--video-link); }
a:focus-visible { outline: 3px solid #fff; outline-offset: 3px; }
.skip-link { position: absolute; left: -10000px; top: auto; }.skip-link:focus { left: 1rem; top: 1rem; z-index: 2; background: #fff; color: #111; padding: .5rem .75rem; }
.video-header, .video-footer { display: flex; gap: 1.5rem; align-items: center; max-width: 1120px; margin: auto; padding: 1.25rem 1.5rem; }.video-header a:first-child { color: var(--video-text); font-weight: 700; text-decoration: none; }
.video-page { max-width: 1120px; margin: 0 auto; padding: 3.5rem 1.5rem 5rem; }.video-eyebrow { margin: 0 0 .6rem; color: var(--video-link); font-weight: 700; }.video-eyebrow a { color: inherit; }.video-page h1 { max-width: 860px; font-size: clamp(2rem, 5vw, 4rem); line-height: 1.08; margin: 0; }.video-intro { max-width: 760px; color: var(--video-muted); font-size: 1.15rem; }.video-player { position: relative; overflow: hidden; padding-top: 56.25%; margin: 2rem 0; border: 1px solid var(--video-border); border-radius: 1rem; background: #000; }.video-player iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }.video-next-steps { max-width: 760px; padding: 1.25rem 1.5rem; border: 1px solid var(--video-border); border-radius: .8rem; background: var(--video-panel); }.video-next-steps h2 { margin-top: 0; }.video-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1.25rem; margin-top: 2rem; }.video-card { overflow: hidden; border: 1px solid var(--video-border); border-radius: .8rem; background: var(--video-panel); }.video-card img { display: block; width: 100%; height: auto; }.video-card h2, .video-card p { padding: 0 1rem; }.video-card h2 { font-size: 1.1rem; line-height: 1.35; }.video-card p { color: var(--video-muted); }.video-footer { border-top: 1px solid var(--video-border); color: var(--video-muted); font-size: .9rem; }
.video-watch-page h1 { font-size: clamp(1.75rem, 3vw, 2.5rem); }
@media (max-width: 640px) { .video-page { padding-top: 2rem; }.video-header, .video-footer { padding-inline: 1rem; } }