.hero-carousel {
    overflow: hidden;
    padding: 0;
    position: relative;
}

.hero-carousel__track {
    display: flex;
    height: 100%;
    transition: transform 700ms cubic-bezier(.2, .8, .2, 1);
    width: 100%;
}

.hero-carousel__slide {
    background-color: var(--bg);
    background-position: center center;
    background-size: cover;
    flex: 0 0 100%;
    min-height: inherit;
    overflow: hidden;
    position: relative;
}

.hero-carousel__slide::before {
    background:
        linear-gradient(90deg, rgba(0, 0, 0, calc(var(--hero-overlay, .78) + .08)) 0%, rgba(0, 0, 0, var(--hero-overlay, .78)) 46%, rgba(0, 0, 0, .34) 100%),
        radial-gradient(circle at 70% 34%, color-mix(in srgb, var(--accent) 26%, transparent), transparent 32rem);
    content: "";
    inset: 0;
    pointer-events: none;
    position: absolute;
    z-index: 1;
}

.hero-carousel .archive-hero__media {
    z-index: 0;
}

/* v0.8.20: keep landing hero media fully covering the hero, including Bunny iframes. */
body:not(.admin-body).page-home .hero-carousel,
body:not(.admin-body).page-home .hero-carousel__track,
body:not(.admin-body).page-home .hero-carousel__slide {
    height: clamp(700px, 90vh, 940px);
    min-height: clamp(700px, 90vh, 940px);
}

body:not(.admin-body).page-home .hero-carousel {
    padding: 0 !important;
}

body:not(.admin-body).page-home .hero-carousel__track,
body:not(.admin-body).page-home .hero-carousel__slide {
    width: 100% !important;
}

body:not(.admin-body).page-home .hero-carousel__slide {
    background-position: center center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
}

body:not(.admin-body).page-home .hero-carousel .archive-hero__media {
    border: 0 !important;
    left: 50% !important;
    min-height: 100% !important;
    min-width: 100% !important;
    object-fit: cover !important;
    object-position: center center !important;
    position: absolute !important;
    top: 50% !important;
    transform: translate(-50%, -50%) !important;
}

body:not(.admin-body).page-home .hero-carousel .archive-hero__media--video {
    height: 100% !important;
    width: 100% !important;
}

body:not(.admin-body).page-home .hero-carousel .archive-hero__media--frame {
    height: max(100%, 56.25vw) !important;
    width: max(100%, 177.78vh) !important;
}

@supports (height: 100svh) {
    body:not(.admin-body).page-home .hero-carousel .archive-hero__media--frame {
        width: max(100%, 177.78svh) !important;
    }
}

@media (max-width: 760px) {
    body:not(.admin-body).page-home .hero-carousel,
    body:not(.admin-body).page-home .hero-carousel__track,
    body:not(.admin-body).page-home .hero-carousel__slide {
        height: min(760px, 92vh);
        min-height: min(760px, 92vh);
    }
}

.hero-carousel .fight-slashes,
.hero-carousel .archive-hero__content {
    z-index: 2;
}

.hero-carousel .archive-hero__content {
    padding: clamp(132px, 16vw, 210px) clamp(24px, 8vw, 136px) clamp(76px, 10vw, 126px);
}

.hero-carousel__dots {
    align-items: center;
    bottom: clamp(22px, 4vw, 44px);
    display: flex;
    gap: 10px;
    left: clamp(24px, 8vw, 136px);
    position: absolute;
    z-index: 4;
}

.hero-carousel__dots button {
    background: rgba(255, 255, 255, .45);
    border: 0;
    cursor: pointer;
    height: 3px;
    padding: 0;
    width: 34px;
}

.hero-carousel__dots button.is-active {
    background: var(--accent);
}

.fighter-recruit-section {
    align-items: center;
    background-position: center center;
    background-size: cover;
    border-top: 1px solid rgba(255, 255, 255, .08);
    display: grid;
    gap: clamp(24px, 6vw, 70px);
    grid-template-columns: minmax(0, 1fr) auto;
    min-height: 360px;
    overflow: hidden;
    position: relative;
}

