:root {
  --color-green-50: #edf8f2;
  --color-green-100: #d9efe4;
  --color-green-600: #00805a;
  --color-green-700: #006a45;
  --color-green-800: #005235;
  --color-green-950: #052b20;
  --color-purple-50: #fbf4ff;
  --color-purple-100: #f2dcff;
  --color-purple-600: #9a168f;
  --color-purple-700: #82127f;
  --color-purple-800: #6b0f70;
  --color-surface: #f8faf9;
  --color-text: #0f172a;
  --color-muted: #475569;
  --color-border: #e2e8f0;
  --shadow-soft: 0 18px 60px rgba(15, 39, 71, 0.10);
  --container: 1280px;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  margin: 0;
  background: #fff;
  color: var(--color-text);
  font-family: Arial, Helvetica, sans-serif;
  line-height: 1.5;
}

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

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

button, input, textarea { font: inherit; }

.container {
  width: min(var(--container), calc(100% - 32px));
  margin: 0 auto;
}

.section { padding: 32px 0; }

.section-title {
  margin: 0;
  text-align: center;
  font-size: clamp(20px, 2vw, 28px);
  line-height: 1.2;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}

.icon { object-fit: contain; }
.icon-large { width: 80px; height: 80px; margin: 0 auto; }
.icon-medium { width: 56px; height: 56px; }

/* v128: shared visual rhythm */
:root {
  --container: 1400px;
  --section-space: 48px;
  --section-space-mobile: 30px;
}
.section { padding: var(--section-space) 0; }