@import url('https://fonts.googleapis.com/css2?family=Crimson+Pro:ital,wght@0,200..900;1,200..900&display=swap');
@import url("https://use.typekit.net/bam8anu.css");

:root {
  /* Font stacks */
  --font-heading: 'Crimson Pro', serif;
  --font-body: 'aileron', sans-serif;

  /* Color palette (main, light, dark, and RGB) */
  --color-primary: #B69737;
  --color-primary-light: #E5C97A;
  --color-primary-dark: #7A5C13;
  --color-primary-rgb: 182, 151, 55;
  --color-primary-light-rgb: 229, 201, 122;
  --color-primary-dark-rgb: 122, 92, 19;

  --color-secondary: #f5f7fa;
  --color-secondary-light: #ffffff;
  --color-secondary-dark: #dbe2ea;
  --color-secondary-rgb: 245, 247, 250;
  --color-secondary-light-rgb: 255, 255, 255;
  --color-secondary-dark-rgb: 219, 226, 234;

  --color-dark: #242117;
  --color-dark-rgb: 36, 33, 23;
  --color-light: #f8f6f2;
  --color-light-rgb: 245, 242, 234;
  --color-lightest: #f8f6f2;
  --color-lightest-rgb: 247, 248, 250;
  --color-medium: #7F7862;
  --color-medium-ish: #e2dfd5;

  --color-accent: #ffb400;
  --color-accent-light: #ffd966;
  --color-accent-dark: #b38600;
  --color-accent-rgb: 255, 180, 0;
  --color-accent-light-rgb: 255, 217, 102;
  --color-accent-dark-rgb: 179, 134, 0;

  --color-danger: #e74c3c;
  --color-danger-light: #ff7675;
  --color-danger-dark: #b93222;
  --color-danger-rgb: 231, 76, 60;
  --color-danger-light-rgb: 255, 118, 117;
  --color-danger-dark-rgb: 185, 50, 34;

  --color-success: #27ae60;
  --color-success-light: #55efc4;
  --color-success-dark: #219150;
  --color-success-rgb: 39, 174, 96;
  --color-success-light-rgb: 85, 239, 196;
  --color-success-dark-rgb: 33, 145, 80;

  --color-text: #333;
  --color-text-light: #666;
  --color-text-dark: #111;
  --color-text-rgb: 51, 51, 51;
  --color-text-light-rgb: 102, 102, 102;
  --color-text-dark-rgb: 17, 17, 17;

  --color-bg: var(--color-light);
  --border-radius: 0.625rem;
  --btn-border-radius: 0.375rem;
  --default-transition: all 0.2s ease-in-out;
  --default-gap: 2rem;
  --default-padding: 2rem;
  --default-box-shadow: 0 0 2.5rem rgba(0, 0, 0, 0.1);
  --input-padding: 0.625rem 1.25rem;
  --container-max-width: 75rem; /* 1200px */
  --transition: 0.2s cubic-bezier(.4,0,.2,1);
  --modal-padding: 2rem; /* 32px */
  --modal-min-width: 21.875rem; /* 350px */
  --modal-max-width: 25rem; /* 400px */
  --modal-margin-bottom: 1rem; /* 16px */
  --input-margin-bottom: 0.5rem; /* 8px */
  --textarea-min-height: 3.75rem; /* 60px */
  --actions-gap: 0.5rem; /* 8px */

  --font-size-h1: clamp(1.98rem, 5vw + 0.9rem, 3.5rem);
  --font-size-h2: clamp(1.53rem, 3.5vw + 0.9rem, 2.5rem);
  --font-size-h3: clamp(1.17rem, 2vw + 0.9rem, 2rem);
  --font-size-h4: clamp(0.99rem, 1.5vw + 0.9rem, 1.5rem);
  --font-size-h5: clamp(0.9rem, 1vw + 0.9rem, 1.25rem);
  --font-size-h6: clamp(0.855rem, 0.7vw + 0.9rem, 1rem);
  --font-size-h7: clamp(0.765rem, 0.5vw + 0.9rem, 0.9rem);
  --font-size-small-heading: clamp(0.72rem, 0.5vw + 0.9rem, 0.85rem);

  /* Numeric font sizes (12–60, every 2) */
  --font-size-12: clamp(0.675rem, 0.5vw + 0.54rem, 0.8rem);
  --font-size-14: clamp(0.765rem, 0.5vw + 0.63rem, 0.9rem);
  --font-size-16: clamp(0.9rem, 0.7vw + 0.72rem, 1rem);
  --font-size-18: clamp(0.99rem, 0.8vw + 0.81rem, 1.125rem);
  --font-size-20: clamp(1.08rem, 1vw + 0.9rem, 1.25rem);
  --font-size-22: clamp(1.17rem, 1.1vw + 0.99rem, 1.375rem);
  --font-size-24: clamp(1.26rem, 1.2vw + 1.08rem, 1.5rem);
  --font-size-26: clamp(1.35rem, 1.3vw + 1.17rem, 1.625rem);
  --font-size-28: clamp(1.44rem, 1.4vw + 1.26rem, 1.75rem);
  --font-size-30: clamp(1.53rem, 1.5vw + 1.35rem, 1.875rem);
  --font-size-32: clamp(1.62rem, 1.6vw + 1.44rem, 2rem);
  --font-size-34: clamp(1.71rem, 1.7vw + 1.53rem, 2.125rem);
  --font-size-36: clamp(1.8rem, 1.8vw + 1.62rem, 2.25rem);
  --font-size-38: clamp(1.89rem, 1.9vw + 1.71rem, 2.375rem);
  --font-size-40: clamp(1.98rem, 2vw + 1.8rem, 2.5rem);
  --font-size-42: clamp(2.07rem, 2.1vw + 1.89rem, 2.625rem);
  --font-size-44: clamp(2.16rem, 2.2vw + 1.98rem, 2.75rem);
  --font-size-46: clamp(2.25rem, 2.3vw + 2.07rem, 2.875rem);
  --font-size-48: clamp(2.34rem, 2.4vw + 2.16rem, 3rem);
  --font-size-50: clamp(2.43rem, 2.5vw + 2.25rem, 3.125rem);
  --font-size-52: clamp(2.52rem, 2.6vw + 2.34rem, 3.25rem);
  --font-size-54: clamp(2.61rem, 2.7vw + 2.43rem, 3.375rem);
  --font-size-56: clamp(2.7rem, 2.8vw + 2.52rem, 3.5rem);
  --font-size-58: clamp(2.79rem, 2.9vw + 2.61rem, 3.625rem);
  --font-size-60: clamp(2.88rem, 3vw + 2.7rem, 3.75rem);
}