/* ===== 지역·키워드 SEO 페이지 ===== */
.page-areas,
.page-seo-keyword {
  background: #f4f7fb;
}

/* 히어로 */
.seo-hero {
  background: linear-gradient(135deg, #2d8cff 0%, #1a5f9e 55%, #0f3d6e 100%);
  color: #fff;
  padding: 2.5rem 0 2rem;
  margin-bottom: 0;
}
.seo-hero .breadcrumb a { color: rgba(255,255,255,.85); text-decoration: none; }
.seo-hero .breadcrumb a:hover { color: #fff; text-decoration: underline; }
.seo-hero h1 { font-size: clamp(1.5rem, 4vw, 2rem); font-weight: 800; margin: 0.5rem 0 0.75rem; letter-spacing: -0.02em; }
.seo-hero .hero-desc { opacity: .92; margin: 0; font-size: 1.05rem; max-width: 640px; }
.seo-hero .hero-stats {
  display: flex; flex-wrap: wrap; gap: 12px; margin-top: 1.25rem;
}
.seo-hero .stat-pill {
  background: rgba(255,255,255,.15);
  border: 1px solid rgba(255,255,255,.25);
  padding: 8px 16px;
  border-radius: 999px;
  font-size: .9rem;
  font-weight: 600;
}

/* 지역 카드 그리드 */
.region-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  gap: 16px;
  padding: 2rem 0 1rem;
}
.region-card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: 14px;
  padding: 1.25rem 1.35rem;
  text-decoration: none !important;
  color: #1a1a1a;
  border: 1px solid #e8ecf2;
  box-shadow: 0 2px 12px rgba(0,0,0,.04);
  transition: transform .2s, box-shadow .2s, border-color .2s;
  min-height: 120px;
}
.region-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(45,140,255,.15);
  border-color: #2d8cff;
}
.region-card .region-icon {
  width: 44px; height: 44px;
  border-radius: 12px;
  background: linear-gradient(135deg, #e8f4ff, #d0e8ff);
  color: #2d8cff;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.25rem; font-weight: 800;
  margin-bottom: 12px;
}
.region-card .region-name { font-size: 1.1rem; font-weight: 700; margin: 0 0 4px; }
.region-card .region-desc { font-size: .85rem; color: #6b7280; margin: 0; line-height: 1.4; }
.region-card .region-count {
  margin-top: auto;
  padding-top: 12px;
  font-size: .8rem;
  font-weight: 600;
  color: #2d8cff;
}

/* 키워드 카드 그리드 */
.kw-section { padding: 1.5rem 0 5rem; }
.kw-section-title {
  font-size: 1.15rem;
  font-weight: 700;
  color: #1a1a1a;
  margin: 0 0 1rem;
  padding-bottom: 0.5rem;
  border-bottom: 2px solid #2d8cff;
  display: inline-block;
}
.kw-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 12px;
}
.kw-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  background: #fff;
  border: 1px solid #e8ecf2;
  border-radius: 12px;
  padding: 14px 16px;
  text-decoration: none !important;
  color: #222;
  transition: border-color .2s, box-shadow .2s, background .2s;
}
.kw-card:hover {
  border-color: #2d8cff;
  box-shadow: 0 4px 16px rgba(45,140,255,.12);
  background: #fafcff;
}
.kw-card .kw-text { flex: 1; min-width: 0; }
.kw-card .kw-title {
  font-weight: 600;
  font-size: .95rem;
  line-height: 1.35;
  margin: 0;
  word-break: keep-all;
}
.kw-card .kw-region {
  font-size: .78rem;
  color: #6b7280;
  margin: 4px 0 0;
}
.kw-card .kw-badge {
  flex-shrink: 0;
  font-size: .7rem;
  font-weight: 700;
  padding: 4px 8px;
  border-radius: 6px;
  background: #e8f4ff;
  color: #1a5f9e;
}
.kw-card .kw-arrow {
  flex-shrink: 0;
  color: #2d8cff;
  font-size: 1.1rem;
  opacity: .6;
}
.kw-card:hover .kw-arrow { opacity: 1; }

