/* =========================================
   Sponsors Page Specific Styles
   ========================================= */

/* Hero Section */
.sponsors-hero {
    min-height: 60vh;
    display: flex;
    justify-content: center;
    align-items: center;
    /* Django template tag will go here for the background */
    background-size: cover;
    background-position: center;
    position: relative;
    padding-top: 80px; /* Accounts for navbar */
}

.sponsors-hero-box {
    background-color: rgba(45, 45, 45, 0.7);
    padding: 30px 80px;
    text-align: center;
    box-shadow: 0 4px 15px rgba(0,0,0,0.3);
}

.sponsors-hero-box h1 {
    font-size: 4rem;
    color: var(--text-light, #ffffff);
    margin: 0;
    letter-spacing: 2px;
}

/* Sponsors Intro */
.sponsors-intro {
    text-align: center;
    padding: 60px 10% 20px;
}

.sponsors-intro h2 {
    font-size: 2.8rem;
    color: var(--text-light, #ffffff);
    margin-bottom: 30px;
    line-height: 1.3;
    font-weight: 600;
}

.sponsors-intro p {
    font-size: 1.25rem;
    color: #e0e0e0;
    max-width: 1000px;
    margin: 0 auto;
    line-height: 1.8;
    text-align: left;
}

/* Slanted Divider */
.slant-divider {
    width: 100%;
    line-height: 0; 
    background-color: #e6e6e6; /* Matches the light gray background of logos */
}

.slant-divider svg {
    display: block;
    width: 100%;
    height: auto;
}

/* Sponsors Logos Section */
.sponsors-logos-section {
    background-color: #e6e6e6;
    padding: 40px 10% 80px;
}

.sponsors-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 60px 80px;
    max-width: 1200px;
    margin: 0 auto;
}

.sponsor-logo {
    max-width: 280px;
    max-height: 160px;
    object-fit: contain;
    /* Optional: adds a slight hover effect */
    transition: transform 0.3s ease; 
}

.sponsor-logo:hover {
    transform: scale(1.05);
}

/* Special Thanks Section */
.special-thanks-section {
    background-color: #e6e6e6;
    padding: 20px 10% 80px;
    text-align: center;
}

.special-thanks-section h2 {
    font-size: 2.5rem;
    color: var(--text-dark, #2d2d2d);
    margin-bottom: 60px;
    display: inline-block;
}

.special-thanks-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 50px;
    max-width: 1200px;
    margin: 0 auto;
}

.thanks-item {
    flex: 1;
    min-width: 250px;
    color: var(--text-dark, #2d2d2d);
    font-size: 2rem;
    line-height: 1.3;
}

/* Typography styles matching the image */
.italic-serif {
    font-family: "Georgia", serif;
    font-style: italic;
    font-weight: 600;
}

.stencil-font {
    font-family: "Impact", "Arial Black", sans-serif; /* Adjust to a stencil web-font if you have one loaded */
    text-transform: uppercase;
    letter-spacing: 1px;
}

.bold-sans {
    font-family: "Helvetica Neue", Arial, sans-serif;
    font-weight: 700;
}

/* Responsive Overrides */
@media (max-width: 900px) {
    .sponsors-hero-box h1 {
        font-size: 3rem;
    }
    
    .sponsors-intro h2 {
        font-size: 2.2rem;
    }
    
    .sponsors-intro p {
        font-size: 1.1rem;
    }

    .sponsors-grid {
        gap: 40px;
    }

    .sponsor-logo {
        max-width: 200px;
        max-height: 120px;
    }

    .thanks-item {
        font-size: 1.5rem;
    }
}