/* THEME CONTROL PANEL
   Change these values to restyle every portfolio page.
   Layout rules live in site.css; no project has its own stylesheet.
   Fonts use local system families so there are no external font requests.
   To use a custom font, add its @font-face rule here and update the family below. */
:root {
  color-scheme: light;
  --color-background: #ffffff;
  --color-surface: #f3f5f6;
  --color-text: #172027;
  --color-muted: #56616b;
  --color-accent: #2056a5;
  --color-accent-hover: #153e79;
  --color-border: #d8dee3;
  --color-focus: #2056a5;
  --font-body: 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
  --font-heading: 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
  --font-label: 'Segoe UI', 'Helvetica Neue', Arial, sans-serif;
  --font-size-body: 1rem;
  --font-size-small: 0.875rem;
  --font-size-label: 0.8125rem;
  --font-size-intro: clamp(2.4rem, 5.2vw, 4.4rem);
  --font-size-title: clamp(2.3rem, 5vw, 4rem);
  --font-size-section: clamp(1.5rem, 3vw, 2rem);
  --font-size-project: clamp(1.55rem, 2.9vw, 2.3rem);
  --font-size-card: 1.2rem;
  --line-height-body: 1.65;
  --line-height-heading: 1.1;
  --heading-weight: 600;
  --heading-tracking: -0.035em;
  --label-tracking: 0.065em;
  --page-width: 72rem;
  --text-width: 65ch;
  --page-gutter: clamp(1.25rem, 4vw, 3rem);
  --space-1: 0.4rem;
  --space-2: 0.75rem;
  --space-3: 1rem;
  --space-4: 1.5rem;
  --space-5: 2rem;
  --space-6: 3rem;
  --space-7: 4.5rem;
  --space-8: 6rem;
  --section-space: clamp(3.5rem, 7vw, 6rem);
  --border-width: 1px;
  --image-radius: 3px;
  --image-ratio: 4 / 3;
  --image-fit: cover;
  --focus-width: 3px;
  --transition-speed: 150ms;
}