/* restore.css — 스냅샷에 Wix 런타임 JS가 없어서 죽어 있는 UI를 되살리는 보정 레이어.
   짝이 되는 스크립트는 같은 폴더의 restore.js. 해시가 붙는 Wix 클래스명은 미러를 다시 뜰 때마다
   바뀌므로, 여기서는 안정적인 data-* 훅과 role 속성만 선택자로 쓴다. */

/* ---------------------------------------------------------------- 1. 섹션 배경
   Wix는 배경 이미지 크기를 JS로 뷰포트에 맞춰 다시 계산한다. 스냅샷에는 캡처 당시
   뷰포트 폭(데스크톱 1440px / 모바일 390px)이 인라인 style에 그대로 굳어 있어
   그보다 넓은 화면에서 오른쪽에 빈 띠가 생긴다. 컨테이너를 채우게 되돌린다.
   object-fit:cover 는 인라인 style에 이미 들어 있으므로 비율은 유지된다.
   본문 이미지(뉴스 썸네일 등)는 bgMedia 래퍼 밖에 있으므로 영향을 받지 않는다. */
[id^="bgMedia_"] img {
  width: 100% !important;
  height: 100% !important;
}

/* 홈 히어로 안쪽 띠의 배경은 사진이 아니라 가로로 균일한 검은 세로 그라데이션(위 투명 → 65%부터 불투명)이다.
   cover 로 두면 띠가 이미지보다 가로로 길어지는 폭(약 2100px 초과)부터 위아래가 잘려, 투명한
   윗부분이 사라지고 반쯤 어두운 곳에서 띠가 시작해 경계가 선으로 드러난다(Wix 원본도 같다).
   늘려 채우면 어느 폭에서든 투명한 맨 위부터 시작하고, 가로로 늘어나는 것은 보이지 않는다. */
wow-image[data-image-info*="84770f_3ebbf7ac3e26427b83ca50c82aabaaf8"] img {
  object-fit: fill !important;
}

/* ------------------------------------------------------------ 2. 언어 선택기
   Wix는 열림 상태를 해시 클래스로 토글한다. 그 클래스에 기댈 수 없으므로
   restore.js가 붙이는 data-open 으로 같은 상태를 재현한다. */
[data-testid="languages-dropdown-handle-container"] {
  cursor: pointer;
}
[data-testid="languages-dropdown-handle-container"][data-open="true"] {
  z-index: 47;
}
[data-testid="languages-dropdown-handle-container"][data-open="true"] > [role="menu"] {
  display: flex !important;
}
/* 메뉴가 핸들 버튼 위에 겹쳐 뜨므로 Wix와 동일하게 버튼을 감춘다 */
[data-testid="languages-dropdown-handle-container"][data-open="true"] > [data-testid="languages-dropdown-handle"] {
  opacity: 0;
  pointer-events: none;
}
[data-testid="languages-dropdown-handle-container"][data-open="true"] [role="menu"] svg {
  transform: rotate(180deg);
}
[role="menu"] > [role="menuitem"] {
  cursor: pointer;
}

/* ------------------------------------------------------- 2-1. 모바일 햄버거 메뉴
   모바일 판은 네비게이션과 언어 선택기가 모두 이 서랍 안에 들어 있다. 여는 로직이
   없으면 언어 전환은커녕 다른 페이지로 갈 수조차 없어 함께 되살린다.
   Wix는 해시 클래스로 열고 닫으므로 여기서도 data-* 로 상태를 다시 만든다. */
.MENU_AS_CONTAINER[data-mirror-menu="open"] {
  opacity: 1 !important;
  visibility: visible !important;
}
.MENU_AS_CONTAINER[data-mirror-menu="open"] > [id^="overlay-"] {
  display: initial !important;
  opacity: 1;
}
/* 열려 있을 때 햄버거를 서랍 위로 올려 X로 바꾼다 (Wix와 같은 동작) */
.MENU_AS_CONTAINER_TOGGLE[data-mirror-menu="open"] {
  z-index: var(--above-all-z-index, 100000) !important;
}
.MENU_AS_CONTAINER_TOGGLE[data-mirror-menu="open"] span:first-of-type {
  top: 10px;
  transform: rotate(45deg);
}
.MENU_AS_CONTAINER_TOGGLE[data-mirror-menu="open"] span:last-of-type {
  top: 8px;
  transform: rotate(-45deg);
}

/* --------------------------------------------------------------- 3. 뉴스 카드
   restore.js가 카드 이미지·제목을 <a>로 바꾼다. 링크 색이 본문과 달라지지
   않도록 원래 타이포그래피를 유지한다. */
a[data-mirror-link] {
  color: inherit;
  text-decoration: none;
  cursor: pointer;
  display: block;
}
a[data-mirror-link]:hover {
  text-decoration: underline;
}
a[data-mirror-link][data-testid="linkElement"]:hover {
  text-decoration: none;
  opacity: .9;
}

/* -------------------------------------------------------------- 4. 비디오 플레이어
   Wix의 Playable 플레이어는 껍데기 DOM만 남고 조작 로직이 없어 재생 버튼이
   먹지 않는다. 죽은 크롬을 걷어내고 <video> 기본 컨트롤을 그대로 노출한다.
   (restore.js가 controls 속성을 붙이고, 포스터 커버를 걷어 재생시킨다.) */
[data-mirror-cover="shown"] {
  cursor: pointer;
}
[data-mirror-cover="hidden"] {
  display: none !important;
}
[data-playable-hook="player-container"] > *:not([data-playable-hook="screen-block"]) {
  display: none !important;
}
[data-playable-hook="player-container"] [data-playable-hook="background-canvas"] {
  display: none !important;
}
[data-playable-hook="player-container"] video {
  width: 100% !important;
  height: 100% !important;
  background: #000;
}

