@import 'tailwindcss/base';
@import 'tailwindcss/components';
@import 'tailwindcss/utilities';

/* Global Styles */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font-family: 'Inter', sans-serif;
  line-height: 1.6;
  color: #1f2937;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Playfair Display', serif;
  font-weight: 600;
}

.logo-script {
  font-family: 'Dancing Script', cursive;
  font-weight: 600;
  color: #4f4135;
}

.logo-caps {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 500;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: #61544a;
}

.logo-subtitle {
  font-family: 'Cormorant Garamond', serif;
  font-weight: 400;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: #8d7968;
}

/* Custom Components */
.btn-primary {
  @apply bg-primary-700 hover:bg-primary-800 text-white font-medium py-3 px-6 rounded-lg transition-colors duration-200 focus:outline-none focus:ring-2 focus:ring-primary-500 focus:ring-offset-2 shadow-md hover:shadow-lg;
}

.btn-secondary {
  @apply bg-white hover:bg-primary-50 text-primary-700 font-medium py-3 px-6 rounded-lg border border-primary-600 transition-colors duration-200 focus:outline-none focus:ring-2 focus:ring-primary-500 focus:ring-offset-2 shadow-md hover:shadow-lg;
}

.card {
  @apply bg-white rounded-xl shadow-lg p-6 border border-gray-100;
}

.input-field {
  @apply w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500 transition-colors duration-200;
}

.textarea-field {
  @apply w-full px-4 py-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-primary-500 focus:border-primary-500 transition-colors duration-200 resize-y min-h-[120px];
}

/* Animations */
.fade-in {
  animation: fadeIn 0.6s ease-in-out;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.slide-up {
  animation: slideUp 0.8s ease-out;
}

@keyframes slideUp {
  from {
    opacity: 0;
    transform: translateY(40px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}