/* Shared type scale from the kkokmeok-shop project. */
:root {
  --sans: 'Pretendard', 'Malgun Gothic', 'Apple SD Gothic Neo', sans-serif;
  --serif: var(--sans);
  --mono: var(--sans);
  --fs-xs: 12px; --fs-sm: 14px; --fs-s: 16px; --fs-base: 16px;
  --fs-md: 18px; --fs-lg: 18px; --fs-xl: 24px;
  --fs-2xl: 36px; --fs-3xl: 36px; --fs-4xl: 37px;
  --lh-body: 1.7;
}
body { font-family: var(--sans); font-size: 16px; font-weight: 500; line-height: 1.7; }
body h1, body h2, body h3, body p, body a, body button, body input, body select, body textarea, body label, body th, body td, body small, body span, body b, body strong { font-family: var(--sans); }
body .h1, body .hero .h1, body .page-hero .h1 { font-size: 36px; font-weight: 800; line-height: 1.4; letter-spacing: -1px; }
body .hero .h1 { font-size: 37px; }
body .h2, body .sec-head .h2 { font-size: 36px; font-weight: 900; line-height: 1.5; letter-spacing: -.5px; }
body .h3, body #why .card .h3 { font-size: 24px; font-weight: 800; line-height: 1.5; }
body .lead, body .hero__lead, body .hero .hero__lead, body .page-hero p { font-size: 18px; font-weight: 500; line-height: 1.7; }
body .gnb__link, body .mobile-menu__link { font-size: 16px; font-weight: 750; }
body .btn, body .header .btn, body .float__btn { font-size: 16px; font-weight: 700; }
body .photo__t b, body .strip__item b, body .tl__body b { font-size: 18px; font-weight: 800; }
body .photo__t span, body .strip__item span, body .brand small, body .hero .hero__location, body .hero .hero__contact { font-size: 14px; font-weight: 500; }
body .card p, body #why .card p, body .tbl td, body .tbl th, body .field label, body .field input, body .field select, body .field textarea, body .consent { font-size: 16px; line-height: 1.7; }
body .process-overview__head p, body .process-overview__list p { font-size: 16px; font-weight: 500; }
body .process-overview__list h3 { font-size: 18px; font-weight: 800; }
body .brand b { font-family: var(--sans); font-weight: 800; }
@media (max-width: 820px) {
  body .h1, body .hero .h1, body .page-hero .h1 { font-size: 31px; }
  body .h2, body .sec-head .h2 { font-size: 23px; }
  body .h3, body #why .card .h3 { font-size: 20px; }
  body .lead, body .hero__lead, body .hero .hero__lead, body .page-hero p { font-size: 16px; }
  body .btn, body .header .btn, body .float__btn, body .hero .hero__cta .btn { font-size: 14px; }
}

/* Contact guidance: quieter surfaces and generous line icons. */
.contact .info { gap: 14px; }
.contact .info > a, .contact .info > div { gap: 20px; padding: 25px 24px; border: 1px solid #e0e5eb; border-radius: 10px; align-items: center; }
.contact .info i { width: 56px; height: 56px; border-radius: 50%; background: #f6f1e8; color: #967143; }
.contact .info i svg { width: 27px; height: 27px; stroke-width: 1.6; }
.contact .info b { font-size: 13px; letter-spacing: 0; margin-bottom: 6px; color: #687384; }
.contact .info span { display: block; font-size: 18px; font-weight: 700; line-height: 1.45; }
.contact .info > a span { font-size: 23px; font-weight: 800; }
.contact .info small { font-size: 13px; line-height: 1.7; margin-top: 7px; }
.contact .info > a:hover { border-color: #c4ab83; background: #fffdf9; }
@media (max-width: 640px) {
  .contact .info > a, .contact .info > div { padding: 20px 18px; gap: 16px; }
  .contact .info i { width: 48px; height: 48px; }
  .contact .info i svg { width: 25px; height: 25px; }
  .contact .info span { font-size: 16px; }
  .contact .info > a span { font-size: 21px; }
}

/* Softer navy footer across every page. */
.footer { background: #263b56; }