/* Public pricing: all presentation rules are limited to this page. */
.page-pricing {
  --rp-navy: #163758;
  --rp-ivory: #f7f3ea;
  --rp-gold: #c0a56a;
  --rp-gold-ink: #816431;
  --rp-muted: #526477;
  --rp-rule: #ded4c1;
}

.page-pricing :is(.rp-hero, .rp-services, .rp-web, .rp-estimate) {
  font-size: 18px;
  line-height: 1.9;
}
.page-pricing :is(.rp-hero, .rp-services, .rp-web, .rp-estimate) :is(h1, h2, h3) {
  font-family: Batang, "바탕", "Noto Serif KR", Georgia, serif;
  font-weight: 700;
  letter-spacing: -.035em;
}
.page-pricing :is(.rp-hero-grid, .rp-service-grid, .rp-web-grid, .rp-estimate-grid) > * {
  min-width: 0;
}
.page-pricing :is(.rp-hero, .rp-services, .rp-web, .rp-estimate) .eyebrow {
  font-family: NanumGothic, "Malgun Gothic", sans-serif;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: .1em;
  color: var(--rp-gold-ink);
  margin-bottom: 16px;
}
.page-pricing :is(.rp-hero, .rp-services, .rp-web, .rp-estimate) .button {
  font-size: 18px;
  min-height: 56px;
  padding: 13px 25px;
}

