@font-face {
  font-family: "Inter";
  src: url("../fonts/InterTurkish.woff2") format("woff2");
  font-display: swap;
  font-style: normal;
  font-weight: 100 900;
}

:root {
  color-scheme: light;
  --background: #e0e5ec;
  --foreground: #f0f2f5;
  --muted: #d1d9e6;
  --text: #2d3436;
  --text-muted: #4a5568;
  --accent: #f04f23;
  --accent-dark: #b43a18;
  --accent-foreground: #ffffff;
  --shadow: #babecc;
  --highlight: #ffffff;
  --deep-shadow: #a3b1c6;
  --signal-green: #22c55e;
  --signal-yellow: #fbbf24;
  --material-gradient: linear-gradient(145deg, var(--foreground), var(--background));

  --font-sans: "Inter", Arial, sans-serif;
  --font-mono: var(--font-sans);


  --head-size: clamp(1.52rem, 2.19vw, 2.23rem);
  --head-scale: 0.9;
  --nav-size: 0.78rem;
  --nav-scale: 1.01;
  --akis-scale: 0.7;
  --vig: 0.6;

  --radius-sm: 0.375rem;
  --radius-md: 0.625rem;
  --radius-lg: 0.875rem;
  --radius-xl: 1.25rem;
  --radius-2xl: 1.5rem;
  --radius-full: 999px;

  --shadow-card: 5px 5px 10px var(--shadow), -5px -5px 10px var(--highlight);
  --shadow-floating: 8px 8px 18px var(--shadow), -8px -8px 18px var(--highlight), inset 1px 1px 0 rgb(255 255 255 / 50%);
  --shadow-pressed: inset 4px 4px 8px var(--shadow), inset -4px -4px 8px var(--highlight);
  --shadow-recessed: inset 3px 3px 6px var(--shadow), inset -3px -3px 6px var(--highlight);
  --shadow-accent: 4px 4px 9px rgb(157 65 35 / 30%), -4px -4px 9px rgb(255 158 120 / 34%), inset 1px 1px 0 rgb(255 255 255 / 30%);
  --shadow-accent-pressed: inset 4px 4px 8px #b93b19, inset -4px -4px 8px #ff774c;


  --container: 69rem;
  --container-wide: 82rem;
  --gutter: clamp(1.25rem, 4vw, 3rem);
  --gutter-wide: clamp(1.25rem, 4.5vw, 4rem);
  --section-gap: clamp(3rem, 4.5vw, 4rem);
  --mechanical-ease: cubic-bezier(0.175, 0.885, 0.32, 1.275);

  --bs-body-font-family: var(--font-sans);
  --bs-body-color: var(--text);
  --bs-body-bg: var(--background);
  --bs-primary: var(--accent);
  --bs-primary-rgb: 240, 79, 35;
  --bs-link-color-rgb: 45, 52, 54;
  --bs-link-hover-color-rgb: 240, 79, 35;
  --bs-border-radius: var(--radius-md);
  --bs-border-radius-lg: var(--radius-lg);
  --bs-border-radius-xl: var(--radius-xl);
}