/* 스크린리더용 숨김 */
.sr-only {
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}

/* 섹션: 기본 여백만 정리 (컨테이너에 맞춰 '꽉 차게') */
.jf-overview { margin: 0; padding: 0; }

/* figure 기본 여백 제거 */
.jf-overview__poster { margin: 0; }

/* 이미지: 컨테이너 가로 100%, 세로 자동(비율 유지) */
.jf-overview__poster img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  /* 글로벌 스타일 충돌 대비 */
  border: 0;
  box-shadow: none;
  background: #fff; /* 포스터가 흰 배경일 때 가장 자연스럽게 */
}

/* 모바일에서 좌우 여백 없이 꽉 차게 */
@media (max-width: 768px) {
  .jf-overview { padding: 0; }
}

/* 컨테이너 폭(예: .pick-wrap max-width:1120px)을 존중하면서,
   포스터 이미지는 컨테이너 안에서만 꽉 차게 */
.pick-wrap .jf-overview { margin:0; padding:0; }
.pick-wrap .jf-overview__poster { margin:0; }

/* 전역에 img { width:100vw } 같은 규칙이 있어도 무력화 */
.pick-wrap .jf-overview__poster img{
  display:block;
  width:100% !important;        /* 컨테이너 100% */
  max-width:100% !important;    /* 더 커지지 않음 */
  height:auto !important;       /* 비율 유지 */
  margin:0 auto !important;     /* 남는 여백 중앙 정렬 */
  left:auto !important; right:auto !important; transform:none !important;
}

/* 혹시 이전에 full-bleed를 쓴 적이 있으면 강제 해제 */
.pick-wrap .jf-overview__poster.full-bleed{
  position:static !important;
  width:auto !important;
  margin:0 !important;
}


/* 컨테이너 폭: 1400px로 확대 */
.pick-wrap{
  max-width: 1400px !important;  /* 기존 1120px 덮어쓰기 */
  margin: 0 auto;
  padding: 12px 16px;
}

/* 포스터/이미지 섹션도 컨테이너 안에서만 꽉 차게 */
.pick-wrap .jf-overview__poster img{
  display:block;
  width:100%;
  max-width:100%;
  height:auto;
}

/* 그리드 여백 살짝 보정(선택) */
@media (min-width: 1400px){
  .pick-wrap .grid{ gap:16px; }  /* 넓어졌을 때 카드 간격 살짝 여유 */
}


/* ===== 컨테이너 & 포스터 ===== */
.pick-wrap{ max-width:1400px; margin:0 auto; padding:16px; }
.jf-overview{ margin:0; padding:0; }
.jf-overview__poster{ margin:0; }
.jf-overview__poster img{ display:block; width:100%; height:auto; }

/* ===== CTA 버튼 ===== */
.jf-cta{ margin-top:16px; }
.jf-cta__btn{
  display:flex; align-items:center; justify-content:space-between;
  gap:16px; width:100%;
  text-decoration:none;
  color:#fff;
  padding:18px 22px;
  border-radius:16px;
  background:
    radial-gradient(120% 120% at 10% -20%, #93c5fd 0%, rgba(147,197,253,0) 60%),
    linear-gradient(135deg, #1f4ed8 0%, #0ea5e9 50%, #14b8a6 100%);
  box-shadow: 0 10px 24px rgba(0,0,0,.12), inset 0 0 0 1px rgba(255,255,255,.25);
  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}
.jf-cta__btn:hover{ transform: translateY(-1px); box-shadow: 0 14px 30px rgba(0,0,0,.16); filter: brightness(1.02); }
.jf-cta__btn:focus-visible{ outline: none; box-shadow: 0 0 0 4px rgba(59,130,246,.35); }

.jf-cta__text{ display:flex; flex-direction:column; }
.jf-cta__title{
  font-size: clamp(18px, 2vw, 22px);
  line-height:1.25;
  font-weight:800;
  letter-spacing:.01em;
}
.jf-cta__subtitle{
  margin-top:4px;
  font-size: clamp(14px, 1.6vw, 16px);
  font-weight:600;
  opacity:.95;
}
.jf-cta__icon{
  flex:0 0 auto;
  width:26px; height:26px;
  opacity:.95;
}

/* 좁은 화면 보강 */
@media (max-width: 520px){
  .pick-wrap{ padding:12px; }
  .jf-cta__btn{ padding:16px 18px; border-radius:14px; }
  .jf-cta__icon{ width:24px; height:24px; }
}