/* ── 래퍼 ── */
    .yn-hl-v1-wrap {
      width: 100%;
      max-width: 840px;
      margin: 0 auto;
      background: #fff;
      display: flex;
      flex-direction: column;
    }

    /* ── 상단 히어로: 이미지 + 오버레이 제목 ── */
    .yn-hl-v1-hero {
      position: relative;
      width: 100%;
      aspect-ratio: 16 / 9;
      overflow: hidden;
    }
    .yn-hl-v1-hero a { display: block; width: 100%; height: 100%; }
    .yn-hl-v1-hero img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
      transition: transform 0.4s ease;
    }
    .yn-hl-v1-hero:hover img { transform: scale(1.04); }

    /* 그라디언트 오버레이 */
    .yn-hl-v1-hero-overlay {
      position: absolute;
      inset: 0;
      background: linear-gradient(to top, rgba(0,0,0,0.75) 0%, rgba(0,0,0,0.1) 25%, transparent 100%);
      pointer-events: none;
    }

    /* 오버레이 위 텍스트 */
    .yn-hl-v1-hero-text {
      position: absolute;
      bottom: 0;
      left: 0;
      right: 0;
      padding: 20px 24px 22px;
    }
    .yn-hl-v1-hero-badge {
      display: inline-block;
      background: #009D96;
      color: #fff;
      font-family: 'Noto Sans KR', sans-serif;
      font-size: 14px;
      font-weight: 800;
      letter-spacing: 2px;
      padding: 6px 16px;
      margin-bottom: 14px;
      text-transform: uppercase;
    }
    .yn-hl-v1-title {
      font-size: 35px;
      font-weight: 800;
      line-height: 1.4;
      letter-spacing: -0.5px;
      color: #fff;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .yn-hl-v1-title a { color: inherit; text-decoration: none; }
    .yn-hl-v1-title a:hover { color: #7ee8e4; }

    /* ── 구분선 ── */
    .yn-hl-v1-divider {
      display: block;
      border: none;
      border-top: 1px solid #e1e1e1;
      margin: 18px 0 16px;
    }

    /* ── 하단 카드 3개 ── */
    .yn-hl-v1-bottom {
      display: flex;
      gap: 16px;
      padding: 0 0 20px;
    }
    .yn-hl-v1-card {
      flex: 1 1 0;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 8px;
    }
    .yn-hl-v1-card a { display: block; }
    .yn-hl-v1-card img {
      width: 100%;
      aspect-ratio: 292 / 158;
      object-fit: cover;
      display: block;
    }
    .yn-hl-v1-card-title {
      font-size: 18px;
      font-weight: 600;
      line-height: 1.55;
      margin: 0;
      letter-spacing: -0.3px;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }
    .yn-hl-v1-card-title a { color: #000; text-decoration: none; }
    .yn-hl-v1-card-title a:hover { color: #009D96; }

    @media (max-width: 640px) {
      .yn-hl-v1-hero-text { padding: 12px 14px 16px; }
      .yn-hl-v1-hero-badge { font-size: 12px; padding: 2px 6px; margin-bottom: 6px; letter-spacing: 0; }
      .yn-hl-v1-title { font-size: 16px; }
      .yn-hl-v1-bottom { flex-direction: column; gap: 12px; }
      .yn-hl-v1-card { flex-direction: row; align-items: flex-start; gap: 10px; }
      .yn-hl-v1-card > a:first-child { flex-shrink: 0; width: 120px; }
      .yn-hl-v1-card img { aspect-ratio: 4/3; }
      .yn-hl-v1-card-title { font-size: 16px; -webkit-line-clamp: 3; }
    }