:root {
    --c-bg: #f4f4f2;
    --c-hero: #8dbc81;
    --c-primary: #007a3d;
    --c-dark: #1a392a;
    --c-text: #1e1e1e;
    --c-surface: #ffffff;
    --radius-sm: 10px;
    --container: 1450px;
    --bar-h: 112px;
    --h1-lh: 73px;
    --pill-w: 1180px;
    --pill-top: 60px;

    /* Theme tokens (main site defaults in green palette) */
    --site-primary: #007a3d;
    --site-primary-dark: #006332;
    --site-primary-contrast: #ffffff;
    --site-primary-border: rgba(0, 122, 61, 0.7);
    --site-primary-muted: rgba(0, 122, 61, 0.45);
    --site-primary-soft: #d3f2e2;
    --site-primary-soft-hover: #c8ecd9;
    --site-primary-pale: #e3f7ec;
    --site-primary-subtle: rgba(0, 122, 61, 0.1);
    --site-primary-overlay: rgba(0, 0, 0, 0.4);
    --site-primary-ring: rgba(0, 122, 61, 0.7);
    --site-primary-rgb: 0, 122, 61;
    --site-divider: rgba(0, 122, 61, 0.25);
}

html,
body {
    overflow-x: hidden;
}

.agenda-day-scroller {
    display: block;
    overflow-x: auto !important;
    overflow-y: hidden;
    padding-inline: 16px;
    scroll-padding-inline: 16px;
    white-space: nowrap;
    scrollbar-width: none;
    -ms-overflow-style: none;
    cursor: grab;
    touch-action: pan-x;
    scroll-snap-type: none;
}
.agenda-day-scroller::-webkit-scrollbar {
    display: none;
}
.agenda-day-scroller:active {
    cursor: grabbing;
}

.agenda-day-scroller > div {
    flex-wrap: nowrap;
    min-width: max-content;
}
.agenda-day-row {
    display: inline-flex;
    width: max-content;
    padding-right: clamp(80px, 12vw, 160px);
}

/* soft shadow utility */
.shadow-soft {
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.12);
}

/* snap carousels */
.snap-x {
    scroll-snap-type: x mandatory;
}
.snap-start {
    scroll-snap-align: start;
}

/* Tier label colors for bottom sponsor cards */
.tier-gold {
    color: #ddac17;
}
.tier-silver {
    color: #64748b;
} /* slate-500ish */
.tier-bronze {
    color: #9c6b3d;
}

/* Hide horizontal scrollbar but keep scroll functionality */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}
.no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* Expo Sector style */
.content-card {
    max-width: 1450px;
    width: 100%;
}

/* Typography for content sections */
.prose-sec {
    font-family: "Roboto", ui-sans-serif, system-ui, -apple-system, Segoe UI, Helvetica, Arial, sans-serif;
    font-size: clamp(16px, 2vw, 18px);
    line-height: 1.6;
    color: #000;
}
.prose-sec h2,
.prose-sec h3,
.prose-sec h4 {
    font-family: "Montserrat", ui-sans-serif, system-ui, -apple-system, Segoe UI, Helvetica, Arial, sans-serif;
    color: #1e1e1e;
}
.prose-sec p + p {
    margin-top: 0.8rem;
}
.prose-sec ul,
.prose-sec ol {
    margin-top: 0.75rem;
}

/* Bullet list styling scoped to prose-sec */
.prose-sec > ul {
    display: flex;
    flex-wrap: wrap;
    gap: 1.25rem;
    list-style: none;
    padding-left: 0;
}
.prose-sec > ul li {
    display: inline-flex;
    align-items: center;
    margin: 0;
}
.prose-sec > ul li::before {
    content: "•";
    color: var(--c-primary);
    margin-right: 0.4rem;
    font-weight: 700;
}

/* FOOTER icon buttons */
.icon-btn {
    width: 44px;
    height: 44px;
    border-radius: 9999px;
    background: #fff;
    color: #ec233c;
    display: grid;
    place-items: center;
    transition: transform 0.15s ease, opacity 0.15s ease, background-color 0.15s ease;
}
.icon-btn img {
    filter: brightness(0) saturate(100%) invert(37%) sepia(77%) saturate(515%) hue-rotate(114deg) brightness(95%)
        contrast(101%);
}
.icon-btn:hover {
    transform: translateY(-1px);
    opacity: 0.9;
    background-color: #eee;
}
.icon-btn:focus-visible {
    outline: 3px solid #f2c75c;
    outline-offset: 3px;
}
.rotating-icon {
    display: inline-block;
    transform: scale(1.8);
    transform-origin: center;
    will-change: transform;
    image-rendering: auto;
}

