@font-face {
  font-family: 'AlteHaasGrotesk';
  src: url("../fonts/AlteHaasGroteskRegular.38025932dce4.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'AlteHaasGrotesk';
  src: url("../fonts/AlteHaasGroteskBold.8dddfc4c12cf.ttf") format("truetype");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}

:root {
  --color-bg: #F5E8C7;
  --color-primary: #8B5E5E;
  --color-primary-dark: #6B3A3A;
  --color-primary-light: #A98686;
  --color-secondary: #D4A574;
  --color-secondary-light: #E8C9A0;
  --color-secondary-lighter: #F0DCC0;
  --color-text: #2C1810;
  --color-text-light: #F5F0E8;
  --color-text-muted: #8B7D6B;
  --color-white: #FFFFFF;
  --color-shadow: rgba(44, 24, 16, 0.1);
  --color-shadow-strong: rgba(44, 24, 16, 0.18);
  --font-primary: 'AlteHaasGrotesk', -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 24px;
  --transition: 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  height: 100vh;
  overflow: hidden;
  font-size: 16px;
}

body {
  font-family: var(--font-primary);
  background-color: var(--color-bg);
  color: var(--color-text);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  margin: 0;
  padding: 0;
}

a {
  color: inherit;
  text-decoration: none;
}

img {
  max-width: 100%;
  display: block;
}