:root {
    --brand-blue: #2563eb;
}

body { font-family: 'Inter', sans-serif; }
.serif { font-family: 'Playfair Display', serif; }

.nav-link {
    position: relative;
    transition: color 0.3s;
}
.nav-link::after {
    content: '';
    position: absolute;
    width: 0;
    height: 2px;
    bottom: -4px;
    left: 0;
    background-color: var(--brand-blue);
    transition: width 0.3s;
}
.nav-link:hover::after {
    width: 100%;
}
.tab-content { display: none; }

/* Original tab content animation */
.tab-content.active { 
    display: block; 
    animation: fadeSlideUp 0.4s ease-out forwards;
}

.nav-link.active-tab {
    color: var(--brand-blue);
}
.nav-link.active-tab::after {
    width: 100%;
}

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

html { scroll-behavior: smooth; }

.hero-gradient {
    background-color: #1e293b; /* A fallback solid color for mobile */
}

@media (min-width: 768px) { /* md breakpoint in Tailwind */
    .hero-gradient {
        background: linear-gradient(rgba(15, 23, 42, 0.7), rgba(15, 23, 42, 0.7)), 
                    url('Light house.jpg');
        background-size: cover;
        background-position: center;
    }
}

.schedule-background {
    background: linear-gradient(rgba(248, 250, 252, 0.92), rgba(248, 250, 252, 0.92)), 
                url('Sun Rise.jpg');
    background-size: cover;
    background-position: center;
}

/* Back to Top Button */
#backToTopBtn {
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s, visibility 0.3s;
}
#backToTopBtn.show {
    opacity: 1;
    visibility: visible;
}

/* Zoom Modal */
#zoomModal {
    display: none; /* Hidden by default */
    opacity: 0;
    transition: opacity 0.3s ease-out;
}
#zoomModal.show {
    display: flex; /* Use flex for centering */
    opacity: 1;
}

/* Foundation Modal */
#foundationModal {
    display: none; /* Hidden by default */
    opacity: 0;
    transition: opacity 0.3s ease-out;
}
#foundationModal.show {
    display: flex; /* Use flex for centering */
    opacity: 1;
}

/* Prevent background scroll when modal is open */
body.modal-open {
    overflow: hidden;
}