:root {
  --ink: #111827;
  --muted: #5f6b62;
  --accent: #00a84d;
  --accent-soft: rgba(0, 168, 77, 0.14);
}

* {
  box-sizing: border-box;
}

html, body {
  margin: 0;
  padding: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: "Manrope", "Nanum Gothic", sans-serif;
}

a {
  color: inherit;
}

.legal-site {
  min-height: 100vh;
}

.legal-topbar {
  position: sticky;
  top: 0;
  z-index: 20;
  background: rgba(245, 245, 245, 0.78);
  backdrop-filter: blur(10px);
}

.legal-wrap {
  width: min(1120px, calc(100% - 40px));
  margin: 0 auto;
}

.legal-topbar-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  min-height: 64px;
}

.legal-brand {
  color: var(--accent);
  font-family: "Space Grotesk", sans-serif;
  font-size: 1.15rem;
  font-weight: 800;
  letter-spacing: -0.03em;
  text-decoration: none;
}

.legal-main-nav,
.legal-page-nav,
.legal-footer-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
}

.legal-main-nav a,
.legal-page-nav a,
.legal-footer-nav a {
  color: var(--muted);
  text-decoration: none;
  font-size: 0.94rem;
  font-weight: 700;
  transition: color 160ms ease, opacity 160ms ease;
}

.legal-main-nav a:hover,
.legal-page-nav a:hover,
.legal-footer-nav a:hover,
.legal-page-nav a.is-current {
  color: var(--ink);
}

.legal-main {
  padding: 52px 0 84px;
}

.legal-shell {
  display: grid;
  gap: 34px;
}

.legal-page-nav {
  gap: 12px 22px;
  padding: 0;
}

.legal-page-nav a {
  position: relative;
  padding-bottom: 8px;
}

.legal-page-nav a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 2px;
  border-radius: 999px;
  background: currentColor;
  opacity: 0;
  transform: scaleX(0.3);
  transform-origin: left center;
  transition: opacity 160ms ease, transform 160ms ease;
}

.legal-page-nav a:hover::after,
.legal-page-nav a.is-current::after {
  opacity: 1;
  transform: scaleX(1);
}

.legal-hero {
  padding: 8px 0 4px;
}

.legal-hero,
.legal-section,
.legal-note,
.legal-contact-box,
.contact-card,
.contact-info {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.legal-eyebrow {
  margin: 0 0 16px;
  color: var(--accent);
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.legal-title {
  margin: 0;
  font-family: "Space Grotesk", sans-serif;
  font-size: clamp(2rem, 5vw, 3.2rem);
  line-height: 1.02;
  letter-spacing: -0.05em;
}

.legal-lead {
  margin: 18px 0 0;
  max-width: 980px;
  color: var(--muted);
  font-size: 1.05rem;
  line-height: 1.9;
}

.legal-body {
  display: grid;
  gap: 26px;
}

.legal-section {
  padding: 0;
}

.legal-section + .legal-section {
  padding-top: 26px;
}

.legal-card {
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.legal-card h2 {
  margin: 0 0 14px;
  font-family: "Space Grotesk", sans-serif;
  font-size: 1.16rem;
  line-height: 1.45;
  letter-spacing: -0.02em;
}

.legal-card p {
  margin: 0 0 12px;
  color: var(--muted);
  line-height: 1.9;
  font-size: 1rem;
}

.legal-card p:last-child {
  margin-bottom: 0;
}

.legal-card + .legal-card {
  padding-top: 26px;
}

.legal-group {
  margin-top: 14px;
}

.legal-group-label {
  margin: 0 0 8px;
  color: var(--ink) !important;
}

.legal-note {
  margin-top: 12px !important;
  padding: 0 !important;
  color: var(--muted) !important;
}

.legal-list {
  margin: 12px 0 0;
  padding-left: 18px;
  color: var(--muted);
  line-height: 1.9;
}

.legal-list li + li {
  margin-top: 6px;
}

.legal-contact-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

.contact-cards {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px;
}

.legal-contact-card {
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}

.legal-contact-card h2 {
  margin: 0 0 10px;
  font-size: 1rem;
  line-height: 1.5;
}

.legal-contact-card p {
  margin: 0;
  color: var(--muted);
  line-height: 1.8;
  font-size: 0.97rem;
}

.contact-card {
  padding: 0;
}

.contact-card-label {
  margin: 0 0 10px;
  color: var(--ink);
  font-size: 1rem;
  line-height: 1.5;
}

.contact-card-desc {
  margin: 0;
  color: var(--muted);
  line-height: 1.8;
  font-size: 0.97rem;
}

.legal-contact-box {
  display: grid;
  gap: 16px;
  padding-top: 10px;
}

.contact-info {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px 24px;
  padding-top: 10px;
}

.contact-info-row {
  display: grid;
  gap: 6px;
}

.contact-info-label {
  color: var(--accent);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.contact-info-value,
.contact-info-value a {
  color: var(--ink);
  font-size: 1rem;
  font-weight: 700;
  text-decoration: none;
}

.legal-contact-row {
  display: grid;
  gap: 6px;
}

.legal-contact-label {
  color: var(--accent);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.legal-contact-value,
.legal-contact-value a {
  color: var(--ink);
  font-size: 1rem;
  font-weight: 700;
  text-decoration: none;
}

.legal-footer {
  padding: 24px 0 34px;
}

.legal-footer-inner {
  display: grid;
  gap: 12px;
}

.legal-footer-brand {
  color: #374151;
  font-family: "Space Grotesk", sans-serif;
  font-size: 0.95rem;
  font-weight: 700;
}

.legal-footer-copy {
  color: var(--muted);
  font-size: 0.85rem;
}

@media (max-width: 820px) {
  .legal-topbar-inner {
    align-items: flex-start;
    flex-direction: column;
    padding: 14px 0;
  }

  .legal-main {
    padding: 30px 0 60px;
  }

  .legal-hero {
    padding: 2px 0 0;
  }

  .legal-contact-grid {
    grid-template-columns: 1fr;
  }

  .contact-cards,
  .contact-info {
    grid-template-columns: 1fr;
  }

  .legal-shell {
    gap: 28px;
  }

  .legal-body {
    gap: 22px;
  }

  .legal-card + .legal-card {
    padding-top: 22px;
  }
}

/* ── 사업자 정보 표 ─────────────────────────────────────────── */
.legal-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
  margin-top: 8px;
}

.legal-table th,
.legal-table td {
  text-align: left;
  border-bottom: 1px solid var(--border, #e5e7eb);
  vertical-align: top;
  line-height: 1.5;
}

.legal-table th {
  padding: 12px 16px 12px 4px;
  width: 9rem;
  color: var(--muted);
  font-weight: 600;
  font-size: 0.82rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  white-space: nowrap;
}

.legal-table td {
  padding: 10px 8px 10px 4px;
}

[data-theme="dark"] .legal-table th {
  color: #9ca3af;
}

[data-theme="dark"] .legal-table th,
[data-theme="dark"] .legal-table td {
  border-color: #374151;
}

/* ── 시행일·보조 메타 텍스트 ──────────────────────────────── */
.legal-meta {
  font-size: 0.82rem;
  color: var(--muted);
  margin-top: 6px;
}

/* ── 카드 내 h3 소제목 ────────────────────────────────────── */
.legal-card h3 {
  font-size: 0.97rem;
  font-weight: 700;
  margin: 20px 0 6px;
  color: var(--ink);
}

[data-theme="dark"] .legal-card h3 {
  color: #e5e7eb;
}