/* Seamless marquee (CSS keyframes + auto-duplication via tiny JS) */
.marquee {
    --gap: 1rem;
    --speed: 60;
    --duration: 30s;
}

.marquee__viewport {
    overflow: hidden;
    width: 100%;
    isolation: isolate;
    padding-bottom: 2px;
    touch-action: pan-y;
    cursor: grab;
}

.marquee__track {
    margin: 0;
    padding: 0;
    list-style: none;
    display: inline-flex; /* inline to allow max-content measurement */
    gap: var(--gap);
    will-change: transform;
    min-width: max-content; /* track shrinks to content; crucial for calc */
    transform: translate3d(0, 0, 0);
    animation: marquee-slide var(--duration) linear infinite;
}

.marquee__item {
    flex: 0 0 auto;
    will-change: transform;
}

.marquee--dragging .marquee__viewport {
    cursor: grabbing;
}

@keyframes marquee-slide {
    0% {
        transform: translate3d(0, 0, 0);
    }
    100% {
        transform: translate3d(-50%, 0, 0);
    } /* exactly half (2x content) */
}

/* Variants for density */
.marquee--tight {
    --gap: 0.75rem;
}
.marquee--loose {
    --gap: 2rem;
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
    .marquee__track {
        animation: none !important;
        transform: translate3d(0, 0, 0) !important;
    }
}

/* === Scroll-to-top floating button === */
#to-top {
    position: fixed;
    right: clamp(12px, 4vw, 22px);
    bottom: clamp(12px, 4vw, 22px);
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background: #ec233c;
    color: #f4f4f2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.25), 0 5px 12px rgba(0, 0, 0, 0.18);
    border: 1px solid rgba(255, 255, 255, 0.16);
    opacity: 0;
    transform: translateY(12px) scale(14);
    pointer-events: none;
    transition: opacity 180ms ease, transform 180ms ease, box-shadow 160ms ease, background 160ms ease;
    z-index: 90;
}
#to-top.to-top--show {
    opacity: 1;
    transform: translateY(0) scale(1);
    pointer-events: auto;
}
#to-top:hover {
    box-shadow: 0 12px 26px rgba(0, 0, 0, 0.24), 0 6px 14px rgba(0, 0, 0, 0.16);
    transform: translateY(-2px) scale(1.02);
}
#to-top:focus-visible {
    outline: 3px solid rgba(255, 255, 255, 0.65);
    outline-offset: 3px;
}
#to-top .to-top__icon {
    display: block;
    width: 70%;
    height: 70%;
    background: url("/static/img/upward-arrow.svg") center/contain no-repeat;
    filter: invert(1);
}
@media (max-width: 1024px) {
    #to-top {
        width: 54px;
        height: 54px;
    }
}
@media (max-width: 640px) {
    #to-top {
        width: 44px;
        height: 44px;
    }
}
@media (prefers-reduced-motion: reduce) {
    #to-top {
        transition: none;
    }
}

/* Multi-line clamp (Tailwind plugin not required) */
.line-clamp-2 {
    display: -webkit-box;
    line-clamp: 2;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* PARTICIPANTS */

.prose p,
.prose li {
    font-size: 25px;
    line-height: 40px;
    color: #000;
}

.prose img {
    border-radius: 20px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.07);
}

/* Legal pages (terms/privacy) responsive typography */
.legal-heading {
    font-size: clamp(20px, 5vw, 32px);
    line-height: 1.35;
    color: #000;
}
.legal-content {
    font-size: clamp(15px, 3.8vw, 18px);
    line-height: 1.7;
    color: #000;
}
.legal-content p + p {
    margin-top: 0.9rem;
}
.legal-content ul,
.legal-content ol {
    margin: 0.75rem 0 0 1.2rem;
    padding: 0;
}
.legal-content li {
    margin-bottom: 0.4rem;
}
.legal-content h2,
.legal-content h3 {
    font-size: clamp(18px, 4.8vw, 26px);
    line-height: 1.3;
    margin: 1rem 0 0.5rem;
    color: #1e1e1e;
}
