/* Japhet UI v1 — extracted from the current portfolio, October 2026. */
@font-face {
  font-family: 'JA Manrope';
  src: url('./fonts/manrope-latin.woff2') format('woff2');
  font-weight: 400 800;
  font-style: normal;
  font-display: swap;
}
:root {
  --ja-white: #ffffff;
  --ja-ink: #162d37;
  --ja-muted: #586a73;
  --ja-brand: #156775;
  --ja-brand-hover: #104f5a;
  --ja-brand-soft: #e9f3f4;
  --ja-surface: #f4f7f8;
  --ja-surface-raised: #f1f6f7;
  --ja-media-surface: #e4eef1;
  --ja-border: #dce5e8;
  --ja-border-strong: #b8cbd0;
  --ja-control-border: #78949d;
  --ja-focus: #156775;
  --ja-success: #155f4c;
  --ja-success-soft: #edf7f2;
  --ja-error: #9a3030;
  --ja-error-soft: #fdf1f1;
  --ja-font: 'JA Manrope', Manrope, Arial, sans-serif;
  --ja-text-xs: 0.75rem;
  --ja-text-sm: 0.875rem;
  --ja-text-base: 1rem;
  --ja-text-lg: 1.0625rem;
  --ja-text-card: 1.4375rem;
  --ja-text-section: clamp(2.0625rem, 3.1vw, 2.8125rem);
  --ja-text-display: clamp(2.3125rem, 4.5vw, 4.0625rem);
  --ja-leading-heading: 1.18;
  --ja-leading-body: 1.8;
  --ja-space-1: 0.25rem;
  --ja-space-2: 0.5rem;
  --ja-space-3: 0.75rem;
  --ja-space-4: 1rem;
  --ja-space-5: 1.25rem;
  --ja-space-6: 1.5rem;
  --ja-space-8: 2rem;
  --ja-space-10: 2.5rem;
  --ja-space-12: 3rem;
  --ja-space-16: 4rem;
  --ja-space-20: 5rem;
  --ja-radius-control: 0.5625rem;
  --ja-radius-card: 0.875rem;
  --ja-radius-feature: 1rem;
  --ja-radius-badge: 0.3125rem;
  --ja-shadow-card: 0 16px 32px -20px #163d4640;
  --ja-shadow-feature: 0 18px 44px -28px #163d4650;
  --ja-shadow-button: 0 5px 18px #15677518;
  --ja-duration: 180ms;
  --ja-easing: ease;
  --ja-container: 77.5rem; /* 1240px */
  --ja-gutter: 3rem;
  --ja-section-space: 5.125rem; /* 82px */
}
@media (max-width: 1100px) { :root { --ja-gutter: 2rem; } }
@media (max-width: 760px) {
  :root {
    --ja-gutter: 1.25rem;
    --ja-section-space: 3.4375rem; /* 55px */
    --ja-text-display: clamp(2.3125rem, 9.7vw, 3.4375rem);
  }
}