/* STEMDEX — base styles. Colors and type follow the STEMDEX design system tokens. */
:root {
  --surface: #F5F7F6;
  --surface-raised: #FFFFFF;
  --ink: #0B1F24;
  --ink-muted: #4A5D60;
  --line: #D9E1DF;
  --teal: #0E6E6A;
  --teal-soft: #DCEFED;
  --deep: #0B2E33;
  --on-deep: #E8EFED;
  --amber: #E8A33D;
  --amber-ink: #8A5A0E;
  --critical: #B3261E;
  --font-sans: Pretendard, "Pretendard Variable", "Noto Sans KR", system-ui, -apple-system, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, monospace;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--surface); color: var(--ink); font-family: var(--font-sans); word-break: keep-all; overflow-wrap: break-word; }
a { color: var(--teal); }
a:hover { color: var(--ink); }
input:focus-visible, select:focus-visible, a:focus-visible, button:focus-visible { outline: 2px solid var(--teal); outline-offset: 2px; }
button { -webkit-appearance: none; }
button[disabled] { opacity: .6; cursor: progress; }
input[aria-invalid="true"], select[aria-invalid="true"] { border-color: var(--critical) !important; }
section[id] { scroll-margin-top: 16px; }

.skip-link { position: absolute; left: -9999px; top: 8px; z-index: 10; padding: 8px 16px; background: var(--teal); color: #fff; border-radius: 8px; }
.skip-link:focus { left: 8px; }

.form-status { margin: 0; font-size: 14px; line-height: 22px; min-height: 0; }
.form-status:empty { display: none; }
.form-status.is-ok { color: var(--teal); font-weight: 600; }
.form-status.is-error { color: var(--critical); }
#consult .form-status.is-ok, #consult .form-status.is-error { color: inherit; }
#consult form .form-status.is-ok { color: var(--teal); }
#consult form .form-status.is-error { color: var(--critical); }
.hp-field { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

/* Phone and small tablet */
@media (max-width: 720px) {
  .site-nav { padding: 12px 16px !important; }
  .nav-links { flex-wrap: nowrap !important; overflow-x: auto; gap: 16px !important; width: 100%; padding-bottom: 4px; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
  .nav-links::-webkit-scrollbar { display: none; }
  .nav-links a { flex: 0 0 auto; }
  .nav-links a[href="#diagnosis"] { position: absolute; top: 10px; right: 16px; min-height: 40px !important; padding: 0 16px !important; }
  .site-nav { position: relative; }
  .hero { padding-top: 48px !important; padding-bottom: 48px !important; gap: 32px !important; }
  .hero-title { font-size: 34px !important; line-height: 44px !important; }
  h2 { font-size: 26px !important; line-height: 34px !important; }
  section > div, section { padding-left: 16px; padding-right: 16px; }
}