.button_primary {
    @apply bg-[var(--primary-color)] text-white py-2 px-4 rounded-md hover:bg-[var(--accent-color)] focus:outline-none focus:ring-2 focus:ring-[var(--primary-color)] focus:ring-opacity-50;
}

.button_secondary {
    @apply bg-[var(--secondary-color)] text-[var(--text-primary)] py-2 px-4 rounded-md hover:bg-gray-200 focus:outline-none focus:ring-2 focus:ring-[var(--primary-color)] focus:ring-opacity-50;
}

/* Heritage Card */
.heritage-card {
    @apply rounded-xl shadow-lg overflow-hidden border-4 border-white transition-all duration-500;
    box-shadow: 0 10px 25px rgba(92, 61, 46, 0.15);
}

.heritage-card:hover {
    transform: translateY(-10px);
    box-shadow: 0 15px 35px rgba(92, 61, 46, 0.25);
}

.heritage-card img {
    @apply w-full h-full object-cover transition-transform duration-700;
}

.heritage-card:hover img {
    transform: scale(1.05);
}

.year-badge {
    @apply inline-block bg-[var(--accent-color)] text-[var(--text-primary)] px-4 py-1 rounded-full text-sm font-bold mb-4;
    box-shadow: 0 4px 6px rgba(237, 140, 42, 0.3);
}

/* Dot Navigation */
.dot-indicator {
    @apply w-3 h-3 rounded-full bg-gray-300 mb-3 transition-all;
}

.dot-indicator.active {
    @apply bg-[var(--primary-color)] scale-125;
}

.mobile-dot-nav {
    @apply fixed bottom-4 left-1/2 transform -translate-x-1/2 z-40 flex flex-row;
}

.mobile-dot-nav .dot-indicator {
    @apply mb-0 mx-2;
}

/* Back to Top */
.back-to-top {
    @apply fixed right-4 bottom-4 md:right-8 md:bottom-8 w-12 h-12 md:w-14 md:h-14 rounded-full bg-[var(--primary-color)] flex items-center justify-center text-white shadow-lg z-50 transition-all duration-300;
    opacity: 0;
    transform: translateY(20px);
}

.back-to-top.visible {
    opacity: 1;
    transform: translateY(0);
}

.back-to-top:hover {
    @apply bg-[var(--text-primary)] transform scale-110;
}