.page-pricing .rp-hero {
  min-height: 500px;
  color: #fff;
  background: radial-gradient(ellipse at 85% 22%, #294664 0, transparent 48%),
    linear-gradient(115deg, #12304e, #163758 68%, #1d3d5b);
  border-bottom: 1px solid var(--rp-gold);
}
.page-pricing .rp-hero .breadcrumb {
  color: #e5e9ec;
  font-size: 18px;
  padding-top: 26px;
  margin-bottom: 20px;
}
.page-pricing .rp-hero .breadcrumb > span { color: #d4bd87; }
.page-pricing .rp-hero .breadcrumb a:hover { color: #efdcae; }
.page-pricing .rp-hero-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(280px, .8fr);
  align-items: center;
  gap: 70px;
  min-height: 410px;
  padding-block: 22px 62px;
}
.page-pricing .rp-hero-copy { max-width: 800px; }
.page-pricing .rp-hero .eyebrow { color: #e1c894; }
.page-pricing .rp-hero h1 {
  font-size: clamp(38px, 4.1vw, 58px);
  line-height: 1.4;
}
.page-pricing .rp-hero-copy > p:not(.eyebrow) {
  max-width: 740px;
  margin-top: 23px;
  font-size: 20px;
  color: #edf0f3;
  line-height: 1.95;
}
.page-pricing .rp-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 13px;
  margin-top: 29px;
}
.page-pricing .rp-actions .button-gold {
  background: #d9bf87;
  color: #15334f;
}
.page-pricing .rp-actions .button-gold:hover { background: #e9d4aa; }
.page-pricing .rp-actions .button-outline { border-color: #c8b88e; }
.page-pricing .rp-hero-mark {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 20px;
  text-align: center;
  padding: 40px 26px;
  border: 1px solid var(--rp-gold);
  background: var(--rp-ivory);
  box-shadow: 0 14px 38px #071c2f24;
}
.page-pricing .rp-hero-mark::before {
  content: "";
  position: absolute;
  inset: 6px;
  border: 1px solid #d9caaa;
  pointer-events: none;
}
.page-pricing .rp-hero-mark img {
  width: min(100%, 240px);
  height: 240px;
  object-fit: contain;
}
.page-pricing .rp-hero-mark strong {
  display: block;
  font-family: Batang, "바탕", Georgia, serif;
  font-size: 30px;
  letter-spacing: .07em;
}
.page-pricing .rp-hero-mark :is(span, p) {
  font-size: 18px;
  color: #715a2c;
  letter-spacing: .14em;
}
.page-pricing .rp-hero-mark p { color: var(--rp-navy); font-weight: 700; }

.page-pricing :is(.rp-services, .rp-web, .rp-estimate) { padding-block: 82px; }
.page-pricing .rp-heading { max-width: 900px; margin-bottom: 30px; }
.page-pricing .rp-heading h2,
.page-pricing .rp-estimate-grid h2 {
  font-size: clamp(30px, 3vw, 40px);
  line-height: 1.5;
}
.page-pricing .rp-heading > p:not(.eyebrow),
.page-pricing .rp-estimate-grid > div > p:not(.eyebrow) {
  margin-top: 18px;
  font-size: 18px;
  color: var(--rp-muted);
}
.page-pricing .rp-price-note {
  border-left: 3px solid var(--rp-gold);
  background: var(--rp-ivory);
  padding: 16px 22px;
  margin-bottom: 30px;
  color: #46596b;
  font-size: 18px;
}
.page-pricing .rp-service-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px;
}
.page-pricing .rp-card {
  display: flex;
  flex-direction: column;
  position: relative;
  padding: 32px 35px 30px;
  border: 1px solid #c0a56ab3;
  background: #fffefa;
  box-shadow: 0 6px 24px #16375806;
}
.page-pricing .rp-card#planning-price { background: #f0f5f8; }
.page-pricing .rp-card#mission-price { background: #faf5eb; }
.page-pricing .rp-card#brand-price { background: #f5ecd9; }
.page-pricing .rp-card#document-price { background: #f1f3f3; }
.page-pricing .rp-card-top {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 12px;
  margin-bottom: 21px;
}
.page-pricing .rp-index {
  font-family: Georgia, serif;
  font-size: 30px;
  color: var(--rp-gold-ink);
  line-height: 1.2;
}
.page-pricing .rp-kind {
  font-size: 18px;
  color: var(--rp-gold-ink);
  letter-spacing: .04em;
}
.page-pricing .rp-card h3 { font-size: 26px; line-height: 1.55; }
.page-pricing .rp-summary {
  margin-top: 15px;
  font-size: 18px;
  color: var(--rp-muted);
}
.page-pricing .rp-package-label { margin-top: 20px; font-size: 18px; font-weight: 700; color: var(--rp-navy); }
.page-pricing .rp-package-label + .rp-includes { margin-top: 6px; }
.page-pricing .rp-includes {
  margin: 20px 0 25px;
  padding: 0;
  list-style: none;
  font-size: 18px;
  color: #3e5367;
}
.page-pricing .rp-includes li {
  position: relative;
  padding: 3px 0 3px 19px;
}
.page-pricing .rp-includes li::before {
  content: "";
  position: absolute;
  top: 18px;
  left: 0;
  width: 5px;
  height: 5px;
  background: var(--rp-gold);
}
.page-pricing .rp-rates {
  margin: auto 0 0;
  border-top: 1px solid var(--rp-rule);
  border-bottom: 1px solid var(--rp-rule);
}
.page-pricing .rp-rates > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px 22px;
  flex-wrap: wrap;
  padding: 14px 0;
}
.page-pricing .rp-rates > div + div { border-top: 1px solid #e9e1d2; }
.page-pricing .rp-rates dt { font-size: 18px; font-weight: 700; }
.page-pricing .rp-rates dd { margin: 0 0 0 auto; color: var(--rp-navy); }
.page-pricing .rp-rates dd strong {
  font-size: 30px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: -.025em;
  font-variant-numeric: tabular-nums;
}
.page-pricing .rp-rates dd small { font-size: 18px; margin-left: 5px; }
.page-pricing .rp-card-note {
  margin-top: 17px;
  font-size: 18px;
  line-height: 1.8;
  color: var(--rp-muted);
}
.page-pricing .rp-card-link {
  display: inline-flex;
  align-self: flex-start;
  align-items: center;
  gap: 16px;
  margin-top: 20px;
  font-size: 18px;
  font-weight: 700;
  color: #725729;
  text-underline-offset: 5px;
}
.page-pricing .rp-card-link:hover { text-decoration: underline; }

.page-pricing .rp-web {
  background: var(--rp-ivory);
  border-block: 1px solid #e7ddca;
}
.page-pricing .rp-web-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
  margin-top: 34px;
}
.page-pricing .rp-web-card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid #c0a56a99;
  border-top: 3px solid var(--rp-gold);
  padding: 28px 25px;
}
.page-pricing .rp-web-card:nth-child(1) { background: #fcfaf4; }
.page-pricing .rp-web-card:nth-child(2) { background: #f8f4ea; }
.page-pricing .rp-web-card:nth-child(3) { background: #f3eedd; }
.page-pricing .rp-web-card:nth-child(4) { background: #f1e9d8; }
.page-pricing .rp-web-card .text-link:hover { color: #725729; }
.page-pricing .rp-web-card h3 { font-size: 25px; line-height: 1.5; }
.page-pricing .rp-screen {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 5px 8px;
  margin-top: 20px;
  color: #645130;
  line-height: 1.5;
}
.page-pricing .rp-screen strong { font-family: Georgia, serif; font-size: 36px; font-weight: 400; }
.page-pricing .rp-screen span { font-size: 18px; }
.page-pricing .rp-web-price {
  padding-bottom: 21px;
  margin-top: 20px;
  border-bottom: 1px solid var(--rp-rule);
  line-height: 1.4;
}
.page-pricing .rp-web-price strong {
  font-size: 34px;
  font-variant-numeric: tabular-nums;
  letter-spacing: -.025em;
}
.page-pricing .rp-web-price small { font-size: 18px; margin-left: 5px; }
.page-pricing .rp-web-desc { font-size: 18px; color: var(--rp-muted); margin-top: 20px; }
.page-pricing .rp-web-card .text-link { margin-top: auto; padding-top: 24px; font-size: 18px; }
.page-pricing .rp-web-common {
  margin-top: 30px;
  padding: 23px 27px;
  background: #eeE7d8;
  border-left: 3px solid var(--rp-gold);
  font-size: 18px;
  color: #344d64;
}
.page-pricing .rp-web-common p + p { margin-top: 10px; }
.page-pricing .rp-web-footnote {
  margin-top: 20px;
  font-size: 18px;
  color: var(--rp-muted);
}

.page-pricing .rp-estimate-grid {
  display: grid;
  grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
  gap: 70px;
  align-items: start;
}
.page-pricing .rp-guide-list { margin: 0; padding: 0; list-style: none; counter-reset: rp-guide; }
.page-pricing .rp-guide-list li {
  position: relative;
  counter-increment: rp-guide;
  padding: 0 0 24px 58px;
  margin-bottom: 24px;
  border-bottom: 1px solid var(--rp-rule);
}
.page-pricing .rp-guide-list li:last-child { margin-bottom: 0; }
.page-pricing .rp-guide-list li::before {
  content: counter(rp-guide, decimal-leading-zero);
  position: absolute;
  top: 0;
  left: 0;
  color: var(--rp-gold-ink);
  font-size: 27px;
  font-family: Georgia, serif;
  line-height: 1.5;
}
.page-pricing .rp-guide-list strong { font-size: 21px; line-height: 1.6; }
.page-pricing .rp-guide-list p { margin-top: 9px; font-size: 18px; color: var(--rp-muted); }
.page-pricing .rp-final-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 25px 40px;
  margin-top: 55px;
  padding: 36px 40px;
  border: 1px solid #c0a56aa6;
  background: var(--rp-ivory);
}
.page-pricing .rp-final-cta h2 { font-size: 28px; }
.page-pricing .rp-final-cta h3 { font-size: 25px; }
.page-pricing .rp-final-cta p { font-size: 18px; color: var(--rp-muted); margin-top: 11px; }
.page-pricing .rp-final-cta .button { flex-shrink: 0; }

@media (max-width: 1100px) {
  .page-pricing .rp-hero-grid { gap: 35px; grid-template-columns: minmax(0, 1.4fr) minmax(230px, .75fr); }
  .page-pricing .rp-hero-mark img { width: 200px; height: 200px; }
  .page-pricing .rp-card { padding: 28px; }
  .page-pricing .rp-web-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
  .page-pricing .rp-estimate-grid { gap: 40px; }
}
@media (max-width: 760px) {
  .page-pricing .rp-hero-grid { grid-template-columns: minmax(0, 1fr); gap: 20px; padding-block: 17px 42px; }
  .page-pricing .rp-hero-copy { max-width: none; }
  .page-pricing .rp-hero-copy > p:not(.eyebrow) { font-size: 18px; }
  .page-pricing .rp-hero-mark { padding: 28px 22px; gap: 15px; max-width: 390px; width: 100%; justify-self: center; }
  .page-pricing .rp-hero-mark img { width: 150px; height: 150px; }
  .page-pricing .rp-hero-mark strong { font-size: 26px; }
  .page-pricing .rp-hero-mark :is(span, p) { letter-spacing: .08em; }
  .page-pricing :is(.rp-services, .rp-web, .rp-estimate) { padding-block: 58px; }
  .page-pricing .rp-service-grid { grid-template-columns: minmax(0, 1fr); gap: 25px; }
  .page-pricing .rp-estimate-grid { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .page-pricing .rp-final-cta { flex-direction: column; align-items: flex-start; padding: 29px; margin-top: 39px; }
}
@media (max-width: 560px) {
  .page-pricing .rp-hero .breadcrumb { gap: 9px; font-size: 18px; }
  .page-pricing .rp-hero h1 { font-size: 36px; }
  .page-pricing .rp-hero-copy > p:not(.eyebrow) br { display: none; }
  .page-pricing .rp-actions { align-items: stretch; gap: 11px; }
  .page-pricing .rp-actions .button { flex: 1 1 180px; gap: 15px; padding-inline: 18px; }
  .page-pricing .rp-hero-mark img { width: 125px; height: 125px; }
  .page-pricing .rp-heading h2, .page-pricing .rp-estimate-grid h2 { font-size: 30px; }
  .page-pricing .rp-price-note { padding: 16px 18px; }
  .page-pricing .rp-card { padding: 25px 22px; }
  .page-pricing .rp-card h3 { font-size: 24px; }
  .page-pricing .rp-card-top { margin-bottom: 18px; }
  .page-pricing .rp-rates > div { gap: 7px 14px; }
  .page-pricing .rp-web-grid { grid-template-columns: minmax(0, 1fr); gap: 22px; }
  .page-pricing .rp-web-card { padding: 27px 24px; }
  .page-pricing .rp-web-common { padding: 21px; }
  .page-pricing .rp-guide-list li { padding-left: 45px; }
  .page-pricing .rp-guide-list strong { font-size: 20px; }
  .page-pricing .rp-final-cta { padding: 25px 22px; }
  .page-pricing .rp-final-cta h2 { font-size: 26px; }
  .page-pricing .rp-final-cta .button { width: 100%; }
}
