/* Gallery introduction */
.video-page { background: #faf8f0; color: #244b37; }
.video-intro { background: radial-gradient(ellipse at top right, #eddda94d, transparent 60%), #f4efdd; border-bottom: 1px solid #dacead; padding: 34px 0 0; }
.video-intro nav { display: flex; gap: 14px; font-size: 13px; color: #76806a; margin-bottom: 38px; }
.video-intro nav a { color: #28513d; }
.video-intro-grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: 70px; align-items: center; }
.video-eyebrow { display: block; font-size: 11px; letter-spacing: .15em; color: #8d7746; margin-bottom: 14px; }
.video-intro h1 { font-size: clamp(38px, 4.5vw, 65px); line-height: 1.12; letter-spacing: -.04em; color: #163e2c; margin-bottom: 30px; }
.video-intro h1 em { font-family: Georgia, serif; font-weight: 400; color: #80713f; }
.video-intro p { font-size: 17px; line-height: 1.9; color: #66715f; max-width: 430px; }
.video-intro-bottom { display: flex; justify-content: space-between; gap: 20px; padding: 22px 0; margin-top: 20px; border-top: 1px solid #d8ccaa; font-size: 12px; letter-spacing: .07em; }
.video-intro-bottom a { color: #254d37; letter-spacing: 0; font-size: 14px; }
/* Responsive film cards */
.video-section { padding: 46px 0 60px; }
.video-collection { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.video-card { overflow: hidden; padding: 9px; border: 1px solid #ddd2b2; border-radius: 14px; background: #fffdf6; box-shadow: 0 10px 35px #183d2909; }
.video-card:first-child { background: #163e2e; border-color: #42654b; }
.video-screen { background: #0c2119; border-radius: 8px; overflow: hidden; }
.video-screen video { display: block; width: 100%; aspect-ratio: 16/9; object-fit: contain; background: #0c2119; }
.video-caption { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 9px 12px; }
.video-caption .video-eyebrow { font-size: 10px; letter-spacing: .1em; margin-bottom: 9px; }
.video-caption h2 { font-size: 21px; line-height: 1.3; letter-spacing: -.025em; margin: 0; color: #224b35; }
.video-duration { border: 1px solid #ddd1ac; padding: 5px 12px; border-radius: 20px; font-size: 12px; color: #807249; white-space: nowrap; }
.video-card:first-child h2 { color: #fff8e3; }
.video-card:first-child .video-eyebrow, .video-card:first-child .video-duration { color: #dfcc96; }
.video-card:first-child .video-duration { border-color: #dfcc9650; }
.video-closing { display: flex; justify-content: space-between; gap: 25px; margin-top: 38px; padding: 25px 0 0; border-top: 1px solid #ded4b9; font-size: 12px; color: #877747; letter-spacing: .07em; }
.video-closing a { color: #224b35; font-size: 15px; letter-spacing: 0; }
video:focus-visible { outline: 3px solid #d3b467; outline-offset: -3px; }
/* Mobile layout */
@media (min-width: 768px) and (max-width: 1199px) {
  .video-collection { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  .video-intro-grid { grid-template-columns: 1fr; gap: 0; }
  .video-intro nav { margin-bottom: 28px; }
  .video-intro h1 { margin-bottom: 20px; }
  .video-intro-bottom, .video-closing { flex-direction: column; gap: 12px; }
  .video-section { padding: 28px 0 38px; }
  .video-collection { grid-template-columns: 1fr; gap: 24px; }
  .video-card:first-child { padding: 8px; }
  .video-caption { padding: 18px 9px 12px; }
  .video-caption h2, .video-card:first-child h2 { font-size: 23px; }
  .video-caption .video-eyebrow { font-size: 9px; }
}