html,body {
    font-family: 'Inter', sans-serif;
    background-color: #111827; /* Dark background */
    color: #F3F4F6; /* Light text */
    overflow-x: hidden;
}

.font-playfair {
    font-family: 'Playfair Display', serif;
}

/* Section styling */
.gallery-section {
    min-height: 100vh;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    padding: 6rem 2rem;
    position: relative;
    border-bottom: 1px solid #374151;
}

/* Custom transition for background color */
.background-transition {
    transition: background-color 0.5s ease-in-out;
}

/* Card flip styles for Sculpture Section */
.flip-card {
    background-color: transparent;
    width: 300px;
    height: 400px;
    perspective: 1000px;
}

.flip-card-inner {
    position: relative;
    width: 100%;
    height: 100%;
    text-align: center;
    transition: transform 0.8s;
    transform-style: preserve-3d;
}

.flip-card:hover .flip-card-inner {
    transform: rotateY(180deg);
}

.flip-card-front, .flip-card-back {
    position: absolute;
    width: 100%;
    height: 100%;
    -webkit-backface-visibility: hidden; /* Safari */
    backface-visibility: hidden;
    border-radius: 0.75rem;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.flip-card-front {
    background-color: #1F2937;
    color: white;
}

.flip-card-back {
    background-color: #4B5563;
    color: white;
    transform: rotateY(180deg);
    padding: 1.5rem;
}

/* Quiz styles */
.quiz-option {
    transition: background-color 0.3s;
}
.quiz-option:hover {
     background-color: #374151;
}
.quiz-option.selected {
    background-color: #4F46E5;
}