.kw-card-main,
.region-card-main {
  border-color: #c5daf5;
  background: linear-gradient(135deg, #f8fbff 0%, #fff 100%);
}
.region-card-main .region-icon {
  background: #2d8cff;
  color: #fff;
}

.footer-region-nav {
  background: #f3f6fa;
  border-top: 1px solid #e5e9ef;
  padding: 28px 0 20px;
  font-size: .82rem;
}
.footer-region-title {
  font-weight: 700;
  margin: 0 0 10px;
}
.footer-region-title a { color: #1a5f9e; text-decoration: none; }
.footer-region-sub {
  margin: 16px 0 8px;
  font-weight: 600;
  color: #4b5563;
}
.footer-region-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 6px 14px;
}
.footer-region-list a {
  color: #374151;
  text-decoration: none;
}
.footer-region-list a:hover { color: #2d8cff; text-decoration: underline; }

/* 페이지네이션 */
.seo-pagination {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid #e8ecf2;
}
.seo-pagination a,
.seo-pagination span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 12px;
  border-radius: 10px;
  font-weight: 600;
  font-size: .9rem;
  text-decoration: none;
  border: 1px solid #dde3eb;
  background: #fff;
  color: #333;
}
.seo-pagination a:hover { background: #e8f4ff; border-color: #2d8cff; color: #1a5f9e; }
.seo-pagination .current {
  background: #2d8cff;
  border-color: #2d8cff;
  color: #fff;
}
.seo-pagination .disabled { opacity: .4; pointer-events: none; }

/* 키워드 상세 페이지 */
.seo-keyword-layout {
  padding: 0 0 5rem;
}
.seo-keyword-layout .layout-row {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 28px;
  align-items: start;
  padding-top: 1.5rem;
}
.seo-main-article {
  background: #fff;
  border-radius: 16px;
  border: 1px solid #e8ecf2;
  box-shadow: 0 4px 20px rgba(0,0,0,.05);
  overflow: hidden;
}
.seo-cover {
  margin: 0;
  max-height: 320px;
  overflow: hidden;
}
.seo-cover img {
  width: 100%;
  height: auto;
  object-fit: cover;
  display: block;
}
.seo-body-inner { padding: 1.75rem 2rem 2rem; }

.seo-sidebar {
  position: sticky;
  top: calc(var(--gnb-h, 91px) + 16px);
}
.seo-side-card {
  background: #fff;
  border-radius: 14px;
  border: 1px solid #e8ecf2;
  padding: 1.35rem;
  margin-bottom: 16px;
  box-shadow: 0 2px 12px rgba(0,0,0,.04);
}
.seo-side-card h3 {
  font-size: 1rem;
  font-weight: 700;
  margin: 0 0 12px;
  color: #1a1a1a;
}
.seo-side-cta {
  background: linear-gradient(135deg, #2d8cff, #1a5f9e);
  color: #fff;
  border: none;
  text-align: center;
}
.seo-side-cta .btn-cta-main {
  display: block;
  width: 100%;
  padding: 14px;
  background: #ff7a21;
  color: #fff !important;
  font-weight: 700;
  border-radius: 10px;
  text-decoration: none !important;
  margin-top: 12px;
}
.seo-side-cta .btn-cta-main:hover { filter: brightness(1.05); }
.seo-side-cta .tel-link {
  color: #fff;
  font-size: 1.35rem;
  font-weight: 800;
  text-decoration: none;
}
.seo-side-list { list-style: none; padding: 0; margin: 0; font-size: .9rem; }
.seo-side-list li {
  padding: 8px 0;
  border-bottom: 1px solid #f0f2f5;
  color: #444;
}
.seo-side-list li:last-child { border-bottom: none; }

/* 본문 타이포 */
.seo-body .seo-article { max-width: none; }
.seo-body .lead {
  font-size: 1.08rem;
  line-height: 1.75;
  color: #333;
  padding: 0 0 1rem;
  border-bottom: 1px solid #f0f2f5;
  margin-bottom: 1.25rem;
}
.seo-body .article-toc {
  background: #f8fafc;
  border-radius: 12px;
  padding: 1rem 1.25rem;
  margin: 1rem 0 1.5rem;
  border: 1px solid #e8ecf2;
}
.seo-body .article-toc ol { margin: 8px 0 0; padding-left: 1.25rem; }
.seo-body .article-toc a { color: #1a5f9e; text-decoration: none; font-weight: 500; }
.seo-body .article-toc a:hover { text-decoration: underline; }
.seo-body h2 {
  font-size: 1.2rem;
  font-weight: 700;
  color: #1a5f9e;
  margin: 2rem 0 0.75rem;
  padding-top: 0.5rem;
}
.seo-body h2:first-of-type { margin-top: 0; }
.seo-body p { line-height: 1.8; color: #374151; margin-bottom: 1rem; }
.seo-body .article-figure {
  margin: 1.25rem 0;
  border-radius: 12px;
  overflow: hidden;
}
.seo-body .seo-check-list {
  padding-left: 0;
  list-style: none;
  margin: 0 0 1.25rem;
}
.seo-body .seo-check-list li {
  position: relative;
  padding: 10px 0 10px 28px;
  border-bottom: 1px solid #f3f4f6;
  line-height: 1.6;
}
.seo-body .seo-check-list li::before {
  content: "✓";
  position: absolute;
  left: 0;
  color: #2d8cff;
  font-weight: 800;
}
.seo-body .seo-steps {
  padding-left: 1.25rem;
  margin: 0 0 1.25rem;
}
.seo-body .seo-steps li { margin-bottom: 10px; line-height: 1.65; }
.seo-body .faq-seo-list { margin: 1rem 0; }
.seo-body .faq-seo-item {
  background: #f8fafc;
  border-radius: 10px;
  padding: 1rem 1.15rem;
  margin-bottom: 10px;
  border: 1px solid #e8ecf2;
}
.seo-body .faq-seo-q {
  font-size: 1rem;
  font-weight: 700;
  margin: 0 0 8px;
  color: #1a1a1a;
}
.seo-body .faq-seo-a { margin: 0; font-size: .95rem; color: #4b5563; line-height: 1.7; }
.seo-body .btn-seo-cta,
.seo-body .btn-primary {
  display: inline-block;
  background: #ff7a21 !important;
  color: #fff !important;
  padding: 14px 28px;
  border-radius: 10px;
  font-weight: 700;
  text-decoration: none !important;
  border: none;
}
.seo-body .related-kw-text { font-size: .9rem; color: #6b7280; }

/* 관련 키워드 */
.related-kw-section {
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid #e8ecf2;
}
.related-kw-section h2 {
  font-size: 1.1rem;
  font-weight: 700;
  margin-bottom: 1rem;
}

@media (max-width: 991px) {
  .seo-keyword-layout .layout-row {
    grid-template-columns: 1fr;
  }
  .seo-sidebar { position: static; }
  .seo-body-inner { padding: 1.25rem 1.25rem 1.5rem; }
  .region-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
  .kw-grid { grid-template-columns: 1fr; }
}

@media (max-width: 480px) {
  .region-grid { grid-template-columns: 1fr; }
  .seo-hero { padding: 1.75rem 0 1.5rem; }
}

/* 지역 키워드 SEO — 메인과 동일 리뷰·가격 블록 */
.seo-keyword-banners {
  padding: 1.5rem 2rem 0;
  background: #fff;
}
.seo-embed-reviews,
.seo-embed-pricing {
  margin-bottom: clamp(1.25rem, 3vw, 2rem);
}
.seo-embed-reviews .home-reviews--in-gallery {
  padding: 0;
}
.seo-embed-pricing .home-pricing {
  padding: 0;
}
.seo-keyword-banners .home-reviews-grid,
.seo-embed-reviews .home-reviews-grid {
  max-width: 100%;
}
.seo-keyword-banners .home-pricing-grid,
.seo-embed-pricing .home-pricing-grid {
  max-width: 100%;
}
.seo-body-below-banners {
  padding-top: 1.25rem;
}
.seo-body-inner .seo-embed-reviews,
.seo-body-inner .seo-embed-pricing {
  margin: 1.5rem 0;
}
@media (max-width: 991px) {
  .seo-keyword-banners { padding: 1.25rem 1.25rem 0; }
  .seo-keyword-banners .home-reviews-grid,
  .seo-keyword-banners .home-pricing-grid {
    grid-template-columns: 1fr;
    max-width: 420px;
    margin-left: auto;
    margin-right: auto;
  }
}
