/*
 * mtpolice2.com 리뉴얼 CSS v2
 * 2026-09-18 · A-stance archive · SEO-first
 */

:root {
  --mp-bg:            #0f1115;
  --mp-surface:       #171a21;
  --mp-surface-2:     #1f2430;
  --mp-border:        #2a3040;
  --mp-text:          #e6e8ee;
  --mp-text-dim:      #9aa3b2;
  --mp-text-muted:    #6b7280;
  --mp-accent:        #ff5c5c;
  --mp-accent-2:      #ffb84d;
  --mp-accent-3:      #4dd4a4;
  --mp-link:          #7cb9ff;
  --mp-font-body:     'Pretendard', 'Noto Sans KR', -apple-system, BlinkMacSystemFont, 'Malgun Gothic', sans-serif;
  --mp-font-mono:     'JetBrains Mono', ui-monospace, SFMono-Regular, Consolas, monospace;
  --mp-radius-sm:     6px;
  --mp-radius-md:     10px;
  --mp-radius-lg:     16px;
  --mp-space-1:       4px;
  --mp-space-2:       8px;
  --mp-space-3:       12px;
  --mp-space-4:       16px;
  --mp-space-6:       24px;
  --mp-space-8:       32px;
  --mp-space-12:      48px;
}

/* Hero */
.mp-hero { padding: var(--mp-space-12) 0 var(--mp-space-8); text-align: left; }
.mp-hero__title { font-size: clamp(28px, 4vw, 44px); font-weight: 800; line-height: 1.2; margin: 0 0 var(--mp-space-4); color: var(--mp-text); }
.mp-hero__sub { font-size: 17px; line-height: 1.7; color: var(--mp-text-dim); margin: 0 0 var(--mp-space-6); max-width: 640px; }
.mp-hero__cta { display: flex; gap: var(--mp-space-3); flex-wrap: wrap; }

/* Buttons */
.mp-btn { display: inline-flex; align-items: center; gap: var(--mp-space-2); padding: 10px 20px; font-size: 14px; font-weight: 600; border-radius: var(--mp-radius-md); border: 1px solid transparent; transition: opacity .15s, transform .15s; text-decoration: none !important; }
.mp-btn:hover { transform: translateY(-1px); }
.mp-btn--primary { background: var(--mp-accent); color: #fff !important; }
.mp-btn--outline { background: transparent; color: var(--mp-text) !important; border-color: var(--mp-border); }
.mp-btn--ghost { background: var(--mp-surface); color: var(--mp-text) !important; border-color: var(--mp-border); }

/* Badges (existing) */
.mp-badge { display: inline-flex; align-items: center; gap: var(--mp-space-1); padding: 2px var(--mp-space-2); font-size: 12px; font-weight: 600; border-radius: var(--mp-radius-sm); line-height: 1.4; letter-spacing: 0.02em; }
.mp-badge--danger    { background: rgba(255,92,92,.12);  color: var(--mp-accent);   border: 1px solid rgba(255,92,92,.32); }
.mp-badge--pending   { background: rgba(255,184,77,.12); color: var(--mp-accent-2); border: 1px solid rgba(255,184,77,.32); }
.mp-badge--verified  { background: rgba(77,212,164,.12); color: var(--mp-accent-3); border: 1px solid rgba(77,212,164,.32); }
.mp-badge--neutral   { background: var(--mp-surface-2);  color: var(--mp-text-dim); border: 1px solid var(--mp-border); }

/* Card / Report item */
.mp-card { background: var(--mp-surface); border: 1px solid var(--mp-border); border-radius: var(--mp-radius-md); padding: var(--mp-space-4); display: grid; gap: var(--mp-space-2); }
.mp-card__title { font-size: 18px; font-weight: 700; color: var(--mp-text); margin: 0; }
.mp-card__domain { font-family: var(--mp-font-mono); font-size: 13px; color: var(--mp-text-dim); }
.mp-card__meta { display: flex; gap: var(--mp-space-3); flex-wrap: wrap; font-size: 12px; color: var(--mp-text-muted); }

/* Disclaimer */
.mp-disclaimer { background: var(--mp-surface-2); border-left: 3px solid var(--mp-accent-2); padding: var(--mp-space-3) var(--mp-space-4); border-radius: var(--mp-radius-sm); color: var(--mp-text-dim); font-size: 13px; line-height: 1.6; }

/* Section */
.mp-section { padding: var(--mp-space-8) 0; }
.mp-section > h2 { font-size: clamp(22px, 3vw, 30px); font-weight: 700; margin: 0 0 var(--mp-space-2); color: var(--mp-text); }
.mp-section__intro { color: var(--mp-text-dim); line-height: 1.7; margin: 0 0 var(--mp-space-6); }

/* Grid */
.mp-grid { display: grid; gap: var(--mp-space-4); }
.mp-grid--2 { grid-template-columns: repeat(2, 1fr); }
.mp-grid--3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 720px) { .mp-grid--2, .mp-grid--3 { grid-template-columns: 1fr; } }

/* Lists */
.mp-list-plain { list-style: none; padding: 0; margin: 0; }
.mp-list-plain > li { padding: var(--mp-space-3) 0; border-bottom: 1px solid var(--mp-border); }
.mp-checklist { list-style: none; padding: 0; margin: 0; }
.mp-checklist > li { padding-left: 26px; position: relative; margin-bottom: var(--mp-space-3); line-height: 1.6; }
.mp-checklist > li::before { content: "✓"; position: absolute; left: 0; color: var(--mp-accent-3); font-weight: 700; }

/* Prose */
.mp-prose { max-width: 720px; margin-inline: auto; line-height: 1.75; color: var(--mp-text); }
.mp-prose h2 { margin-top: 2em; }
.mp-prose h3 { margin-top: 1.5em; }
.mp-prose code { background: var(--mp-surface-2); padding: 2px 6px; border-radius: 4px; font-family: var(--mp-font-mono); font-size: 0.9em; }
.mp-prose a { color: var(--mp-link); }

/* Note */
.mp-note { font-size: 13px; color: var(--mp-text-muted); }

/* CTA block */
.mp-cta-block { background: var(--mp-surface); border: 1px solid var(--mp-border); border-radius: var(--mp-radius-md); padding: var(--mp-space-6); text-align: center; }
.mp-cta-block h3 { margin: 0 0 var(--mp-space-2); }

/* Utility */
.mp-mt-2 { margin-top: var(--mp-space-2); }
.mp-mt-4 { margin-top: var(--mp-space-4); }
.mp-mt-6 { margin-top: var(--mp-space-6); }
.mp-mt-8 { margin-top: var(--mp-space-8); }
.mp-text-dim { color: var(--mp-text-dim); }
.mp-text-muted { color: var(--mp-text-muted); }
.mp-mono { font-family: var(--mp-font-mono); }
