.movie-section { margin:44px 0; }
.movie-heading { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:20px; }
.movie-heading p,.movie-eyebrow { margin:0 0 7px; color:#53738c; font-size:11px; font-weight:800; letter-spacing:.14em; }
.movie-heading h2 { margin:0; font-size:25px; letter-spacing:-.045em; }
.movie-heading > a { font-size:13px; font-weight:700; color:#215779; white-space:nowrap; }
.movie-card { display:grid; grid-template-columns:1fr; width:100%; max-width:360px; border:1px solid #e0e7ed; border-radius:14px; overflow:hidden; background:#fff; color:#172b3b; text-decoration:none; transition:box-shadow .2s,border-color .2s; }
.movie-card:hover { box-shadow:0 12px 32px #193b5b12; border-color:#aac2d5; }
.movie-card:focus-visible { outline:3px solid #1769e0; outline-offset:4px; }
.movie-thumb { position:relative; display:block; aspect-ratio:16/9; background:#f1f4f6; align-self:center; }
.movie-thumb img { width:100%; height:100%; object-fit:contain; display:block; }
.movie-play { position:absolute; right:14px; bottom:14px; display:grid; place-items:center; width:44px; height:32px; border-radius:9px; background:#132f49df; color:white; font-size:14px; }
.movie-copy { padding:17px 18px 19px; display:flex; flex-direction:column; justify-content:center; align-items:flex-start; gap:10px; }
.movie-label { margin:0; font-size:12px; color:#65798b; font-weight:650; }
.movie-copy h3 { margin:0; font-size:18px; font-weight:750; line-height:1.5; letter-spacing:-.035em; word-break:keep-all; overflow-wrap:anywhere; }
.movie-watch { font-size:13px; font-weight:750; color:#215779; }
.movies-main { width:min(1120px,calc(100% - 40px)); margin:44px auto 80px; min-height:55vh; }
.movies-intro { margin:30px 0 32px; max-width:780px; }
.movies-intro h1 { margin:0; font-size:clamp(29px,4vw,42px); line-height:1.35; letter-spacing:-.05em; word-break:keep-all; }
.movies-intro > p:last-child { font-size:15px; line-height:1.8; color:#647588; margin-top:16px; }
.movies-back { color:#65798b; font-size:13px; }
.movies-list { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:24px; }
.movie-section { padding-top:28px; border-top:1px solid #e7edf1; }
.movie-heading h2 { font-size:22px; font-weight:800; }
.movie-heading p { display:none; }
.movie-section .movie-card { max-width:none; grid-template-columns:280px minmax(0,1fr); }
.movie-section .movie-copy { padding:20px 26px; gap:12px; }
.movie-section .movie-copy h3 { font-size:21px; }
.movie-section .movie-card + .movie-card { margin-top:12px; }
@media(max-width:640px) {
  .movie-section { margin:32px 0; }
  .movie-heading { align-items:flex-start; gap:10px; }
  .movie-heading h2 { font-size:21px; line-height:1.4; word-break:keep-all; }
  .movie-heading > a { padding-top:5px; font-size:12px; }
  .movie-card { grid-template-columns:1fr; border-radius:13px; }
  .movie-copy { padding:15px 16px 17px; gap:9px; }
  .movie-copy h3 { font-size:18px; line-height:1.5; }
  .movie-card { max-width:100%; }
  .movie-section { padding-top:24px; }
  .movie-section .movie-card { grid-template-columns:132px minmax(0,1fr); padding:12px; gap:14px; align-items:center; }
  .movie-section .movie-thumb { border-radius:8px; overflow:hidden; }
  .movie-section .movie-copy { padding:0; gap:7px; }
  .movie-section .movie-copy h3 { font-size:15px; line-height:1.5; }
  .movie-section .movie-label { display:none; }
  .movie-section .movie-watch { font-size:11px; }
  .movie-section .movie-play { width:26px; height:21px; right:5px; bottom:5px; border-radius:5px; font-size:10px; }
  .movies-main { width:calc(100% - 32px); margin:24px auto 48px; }
  .movies-intro { margin:24px 0; }
}