/* Etostone's video-window typography and final interface values, scoped here. */
@font-face { font-family: 'Outfit'; src: url('assets/fonts/outfit-latin.woff2') format('woff2'); font-weight: 300 700; font-style: normal; font-display: swap; }
@font-face { font-family: 'Source Sans 3'; src: url('assets/fonts/source-sans-3-latin.woff2') format('woff2'); font-weight: 400 600; font-style: normal; font-display: swap; }
.essian-video-dialog { --video-paper: #eef0e9; --video-muted: #a1aaa9; --video-accent: #b7ced1; --video-line: rgba(199,218,218,.18); border: 1px solid var(--video-line); border-radius: 16px; background: #121a1d; color: var(--video-paper); padding: 0; width: min(980px,calc(100% - 40px)); max-height: 90svh; overflow: auto; box-shadow: 0 30px 120px #0009; font: 15px/1.7 'Source Sans 3',Arial,Helvetica,sans-serif; }
.essian-video-dialog::backdrop { background: #03080dea; backdrop-filter: blur(10px); }
.essian-video-dialog [hidden] { display: none !important; }
.essian-video-dialog :focus-visible { outline: 2px solid #d9eef0; outline-offset: 6px; }
.essian-video-head { display: flex; justify-content: space-between; align-items: center; padding: 22px 28px; border-bottom: 1px solid var(--video-line); gap: 20px; }
.essian-video-head h2 { max-width: none; font: 500 25px/1.35 Outfit,'Source Sans 3',Arial,sans-serif; letter-spacing: -.03em; margin: 0; color: var(--video-paper); }
.essian-video-close { width: 40px; height: 40px; padding: 0; border: 1px solid var(--video-line); border-radius: 9px; background: transparent; color: var(--video-paper); font: 23px/1.7 'Source Sans 3',Arial,Helvetica,sans-serif; flex-shrink: 0; cursor: pointer; }
.essian-video-close:hover { background: #b7ced119; }
.essian-video-stage { width: 100%; aspect-ratio: 16/9; max-height: calc(90svh - 160px); background: #080c0e; position: relative; }
.essian-video-stage > img { width: 100%; height: 100%; object-fit: contain; display: block; }
.essian-video-stage iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.essian-video-dialog .trailer-consent { position: absolute; inset: 0; display: grid; place-content: center; text-align: center; padding: 25px; background: #060f12c9; }
.essian-video-dialog .trailer-consent p { max-width: 440px; margin: 0 0 17px; font: 400 15px/1.7 'Source Sans 3',Arial,Helvetica,sans-serif; color: #c6d3d2; }
.essian-video-dialog .trailer-consent a { font-size: 13.75px; text-decoration: underline; margin-top: 16px; color: var(--video-paper); }
.essian-video-dialog .trailer-consent p a { color: #c6d3d2; }
.essian-video-dialog .trailer-consent-allow { display: inline-flex; align-items: center; justify-content: center; justify-self: center; gap: 18px; padding: 14px 23px; min-height: 50px; text-transform: uppercase; font: 600 13.75px/1.7 'Source Sans 3',Arial,Helvetica,sans-serif; letter-spacing: .075em; border: 1px solid transparent; border-radius: 12px; background: #dce7e5; color: #172023; cursor: pointer; transition: background .2s,transform .2s,border-color .2s; }
.essian-video-dialog .trailer-consent-allow:hover { background: #fff; transform: translateY(-2px); }
.essian-video-dialog .video-play-icon { display: block; width: 18px; height: 18px; fill: currentColor; stroke: currentColor; stroke-width: .85; stroke-linejoin: round; flex-shrink: 0; }
.essian-video-caption { padding: 20px 28px; display: flex; justify-content: space-between; gap: 20px; color: var(--video-muted); font-size: 16.25px; }
.essian-video-caption a { color: var(--video-accent); text-decoration: none; }
body.trailer-open { overflow: hidden; }
@media (max-width: 760px) {
  .essian-video-head { padding: 16px 20px; }
  .essian-video-head h2 { font-size: 21px; }
  .essian-video-caption { padding: 16px 20px; flex-wrap: wrap; font-size: 15px; }
  .essian-video-stage { aspect-ratio: auto; min-height: 260px; max-height: none; }
  .essian-video-stage > img { height: 260px; }
  .essian-video-stage iframe { height: 100%; }
  .essian-video-dialog .trailer-consent { padding: 18px; }
  .essian-video-dialog .trailer-consent p { font-size: 13.75px; }
  .essian-video-dialog .trailer-consent-allow { font-size: 12.5px; padding: 12px 16px; gap: 12px; letter-spacing: .06em; }
}
