:root {
    --wb-gold: #f1c40f;
    --wb-blue: #0070c0;
    --wb-dark: #1e1e1e;
    --wb-text: #111;
    --wb-muted: #444;
    --card-bg: #fff;
    --shadow: 0 10px 24px rgba(0,0,0,.15);
    --radius: 18px;
    --max: 1040px;
}

* {
    box-sizing: border-box;
}

html, body {
    height: 100%;
}

body {
    margin: 0;
    background: var(--wb-gold);
    color: var(--wb-text);
    font-family: Arial, Helvetica, sans-serif;
    line-height: 1.45;
}

img {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
}

a:link, a:visited {
    color: var(--wb-blue);
}

a:hover, a:active {
    color: var(--wb-gold);
}

/* a11y */
.skip-link {
    position: absolute;
    top: -50px;
    left: 12px;
    background: #000;
    color: #fff;
    padding: 10px 12px;
    border-radius: 10px;
    text-decoration: none;
    z-index: 9999;
}

    .skip-link:focus {
        top: 12px;
        outline: 3px solid rgba(241,196,15,.85);
    }

/* layout */
.wb-wrap {
    max-width: var(--max);
    margin: 0 auto;
    padding: 18px 14px 50px;
}

.wb-section {
    background: var(--card-bg);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    padding: clamp(18px, 3vw, 42px);
    margin: 16px 0;
}

.wb-center {
    text-align: center;
}

.wb-logo {
    width: min(520px, 80%);
    height: auto;
}

.wb-h1 {
    margin: 12px 0 6px;
    font-size: clamp(26px, 3vw, 44px);
    letter-spacing: -0.02em;
    
    /* 1. Use "Extra Bold" instead of "Black" */
    font-weight: 700; 

    /* 2. A very thin stroke for just a hint of extra weight */
    -webkit-text-stroke: 0.5px currentColor;

    /* 3. Remove the shadow to keep the edges clean */
    text-shadow: none;
}

.wb-sub {
    margin: 0 auto;
    max-width: 75ch;
    color: var(--wb-muted);
    /* Bumped min from 15 to 16, and max from 18 to 20 */
    font-size: clamp(16px, 1.6vw, 20px);
    line-height: 1.5; /* Added for better readability at larger sizes */
}

/* canonical footer */
.wb-footer {
    background: var(--wb-dark);
    color: #fff;
    text-align: center;
}

    .wb-footer a {
        color: #fff;
    }

        .wb-footer a:hover {
            color: var(--wb-gold);
        }

.wb-footer-tagline {
    margin: 0 0 8px;
    font-style: italic;
    color: var(--wb-gold);
    font-size: clamp(22px, 2.2vw, 36px);
    font-weight: 900;
}

.wb-footer-meta {
    margin: 0 0 10px;
    font-size: clamp(14px, 1.4vw, 18px);
}

.wb-footer-logos {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 18px;
    flex-wrap: wrap;
    margin: 16px 0 8px;
}

    .wb-footer-logos img {
        height: 130px;
        width: auto;
    }

.wb-fineprint {
    font-size: 12px;
    opacity: .9;
    margin-top: 14px;
}

/* Custom class for the circular icon container */
.wb-icon-circle-container {
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%; /* Ensures the circle shape */
}

/* Targets both the links and the session timer text */
.navbar-nav .nav-link,
.navbar-text {
    font-size: 1.25rem; /* Matches your link size */
    font-weight: 700; /* Matches your link thickness */
}

/* Specifically for the session timer if you want it slightly different */
#session-timer {
    font-weight: 800; /* Extra thick for the actual countdown */
    font-variant-numeric: tabular-nums; /* Prevents numbers from jumping around */
}

@media (max-width: 520px) {
    .wb-footer-logos img {
        height: 110px;
    }
}

/* 🛡️ Pulse Animation for Critical Alerts */
.animate-pulse {
    animation: pulse-red 2s infinite;
}

@keyframes pulse-red {
    0% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(220, 53, 69, 0.7);
    }

    70% {
        transform: scale(1);
        box-shadow: 0 0 0 10px rgba(220, 53, 69, 0);
    }

    100% {
        transform: scale(0.95);
        box-shadow: 0 0 0 0 rgba(220, 53, 69, 0);
    }
}

/* 🛡️ Carlsbad Search Spinner: High-Fidelity Alignment */
.search-wrapper {
    position: relative;
    display: flex;
    align-items: center;
}

#searchSpinner {
    right: 85px; /* Sits exactly before the 'Find' button */
    top: 50%;
    transform: translateY(-50%);
    z-index: 5;
    pointer-events: none; /* User can click "through" it to focus input */
    color: #0d6efd; /* Carlsbad Primary Blue */
}

.qr-sharp {
    /* Chrome, Edge, Safari (The modern standard) */
    image-rendering: pixelated;
    /* Firefox (The older/alternate standard) */
    image-rendering: crisp-edges;
    /* Old Safari/iOS versions */
    image-rendering: -webkit-optimize-contrast;
}