.fighter-recruit-section::before {
    background:
        linear-gradient(90deg, rgba(0, 0, 0, .88), rgba(0, 0, 0, .62)),
        linear-gradient(115deg, transparent 0 58%, color-mix(in srgb, var(--accent) 45%, transparent) 58% 70%, transparent 70%);
    content: "";
    inset: 0;
    pointer-events: none;
    position: absolute;
}

.fighter-recruit-section > * {
    position: relative;
    z-index: 1;
}

.fighter-recruit-section__copy {
    max-width: 780px;
}

.fighter-recruit-section__copy h2 {
    font-size: clamp(44px, 7vw, 92px);
    line-height: .94;
    margin: 0 0 18px;
}

.fighter-recruit-section__copy p:last-child {
    color: color-mix(in srgb, var(--text) 78%, transparent);
    font-size: clamp(18px, 2vw, 24px);
    line-height: 1.32;
    margin: 0;
    max-width: 680px;
}

.application-hero {
    background-position: center center;
    background-size: cover;
    min-height: min(60vh, 620px);
    overflow: hidden;
    position: relative;
}

.application-hero::before {
    background:
        linear-gradient(90deg, rgba(0, 0, 0, .86), rgba(0, 0, 0, .42)),
        linear-gradient(112deg, transparent 0 66%, color-mix(in srgb, var(--accent) 32%, transparent) 66% 76%, transparent 76%);
    content: "";
    inset: 0;
    pointer-events: none;
    position: absolute;
}

.application-hero > * {
    position: relative;
    z-index: 1;
}

.application-section {
    align-items: start;
    display: grid;
    gap: clamp(28px, 6vw, 72px);
    grid-template-columns: minmax(0, .85fr) minmax(320px, 1fr);
}

.application-section__copy h2 {
    font-size: clamp(42px, 6vw, 86px);
    line-height: .96;
    margin: 0 0 16px;
}

.application-section__copy p:last-child {
    color: color-mix(in srgb, var(--text) 80%, transparent);
    font-size: clamp(18px, 2vw, 23px);
    line-height: 1.35;
    max-width: 620px;
}

.application-form {
    background:
        linear-gradient(135deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .025)),
        color-mix(in srgb, var(--surface) 82%, #000000);
    border: 1px solid rgba(255, 255, 255, .16);
    box-shadow: 0 24px 80px rgba(0, 0, 0, .34);
    display: grid;
    gap: 18px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding: clamp(24px, 4vw, 40px);
}

.application-form .full,
.application-form button,
.application-form .success-box,
.application-form .error-box,
.application-form .sr-only {
    grid-column: 1 / -1;
}

.application-form label {
    color: color-mix(in srgb, var(--text) 78%, transparent);
    display: grid;
    font-family: var(--heading-font);
    font-size: 13px;
    font-weight: 700;
    gap: 8px;
    letter-spacing: 0;
    text-transform: uppercase;
}

.application-form input,
.application-form select,
.application-form textarea {
    background: rgba(0, 0, 0, .52);
    border: 1px solid rgba(255, 255, 255, .18);
    color: var(--text);
    font: 600 16px var(--body-font);
    min-height: 48px;
    padding: 12px 14px;
}

.application-form textarea {
    min-height: 140px;
    resize: vertical;
}

body:not(.admin-body) .home-social-stats[data-reveal],
body:not(.admin-body) .fighter-recruit-section[data-reveal],
body:not(.admin-body) .application-section[data-reveal] {
    opacity: 1 !important;
    transform: none !important;
}

body:not(.admin-body) .home-social-stats,
body:not(.admin-body) .fighter-recruit-section {
    color: var(--text) !important;
}

