@import url('https://fonts.googleapis.com/css2?family=Karla:wght@300;400;500;600;700&family=Playfair+Display:ital,wght@0,400;0,700;1,400&display=swap');

:root {
  --cream: #f5f3e8;
  --green: #8d8f60;
  --brown: #423022;
  --orange: #9c6640;
  --white: #ffffff;
}

html {
  scroll-behavior: smooth;
  scroll-padding-top: 80px;
}

body {
  background-color: var(--cream);
}

/* Section number labels */
.section-number {
  font-family: 'Playfair Display', serif;
  font-style: italic;
  color: var(--orange);
  letter-spacing: 0.1em;
}

/* Divider line */
.section-divider {
  width: 60px;
  height: 2px;
  background-color: var(--orange);
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}