/* SPONSOR TIER TITLES */
.sponsor-color-platinum,
.sponsor-color-gold,
.sponsor-color-silver,
.sponsor-color-bronze,
.sponsor-color-other {
    display: block;
    clear: both;
    width: 100%;
    margin: 60px auto 20px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* first tier title needs less top gap (intro text above it) */
.content-boxed > .sponsor-color-platinum:first-of-type,
.content-boxed > h3:first-of-type {
    margin-top: 60px;
}

/* metallic gradient text — fallback color first, then clip gradient */
.sponsor-color-platinum,
.sponsor-color-gold,
.sponsor-color-silver,
.sponsor-color-bronze,
.sponsor-color-other {
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.sponsor-color-platinum {
    color: #b9b8b5;
    background-image: linear-gradient(95deg, #8a8987 0%, #d9d8d6 45%, #ffffff 55%, #9a9997 100%);
}

.sponsor-color-gold {
    color: #ebbb10;
    background-image: linear-gradient(95deg, #a6790a 0%, #ebbb10 40%, #fff3b0 55%, #c4900c 100%);
}

.sponsor-color-silver {
    color: #999da1;
    background-image: linear-gradient(95deg, #6f7479 0%, #b9bdc1 45%, #eef0f1 55%, #82878c 100%);
}

.sponsor-color-bronze {
    color: #8b664d;
    background-image: linear-gradient(95deg, #6b4a34 0%, #a9764f 45%, #d8a877 55%, #7a5238 100%);
}

.sponsor-color-other {
    color: #666;
    background-image: linear-gradient(95deg, #555 0%, #888 50%, #5a5a5a 100%);
}

/* SPONSOR LOGOS */
.sponsor {
    width: 24%;
    display: inline-block;
    vertical-align: middle;
    padding: 20px 30px;
    box-sizing: border-box;
}

/* RESPONSIVE LOGOS */
@media all and (max-width: 850px) {
    .sponsor {
        width: 33%;
        padding: 18px 20px;
    }
}

@media all and (max-width: 550px) {
    .sponsor {
        width: 50%;
        padding: 15px 12px;
    }
}

/* RESPONSIVE TITLES */
@media all and (max-width: 768px) {
    .sponsor-color-platinum,
    .sponsor-color-gold,
    .sponsor-color-silver,
    .sponsor-color-bronze,
    .sponsor-color-other {
        margin: 45px auto 15px;
        font-size: 1.6rem;
    }
}

@media all and (max-width: 550px) {
    .sponsor-color-platinum,
    .sponsor-color-gold,
    .sponsor-color-silver,
    .sponsor-color-bronze,
    .sponsor-color-other {
        margin: 35px auto 12px;
        font-size: 1.3rem;
    }
}
