/* Google Fonts: Itim (Cute, Rounded) & Kanit (Clean, Modern) */
@import url('https://fonts.googleapis.com/css2?family=Itim&family=Kanit:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&display=swap');

:root {
  --color-sage-light: #F1F5F2;
  --color-sage: #88A47C;
  --color-sage-dark: #4C6E5D;
  --color-wood-light: #EFE9DB;
  --color-wood: #A9907E;
  --color-wood-dark: #6D5D50;
  --color-sunshine: #F7E1AE;
  --color-sunshine-dark: #DFA85E;
  --color-cream: #FCF9F2;
  --color-accent: #E76161;
}

body {
  font-family: 'Kanit', sans-serif;
  background-color: var(--color-cream);
  color: var(--color-wood-dark);
  scroll-behavior: smooth;
}

h1, h2, h3, h4, h5, h6, .font-cute {
  font-family: 'Itim', cursive;
}

/* Custom Scrollbar */
::-webkit-scrollbar {
  width: 10px;
}
::-webkit-scrollbar-track {
  background: var(--color-cream);
}
::-webkit-scrollbar-thumb {
  background: var(--color-sage);
  border-radius: 5px;
}
::-webkit-scrollbar-thumb:hover {
  background: var(--color-sage-dark);
}

/* Cozy Farm Borders & Card styling */
.farm-card {
  background-color: #ffffff;
  border: 3px solid var(--color-wood-light);
  border-radius: 1.5rem;
  box-shadow: 0 8px 0px 0px var(--color-wood-light);
  transition: all 0.25s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.farm-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 0px 0px var(--color-wood);
  border-color: var(--color-wood);
}

.farm-btn {
  font-family: 'Itim', cursive;
  background-color: var(--color-sage);
  color: white;
  border: 2px solid var(--color-sage-dark);
  border-radius: 9999px;
  box-shadow: 0 4px 0px 0px var(--color-sage-dark);
  transition: all 0.15s ease-in-out;
}

.farm-btn:hover {
  transform: translateY(2px);
  box-shadow: 0 2px 0px 0px var(--color-sage-dark);
  background-color: var(--color-sage-dark);
}

.farm-btn-secondary {
  font-family: 'Itim', cursive;
  background-color: var(--color-sunshine);
  color: var(--color-wood-dark);
  border: 2px solid var(--color-sunshine-dark);
  border-radius: 9999px;
  box-shadow: 0 4px 0px 0px var(--color-sunshine-dark);
  transition: all 0.15s ease-in-out;
}

.farm-btn-secondary:hover {
  transform: translateY(2px);
  box-shadow: 0 2px 0px 0px var(--color-sunshine-dark);
  background-color: var(--color-sunshine-dark);
  color: white;
}

.farm-btn-accent {
  font-family: 'Itim', cursive;
  background-color: var(--color-accent);
  color: white;
  border: 2px solid #B03A3A;
  border-radius: 9999px;
  box-shadow: 0 4px 0px 0px #B03A3A;
  transition: all 0.15s ease-in-out;
}

.farm-btn-accent:hover {
  transform: translateY(2px);
  box-shadow: 0 2px 0px 0px #B03A3A;
  background-color: #C84B4B;
}

/* Lightbox Modal Animation */
.lightbox-backdrop {
  backdrop-filter: blur(8px);
  transition: opacity 0.3s ease-out;
}

.lightbox-content {
  transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

/* Decorative Background Grid Pattern */
.cozy-pattern {
  background-color: var(--color-cream);
  background-image: radial-gradient(var(--color-wood-light) 1px, transparent 1px);
  background-size: 24px 24px;
}

/* Image overlay icons */
.gallery-overlay {
  background: rgba(76, 110, 93, 0.4);
  opacity: 0;
  transition: opacity 0.3s ease;
}

.gallery-item:hover .gallery-overlay {
  opacity: 1;
}

/* Smooth active nav links */
.nav-link {
  position: relative;
  transition: color 0.3s ease;
}

.nav-link::after {
  content: '';
  position: absolute;
  width: 0;
  height: 3px;
  bottom: -4px;
  left: 0;
  background-color: var(--color-sage);
  transition: width 0.3s ease;
  border-radius: 2px;
}

.nav-link:hover::after {
  width: 100%;
}