/* ------------------------------------------------------------------- 5. 지도
   restore.js가 정적 캡처 이미지를 Google Maps 임베드로 교체한다.
   (JS가 꺼져 있으면 캡처 이미지가 그대로 남는다.) */
[data-mirror-map] {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}
/* API 키가 없을 때 쓰는 임베드는 스타일을 지정할 수 없다. 원본 위젯의 흑백 스타일에
   밝기 분포가 가장 가깝도록 맞춘 필터를 씌운다(핀도 회색이 되고, 위성 보기도 흑백이 된다).
   키가 있으면 restore.js가 iframe 대신 div에 원본 스타일 그대로 그리므로 적용되지 않는다. */
iframe[data-mirror-map] {
  filter: grayscale(1) contrast(0.7) brightness(1.3);
}

/* --------------------------------------------------------------- 6. 체크박스
   <label> 클릭으로 input 상태는 바뀌지만, 체크 표시를 그리던 React가 없어
   화면이 그대로다. restore.js가 data-checked 를 갱신하고 체크 아이콘을
   넣어주며, 아래 규칙은 Wix 자체 규칙이 바뀌어도 아이콘이 보이게 하는 보루다. */
[data-hook="checkbox-core"] {
  cursor: pointer;
}
[data-checked="true"] [data-hook="icon-wrapper"] > svg[data-mirror-check] {
  display: block;
  position: absolute;
  top: -1px;
  left: -1px;
  width: calc(100% + 2px);
  height: calc(100% + 2px);
}

/* ------------------------------------------------------ 7. 전화번호 국가코드
   restore.js가 body 끝에 붙이는 드롭다운. 치수·색은 원본 위젯을 계측한 값이고,
   글자색·글꼴·테두리색·배경은 restore.js가 폼 칸의 계산값을 --cc-* 로 넘긴다. */
[data-hook="country-selector-trigger"] {
  cursor: pointer;
}
[data-mirror-cc="open"] [data-mirror-chevron] > svg {
  transform: rotate(180deg);
}
[data-mirror-flag] {
  display: flex;
  align-items: center;
  justify-content: center;
}
[data-mirror-flag] > img {
  width: 22px;
  height: 14px;
  display: block;
}
.mirror-cc {
  position: absolute;
  z-index: 10000;
  width: 288px;
  box-sizing: border-box;
  background: var(--cc-bg, #fff4ec);
  border: 1px solid rgba(74, 53, 40, 0.4);
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1), 0 0 4px rgba(0, 0, 0, 0.1);
  padding-top: 12px;
  color: var(--cc-color, #4a3528);
  font: 14px/17px var(--cc-font, roboto-bold, roboto, sans-serif);
}
.mirror-cc[hidden] {
  display: none;
}
.mirror-cc__search {
  display: flex;
  align-items: center;
  gap: 8px;
  height: 42px;
  box-sizing: border-box;
  margin: 0 24px 8px;
  padding: 0 12px;
  border: 1px solid var(--cc-border, #ff7519);
  border-radius: 6px;
  cursor: text;
}
.mirror-cc__search > svg {
  flex: none;
}
.mirror-cc__search > input {
  flex: 1;
  min-width: 0;
  height: 100%;
  border: 0;
  outline: 0;
  padding: 0;
  background: transparent;
  color: inherit;
  font: 14px/24px var(--cc-font, roboto-bold, roboto, sans-serif);
}
.mirror-cc__search > input::placeholder {
  color: inherit;
  opacity: 1;
}
.mirror-cc__list {
  max-height: 198px;
  overflow-y: auto;
}
.mirror-cc__option {
  display: flex;
  align-items: center;
  padding: 10px 24px;
  cursor: pointer;
  white-space: nowrap;
}
.mirror-cc__option[hidden] {
  display: none;
}
.mirror-cc__option[data-active] {
  background: rgba(74, 53, 40, 0.06);
}
.mirror-cc__option > img {
  width: 22px;
  height: 14px;
  margin-inline-end: 12px;
  flex: none;
}
/* 모바일: 원본처럼 화면을 어둡게 덮고 아래에서 시트가 올라온다 */
.mirror-cc--sheet {
  position: fixed;
  inset: 0;
  width: auto;
  padding: 0;
  border: 0;
  box-shadow: none;
  background: transparent;
  font-size: 16px;
  line-height: 20px;
}
.mirror-cc--sheet .mirror-cc__backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
}
.mirror-cc--sheet .mirror-cc__panel {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding-top: 16px;
  background: var(--cc-bg, #fff4ec);
}
.mirror-cc--sheet .mirror-cc__search {
  height: 48px;
  margin: 0 20px 8px;
}
.mirror-cc--sheet .mirror-cc__search > input {
  font-size: 16px;
}
.mirror-cc--sheet .mirror-cc__list {
  max-height: 50vh;
  padding-bottom: env(safe-area-inset-bottom);
}
.mirror-cc--sheet .mirror-cc__option {
  padding: 12px 20px;
}
.mirror-cc--sheet .mirror-cc__option > img {
  width: 28px;
  height: 18px;
}

/* --------------------------------------------------------- 8. 헤더 스크롤 숨김
   restore.js가 스크롤 방향에 따라 data-mirror-header 를 바꾼다.
   값은 원본 Wix 규칙 그대로(숨김: 0.2s ease-in 으로 자기 높이만큼 위로, 표시: 0.2s). */
#SITE_HEADER[data-mirror-header="hidden"] {
  transition: all 0.2s ease-in;
  transform: translateY(-100%);
}
#SITE_HEADER[data-mirror-header="shown"] {
  transition: all 0.2s;
  transform: none;
}