/* ============================================================
   모바일 히어로 보정 — Figma 시안(375x704) 기준
   ------------------------------------------------------------
   문제 : 히어로 높이를 100vh 로 잡고 background-size:cover 를 쓰는 탓에
          세로를 채우느라 일러스트가 시안(2.15배)보다 확대(2.59배)되어
          로고 오브제만 크게 잘리고 카피 아래 빈 공간이 생김.
   조치 : 시안과 동일하게 높이 704px, 일러스트 가로 배율 215% 로 고정.
          (배경 위치는 하단 중앙 정렬 — 시안의 크롭과 동일)
   ============================================================ */
@media (max-width: 1024px) {
  .p-ls__section--hero .p-ls__shell--edge {
    min-height: 704px;
    height: auto;
    background-size: 215% auto;
    background-position: 50% 100%;
  }
}

/* 아주 좁은 화면(=360 이하)에서는 시안 비율을 유지하되 높이만 소폭 축소 */
@media (max-width: 360px) {
  .p-ls__section--hero .p-ls__shell--edge {
    min-height: 660px;
  }
}

/* ============================================================
   히어로 타이틀 — 모바일에서 더 크고 굵게
   가용 폭 335px 기준 최장 줄이 297px(34px) 이라 여유가 있어 38px 까지 확대.
   굵기는 M PLUS 1 Black(900) 사용 (폰트 링크에 900 추가 필요).
   ≤360px 에서는 컨테이너가 좁아지므로 34px 로 되돌림.
   ============================================================ */
@media (max-width: 1024px) {
  .p-ls__section--hero .p-ls__hero-title {
    font-size: 38px;
    font-weight: 900;
    line-height: 1.32;
    letter-spacing: -0.03em;
  }
}

@media (max-width: 360px) {
  .p-ls__section--hero .p-ls__hero-title {
    font-size: 34px;
  }
}