/* ============================================================
   poster-sample.css — 점두 브리핑 샘플 페이지 (랜딩 공개)
   main.css 디자인 토큰 재사용 (--green-ink / --green-600 / --line
   / --surface / --paper / --ink / --muted). 새 컬러 체계 없음.
   시트는 컨테이너 쿼리 단위(cqw)로 A4 비율 유지하며 무단 스케일.
   ============================================================ */

.poster-sample-page {
  min-height: 100vh;
  background: var(--surface);
  padding-bottom: 56px;
}

/* ── 상단 툴바 ── */
.poster-sample-toolbar {
  position: sticky;
  top: 0;
  z-index: 10;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  padding: 14px 24px;
  background: var(--paper);
  border-bottom: 1px solid var(--line);
}
.poster-sample-logo { display: inline-flex; align-items: center; line-height: 0; text-decoration: none; }
.poster-sample-logo img { display: block; width: 123px; height: 24px; }
.poster-sample-tools { display: flex; align-items: center; gap: 10px; }
.poster-sample-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 9px 16px;
  border-radius: 8px;
  font-size: 13.5px;
  font-weight: 700;
  text-decoration: none;
  transition: background .15s ease, border-color .15s ease, color .15s ease;
  white-space: nowrap;
}
.poster-sample-btn-ghost {
  color: var(--green-ink);
  border: 1.5px solid var(--line-2);
  background: var(--paper);
}
.poster-sample-btn-ghost:hover {
  border-color: var(--green-ink);
}
.poster-sample-btn-primary {
  color: #fff;
  background: var(--green-600);
  border: 1.5px solid var(--green-600);
}
.poster-sample-btn-primary:hover {
  background: var(--green-ink);
  border-color: var(--green-ink);
}

/* ── 시트 컨테이너 ── */
.poster-sample-sheet-wrap {
  container-type: inline-size;
  width: min(860px, calc(100vw - 48px));
  margin: 36px auto 0;
}

/* ── A4 시트 — 모든 타이포는 cqw 로 시트 폭에 비례 스케일 ── */
.poster-sample-sheet {
  width: 100%;
  aspect-ratio: 210 / 297;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  padding: 6.4cqw 6cqw 5.4cqw;
  background: var(--paper);
  border: 1px solid var(--line);
  box-shadow: 0 10px 40px -16px rgba(11, 61, 46, .22);
  color: var(--green-ink);
}

/* 헤더 — 한글 템플릿명 먼저(크게), 영문 보조. 하단 딥그린 굵은 라인. */
.sheet-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 3cqw;
  padding-bottom: 2.4cqw;
  border-bottom: 0.5cqw solid var(--green-ink);
}
.sheet-brand { display: flex; flex-direction: column; gap: 0.5cqw; }
.sheet-brand-ko {
  font-size: 4.6cqw;
  font-weight: 800;
  line-height: 1.05;
  letter-spacing: -0.02em;
  color: var(--green-ink);
}
.sheet-brand-en {
  font-size: 1.5cqw;
  font-weight: 700;
  letter-spacing: 0.34em;
  color: var(--muted-2);
}
.sheet-office {
  font-size: 1.85cqw;
  font-weight: 700;
  color: var(--muted);
  padding-top: 1.4cqw;
  white-space: nowrap;
}

/* 본문 */
.sheet-body { flex: 1; display: flex; flex-direction: column; padding-top: 3.4cqw; }

.sheet-lead { margin-bottom: 0.4cqw; }
.sheet-eyebrow {
  font-size: 1.85cqw;
  font-weight: 600;
  color: var(--muted);
  letter-spacing: 0.01em;
}
.sheet-apartment {
  margin: 0.6cqw 0 0;
  font-size: 5.6cqw;
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -0.025em;
  color: var(--green-ink);
}

/* 가격 — 초대형. 배경 박스 없음, 타이포만 강조. */
.sheet-price-block { margin-top: 2cqw; }
.sheet-price-label {
  display: block;
  font-size: 1.7cqw;
  font-weight: 800;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--green-700);
  margin-bottom: 0.2cqw;
}
.sheet-price {
  display: block;
  font-size: 16cqw;
  font-weight: 900;
  line-height: 0.9;
  letter-spacing: -0.045em;
  color: var(--green-ink);
  word-break: keep-all;
}

