:root {
  color-scheme: light;
  --ink: #242823;
  --muted: #686b61;
  --gold: #8a7045;
  --line: #e4dfd4;
  --paper: #fffefb;
  --bg: #f2efe8;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Malgun Gothic", "Noto Sans KR", sans-serif;
  font-size: 15px;
  line-height: 1.8;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; }
a:focus-visible, summary:focus-visible { outline: 3px solid var(--gold); outline-offset: 5px; }
.proposal { max-width: 1040px; margin: 0 auto; padding: 32px 28px calc(112px + env(safe-area-inset-bottom)); }
.cover {
  position: relative;
  overflow: hidden;
  padding: 42px 60px 38px;
  border: 1px solid var(--line);
  border-top: 4px solid var(--gold);
  background: var(--paper);
}
.cover::after {
  content: "";
  position: absolute;
  width: 330px;
  height: 330px;
  top: 160px;
  right: -195px;
  border: 1px solid #ded5c4;
  border-radius: 50%;
  box-shadow: 0 0 0 28px var(--paper), 0 0 0 29px #eee8dc, 0 0 0 60px var(--paper), 0 0 0 61px #f1ece2;
  pointer-events: none;
}
.cover > * { position: relative; z-index: 1; }
.brand { display: flex; align-items: center; gap: 10px; margin-bottom: 68px; }
.brand-logo { display: block; width: auto; height: 36px; }
.brand-name { font-size: 17px; font-weight: 800; letter-spacing: .12em; }
.brand-name em { color: var(--gold); font-style: normal; }
.edition { margin-left: auto; color: var(--muted); font-size: 10px; letter-spacing: .16em; }
.eyebrow { margin: 0 0 22px; color: var(--gold); font-size: 11px; font-weight: 700; letter-spacing: .22em; }
.recipient { margin: 0 0 14px; color: var(--muted); font-size: 14px; }
.cover h1 { margin: 0; font-size: clamp(38px, 6vw, 64px); font-weight: 500; line-height: 1.23; letter-spacing: -.055em; word-break: keep-all; }
.proposal-title { margin: 22px 0 32px; color: var(--gold); font-size: 15px; font-weight: 600; }
.hero-message { max-width: 580px; margin: 0 0 12px; font-size: 21px; font-weight: 600; line-height: 1.6; letter-spacing: -.03em; word-break: keep-all; }
.hero-description { max-width: 570px; margin: 0; color: var(--muted); font-size: 14px; word-break: keep-all; }
.cover-meta { display: flex; justify-content: space-between; gap: 16px; margin-top: 48px; padding-top: 20px; border-top: 1px solid var(--line); }
.date, .company { margin: 0; color: var(--muted); font-size: 11px; }
.company strong { margin-left: 8px; color: var(--ink); font-weight: 600; }
.journey { display: grid; grid-template-columns: repeat(3, 1fr); padding: 32px 0; }
.journey div { padding: 0 24px; border-right: 1px solid #d9d3c7; }
.journey div:first-child { padding-left: 8px; }
.journey div:last-child { border: 0; }
.journey span { display: block; margin-bottom: 5px; color: var(--gold); font-size: 10px; letter-spacing: .12em; }
.journey strong { font-size: 15px; font-weight: 500; word-break: keep-all; }
.contents { display: flex; flex-wrap: wrap; gap: 10px 20px; margin: 0 0 28px; padding: 20px 24px; border: 1px solid var(--line); background: #f8f6f0; }
.contents > span { width: 100%; color: var(--gold); font-size: 10px; letter-spacing: .16em; }
.contents a { color: var(--muted); font-size: 12px; text-decoration: none; }
.contents a:hover { color: var(--ink); text-decoration: underline; text-underline-offset: 4px; }
.sections { display: flex; flex-direction: column; gap: 22px; }
.card { scroll-margin-top: 24px; padding: 38px 44px; background: var(--paper); border: 1px solid var(--line); }
.card-head { display: flex; align-items: baseline; gap: 18px; margin-bottom: 24px; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.num { flex: 0 0 auto; min-width: 24px; color: var(--gold); font-family: Georgia, serif; font-size: 24px; line-height: 1; }
.card-head h2 { margin: 0; font-size: 23px; font-weight: 600; line-height: 1.5; letter-spacing: -.035em; word-break: keep-all; }
.body p { margin: 0 0 18px; color: #50564c; font-size: 15px; word-break: keep-all; overflow-wrap: anywhere; }
.body p:last-child { margin-bottom: 0; }
.service-list { margin: 0 0 22px; padding: 0; list-style: none; }
.service-list:last-child { margin-bottom: 0; }
.service-list li { position: relative; padding: 9px 0 9px 20px; color: #50564c; font-size: 15px; word-break: keep-all; overflow-wrap: anywhere; }
.service-list li::before { content: ""; position: absolute; top: 21px; left: 2px; width: 4px; height: 4px; background: var(--gold); }
.terms { margin: 0 0 24px; }
.terms > div { display: grid; grid-template-columns: 1fr 1.4fr; gap: 20px; padding: 17px 0; border-bottom: 1px solid var(--line); }
.terms dt { color: var(--muted); font-size: 14px; }
.terms dd { margin: 0; text-align: right; font-size: 16px; font-weight: 600; word-break: keep-all; }
.card-investment .terms > div:nth-child(4) { padding: 23px 0; border-bottom: 2px solid var(--gold); }
.card-investment .terms > div:nth-child(4) dd { color: var(--gold); font-size: 24px; }
.empty { color: var(--muted); }
.callout { margin-top: 26px; padding: 18px 22px; border-left: 2px solid var(--gold); background: #f5f2eb; color: #655332; font-size: 14px; word-break: keep-all; }
.callout p { margin: 0; }
.card-highlight { background: var(--ink); border-color: var(--ink); }
.card-highlight .card-head { border-color: #4a4e43; }
.card-highlight .num { color: #d0b585; }
.card-highlight h2 { color: #fffdf6; }
.card-highlight .body p { color: #e0e1d6; }
.card-highlight .service-list li { color: #e6e7dc; }
.card-highlight .service-list li::before { background: #d0b585; }
.card-highlight .terms dt { color: #b9bbaf; }
.card-highlight .terms dd { color: #fffdf6; }
.card-highlight .body p:first-child { color: #efdbb7; font-size: 23px; line-height: 1.7; letter-spacing: -.03em; }
.evidence-panel { margin-top: 28px; border-top: 1px solid var(--line); }
.evidence-panel summary { padding: 18px 0; color: var(--ink); font-size: 14px; cursor: pointer; }
.evidence-panel summary span { margin-left: 12px; color: var(--gold); font-size: 10px; letter-spacing: .08em; }
.evidence { display: grid; grid-template-columns: 1fr 1fr; gap: 24px 18px; padding-top: 8px; }
.evidence figure { min-width: 0; margin: 0; }
.evidence img { display: block; width: 100%; height: auto; border: 1px solid var(--line); background: white; }
.evidence figcaption { margin-top: 10px; color: var(--muted); font-size: 12px; line-height: 1.7; word-break: keep-all; }
.evidence figcaption b { color: var(--ink); }
.evidence-note { grid-column: 1 / -1; margin: 0; color: var(--muted); font-size: 11px; }
.proposal-foot { margin-top: 44px; text-align: center; color: var(--muted); font-size: 11px; overflow-wrap: anywhere; }
.proposal-foot p { margin: 4px 0; }
.footer-brand { display: block; margin-bottom: 14px; color: var(--gold); font-size: 15px; font-weight: 600; letter-spacing: .22em; }
.cta { position: fixed; z-index: 10; bottom: 0; left: 50%; transform: translateX(-50%); width: 100%; max-width: 984px; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 12px 20px calc(12px + env(safe-area-inset-bottom)); background: #fffefbf5; border: 1px solid var(--line); border-bottom: 0; }
.cta a { display: flex; justify-content: center; align-items: center; min-height: 48px; border: 1px solid var(--ink); font-size: 14px; font-weight: 600; text-decoration: none; }
.cta a:first-child { background: var(--ink); color: var(--paper); }
.cta a:hover { border-color: var(--gold); background: var(--gold); color: white; }

@media (max-width: 600px) {
  .proposal { padding: 0 16px calc(104px + env(safe-area-inset-bottom)); }
  .cover { margin: 0 -16px; padding: 28px 26px 30px; }
  .cover::after { right: -285px; }
  .brand { margin-bottom: 46px; gap: 8px; }
  .brand-logo { height: 30px; }
  .brand-name { font-size: 14px; }
  .edition { font-size: 8px; letter-spacing: .06em; }
  .hero-message { font-size: 19px; }
  .cover-meta { margin-top: 32px; flex-direction: column; gap: 5px; }
  .journey { padding: 24px 0; }
  .journey div, .journey div:first-child { padding: 0 10px; }
  .journey span { font-size: 8px; letter-spacing: 0; }
  .journey strong { font-size: 12px; }
  .contents { padding: 16px 18px; gap: 9px 16px; margin-bottom: 20px; }
  .sections { gap: 16px; }
  .card { padding: 26px 22px; }
  .card-head { gap: 12px; margin-bottom: 18px; padding-bottom: 15px; }
  .card-head h2 { font-size: 20px; }
  .num { min-width: 18px; font-size: 21px; }
  .body p, .service-list li { font-size: 14px; }
  .terms > div { grid-template-columns: 1fr; gap: 4px; padding: 14px 0; }
  .terms dd { text-align: left; font-size: 16px; }
  .card-investment .terms > div:nth-child(4) dd { font-size: 24px; }
  .callout { padding: 15px 17px; font-size: 13px; }
  .card-highlight .body p:first-child { font-size: 20px; }
  .evidence { grid-template-columns: 1fr; }
  .evidence-panel summary span { display: block; margin: 4px 0 0 18px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

@media print {
  @page { margin: 16mm; }
  body { background: white; }
  .proposal { max-width: none; padding: 0; }
  .cover { margin: 0; break-after: page; }
  .cover::after, .cta, .contents { display: none; }
  .card { break-inside: avoid; padding: 24px; }
  .journey { padding: 24px 0; }
  .card-highlight { background: white; border: 2px solid var(--gold); }
  .card-highlight h2, .card-highlight .body p, .card-highlight .body p:first-child { color: var(--ink); }
  .card-highlight .service-list li, .card-highlight .terms dt, .card-highlight .terms dd { color: var(--ink); }
  .evidence-panel:not([open]) { display: none; }
}

/* 신청서 */
.apply-lead { margin: 0 0 22px; color: #50564c; font-size: 15px; }
.apply-form { display: grid; grid-template-columns: 1fr 1fr; gap: 16px 18px; }
.apply-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.apply-field.full { grid-column: 1 / -1; }
.apply-field label { color: var(--muted); font-size: 13px; }
.apply-field .req { color: #b4552d; }
.apply-field input, .apply-field select, .apply-field textarea { width: 100%; padding: 11px 12px; border: 1px solid var(--line); background: #fff; font: inherit; font-size: 15px; color: var(--ink); border-radius: 0; }
.apply-field input:focus, .apply-field select:focus, .apply-field textarea:focus { outline: 2px solid var(--gold); outline-offset: -1px; }
.apply-field textarea { min-height: 100px; resize: vertical; }
.apply-help { color: var(--muted); font-size: 12px; }
.apply-error { color: #b4552d; font-size: 12px; }
.apply-error-box { grid-column: 1 / -1; padding: 12px 14px; border-left: 2px solid #b4552d; background: #fbf1ee; color: #8c3d22; font-size: 13px; }
.apply-agree-label { display: flex; align-items: flex-start; gap: 10px; color: #50564c; font-size: 14px; }
.apply-agree-label input { width: 18px; height: 18px; margin-top: 2px; }
.apply-submit { grid-column: 1 / -1; min-height: 52px; border: 1px solid var(--ink); background: var(--ink); color: var(--paper); font: inherit; font-size: 15px; font-weight: 600; cursor: pointer; }
.apply-submit:hover { border-color: var(--gold); background: var(--gold); color: #fff; }
.apply-done { padding: 22px 24px; border-left: 2px solid var(--gold); background: #f5f2eb; }
.apply-done strong { display: block; margin-bottom: 8px; font-size: 17px; color: var(--ink); }
.apply-done p { margin: 0; color: #50564c; font-size: 14px; }
.apply-note { margin: 18px 0 0; color: var(--muted); font-size: 12px; }
.cta { grid-template-columns: repeat(3, 1fr); }

@media (max-width: 600px) {
  .apply-form { grid-template-columns: 1fr; }
  .cta { grid-template-columns: 1fr 1fr; }
  .cta a:first-child { grid-column: 1 / -1; }
}

/* 본문 도메인 링크 */
.body a, .service-list a { color: inherit; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--gold); }
.body a:hover, .service-list a:hover { color: var(--gold); }

/* 진단 리포트 질문 상자 — 범위를 정하기 전에 묻는 창구 (2026-10-25) */
.ask-lead { margin: 0 0 22px; color: #50564c; font-size: 15px; word-break: keep-all; overflow-wrap: anywhere; }
.ask-card { scroll-margin-top: 24px; }
.ask-form { display: flex; flex-direction: column; gap: 22px; scroll-margin-top: 24px; }
.ask-item { display: flex; flex-direction: column; gap: 6px; }
.ask-label { color: var(--muted); font-size: 13px; }
.ask-question { margin: 0; color: #50564c; font-size: 15px; word-break: keep-all; overflow-wrap: anywhere; }
.ask-form input[type="text"] { width: 100%; padding: 13px 14px; border: 1px solid var(--line); background: #fff; font: inherit; font-size: 16px; color: var(--ink); border-radius: 0; }
.ask-form input[type="text"]:focus { outline: 2px solid var(--gold); outline-offset: -1px; }
.ask-error { color: #b4552d; font-size: 12px; }
.ask-answer { margin: 0; padding: 13px 14px; border: 1px solid var(--line); background: #f0eee8; color: #6b6f66; font-size: 16px; word-break: keep-all; overflow-wrap: anywhere; }
.ask-submit { display: inline-flex; align-items: center; justify-content: center; align-self: flex-start; min-width: 180px; min-height: 52px; border: 1px solid var(--ink); background: var(--ink); color: var(--paper); font: inherit; font-size: 15px; font-weight: 600; cursor: pointer; text-decoration: none; }
.ask-submit:hover { border-color: var(--gold); background: var(--gold); color: #fff; }
.ask-done { margin: 0; padding: 16px 18px; border-left: 2px solid var(--gold); background: #f5f2eb; color: #655332; font-size: 15px; font-weight: 600; word-break: keep-all; }

@media (max-width: 600px) {
  .ask-submit { align-self: stretch; min-width: 0; }
}

/* 세이프넷이 제공할 수 있는 일 — 답변을 받기 전에는 펼칠 수 없다 (2026-10-25) */
.offer-card.is-locked { background: #f7f6f2; }
.offer-card.is-locked .num { color: #b8bab2; }
.offer-card.is-locked h2 { color: #8b8e86; }
.offer-lead { margin: 0 0 20px; color: #50564c; font-size: 15px; word-break: keep-all; }
.offer-fold > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 15px; border: 1px solid var(--line); background: #f8f6f0; color: var(--ink); font-size: 15px; font-weight: 600; cursor: pointer; list-style: none; }
.offer-fold > summary::-webkit-details-marker { display: none; }
.offer-fold > summary::after { content: "＋"; color: var(--gold); font-size: 18px; }
.offer-fold[open] > summary::after { content: "－"; }
.offer-items { list-style: none; margin: 18px 0 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.offer-item { display: flex; align-items: flex-start; gap: 12px; padding: 14px 16px; border: 1px solid var(--line); background: #fff; }
.offer-item input[type="checkbox"] { flex: none; width: 22px; height: 22px; margin: 2px 0 0; }
.offer-item label { cursor: pointer; }
.offer-item strong { display: block; margin-bottom: 4px; font-size: 15px; font-weight: 600; }
.offer-item span { color: #50564c; font-size: 14px; word-break: keep-all; overflow-wrap: anywhere; }