/* 전문 열람 게이트 — 모달 전용.
   서식은 사이트 폼 표준(src/JAIN/css/form.css)과 같은 페이지의 버튼(.bil_btn)을 따른다:
   radius 6 · 라벨 16px/500/#212121 · 입력 border #e3e3e3, placeholder #a0a0a0 ·
   오류 #b3261e · 버튼 weight 500 + transition .3s ease (2026-08-03 서식 통일). */

.ebook_gate_dimmed {
  display: none;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.75);   /* 같은 페이지 미리보기 모달과 동일 */
  z-index: 999;
}
.ebook_gate_modal {
  display: none;
  position: fixed;
  left: 50%;
  top: 50%;
  width: 420px;
  max-width: calc(100vw - 32px);
  max-height: calc(100vh - 32px);
  overflow-y: auto;
  padding: 36px 28px 28px;
  background-color: #fff;
  border-radius: 8px;                       /* 미리보기 모달과 동일 */
  transform: translate3d(-50%, -50%, 0);
  z-index: 1000;
}
.ebook_gate.open .ebook_gate_dimmed,
.ebook_gate.open .ebook_gate_modal {
  display: block;
}
.ebook_gate_close {
  position: absolute;
  right: 16px;
  top: 12px;
  border: 0;
  background: none;
  color: #464748;                           /* 미리보기 모달 컨트롤 톤 */
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
}

.ebook_gate_title {
  margin-bottom: 8px;
  font-size: 20px;
  font-weight: 700;
  line-height: 140%;
  color: #212121;
}
.ebook_gate_desc {
  margin-bottom: 24px;
  font-size: 15px;
  font-weight: 400;
  line-height: 150%;
  color: #7b7b7b;
}

.ebook_gate_field {
  display: block;
  margin-bottom: 14px;                      /* form.css 필드 gap */
}
.ebook_gate_field span {
  display: block;
  margin-bottom: 8px;
  font-size: 16px;                          /* 사이트 폼 라벨 규격 */
  font-weight: 500;
  line-height: 160%;
  color: #212121;
}
.ebook_gate_field input {
  width: 100%;
  padding: 12px 14px;                       /* form.css 입력 규격 */
  border: 1px solid #e3e3e3;
  border-radius: 6px;
  font-family: 'Pretendard';
  font-size: 16px; /* iOS 확대 방지 — 16px 미만이면 포커스 시 화면이 줌된다 */
  font-weight: 400;
  line-height: 160%;
  color: #212121;
}
.ebook_gate_field input::placeholder {
  font-weight: 400;
  color: #a0a0a0;                           /* form.css placeholder */
}
.ebook_gate_field input:focus {
  border-color: #1E5AF0;
  outline: none;
}
/* 라벨과 같은 span 이라 .ebook_gate_field span 규칙을 이겨야 한다 */
.ebook_gate_field .ebook_gate_hint {
  margin-top: 6px;
  margin-bottom: 0;
  font-size: 13px;
  font-weight: 400;
  color: #a0a0a0;
}
.ebook_gate_error {
  min-height: 20px;
  margin-bottom: 8px;
  font-size: 14px;                          /* form.css 오류 규격 */
  font-weight: 400;
  color: #b3261e;
}

/* 주 액션 — CTA 규칙(코발트 채움, src/JAIN/CLAUDE.md)·버튼 규격(weight 500, radius 6, transition) */
.ebook_gate_submit {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 50px;
  margin-top: 8px;
  border: 0;
  border-radius: 6px;
  background-color: #1E5AF0;
  font-family: 'Pretendard';
  font-size: 16px;
  font-weight: 500;
  line-height: 19px;
  color: #fff;
  transition: 0.3s ease;
  cursor: pointer;
}
.ebook_gate_submit:hover {
  background-color: #1848C9;
}
.ebook_gate_submit:disabled {
  background-color: #a0a0a0;
  cursor: default;
}

/* ── 성공 화면 ──────────────────────────────────────────────────────────── */
/* [hidden] 을 display 규칙보다 세게 — 단계 전환이 스타일에 지지 않게 */
.ebook_gate_stage_form[hidden],
.ebook_gate_stage_done[hidden] {
  display: none;
}
/* 성공 화면의 리더 링크 — 제출 버튼과 같은 규격의 «진짜 링크» */
.ebook_gate_open {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 50px;
  border-radius: 6px;
  background-color: #1E5AF0;
  font-size: 16px;
  font-weight: 500;
  line-height: 19px;
  color: #fff;
  text-decoration: none;
  transition: 0.3s ease;
}
.ebook_gate_open:hover {
  background-color: #1848C9;
}

/* iOS Safari 동적 툴바 — 100vh 는 툴바 펼침 상태에서 실제 가시 높이보다 크다 (⑦-a P2).
   dvh 를 지원하는 브라우저에서만 덮는다. */
@supports (height: 100dvh) {
  .ebook_gate_modal {
    max-height: calc(100dvh - 32px);
  }
}