/* Overall Festival Calendar Section Styling */
.festival-calendar {
    background-color: #ffffff; /* Clean white background for premium look */
    padding: 80px 40px;
    text-align: center;
    margin: 0 auto;
    max-width: 1300px; /* Constrained maximum width for professional layout */
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.1); /* Subtle depth shadow */
    border-radius: 0px; /* Smooth, rounded corners */
    border: 1px solid #e0e0e0; /* Light border for elegance */
    overflow: visible; /* Prevent content from being hidden */
}

/* Header Styling */
.festival-calendar .calendar-header {
    margin-bottom: 50px;
}

.festival-calendar h2 {
    font-family: 'Helvetica Neue', sans-serif;
    font-size: 3rem;
    color: #333;
    font-weight: 600;
    margin-bottom: 15px;
    letter-spacing: 2px; /* Subtle spacing for a modern effect */
    text-transform: uppercase;
}

.festival-calendar p {
    font-size: 1.1rem;
    color: #777;
    margin-bottom: 40px;
    font-family: 'Roboto', sans-serif;
}

/* Table Styling */
.festival-table {
    width: 100%;
    border-collapse: collapse;
    margin: 0 auto;
    border-radius: 10px; /* Rounded corners for table */
    overflow: hidden;
    border: 2px solid #e0e0e0; /* Add a border around the whole table */
}

.festival-table th, .festival-table td {
    padding: 20px 30px; /* Ample padding for clean layout */
    text-align: center;
    font-size: 1.1rem;
    font-family: 'Roboto', sans-serif;
    border: 1px solid #e0e0e0; /* Borders for each cell */
}

/* Header Cell Styling */
.festival-table th {
    background-color: #00695c; /* Deep teal for sophistication */
    color: #fff;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 20px 30px; /* Larger padding for header */
}

/* Body Cells */
.festival-table td {
    background-color: #f9f9f9; /* Light grey background */
    color: #333;
    text-align: left; /* Left align for Festival Name and Town */
    padding-left: 30px; /* Adds extra left padding for readability */
}

/* Hover Effect */
.festival-table tr:hover {
    background-color: #f4e1a1; /* Golden color hover effect (matches logo) */
    transform: translateY(-3px); /* Smooth upward animation on hover */
    transition: all 0.3s ease-in-out; /* Subtle transition for professional feel */
}

/* Smooth Hover Font Color */
.festival-table tr:hover td, .festival-table tr:hover th {
    color: #004d40; /* Dark green font color on hover */
}

/* Striping for readability */
.festival-table tr:nth-child(odd) {
    background-color: #f4f4f4; /* Soft gray for odd rows */
}

/* Smooth Hover Focus */
.festival-table th, .festival-table td {
    transition: background-color 0.3s ease, color 0.3s ease;
}

.festival-table tr:hover th, .festival-table tr:hover td {
    background-color: #f4e1a1; /* Golden background for hover row */
    color: #004d40; /* Dark green text when hovered */
}

/* Adding Active Hover State */
.festival-table tr:active {
    transform: scale(0.98); /* Slightly scales down when clicked */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1); /* Small shadow effect */
}

/* Responsive Design for Smaller Screens */
@media (max-width: 768px) {
    .festival-calendar {
        padding: 40px 20px;
    }

    .festival-calendar h2 {
        font-size: 2.5rem;
    }

    .festival-table th, .festival-table td {
        padding: 15px 20px; /* Less padding for mobile screens */
        font-size: 1rem; /* Slightly smaller text */
    }
}