/* =========================================================================
   확정된 화면 보정
   =========================================================================

   taeshin.css 와 modules.css 는 프로덕션 빌드에서 뽑아낸 생성물이라 손으로
   고치면 다시 만들 때 되돌아간다. 그래서 클라이언트가 확정한 보정은 여기에
   모으고, 이 파일을 두 번들 뒤에 읽는다.

   여기 있는 것은 전부 "확정된 수정"이다. 새 디자인을 만들지 않는다.
   ========================================================================= */

/* -------------------------------------------- WHO WE ARE 구간 경계를 직선으로

   구간 사이를 clip-path 로 비스듬히 잘라 사선으로 만들고 있었다. 잘린 삼각형
   자리에 페이지 바탕이 비쳐 흰 틈처럼 보이기도 했다.

   자르는 폭(--cut)을 0 으로 두면 다각형이 그대로 직사각형이 되어 경계가
   직선이 된다. 구간을 나누는 것 자체는 그대로다 — 사진 띠와 흰 패널이
   번갈아 오는 구성은 건드리지 않는다.

   여백을 계산하는 식도 var(--cut) 을 쓰므로 0 이 더해질 뿐이다. 사선을
   피하려고 두었던 여분의 여백이 없어지는 것이라 의도한 결과다.

   2026-08-31 클라이언트 확정. */

.m-who-we-are-page,
.m-who-we-are-panel {
  --cut: 0px;
}

/* -------------------------------------------------- iOS 이미지 테두리 깨짐

   iOS 사파리는 overflow:hidden 으로 잘라 낸 합성 레이어의 가장자리를 제대로
   맞추지 못해, 스크롤 중에 가는 선이 지지직거리며 나타난다. HOME 03 구간처럼
   사진이 틀 안에 꽉 차게 들어간 자리에서 두드러진다.

   마스크를 하나 걸어 두면 사파리가 클리핑 경로를 다시 계산해 그 선이
   사라진다. 보이는 모습은 달라지지 않고, iOS 사파리에만 적용된다. */

@supports (-webkit-touch-callout: none) {
  .img-frame,
  .m-why-taeshin-media,
  .why-media-frame {
    -webkit-mask-image: -webkit-radial-gradient(#fff, #000);
    mask-image: -webkit-radial-gradient(#fff, #000);
  }
}

/* ------------------------------------------------- 모바일 과도한 튕김 완화

   화면 끝에서 문서 전체가 고무줄처럼 크게 늘어났다 돌아오는 동작이다. 그
   되돌아오는 동안 스크롤에 맞춰 도는 연출들이 한꺼번에 다시 계산되어 버벅인다.

   문서 바깥으로 끌려 나가는 것만 막는다. 스크롤 자체와 기존 연출은 그대로
   둔다 — 관성 스크롤은 원래 좁은 화면에 붙지 않으므로 여기서 손댈 것이 없다. */

@media (max-width: 900px) {
  html {
    overscroll-behavior-y: none;
  }
}