body:not(.admin-body) .home-social-stats::before {
    background:
        linear-gradient(108deg, rgba(2, 3, 4, 0.82) 0%, rgba(7, 10, 13, 0.64) 46%, rgba(17, 24, 32, 0.56) 100%),
        linear-gradient(120deg, transparent 0 58%, rgba(216, 13, 22, 0.56) 58% 64%, transparent 64% 100%) !important;
}

body:not(.admin-body) .home-social-stats__intro h2,
body:not(.admin-body) .home-social-stat strong,
body:not(.admin-body) .fighter-recruit-section__copy h2 {
    color: #ffffff !important;
    opacity: 1 !important;
}

body:not(.admin-body) .home-social-stat,
body:not(.admin-body) .fighter-recruit-section__copy p:last-child {
    opacity: 1 !important;
}

@media (max-width: 860px) {
    .hero-carousel .archive-hero__content {
        padding: 128px 24px 82px;
    }

    .hero-carousel__dots {
        left: 24px;
    }

    .fighter-recruit-section,
    .application-section,
    .application-form {
        grid-template-columns: 1fr;
    }

    .fighter-recruit-section {
        align-items: start;
    }

    .fighter-recruit-section .button {
        justify-self: start;
    }

    .application-section__copy h2 {
        font-size: clamp(36px, 13vw, 56px);
        max-width: 9ch;
    }
}

/* v0.8.15: final public mobile/menu/card layer guards. */
body:not(.admin-body) .match-card::before {
    pointer-events: none !important;
    z-index: 1 !important;
}

body:not(.admin-body) .match-card::after {
    pointer-events: none !important;
    z-index: 2 !important;
}

body:not(.admin-body) .match-card .match-thumb {
    z-index: 0 !important;
}

body:not(.admin-body) .match-card .match-body,
body:not(.admin-body) .match-card .match-body strong,
body:not(.admin-body) .match-card .match-type-badge {
    position: relative !important;
    z-index: 5 !important;
}

@media (max-width: 760px) {
    body:not(.admin-body) .site-header {
        align-items: center !important;
        display: grid !important;
        grid-template-columns: 48px minmax(0, 1fr) 48px !important;
        justify-items: center !important;
        overflow: visible !important;
    }

    body:not(.admin-body) .site-menu-toggle {
        display: inline-flex !important;
        grid-column: 1 !important;
        grid-row: 1 !important;
        justify-self: start !important;
    }

    body:not(.admin-body) .site-header .brand {
        grid-column: 2 !important;
        grid-row: 1 !important;
        justify-self: center !important;
    }

    body:not(.admin-body) .site-nav {
        align-items: stretch !important;
        background:
            linear-gradient(135deg, rgba(216, 13, 22, 0.18), transparent 42%),
            rgba(3, 5, 7, 0.98) !important;
        border: 1px solid rgba(255, 255, 255, 0.14) !important;
        box-shadow: 0 28px 80px rgba(0, 0, 0, 0.52) !important;
        display: none !important;
        flex-direction: column !important;
        grid-column: 1 / -1 !important;
        grid-row: 2 !important;
        grid-template-columns: 1fr !important;
        justify-content: start !important;
        justify-self: stretch !important;
        left: auto !important;
        margin: 12px 0 0 !important;
        max-height: calc(100vh - 98px) !important;
        opacity: 1 !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        padding: 10px !important;
        pointer-events: auto !important;
        position: static !important;
        right: auto !important;
        top: auto !important;
        transform: none !important;
        width: 100% !important;
    }

    body:not(.admin-body) .site-header.is-menu-open .site-nav {
        display: grid !important;
    }

    body:not(.admin-body) .site-nav a,
    body:not(.admin-body) .site-nav .nav-link--account,
    body:not(.admin-body) .site-nav .nav-link--admin,
    body:not(.admin-body) .site-nav .nav-link--primary {
        align-items: center !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
        display: flex !important;
        justify-content: center !important;
        min-height: 48px !important;
        padding: 15px 16px !important;
        transform: none !important;
        width: 100% !important;
    }
}