/* 구분선 */
.sheet-divider {
  height: 0;
  border-top: 1px solid var(--line);
  margin: 2.6cqw 0;
}

/* 평형 / 전용면적 */
.sheet-specs { }
.sheet-specs-main {
  margin: 0;
  font-size: 5.4cqw;
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: 0.005em;
  color: var(--green-ink);
}
.sheet-specs-main sup {
  font-size: 0.5em;
  font-weight: 800;
  vertical-align: super;
}
.sheet-specs-sub {
  margin: 0.9cqw 0 0;
  font-size: 2.9cqw;
  font-weight: 600;
  color: var(--ink-2);
}

/* 핵심 태그 — 얇은 테두리 · 흰 배경 · 굵은 글씨 */
.sheet-tags {
  list-style: none;
  margin: 2.4cqw 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 1.4cqw;
}
.sheet-tags li {
  display: inline-flex;
  align-items: center;
  padding: 1.1cqw 2.4cqw;
  border: 0.18cqw solid var(--green-700);
  border-radius: 999px;
  font-size: 2.5cqw;
  font-weight: 700;
  color: var(--green-ink);
  letter-spacing: -0.01em;
}

/* 상세문구 — 가격 다음으로 강한 핵심 세일즈 문구 */
.sheet-desc {
  margin: 0;
  font-size: 4.7cqw;
  font-weight: 800;
  line-height: 1.45;
  letter-spacing: -0.02em;
  color: var(--green-ink);
  word-break: keep-all;
}
/* 보조문구 — 읽어도 되고 안 읽어도 되는 정보. 상세문구를 방해하지 않게. */
.sheet-subdesc {
  margin: 1.8cqw 0 0;
  font-size: 2.5cqw;
  font-weight: 500;
  line-height: 1.7;
  color: rgba(0, 0, 0, .72);
  word-break: keep-all;
}

/* 하단 — 전화번호가 메인 CTA */
.sheet-foot {
  display: flex;
  flex-wrap: nowrap;
  align-items: flex-end;
  justify-content: space-between;
  gap: 3cqw;
  padding-top: 2.8cqw;
  border-top: 0.45cqw solid var(--green-ink);
}
.sheet-contact { flex-shrink: 0; }
.sheet-contact-label {
  display: block;
  font-size: 1.85cqw;
  font-weight: 800;
  letter-spacing: 0.16em;
  color: var(--green-700);
}
.sheet-contact-num {
  display: block;
  margin-top: 0.4cqw;
  font-size: 6.5cqw;
  font-weight: 900;
  line-height: 1;
  letter-spacing: -0.03em;
  color: var(--green-ink);
  white-space: nowrap;
}
.sheet-agent {
  text-align: right;
  flex-shrink: 1;
  min-width: 0;
}
.sheet-agent-row {
  display: flex;
  align-items: baseline;
  justify-content: flex-end;
  gap: 1cqw;
}
.sheet-agent-name { font-size: 2.3cqw; font-weight: 800; color: var(--green-ink); }
.sheet-agent-firm { font-size: 2cqw; font-weight: 700; color: var(--ink-2); }
.sheet-agent-addr {
  display: block;
  margin-top: 0.5cqw;
  font-size: 1.6cqw;
  color: var(--muted);
}
.sheet-agent-date {
  display: block;
  margin-top: 0.4cqw;
  font-size: 1.5cqw;
  font-weight: 700;
  color: var(--muted-2);
  letter-spacing: 0.04em;
}

.sheet-disclaimer {
  margin: 1.8cqw 0 0;
  font-size: 1.4cqw;
  color: var(--muted-2);
  line-height: 1.6;
  word-break: keep-all;
}

/* ── 반응형 — 모바일 ── */
@media (max-width: 640px) {
  .poster-sample-toolbar {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }
  .poster-sample-tools { justify-content: stretch; }
  .poster-sample-btn { flex: 1; }
  .poster-sample-sheet-wrap {
    width: calc(100vw - 28px);
    margin-top: 20px;
  }
}

/* ── 인쇄 ── */
@media print {
  @page { size: A4; margin: 0; }
  .poster-sample-toolbar { display: none !important; }
  .poster-sample-page { background: #fff; padding: 0; }
  .poster-sample-sheet-wrap {
    width: 210mm;
    max-width: none;
    margin: 0;
  }
  .poster-sample-sheet {
    box-shadow: none;
    border: none;
  }
}
