:root {
  --brand-50: #f8f5f1;
  --brand-100: #f2e9df;
  --brand-600: #7a4a22;
  --brand-700: #5f3715;
  --ink-900: #1f2937;
}

html {
  scroll-behavior: smooth;
}

body {
  color: var(--ink-900);
  background:
    radial-gradient(circle at 0 0, rgba(122, 74, 34, 0.09), transparent 50%),
    radial-gradient(circle at 100% 100%, rgba(168, 85, 247, 0.04), transparent 45%),
    linear-gradient(180deg, #fff 0%, var(--brand-50) 100%);
}

.site-shell {
  min-height: 100vh;
}

.hero-overlay {
  background: linear-gradient(120deg, rgba(17, 24, 39, 0.82), rgba(17, 24, 39, 0.42));
}

.card-lift {
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.card-lift:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 50px -26px rgba(31, 41, 55, 0.45);
}

.section-title {
  letter-spacing: -0.02em;
}

.soft-grid {
  background-image:
    linear-gradient(rgba(122, 74, 34, 0.09) 1px, transparent 1px),
    linear-gradient(90deg, rgba(122, 74, 34, 0.09) 1px, transparent 1px);
  background-size: 24px 24px;
}

[data-menu] {
  transition: max-height 0.25s ease;
}

@media (prefers-reduced-motion: reduce) {
  * {
    animation: none !important;
    transition: none !important;
  }
}
