.video-showcase {
  max-width: 1376px;
  margin: 0 auto 70px;
  padding: 38px 32px 42px;
  border: 1px solid rgba(242, 173, 19, .32);
  border-radius: 24px;
  background: linear-gradient(145deg, rgba(32, 28, 21, .9), rgba(10, 9, 8, .96));
  box-shadow: 0 24px 70px rgba(0, 0, 0, .35);
}
.video-showcase__eyebrow { margin: 0 0 10px; color: var(--gold); font-size: 13px; font-weight: 800; letter-spacing: .18em; }
.video-showcase h2 { margin: 0 0 25px; font-size: clamp(28px, 4vw, 42px); }
.video-links { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; }
.video-link { display: flex; align-items: center; gap: 14px; min-height: 72px; padding: 15px 18px; border: 1px solid rgba(242, 173, 19, .52); border-radius: 15px; background: rgba(255, 255, 255, .045); color: #fff; font: inherit; text-align: left; cursor: pointer; transition: transform .18s, background .18s, border-color .18s; }
.video-link:hover, .video-link:focus-visible { transform: translateY(-2px); border-color: var(--gold); background: rgba(242, 173, 19, .11); outline: none; }
.video-link__play { flex: 0 0 auto; display: grid; place-items: center; width: 42px; height: 42px; padding-left: 3px; border-radius: 50%; background: linear-gradient(135deg, #ffc84e, #d48600); color: #171008; font-size: 18px; box-shadow: 0 6px 18px rgba(242, 173, 19, .2); }
.video-link__copy strong, .video-link__copy small { display: block; }
.video-link__copy strong { font-size: 17px; line-height: 1.25; }
.video-link__copy small { margin-top: 4px; color: #c6bfb4; font-size: 13px; }
.video-empty { margin: 0; color: #aaa49a; font-size: 16px; }
.video-modal[hidden] { display: none; }
.video-modal { position: fixed; z-index: 1100; inset: 0; display: grid; place-items: center; padding: 24px; }
.video-modal__backdrop { position: absolute; inset: 0; background: rgba(0, 0, 0, .86); backdrop-filter: blur(8px); }
.video-modal__dialog { position: relative; width: min(100%, 1040px); max-height: calc(100vh - 48px); padding: 25px; border: 1px solid rgba(242, 173, 19, .46); border-radius: 20px; background: #100e0b; box-shadow: 0 30px 100px #000; overflow: auto; }
.video-modal__dialog h2 { margin: 0 52px 18px 0; font-size: clamp(21px, 3vw, 30px); }
.video-modal__close { position: absolute; top: 13px; right: 14px; width: 40px; height: 40px; border: 1px solid rgba(255,255,255,.25); border-radius: 50%; background: rgba(255,255,255,.08); color: #fff; font-size: 28px; cursor: pointer; }
.video-modal video { display: block; width: 100%; max-height: calc(100vh - 150px); border-radius: 12px; background: #000; }
@media (max-width: 700px) { .video-showcase { margin: 0 14px 45px; padding: 28px 20px 30px; border-radius: 18px; } .video-modal { padding: 10px; } .video-modal__dialog { padding: 18px; } }