/* Waterpro Posts Custom CSS - 누수 피해 보상 전문 */
/* 모던 바이올렛 디자인 패턴 */

:root {
  --wp-primary: #6a1b9a;
  --wp-secondary: #9c27b0;
  --wp-accent: #ce93d8;
  --wp-dark: #4a148c;
  --wp-deep: #2c0a4a;
  --wp-text: #333;
  --wp-gray: #777;
  --wp-light: #f9f5fc;
  --wp-border: #e8daf0;
  --wp-cta: #e53935;
}

.wp-post-content {
  font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, 'Malgun Gothic', sans-serif;
  color: var(--wp-text);
  line-height: 1.85;
  max-width: 800px;
  margin: 0 auto;
  padding: 0 20px;
}

.wp-post-header {
  background: linear-gradient(135deg, var(--wp-deep), var(--wp-dark));
  color: #fff;
  padding: 50px 20px 40px;
  text-align: center;
  margin-bottom: 40px;
}
.wp-post-header h1 { font-size: 30px; font-weight: 800; letter-spacing: -0.5px; margin-bottom: 12px; }
.wp-post-header .post-meta { font-size: 13px; color: rgba(255,255,255,0.7); }

.wp-featured-img {
  width: 100%; max-height: 450px; object-fit: cover;
  border-radius: 12px; margin-bottom: 32px;
  box-shadow: 0 4px 20px rgba(106,27,154,0.12);
}

.wp-post-content h2 {
  font-size: 24px; font-weight: 700; color: var(--wp-dark);
  margin: 40px 0 16px; padding-bottom: 10px;
  border-bottom: 2px solid var(--wp-border);
}
.wp-post-content h3 {
  font-size: 19px; font-weight: 700; color: var(--wp-deep);
  margin: 30px 0 12px;
}
.wp-post-content p { font-size: 15px; margin-bottom: 18px; color: #444; }
.wp-post-content img { max-width: 100%; height: auto; border-radius: 8px; margin: 24px 0; }

.wp-info-box {
  background: var(--wp-light); border-left: 4px solid var(--wp-secondary);
  padding: 20px 24px; border-radius: 0 8px 8px 0; margin: 24px 0; font-size: 14px;
}
.wp-info-box strong { display: block; color: var(--wp-dark); margin-bottom: 8px; font-size: 15px; }

.wp-warning-box {
  background: #fdf2f2; border-left: 4px solid var(--wp-cta);
  padding: 20px 24px; border-radius: 0 8px 8px 0; margin: 24px 0; font-size: 14px;
}
.wp-warning-box strong { color: var(--wp-cta); display: block; margin-bottom: 6px; }

.wp-checklist { list-style: none; padding: 0; margin: 20px 0; }
.wp-checklist li {
  padding: 10px 0 10px 28px; position: relative; font-size: 15px;
  border-bottom: 1px solid #f0ecf4;
}
.wp-checklist li::before {
  content: ''; position: absolute; left: 0; top: 14px;
  width: 10px; height: 10px; background: var(--wp-secondary); border-radius: 50%;
}

.wp-table { width: 100%; border-collapse: collapse; margin: 24px 0; font-size: 14px; }
.wp-table th { background: var(--wp-primary); color: #fff; padding: 12px 16px; text-align: left; font-weight: 600; }
.wp-table td { padding: 12px 16px; border-bottom: 1px solid var(--wp-border); }
.wp-table tr:nth-child(even) td { background: var(--wp-light); }

.wp-steps { counter-reset: step-counter; list-style: none; padding: 0; margin: 24px 0; }
.wp-steps li {
  counter-increment: step-counter; padding: 16px 16px 16px 56px;
  position: relative; margin-bottom: 12px; background: var(--wp-light);
  border-radius: 8px; font-size: 14px;
}
.wp-steps li::before {
  content: counter(step-counter); position: absolute; left: 16px; top: 14px;
  width: 28px; height: 28px; background: var(--wp-primary); color: #fff;
  border-radius: 50%; display: flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 13px;
}

.wp-compare-box {
  display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin: 24px 0;
}
.wp-compare-item {
  background: var(--wp-light); border-radius: 10px; padding: 20px;
  border: 1px solid var(--wp-border);
}
.wp-compare-item h4 {
  font-size: 16px; font-weight: 700; margin-bottom: 12px;
  padding-bottom: 8px; border-bottom: 2px solid var(--wp-accent);
  color: var(--wp-dark);
}
.wp-compare-item.alt { background: #fff5f5; border-color: #f5cece; }
.wp-compare-item.alt h4 { border-color: #ef9a9a; color: #c62828; }

.wp-cta-box {
  background: linear-gradient(135deg, var(--wp-deep), var(--wp-dark));
  color: #fff; padding: 32px; border-radius: 12px; text-align: center; margin: 40px 0;
}
.wp-cta-box h3 { color: #fff; font-size: 20px; margin-bottom: 10px; }
.wp-cta-box p { color: rgba(255,255,255,0.85); margin-bottom: 16px; }
.wp-cta-box .cta-phone { font-size: 28px; font-weight: 800; letter-spacing: 1px; display: block; margin: 12px 0; }
.wp-cta-box a {
  display: inline-block; background: var(--wp-cta); color: #fff;
  padding: 12px 32px; border-radius: 6px; font-weight: 700;
  margin-top: 8px; text-decoration: none; transition: transform 0.2s;
}
.wp-cta-box a:hover { transform: translateY(-2px); }

@media (max-width: 768px) {
  .wp-post-header h1 { font-size: 22px; }
  .wp-post-content h2 { font-size: 20px; }
  .wp-post-content h3 { font-size: 17px; }
  .wp-cta-box .cta-phone { font-size: 22px; }
  .wp-table { font-size: 13px; }
  .wp-table th, .wp-table td { padding: 8px 10px; }
  .wp-compare-box { grid-template-columns: 1fr; }
}