.videos { display:grid; grid-template-columns:190px minmax(0,1fr); gap:36px; padding-block:32px 38px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.videos-intro { padding-top:3px; }
.videos-intro .eyebrow { font-size:9px; }
.videos h2 { margin-top:14px; font:400 34px/1.1 var(--atlas-serif,Georgia,serif); letter-spacing:-.045em; }
.videos-intro p { margin-top:13px; color:var(--muted); font-size:12px; line-height:1.6; }
.videos-channel { display:inline-flex; align-items:center; gap:13px; min-height:44px; margin-top:15px; color:var(--atlas-wine,var(--text)); font-size:11px; }
.videos-channel:hover { color:var(--text); }
.video-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; list-style:none; padding:0; margin:0; }
.video-card { min-width:0; }
.video-link { display:block; height:100%; }
.video-thumbnail { display:block; position:relative; aspect-ratio:16/9; background:var(--surface); overflow:hidden; border:1px solid var(--line); }
.video-thumbnail img { width:100%; height:100%; object-fit:cover; transition:transform .3s ease; }
.video-play { display:grid; place-items:center; position:absolute; inset:0; margin:auto; width:34px; height:26px; color:#eee2d1; background:#161316d9; border:1px solid #eee2d166; border-radius:6px; transition:background .2s; }
.video-play svg { width:11px; height:12px; margin-left:2px; fill:currentColor; }
.video-link:hover .video-play { background:#5c3443; }
.video-link:hover .video-thumbnail img { transform:scale(1.035); }
.video-meta { display:flex; justify-content:space-between; gap:10px; margin-top:11px; color:var(--muted); font:9px/1.5 'SFMono-Regular',Consolas,monospace; }
.video-meta > span { color:var(--atlas-wine,var(--text)); }
.video-card h3 { margin-top:6px; font-size:13px; font-weight:500; line-height:1.5; overflow-wrap:anywhere; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.video-link:hover h3 { color:var(--atlas-wine,var(--text)); }
@media(max-width:1000px) {
  .videos { grid-template-columns:150px minmax(0,1fr); gap:24px; }
  .video-grid { gap:16px; }
  .videos h2 { font-size:29px; }
}
@media(max-width:760px) {
  .videos { grid-template-columns:minmax(0,1fr); gap:24px; padding-block:28px; }
  .videos-intro { display:grid; grid-template-columns:1fr auto; align-items:center; gap:0 16px; }
  .videos-intro .eyebrow { grid-column:1 / -1; }
  .videos h2 { font-size:32px; }
  .videos-intro p { margin-top:8px; grid-column:1; }
  .videos-channel { grid-column:2; grid-row:2 / 4; margin:10px 0 0; }
}
@media(max-width:600px) {
  .video-grid { grid-template-columns:minmax(0,1fr); gap:16px; }
  .video-link { display:grid; grid-template-columns:118px minmax(0,1fr); grid-template-rows:auto 1fr; column-gap:14px; align-items:start; }
  .video-thumbnail { grid-row:1 / 3; }
  .video-meta { margin-top:0; }
  .video-card h3 { font-size:12px; margin-top:5px; }
  .video-card + .video-card { border-top:1px solid var(--line); padding-top:16px; }
}
@media(max-width:359px) {
  .video-link { grid-template-columns:100px minmax(0,1fr); column-gap:12px; }
  .videos h2 { font-size:29px; }
  .videos-channel { gap:6px; font-size:10px; }
}
@media(prefers-reduced-motion:reduce) {
  .video-thumbnail img,.video-play { transition:none; }
  .video-link:hover .video-thumbnail img { transform:none; }
}
.motion-paused .video-link:hover .video-thumbnail img { transform:none; }