/* Service and insight pages (loaded when the page passes 'pages' to siteHead) */
.page-hero {background: #181818;padding: 170px 0 90px;text-align: center;}
.page-hero .eyebrow {font-family: 'DIN Pro Cond';font-weight: 700;color: #cc00ff;font-size: 20px;letter-spacing: 8px;text-indent: 8px;}
.page-hero h1 {color: #fff;font-size: 44px;font-weight: 600;line-height: 1.3;margin-top: 18px;word-break: keep-all;}
.page-hero .lead {color: #d0d0d0;max-width: 760px;margin: 24px auto 0;font-size: 17px;line-height: 1.8;font-weight: 300;word-break: keep-all;}
.page-hero .meta {color: #9e9e9e;font-size: 14px;margin-top: 16px;}

.page-body {background: #fff;padding: 90px 0 120px;}
.page-body .block + .block {margin-top: 80px;}
.page-body h2 {font-family: 'DIN Pro Cond';color: #cc00ff;font-size: 30px;font-weight: 700;margin-bottom: 28px;}

.offer-grid {display: grid;grid-template-columns: repeat(2, 1fr);gap: 20px;}
.offer-card {border: 1px solid #e5e5e5;padding: 28px;}
.offer-card h3 {font-size: 19px;font-weight: 600;}
.offer-card p {margin-top: 10px;font-size: 15px;line-height: 1.7;color: #555;font-weight: 300;word-break: keep-all;}

.process {display: grid;grid-template-columns: repeat(4, 1fr);gap: 20px;}
.process li {border-top: 2px solid #cc00ff;padding-top: 18px;}
.process .num {font-family: 'DIN Pro Cond';color: #cc00ff;font-size: 16px;font-weight: 700;}
.process h3 {font-size: 18px;font-weight: 600;margin-top: 6px;}
.process p {font-size: 14px;line-height: 1.7;color: #555;margin-top: 8px;word-break: keep-all;}

.related {display: grid;grid-template-columns: repeat(3, 1fr);gap: 16px;}
.related a {display: block;aspect-ratio: 4 / 3;background-size: cover;background-position: center;position: relative;background-color: #222;}
.related a span {position: absolute;left: 0;right: 0;bottom: 0;padding: 14px;color: #fff;font-size: 14px;
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.8));}

.other-services {display: flex;flex-wrap: wrap;gap: 10px;}
.other-services a {border: 1px solid #cc00ff;color: #cc00ff;padding: 8px 16px;font-size: 14px;}
.other-services a:hover {background: #cc00ff;color: #fff;}

.cta {background: #181818;text-align: center;padding: 64px 24px;}
.cta p {color: #fff;font-size: 22px;font-weight: 500;word-break: keep-all;}
.cta a {display: inline-block;margin-top: 24px;background: #cc00ff;color: #fff;padding: 14px 40px;font-size: 16px;font-weight: 600;}

/* insights */
.article-grid {display: grid;grid-template-columns: repeat(3, 1fr);gap: 28px;}
.article-card .thumb {display: block;aspect-ratio: 16 / 9;background-size: cover;background-position: center;background-color: #181818;}
.article-card .date {display: block;color: #9e9e9e;font-size: 13px;margin-top: 14px;}
.article-card h2 {font-family: 'Pretendard', sans-serif;color: #181818;font-size: 19px;font-weight: 600;line-height: 1.45;margin: 6px 0 0;word-break: keep-all;}
.article-card p {color: #555;font-size: 14px;line-height: 1.7;margin-top: 8px;word-break: keep-all;}
.empty {text-align: center;color: #777;font-size: 16px;padding: 40px 0;}
.pager {display: flex;justify-content: center;gap: 8px;margin-top: 56px;}
.pager a {border: 1px solid #ddd;padding: 6px 14px;font-size: 14px;}

.article-body {max-width: 760px;margin: 0 auto;}
.article-body .cover {margin-bottom: 48px;}
.article-body p {font-size: 17px;line-height: 1.9;color: #333;word-break: keep-all;}
.article-body p + p, .article-body ul + p, .article-body h2 + p {margin-top: 20px;}
.article-body h2 {font-family: 'Pretendard', sans-serif;color: #181818;font-size: 24px;font-weight: 700;margin: 48px 0 0;}
.article-body h2 + p, .article-body h2 + ul {margin-top: 16px;}
.article-body ul {margin: 20px 0 0 4px;}
.article-body ul li {position: relative;padding-left: 16px;font-size: 17px;line-height: 1.8;color: #333;}
.article-body ul li::before {content: '';position: absolute;left: 0;top: 0.8em;width: 6px;height: 6px;background: #cc00ff;}
.article-body .back {display: inline-block;margin-top: 56px;color: #cc00ff;font-size: 15px;}

@media (max-width: 734px) {
  .page-hero {padding: 90px 0 48px;}
  .page-hero .eyebrow {font-size: 13px;letter-spacing: 5px;text-indent: 5px;}
  .page-hero h1 {font-size: 24px;margin-top: 12px;}
  .page-hero .lead {font-size: 13px;line-height: 1.7;margin-top: 16px;}
  .page-body {padding: 48px 0 72px;}
  .page-body .block + .block {margin-top: 48px;}
  .page-body h2 {font-size: 20px;margin-bottom: 16px;}
  .offer-grid, .process, .related, .article-grid {grid-template-columns: 1fr;gap: 12px;}
  .article-grid {gap: 32px;}
  .offer-card {padding: 18px;}
  .offer-card h3 {font-size: 15px;}
  .offer-card p, .process p {font-size: 12px;}
  .process h3 {font-size: 15px;}
  .cta {padding: 40px 20px;}
  .cta p {font-size: 16px;}
  .cta a {font-size: 14px;padding: 12px 28px;}
  .article-body p, .article-body ul li {font-size: 14px;}
  .article-body h2 {font-size: 18px;margin-top: 32px;}
}