:root {
  --emerald-50: #ecfdf5;
  --emerald-100: #d1fae5;
  --emerald-200: #a7f3d0;
  --emerald-300: #6ee7b7;
  --emerald-400: #34d399;
  --emerald-500: #10b981;
  --emerald-600: #059669;
  --emerald-700: #047857;
  --emerald-800: #065f46;
  --emerald-900: #064e3b;
  --emerald-950: #022c22;
  --teal-500: #14b8a6;
  --cyan-600: #0891b2;
  --slate-50: #f8fafc;
  --slate-100: #f1f5f9;
  --slate-200: #e2e8f0;
  --slate-400: #94a3b8;
  --slate-500: #64748b;
  --slate-600: #475569;
  --slate-700: #334155;
  --slate-800: #1e293b;
  --slate-900: #0f172a;
  --white: #ffffff;
  --shadow-sm: 0 1px 3px rgba(15, 23, 42, 0.08);
  --shadow-lg: 0 18px 45px rgba(15, 23, 42, 0.14);
  --shadow-xl: 0 26px 70px rgba(2, 44, 34, 0.2);
  color-scheme: light;
}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  min-width: 320px;
  background: var(--white);
  color: var(--slate-900);
  font-family: "Inter", Arial, "Microsoft YaHei", sans-serif;
  line-height: 1.5;
}

img {
  display: block;
  max-width: 100%;
}

a {
  color: inherit;
  text-decoration: none;
}

button,
input,
select,
textarea {
  font: inherit;
}

button {
  cursor: pointer;
}

.content-max {
  width: min(100% - 32px, 1152px);
  margin-inline: auto;
}

.section {
  padding: 80px 0;
}

.section-kicker {
  display: block;
  margin-bottom: 12px;
  color: var(--emerald-600);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.section-title {
  margin: 0;
  color: var(--slate-900);
  font-size: clamp(32px, 4vw, 52px);
  line-height: 1.08;
  font-weight: 800;
}

.section-copy {
  margin: 16px 0 0;
  color: var(--slate-500);
  font-size: 18px;
}

.text-emerald {
  color: var(--emerald-600);
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translateY(18px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes pulse {
  0%,
  100% {
    opacity: 1;
    transform: scale(1);
  }
  50% {
    opacity: 0.55;
    transform: scale(0.86);
  }
}

@keyframes moleculeFloat {
  0% {
    transform: scale(1) translate(0, 0);
  }
  25% {
    transform: scale(1.03) translate(2px, -3px);
  }
  50% {
    transform: scale(1.01) translate(-1px, 2px);
  }
  75% {
    transform: scale(1.04) translate(3px, -1px);
  }
  100% {
    transform: scale(1) translate(0, 0);
  }
}
