:root {
  color-scheme: light;
  --af-font-sans: Pretendard, "Noto Sans KR", -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", system-ui, sans-serif;
  --af-font-mono: "SFMono-Regular", "Roboto Mono", ui-monospace, Menlo, Consolas, monospace;
  --af-size-0: 12px;
  --af-size-1: 14px;
  --af-size-2: 16px;
  --af-size-3: 18px;
  --af-size-4: 24px;
  --af-size-5: 32px;
  --af-size-6: 48px;
  --af-space-1: 8px;
  --af-space-2: 16px;
  --af-space-3: 24px;
  --af-space-4: 32px;
  --af-space-5: 48px;
  --af-space-6: 64px;
  --af-space-7: 96px;
  --af-color-bg: #ffffff;
  --af-color-bg-soft: #f6f8fa;
  --af-color-surface: #ffffff;
  --af-color-surface-alt: #eef3f7;
  --af-color-ink: #101820;
  --af-color-text: #24313d;
  --af-color-muted: #5b6875;
  --af-color-line: #d7dfe7;
  --af-color-accent: #005a9c;
  --af-color-accent-strong: #003f73;
  --af-color-company: #174a7a;
  --af-color-danger: #c61f2b;
  --af-product-standard: #f2cc2f;
  --af-product-opencore: #60bd16;
  --af-product-sdk: #f36b1d;
  --af-product-asickit: #23a7c8;
  --af-product-labs: #174a7a;
  --af-gradient-soft: linear-gradient(180deg, #ffffff 0%, #f6f8fa 100%);
  --af-radius-card: 8px;
  --af-radius-control: 6px;
  --af-shadow-card: none;
  --af-content: 1180px;
  --af-wide: 1512px;
  --af-nav-h: 52px;

  --font: var(--af-font-sans);
  --ink: var(--af-color-ink);
  --muted: var(--af-color-muted);
  --faint: #7a8491;
  --page: var(--af-color-bg);
  --paper: var(--af-color-surface);
  --surface: var(--af-color-bg-soft);
  --surface-strong: var(--af-color-surface-alt);
  --surface-soft: #fbfcfd;
  --line: var(--af-color-line);
  --accent: var(--af-color-accent);
  --accent-strong: var(--af-color-accent-strong);
  --accent-soft: #eef6ff;
  --link: var(--af-color-accent);
  --content: var(--af-content);
  --nav-h: var(--af-nav-h);
  --shadow-soft: none;
  --shadow-card: none;
}

html,
body {
  font-family: var(--af-font-sans);
  letter-spacing: 0;
}

.site-header {
  min-height: var(--af-nav-h);
  background: rgba(255, 255, 255, .92);
  box-shadow: 0 1px 0 rgba(16, 24, 32, .08);
  backdrop-filter: saturate(160%) blur(18px);
}

.nav-shell {
  min-height: var(--af-nav-h);
}

.brand,
.brand-logo,
.brand-surface {
  font-family: var(--af-font-sans);
  letter-spacing: 0;
}

.nav-links,
.nav-actions,
.language-switcher,
.button {
  letter-spacing: 0;
}

.legal-footer {
  background: var(--af-color-ink);
  color: #ffffff;
}

.legal-footer a,
.legal-footer strong,
.legal-footer h2,
.legal-footer p,
.legal-footer span {
  color: rgba(255, 255, 255, .78);
}

.legal-footer a:hover {
  color: #ffffff;
}

.hero-commerce,
.commerce-panel,
.panel,
.plan-card,
.package-card,
.legal-section,
.pricing-card,
.compare-table,
.login-panel {
  border-radius: var(--af-radius-card);
  box-shadow: var(--af-shadow-card);
}

.btn-buy-gradient,
.hero-upgrade,
.pro-cta,
.max-cta,
.max-plus-cta {
  background: var(--af-color-accent);
  box-shadow: none;
}

.exact-plans .pro-cta,
.exact-plans .max-cta,
.exact-plans .max-plus-cta,
.exact-hero .hero-upgrade {
  background: var(--af-color-accent);
  box-shadow: none;
}

.btn-buy-gradient:hover,
.btn-buy-gradient:focus-visible,
.hero-upgrade:hover,
.hero-upgrade:focus-visible,
.pro-cta:hover,
.pro-cta:focus-visible,
.max-cta:hover,
.max-cta:focus-visible,
.max-plus-cta:hover,
.max-plus-cta:focus-visible {
  background: var(--af-color-accent-strong);
  box-shadow: none;
}

.exact-plans .pro-cta:hover,
.exact-plans .pro-cta:focus-visible,
.exact-plans .max-cta:hover,
.exact-plans .max-cta:focus-visible,
.exact-plans .max-plus-cta:hover,
.exact-plans .max-plus-cta:focus-visible,
.exact-hero .hero-upgrade:hover,
.exact-hero .hero-upgrade:focus-visible {
  background: var(--af-color-accent-strong);
  box-shadow: none;
}