.hero.hero-with-video { background: #0b2237; }
.hero-video-frame { position: absolute; inset: 0; z-index: 0; pointer-events: none; background: #0b2237 url('/assets/video/seohwang-office-poster.jpg') center / cover no-repeat; }
.hero-video-frame video { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.hero-video-frame video[hidden] { display: none; }
.hero-with-video::after { content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: radial-gradient(ellipse at 24% 36%,rgba(0,0,0,.16),transparent 68%),linear-gradient(90deg,rgba(5,22,37,.88) 0%,rgba(5,22,37,.77) 34%,rgba(5,22,37,.35) 65%,rgba(5,22,37,.18) 100%),linear-gradient(0deg,rgba(5,22,37,.72),transparent 32%); }
.hero-with-video h1 { text-shadow:0 3px 14px rgba(0,0,0,.3); }
.hero-with-video .hero-content,.hero-with-video .hero-footer { z-index: 2; }
.hero-with-video .hero-copy { color: #e0e8e5; }
.hero-with-video .hero-footer { color: #c1d4c9; }
@media (max-width:600px) {
  .hero.hero-with-video { min-height: 600px; padding-top: 62px; padding-bottom: 120px; }
  .hero-video-frame video,.hero-video-frame { object-position: 90% center; background-position: 90% center; }
  .hero-with-video::after { background: radial-gradient(ellipse at 28% 30%,rgba(0,0,0,.16),transparent 68%),linear-gradient(90deg,rgba(5,22,37,.78),rgba(5,22,37,.36)),linear-gradient(0deg,rgba(5,22,37,.8),rgba(5,22,37,.08) 30%,rgba(5,22,37,.32)); }
}