/* Tracked separately: the legacy index.scss and config/SCSS are ignored.
   Keep this stylesheet independent of the legacy Sass/PurgeCSS output. */
@font-face {
    font-family: 'Great Vibes';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('/assets/great-vibes.ttf') format('truetype');
}

.sponsor-thanks {
    position: fixed;
    inset: 0;
    margin: auto;
    width: min(53rem, calc(100% - 2rem));
    max-height: calc(100% - 2rem);
    max-height: calc(100dvh - 2rem);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 1.75rem 2.5rem;
    border: 2px solid #c8cdd3;
    border-radius: 1.25rem;
    background: #fff;
    color: #062553;
    text-align: center;
    overflow-wrap: anywhere;
    box-shadow: 0 1rem 3rem #0006;
    font-family: Poppins, Arial, sans-serif;
}

.sponsor-thanks::backdrop { background: #101d30b3; }
.sponsor-thanks__close {
    position: absolute;
    top: .5rem;
    right: .5rem;
    width: 2.75rem;
    height: 2.75rem;
    border: 0;
    border-radius: .3rem;
    background: transparent;
    color: #29364a;
    font: 2.5rem/1 Arial, sans-serif;
    cursor: pointer;
}
.sponsor-thanks__logo { display: block; width: 15rem; max-width: 65%; height: auto; margin: 0 auto .75rem; }
.sponsor-thanks__greeting {
    margin: 0;
    color: #125b9d;
    font-family: 'Great Vibes', 'Snell Roundhand', 'Brush Script MT', cursive;
    font-size: clamp(4rem, 12vw, 7.5rem);
    font-weight: 400;
    line-height: 1.25;
}
.sponsor-thanks h2 { margin: .25rem 0 1.5rem; font-size: clamp(1.5rem, 4.5vw, 3rem); font-weight: 800; line-height: 1.25; }
.sponsor-thanks__description { max-width: 42rem; margin: 0 auto 2rem; color: #29313b; font-size: clamp(1rem, 3vw, 1.9rem); line-height: 1.4; }
.sponsor-thanks__action {
    display: inline-block;
    max-width: 100%;
    padding: 1rem 2rem;
    border: 2px solid #49658b;
    border-radius: .7rem;
    background: #062553;
    color: #fff;
    font-size: clamp(1rem, 3vw, 1.75rem);
    font-weight: 600;
    line-height: 1.4;
    text-decoration: none;
}
.sponsor-thanks__action:hover { background: #123f76; }
.sponsor-thanks__close:hover { background: #edf2f7; }
.sponsor-thanks :focus-visible { outline: 3px solid #125b9d; outline-offset: 4px; }
html:has(.sponsor-thanks[open]) { overflow: hidden; }
#purse-bingo-2026-sponsors { scroll-margin-top: 2rem; }
@media (max-width: 480px) {
    .sponsor-thanks { padding: 2.75rem 1rem 1.5rem; }
    .sponsor-thanks__logo { width: 11rem; }
    .sponsor-thanks h2 { margin-bottom: 1rem; }
    .sponsor-thanks__description { margin-bottom: 1.25rem; }
    .sponsor-thanks__action { padding: .85rem 1rem; }
}
