/* Brand contract: see /DESIGN.md. Keep artwork and case-specific brand colors intact. */
:root {
  --color-brand: #e93a3a;
  --color-brand-hover: #d52e2e;
  --color-ink: #000227;
  --color-text: #606367;
  --color-white: #fff;
  --color-surface: #f5f5f5;
  --color-surface-soft: #f7f8fa;
  --color-border: #ebecf0;
  --color-field-border: #dedede;
  --font-body: 'PingFang SC', 'Microsoft YaHei', 'Helvetica Neue', Arial, sans-serif;
  --text-caption: 0.8125rem;
  --text-small: 0.875rem;
  --text-body: 1rem;
  --text-lead: 1.125rem;
  --text-card: 1.25rem;
  --text-feature: clamp(1.5rem, 1.8vw, 2rem);
  --text-section: clamp(1.875rem, 3.2vw, 2.875rem);
  --text-display: clamp(2rem, 3.2vw, 2.875rem);
  --weight-regular: 400;
  --weight-medium: 500;
  --weight-strong: 600;
  --weight-heading: 700;
  --leading-heading: 1.5;
  --leading-body: 1.8;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-section: clamp(56px, 6vw, 100px);
  --layout-width: 90.4%;
  --layout-max: 1600px;
  --radius-field: 6px;
  --radius-card: 20px;
  --radius-modal: 25px;
  --radius-pill: 100px;
  --radius-brand-button: 100px 100px 100px 0;
  --shadow-card: 0 10px 20px #01103d15;
  /* Original homepage service tile elevation. */
  --service-hover-scale: 1.1;
  --radius-service-hover: 30px;
  --shadow-service-hover: 0 10.444px 18.8px rgb(0 0 0 / 3%), inset 0 0 0 1px #f6f6f6;
  --shadow-modal: 0 25px 80px #0004;
  --shadow-focus: 0 0 0 3px #e93a3a30;
  --motion-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --motion-fast: 200ms;
  --motion-normal: 300ms;
  --motion-entrance-duration: 800ms;
  --motion-entrance-distance: 60px;
  --motion-stagger: 100ms;
  --motion-counter-duration: 1200ms;
  --about-value-image-width: 78%;
  --about-value-image-max: 520px;
  --about-team-parallax-distance: 180px;
  --about-contact-overlap: 240px;
  --header-height: 96px;
  /* Compatibility aliases for migrated templates. New code uses the names above. */
  --ink: var(--color-ink);
  --muted: var(--color-text);
  --brand: var(--color-brand);
  --line: var(--color-border);
  --surface: var(--color-surface);
  --ease: var(--motion-ease);
  --header: var(--header-height);
}