* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: "Montserrat", sans-serif;
    background: #f3f3f3;
    color: #171717;
}

.topo{
    position: fixed;

    top: 0;
    left: 0;

    width: 100%;

    padding: 18px 0;

    background: transparent;

    transition: .4s ease;

    z-index: 999;
}

.menu {
    max-width: 1200px;
    height: 72px;
    margin: auto;
    padding: 0 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.logo {
    display: flex;
    align-items: center;
}

.logo img{
    width: 70px;
}

.menu nav {
    display: flex;
    gap: 24px;
}

.menu a {
    color: white;
    text-decoration: none;
    font-weight: bold;
}

.menu a:hover {
    color: #f6bd00;
}

.menu .botao {
    margin-right: 40px;
}

.banner {
    min-height: 70vh;

    display: flex;
    align-items: center;

    background-image:
        linear-gradient(
            rgba(0, 0, 0, .90),
            rgba(0, 0, 0, 0.81)
        ),
        url("../imagens/banner-corrida.png");

    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

    color: white;
}

.banner-conteudo {
    width: 90%;
    max-width: 1040px;
    margin: 0 auto;

    display: flex;
    flex-direction: column;
    justify-content: center;
}

.edicao {
    color: #f6bd00;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 4px;
}


.banner h1 {
    font-family: "Bebas Neue", sans-serif;
    letter-spacing: 5px;
    max-width: 750px;
    margin: 12px 0;
    font-size: clamp(4rem, 11vw, 8rem);
    line-height: 0.9;
    text-transform: uppercase;
}

.descricao {
    max-width: 550px;
    font-size: 1.2rem;
    line-height: 1.7;
    margin-bottom: 30px;
}

.data-principal {
    display: flex;
    flex-direction: column;
    margin-bottom: 30px;
}

.data-principal strong {
    color: #f6bd00;
    font-size: 1.8rem;
    text-transform: uppercase;
}

.data-principal span {
    margin-top: 6px;
    font-size: 1.1rem;
}

.botao {
    display: inline-block;
    width: fit-content;

    background: #f6bd00;
    color: #000;

    padding: 16px 36px;

    border-radius: 50px;

    font-weight: 700;
    text-decoration: none;

    transition: .3s;
}

.botao:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 24px rgba(246, 189, 0, 0.28);
}

.secao {
    max-width: 1200px;
    margin: auto;
    padding: 90px 24px;
}

.titulo-secao {
    margin-bottom: 40px;
}

.titulo-secao p {
    color: #b58a00;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 3px;
}

.titulo-secao h2 {
    margin-top: 8px;
    font-size: clamp(2rem, 5vw, 3.4rem);
    text-transform: uppercase;
}

.cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
    margin-top: 40px;
}

.card {
    padding: 30px 20px;

    background: #151515;
    color: white;

    border: 1px solid #292929;
    border-radius: 14px;
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);

    text-align: center;

    transition: transform 0.3s ease,
                border-color 0.3s ease,
                box-shadow 0.3s ease;
}
.card:hover {
    transform: translateY(-8px);
    border-color: #f6bd00;
    box-shadow: 0 14px 30px rgba(246, 189, 0, 0.12);
}
.icone-card {
    display: block;
    margin-bottom: 18px;

    font-size: 2.2rem;
}

.card h3 {
    margin-bottom: 8px;
    color: #f6bd00;
}

.card p {
    margin: 0;
}

.card h3 {
    color: #f6bd00;
    text-transform: uppercase;
    margin-bottom: 8px;
}

.secao-escura {
    max-width: none;
    background: #111;
    color: white;
}

.secao-escura > * {
    max-width: 1152px;
    margin-left: auto;
    margin-right: auto;
}

.beneficios {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 18px;

    max-width: 1100px;
    margin: 45px auto 0;
}

.beneficios div {
    padding: 25px;
    border: 1px solid #333;
    border-radius: 8px;
    background: #191919;
    font-size: 1.1rem;
}

.premiacao {
    min-height: 330px;
    padding: 45px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: 12px;
    background: #171717;
    color: white;
}

.premiacao h3 {
    max-width: 600px;
    color: #f6bd00;
    font-size: clamp(2rem, 5vw, 4rem);
    text-transform: uppercase;
}

.premiacao p {
    margin-top: 15px;
    font-size: 1.2rem;
}

.trofeu {
    font-size: 9rem;
}

.inscricao {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
}

.inscricao h2 {
    margin: 8px 0 12px;
    font-size: clamp(2rem, 5vw, 4rem);
    text-transform: uppercase;
}

.chamada {
    color: #b58a00;
    font-weight: bold;
    text-transform: uppercase;
    letter-spacing: 3px;
}

.patrocinadores {
    text-align: center;
}

.espaco-patrocinadores {
    min-height: 220px;
    padding: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 2px dashed #aaa;
    border-radius: 10px;
    color: #777;
    font-weight: bold;
    text-transform: uppercase;
}

footer {
    padding: 35px 24px;
    text-align: center;
    background: #080808;
    color: white;
}

@media (max-width: 900px) {
    .menu nav {
        display: none;
    }

    .cards {
        grid-template-columns: repeat(2, 1fr);
    }

    .beneficios {
        grid-template-columns: repeat(2, 1fr);
    }

    .premiacao {
        flex-direction: column;
        align-items: flex-start;
    }

    .trofeu {
        font-size: 6rem;
    }
}

.contagem {
    display: flex;
    gap: 14px;
    margin: 28px 0;
    flex-wrap: wrap;
}

.contagem div {
    min-width: 68px;
    padding: 12px 8px;

    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.18);
    border-radius: 10px;

    text-align: center;
    backdrop-filter: blur(5px);
}

.contagem strong {
    display: block;

    color: #f6bd00;
    font-family: "Bebas Neue", sans-serif;
    font-size: 2.3rem;
    line-height: 1;
}

.contagem span {
    display: block;
    margin-top: 6px;

    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 1px;
}
@media (max-width: 900px) {
    .cards {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 520px) {
    .cards {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 900px) {
    .beneficios {
        grid-template-columns: repeat(2, 1fr);
    }
}

.historia {
    padding: 100px 20px;
    background-color: #151515;
    border-top: 10px solid rgba(255,255,255,.06);

}

.historia-conteudo {
    max-width: 900px;
    margin: 0 auto;
}

.historia-subtitulo {
    display: block;
    margin-bottom: 10px;

    color: #d79f00;
    font-size: 0.9rem;
    font-weight: 700;
    letter-spacing: 4px;
}

.historia h2 {
    margin: 0 0 35px;

    color: #ffffff;
    font-family: "Bebas Neue", sans-serif;
    font-size: clamp(3.5rem, 8vw, 5.5rem);
    line-height: 1;
    text-transform: uppercase;
}

.historia p {
    max-width: 780px;
    margin-bottom: 20px;

    color: #cfcfcf;
    font-size: 1.08rem;
    line-height: 1.8;
}

.historia .historia-convite {
    margin-top: 35px;
    margin-bottom: 0;

    color: #d79f00;
    font-size: 1.35rem;
    font-weight: 700;
}
.percurso {
    background-color: #151515;
}

.percurso-conteudo {
    display: grid;
    grid-template-columns: 1.4fr 0.8fr;
    align-items: center;
    gap: 45px;

    max-width: 1100px;
    margin: 45px auto 0;
}

.percurso-imagem {
    overflow: hidden;
    padding: 10px;

    background-color: #1c1c1c;
    border: 1px solid rgba(94, 92, 92, 0.08);
    border-radius: 18px;
}

.percurso-imagem img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 12px;
}

.percurso-informacoes h3 {
    margin: 0 0 15px;

    color: #f6bd00;
    font-family: "Bebas Neue", sans-serif;
    font-size: 3rem;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.percurso-informacoes > p {
    margin-bottom: 30px;

    color: #cfcfcf;
    font-size: 1.05rem;
    line-height: 1.8;
}

.percurso-detalhes {
    display: grid;
    gap: 12px;
}

.percurso-detalhes div {
    padding: 18px 20px;

    background-color: #1c1c1c;
    border-left: 3px solid #f6bd00;
    border-radius: 8px;
}

.percurso-detalhes span {
    display: block;
    margin-bottom: 5px;

    color: #999999;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.percurso-detalhes strong {
    color: #ffffff;
    font-size: 1rem;
}

@media (max-width: 800px) {
    .percurso-conteudo {
        grid-template-columns: 1fr;
    }

    .percurso-informacoes h3 {
        font-size: 2.5rem;
    }
}
.inscricao {
    background-color: #0d0d0d;
}
#formulario{
    background-color: #0d0d0d;
}
.inscricao-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 50px;

    max-width: 1000px;
    margin: 45px auto 0;
    padding: 50px;

    background-color: #171717;
    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 18px;
    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.35);
}

.inscricao-texto {
    max-width: 620px;
}

.inscricao-valor {
    display: block;

    color: #f6bd00;
    font-family: "Bebas Neue", sans-serif;
    font-size: clamp(3.8rem, 7vw, 6rem);
    line-height: 1;
}
.inscricao-valor small {
    margin-left: 12px;

    color: #cfcfcf;
    font-family: "Montserrat", sans-serif;
    font-size: clamp(0.85rem, 1.6vw, 1.1rem);
    font-weight: 600;
    vertical-align: middle;
}
.inscricao-texto h3 {
    margin: 8px 0 20px;

    color: #ffffff;
    font-size: 1.4rem;
}

.inscricao-texto p {
    margin: 0;

    color: #cfcfcf;
    font-size: 1.02rem;
    line-height: 1.8;
}

.inscricao-texto .inscricao-vagas {
    margin-top: 18px;

    color: #f6bd00;
    font-weight: 700;
}

.botao-inscricao {
    display: inline-block;
    flex-shrink: 0;

    padding: 17px 32px;

    background-color: #f6bd00;
    color: #111111;

    border-radius: 999px;

    font-size: 0.95rem;
    font-weight: 800;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 1px;

    transition: transform 0.3s ease,
                background-color 0.3s ease;
}

.botao-inscricao:hover {
    transform: translateY(-4px);
    background-color: #ffd139;
    box-shadow: 0 10px 24px rgba(246, 189, 0, 0.28);
}

@media (max-width: 750px) {
    .inscricao-box {
        flex-direction: column;
        align-items: flex-start;
        padding: 35px 25px;
    }

    .botao-inscricao {
        width: 100%;
        text-align: center;
    }
}
.formulario-inscricao{

    max-width:700px;

    margin:45px auto 0;

    display:flex;

    flex-direction:column;

    gap:22px;
}

.campo{

    display:flex;

    flex-direction:column;
}

.campo label{

    margin-bottom:8px;

    color:#f6bd00;

    font-weight:600;
}

.campo input,
.campo select{

    padding:15px;

    border:none;

    border-radius:10px;

    background:#1d1d1d;

    color:white;

    font-size:16px;

    outline:none;
}

.campo input:focus,
.campo select:focus{

    border:1px solid #f6bd00;
}
.vagas-disponiveis{
    display:inline-flex;
    align-items:center;
    gap:10px;
    margin:20px 0;
    padding:10px 18px;
    background:rgba(246,189,0,.12);
    border:1px solid rgba(246,189,0,.35);
    border-radius:999px;
}

.vagas-disponiveis span{
    color:#d0d0d0;
}

.vagas-disponiveis strong{
    color:#F6BD00;
}

.formulario-inscricao button{

    margin-top:15px;

    padding:18px;

    background:#f6bd00;

    border:none;

    border-radius:999px;

    font-size:17px;

    font-weight:bold;

    cursor:pointer;

    transition:.3s;
}

.formulario-inscricao button:hover{

    transform:translateY(-3px);
    box-shadow: 0 10px 24px rgba(246, 189, 0, 0.28);
}
.texto-patrocinadores{

    max-width:700px;

    margin:20px auto 50px;

    text-align:center;

    color:#cfcfcf;

    line-height:1.8;
}

.patrocinadores-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:25px;

    max-width:1000px;

    margin:auto;
}

.patrocinador{

    display:flex;

    align-items:center;

    justify-content:center;

    height:140px;

    background:#1a1a1a;

    border-radius:15px;

    border:1px solid rgba(255,255,255,.08);
}

.patrocinador img{

    max-width:75%;

    max-height:70%;
}

@media(max-width:800px){

    .patrocinadores-grid{

        grid-template-columns:repeat(2,1fr);

    }

}
.apoio-conteudo {
    max-width: 700px;
    margin: 40px auto 0;
    text-align: center;
}

.apoio-conteudo p {
    color: #171717;
    font-size: 1.1rem;
    line-height: 1.8;
    margin-bottom: 30px;
}

.botao-apoio {
    display: inline-block;
    padding: 16px 36px;
    background: #f6bd00;
    color: #111;
    text-decoration: none;
    font-weight: 700;
    border-radius: 999px;
    transition: 0.3s;
}

.botao-apoio:hover {
    transform: translateY(-4px);
    background: #ffd139;
    box-shadow: 0 10px 24px rgba(246, 189, 0, 0.28);
}
footer{

    background:#0a0a0a;

    border-top:1px solid rgba(255,255,255,.08);

    padding:60px 20px;
}

.rodape-conteudo{

    max-width:900px;

    margin:auto;

    display:flex;

    flex-direction:column;

    align-items:center;

    text-align:center;

    gap:18px;
}

.rodape-conteudo img{

    width:90px;
}

.rodape-conteudo p{

    color:#ffffff;

    font-size:1.2rem;

    font-weight:700;

    margin:0;
}

.rodape-conteudo span{

    color:#bdbdbd;

    font-size:.95rem;
}

.rodape-whatsapp{

    display:inline-block;

    padding:14px 28px;

    background:#25D366;

    color:white;

    text-decoration:none;

    border-radius:999px;

    font-weight:700;

    transition:.3s;
}

.rodape-whatsapp:hover{

    transform:translateY(-3px);
}

.rodape-conteudo small{

    color:#777;

    margin-top:10px;
}
.pagamento-pix {
    display: none;
    max-width: 650px;
    margin: 0 auto;
    padding: 40px;
    background: #151515;
    border: 1px solid rgba(246, 189, 0, 0.35);
    border-radius: 18px;
    box-shadow: 0 20px 45px rgba(0, 0, 0, 0.35);
    text-align: center;
}

.pagamento-pix.ativo {
    display: block;
}

.pagamento-icone {
    width: 65px;
    height: 65px;
    margin: 0 auto 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f6bd00;
    color: #111111;
    border-radius: 50%;
    font-size: 32px;
    font-weight: bold;
}

.pagamento-pix h3 {
    margin-bottom: 15px;
    color: #f5f5f5;
    font-size: 32px;
}

.pagamento-pix > p {
    color: #cfcfcf;
    line-height: 1.6;
}

.valor-pix {
    display: block;
    margin: 18px 0 25px;
    color: #f6bd00;
    font-size: 34px;
}

.qr-code-pix {
    width: 230px;
    max-width: 100%;
    margin: 0 auto 25px;
    padding: 12px;
    background: #ffffff;
    border-radius: 12px;
}

.qr-code-pix img {
    display: block;
    width: 100%;
    height: auto;
}

.titulo-codigo-pix {
    margin-bottom: 10px;
    font-weight: 700;
}

.pix-copia-cola {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 25px;
    padding: 10px;
    background: #0d0d0d;
    border: 1px solid #333333;
    border-radius: 10px;
}

.pix-copia-cola span {
    flex: 1;
    overflow: hidden;
    color: #cfcfcf;
    font-size: 14px;
    text-align: left;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.pix-copia-cola button {
    padding: 11px 18px;
    border: none;
    border-radius: 8px;
    background: #f6bd00;
    color: #111111;
    font-weight: 700;
    cursor: pointer;
}

.pix-copia-cola button:hover {
    filter: brightness(1.08);
}

.status-pagamento {
    display: flex;
    gap: 14px;
    padding: 18px;
    background: rgba(246, 189, 0, 0.09);
    border: 1px solid rgba(246, 189, 0, 0.25);
    border-radius: 12px;
    text-align: left;
}

.status-pagamento > span {
    font-size: 25px;
}

.status-pagamento strong {
    display: block;
    margin-bottom: 6px;
    color: #f6bd00;
}

.status-pagamento p {
    margin: 0;
    color: #cfcfcf;
    line-height: 1.5;
}

@media (max-width: 600px) {
    .pagamento-pix {
        padding: 28px 18px;
    }

    .pagamento-pix h3 {
        font-size: 27px;
    }

    .codigo-pix {
        flex-direction: column;
        align-items: stretch;
    }

    .codigo-pix span {
        width: 100%;
    }

    .codigo-pix button {
        width: 100%;
    }
}
/* ========================================
   DISPONIBILIDADE DAS INSCRIÇÕES
======================================== */

[hidden] {
    display: none !important;
}

.vagas-disponiveis {
    transition:
        background-color 0.3s ease,
        border-color 0.3s ease;
}

.vagas-disponiveis.vagas-encerradas {
    background: rgba(220, 53, 69, 0.12);
    border-color: rgba(220, 53, 69, 0.45);
}

.vagas-disponiveis.vagas-encerradas strong {
    color: #ff6b78;
}

.botao.botao-desativado {
    background: #555555;
    color: #dddddd;
    cursor: not-allowed;
    pointer-events: none;
    transform: none;
}

.aviso-inscricoes-encerradas {
    max-width: 700px;
    margin: 35px auto 0;
    padding: 25px;
    background: rgba(220, 53, 69, 0.10);
    border: 1px solid rgba(220, 53, 69, 0.42);
    border-radius: 14px;
    text-align: center;
}

.aviso-inscricoes-encerradas strong {
    display: block;
    margin-bottom: 8px;
    color: #ff6b78;
    font-size: 1.25rem;
}

.aviso-inscricoes-encerradas p {
    margin: 0;
    color: #d5d5d5;
    line-height: 1.6;
}

.formulario-inscricao button:disabled {
    background: #666666;
    color: #dddddd;
    cursor: not-allowed;
    transform: none;
    opacity: 0.8;
}

/* ========================================
   CONFIRMAÇÃO DA INSCRIÇÃO
======================================== */

.confirmacao-inscricao {
    width: 100%;
    color: #ffffff;
    text-align: center;
}

.confirmacao-inscricao * {
    color: inherit;
}

.confirmacao-icone {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 70px;
    height: 70px;
    margin: 0 auto 18px;

    border-radius: 50%;

    background: #22a85a;
    color: #ffffff !important;

    font-size: 38px;
    font-weight: 800;
}

.confirmacao-inscricao .pagamento-etapa {
    display: block;

    margin-bottom: 10px;

    color: #f6bd00 !important;

    font-size: 13px;
    font-weight: 800;
    letter-spacing: 2px;
    text-transform: uppercase;
}

.confirmacao-inscricao h2 {
    margin-bottom: 12px;

    color: #ffffff !important;

    font-size: clamp(2rem, 5vw, 3rem);
    text-transform: uppercase;
}

.confirmacao-nome {
    max-width: 620px;
    margin: 0 auto 25px;

    color: #d9d9d9 !important;

    font-size: 16px;
    line-height: 1.6;
}

.numero-confirmado {
    max-width: 350px;
    margin: 25px auto;
    padding: 22px;

    border: 1px solid rgba(246, 189, 0, 0.45);
    border-radius: 14px;

    background: rgba(246, 189, 0, 0.07);
}

.numero-confirmado span {
    display: block;

    margin-bottom: 8px;

    color: #d9d9d9 !important;

    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
}

.numero-confirmado strong {
    display: block;

    color: #f6bd00 !important;

    font-family: "Bebas Neue", sans-serif;
    font-size: 72px;
    line-height: 1;
}

.confirmacao-informacoes {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;

    margin: 25px 0;
}

.confirmacao-informacoes div {
    padding: 18px 12px;

    border: 1px solid #303030;
    border-radius: 10px;

    background: #101010;
}

.confirmacao-informacoes span {
    display: block;

    margin-bottom: 7px;

    color: #f6bd00 !important;

    font-size: 12px;
    font-weight: 800;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.confirmacao-informacoes strong {
    display: block;

    color: #ffffff !important;

    font-size: 14px;
    line-height: 1.5;
}

.aviso-pontualidade {
    margin: 25px 0;
    padding: 20px;

    border-left: 4px solid #f6bd00;
    border-radius: 8px;

    background: rgba(246, 189, 0, 0.08);

    text-align: left;
}

.aviso-pontualidade strong {
    display: block;

    margin-bottom: 7px;

    color: #f6bd00 !important;
    font-size: 17px;
}

.aviso-pontualidade p {
    color: #eeeeee !important;
    line-height: 1.6;
}

.mensagem-final-confirmacao {
    margin: 22px 0;

    color: #ffffff !important;

    font-size: 18px;
    font-weight: 700;
}

.confirmacao-inscricao .botao {
    margin: 10px auto 0;
}

@media (max-width: 700px) {
    .confirmacao-informacoes {
        grid-template-columns: 1fr;
    }

    .numero-confirmado strong {
        font-size: 60px;
    }

    .aviso-pontualidade {
        text-align: center;
    }
}


.grade-patrocinadores {
    display: grid;
    grid-template-columns: repeat(
        auto-fit,
        minmax(140px, 160px)
    );

    justify-content: center;
    gap: 16px;

    margin: 30px auto;
}

.card-patrocinador {
    height: 90px;
    border: 2px dashed
        rgba(246, 189, 0, 0.5);
    border-radius: 14px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: rgba(255,255,255,0.03);
    transition: .25s;
}

.card-patrocinador:hover {
    transform: translateY(-4px);

    border-color: #f6bd00;

    background: rgba(246,189,0,0.08);
}

.card-patrocinador span {
    color: #f6bd00;
    font-weight: 700;
    text-align: center;
}
.card-patrocinador {
    width: 160px;
    height: 100px;

    border: 2px dashed rgba(246, 189, 0, 0.5);
    border-radius: 14px;

    display: flex;
    justify-content: center;
    align-items: center;

    background: rgba(255,255,255,0.03);
    transition: .25s;

    overflow: hidden;
    padding: 8px;
}

.card-patrocinador img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    display: block;
}
/* ========================================
   REMOVER DEPOIS
======================================== */
.apresentacao-parcerias {
    margin-top: 42px;
}

.aviso-apresentacao {
    max-width: 720px;
    margin: 0 auto 28px;
    padding: 16px 20px;
    border-left: 3px solid #f6bd00;
    border-radius: 8px;
    background: rgba(246, 189, 0, 0.07);
    text-align: left;
}

.aviso-apresentacao strong {
    display: block;
    margin-bottom: 5px;
    color: #f6bd00;
}

.aviso-apresentacao p {
    margin: 0;
    color: #b8b8b8;
    line-height: 1.6;
}

.planos-parceria {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
}

.plano-parceria {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 28px;
    border: 1px solid #303030;
    border-radius: 18px;
    background: #151515;
    text-align: left;
}

.plano-master {
    border-color: rgba(246, 189, 0, 0.75);
    background:
        linear-gradient(
            145deg,
            rgba(246, 189, 0, 0.11),
            transparent 55%
        ),
        #151515;
}

.tipo-parceria {
    color: #f6bd00;
    font-size: 0.78rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.plano-parceria h3 {
    margin: 8px 0 20px;
    color: #fff;
    font-size: 1.45rem;
}

.plano-parceria ul {
    display: grid;
    gap: 12px;
    margin: 0 0 24px;
    padding: 0;
    list-style: none;
}

.plano-parceria li {
    position: relative;
    padding-left: 25px;
    color: #d4d4d4;
    line-height: 1.45;
}

.plano-parceria li::before {
    content: "✓";
    position: absolute;
    left: 0;
    color: #f6bd00;
    font-weight: 900;
}

.limite-parceria {
    margin: auto 0 0;
    padding-top: 18px;
    border-top: 1px solid #303030;
    color: #fff;
    font-weight: 700;
}

.selo-master {
    position: absolute;
    top: 18px;
    right: 18px;
    padding: 6px 10px;
    border-radius: 999px;
    background: #f6bd00;
    color: #080808;
    font-size: 0.7rem;
    font-weight: 900;
    text-transform: uppercase;
}

.aplicacao-marca {
    margin-top: 38px;
    padding: 26px;
    border: 1px solid #2e2e2e;
    border-radius: 20px;
    background: #111;
    text-align: center;
}

.titulo-aplicacao p {
    margin: 0 0 4px;
    color: #f6bd00;
    font-size: 0.75rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.titulo-aplicacao h3 {
    margin: 0 0 22px;
    color: #fff;
    font-size: clamp(1.5rem, 4vw, 2.2rem);
}

.aplicacao-marca img {
    display: block;
    width: 100%;
    max-width: 950px;
    height: auto;
    margin: 0 auto;
    border-radius: 14px;
}

.legenda-aplicacao {
    max-width: 720px;
    margin: 18px auto 0;
    color: #969696;
    font-size: 0.86rem;
    line-height: 1.6;
}

@media (max-width: 760px) {
    .planos-parceria {
        grid-template-columns: 1fr;
    }

    .plano-parceria,
    .aplicacao-marca {
        padding: 22px 18px;
    }
}

/* ========================================
   CORREÇÃO - APRESENTAÇÃO PATROCINADORES APAGAAR TBEM
======================================== */

#patrocinadores .apoio-conteudo {
    max-width: 1100px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}

#patrocinadores .apresentacao-parcerias {
    width: 100%;
    max-width: 1100px;
    margin: 42px auto 0;
}

#patrocinadores .aviso-apresentacao {
    width: 100%;
    max-width: 760px;
    box-sizing: border-box;
}

#patrocinadores .planos-parceria {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
}

#patrocinadores .plano-parceria {
    width: auto;
    min-width: 0;
    box-sizing: border-box;
}

#patrocinadores .aplicacao-marca {
    width: 100%;
    box-sizing: border-box;
}

@media (max-width: 760px) {

    #patrocinadores .planos-parceria {
        grid-template-columns: 1fr;
    }

}

/* ========================================
   AJUSTES FINAIS - PATROCINADORES
======================================== */

/* Textos inferiores dos planos */
#patrocinadores .limite-parceria {
    color: #ffffff;
}

/* Legenda abaixo da imagem */
#patrocinadores .legenda-aplicacao {
    color: #a9a9a9;
}

/* Centraliza o botão Quero ser um apoiador */
#patrocinadores .apresentacao-parcerias + .botao {
    display: block;
    width: fit-content;
    margin: 28px auto 0;
}

/* Garante centralização também no celular */
@media (max-width: 760px) {
    #patrocinadores .apresentacao-parcerias + .botao {
        margin: 24px auto 0;
    }
}

.botao-regulamento-mobile {
    padding: 8px 13px;
    font-size: 0.85rem;
}

.card-patrocinador {
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.card-patrocinador a {
    width: 100%;
    height: 100%;

    display: flex;
    align-items: center;
    justify-content: center;
}

.card-patrocinador img {
    display: block;
    object-fit: contain;
}

.card-patrocinador {
    height: 150px;
    aspect-ratio: 4 / 3;

    display: flex;
    align-items: center;
    justify-content: center;

    overflow: hidden;
}
.card-patrocinador img {
    width: 96%;
    height: 96%;
    object-fit: contain;
    display: block;
}

/* =========================
   MENU PRINCIPAL
========================= */

.menu {
    position: relative;

    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* Logo */
.logo img {
    display: block;
    max-height: 50px;
    width: auto;
}

/* Botão do regulamento */
.menu > .botao {
    white-space: nowrap;
}

/* Botão mobile */
.menu-mobile {
    display: none;

    border: none;
    background: transparent;

    font-size: 28px;
    line-height: 1;

    cursor: pointer;
}

/* Menu normal */
.menu nav {
    display: flex;
    align-items: center;
    gap: 25px;
}


/* =========================
   CELULAR
========================= */

@media (max-width: 768px) {

    .menu {
        width: 100%;
    }

    .logo img {
        max-height: 42px;
    }

    .menu-mobile {
        display: block;

        position: relative;
        z-index: 1001;
    }

    .menu nav {
        display: none;
    }

    .menu > .botao {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);

        font-size: 13px;
    }

}
.menu-mobile-aberto {
    display: none;
}

@media (max-width: 768px) {

    .menu-mobile-aberto.ativo {
        position: absolute;
        top: 100%;
        right: 15px;

        display: flex;
        flex-direction: column;

        min-width: 180px;

        padding: 10px 0;

        background: white;

        border-radius: 10px;

        box-shadow: 0 5px 20px rgba(0, 0, 0, 0.15);

        z-index: 1000;
    }

    .menu-mobile-aberto a {
        padding: 12px 20px;

        color: #111;
        text-decoration: none;

        font-weight: 700;
    }

    .menu-mobile-aberto a:hover {
        background: #f6bd00;
    }

}


.foto-premiacao {
    width: min(90%, 900px);
    height: 280px;

    margin: 35px auto 0;

    display: flex;
    align-items: flex-end;
    justify-content: center;

    padding: 25px;

    background:
        linear-gradient(
            rgba(0, 0, 0, 0.60),
            rgba(0, 0, 0, 0.75)
        ),
        url("../imagens/podio-2025.jpeg");

    background-size: cover;
    background-position: center 28%;

    border-radius: 18px;
    overflow: hidden;
}

.foto-premiacao span {
    color: white;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 1px;
}
.foto-premiacao-feminino {
    background-image:
        linear-gradient(
            rgba(0, 0, 0, 0.60),
            rgba(0, 0, 0, 0.75)
        ),
        url("../imagens/podio-2025f.jpeg");

    background-position: center 28%;
}
@media (max-width: 768px) {
    .foto-premiacao {
        width: 100%;
        height: 170px;

        margin-top: 25px;

        border-radius: 12px;
    }
}


/* ========================================
   FOCO DE TECLADO (acessibilidade)
======================================== */

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible {
    outline: 2px solid #f6bd00;
    outline-offset: 3px;
}


/* ========================================
   HEADER V2 - GLASS
======================================== */

.topo {
    transition:
        background-color 0.35s ease,
        backdrop-filter 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease;
}

.topo.topo-scroll {
    background-color: rgba(0, 0, 0, 0.72) !important;

    backdrop-filter: blur(18px) saturate(140%);
    -webkit-backdrop-filter: blur(18px) saturate(140%);

    border-bottom: 1px solid rgba(255, 255, 255, 0.10);

    box-shadow:
        0 10px 35px rgba(0, 0, 0, 0.35);
}

/* ========================================
   HISTÓRIA V2
======================================== */

.historia {
    position: relative;
    overflow: hidden;
}

.historia::before {
    content: "CAMINHE CORRA VIVA";


    position: absolute;
    right: -20px;
    top: 50%;

    transform: translateY(-50%);

    font-family: 'Bebas Neue', sans-serif;
    font-size: clamp(140px, 22vw, 320px);
    line-height: 1;

    color: rgba(246, 189, 0, 0.045);

    letter-spacing: 4px;

    pointer-events: none;
    user-select: none;
}

.historia-conteudo {
    position: relative;
    z-index: 2;
}   

/* ========================================
   PREMIAÇÃO V2
======================================== */

.foto-premiacao {
    position: relative;
    overflow: hidden;

    transition:
        transform 0.45s ease,
        box-shadow 0.45s ease;
}

.foto-premiacao:hover {
    transform: translateY(-6px) scale(1.01);

    box-shadow:
        0 20px 45px rgba(0, 0, 0, 0.28);
}

.foto-premiacao span {
    transition:
        transform 0.35s ease,
        color 0.35s ease;
}

.foto-premiacao:hover span {
    transform: translateX(8px);
    color: #f6bd00;
}


/* brilho discreto passando */

.foto-premiacao::after {
    content: "";

    position: absolute;
    top: 0;
    left: -120%;

    width: 60%;
    height: 100%;

    background: linear-gradient(
        110deg,
        transparent,
        rgba(255, 255, 255, 0.10),
        transparent
    );

    transform: skewX(-15deg);

    transition: left 0.7s ease;

    pointer-events: none;
}

.foto-premiacao:hover::after {
    left: 150%;
}

.card-patrocinador {
    transition:
        transform 0.25s ease,
        border-color 0.25s ease,
        background 0.25s ease,
        box-shadow 0.25s ease;
}

@media (hover: hover) {

    .card-patrocinador:hover {
        transform: translateY(-6px) scale(1.03) !important;

        border-color: #f6bd00;

        background: rgba(246, 189, 0, 0.08);

        box-shadow:
            0 12px 30px rgba(246, 189, 0, 0.12);
    }

}

/* ========================================
   INSCRIÇÃO V2
======================================== */

.inscricao-box {
    position: relative;
    overflow: hidden;
}

.inscricao-box::before {
    content: "";

    position: absolute;
    inset: 0;

    border: 1px solid transparent;
    border-radius: inherit;

    pointer-events: none;

    transition:
        border-color 0.8s ease,
        box-shadow 0.8s ease;
}

.inscricao-box.inscricao-v2-ativa::before {
    border-color: rgba(246, 189, 0, 0.35);

    box-shadow:
        inset 0 0 35px rgba(246, 189, 0, 0.06);
}

/* ========================================
   FORMULÁRIO V2
======================================== */

.formulario-inscricao .campo {
    position: relative;
    transition:
        transform 0.25s ease,
        opacity 0.25s ease;
}

.formulario-inscricao .campo:focus-within {
    transform: translateY(-3px);
}

.formulario-inscricao input,
.formulario-inscricao select {
    transition:
        border-color 0.25s ease,
        box-shadow 0.25s ease,
        background 0.25s ease;
}

.formulario-inscricao input:focus,
.formulario-inscricao select:focus {
    border-color: #f6bd00 !important;

    box-shadow:
        0 0 0 3px rgba(246, 189, 0, 0.10),
        0 8px 25px rgba(0, 0, 0, 0.08);

    outline: none;
}

#botaoEnviarInscricao {
    position: relative;
    overflow: hidden;

    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease;
}

#botaoEnviarInscricao:active {
    transform: scale(0.97);
}

/* ========================================
   CARDS V2 - INTERAÇÃO
======================================== */

.card {
    position: relative;
    overflow: hidden;
}

/* Reflexo */
.card::after {
    content: "";

    position: absolute;
    inset: 0;

    background: radial-gradient(
        circle at var(--mouse-x, 50%) var(--mouse-y, 50%),
        rgba(246, 189, 0, 0.16),
        transparent 42%
    );

    opacity: 0;
    transition: opacity 0.3s ease;

    pointer-events: none;
}

@media (hover: hover) {

    .card:hover::after {
        opacity: 1;
    }

    .card:hover {
        transform: translateY(-5px);
    }
}


/* Feedback no celular */

@media (hover: none) {

    .card:active {
        transform: scale(0.98);
    }

}

/* ========================================
   RESPONSIVIDADE GERAL (sem hacks do hero)
======================================== */

@media (max-width: 600px) {
    .cards,
    .beneficios {
        grid-template-columns: 1fr;
    }

    .inscricao {
        flex-direction: column;
        align-items: flex-start;
    }
}

@media (max-width: 430px) {
    .menu > .botao {
        font-size: 0.78rem;
        padding: 12px 22px;
        white-space: nowrap;
    }

    .logo img {
        max-height: 34px;
    }

    .menu-mobile {
        font-size: 24px;
    }

    .contagem {
        width: 100%;
        gap: 7px;
        justify-content: space-between;
    }

    .contagem > div {
        flex: 1;
        min-width: 0;
        padding: 10px 4px;
    }

    .contagem strong {
        font-size: 2rem;
    }

    .contagem span {
        font-size: 0.62rem;
        white-space: nowrap;
    }
}

@media (max-width: 370px) {
    .menu > .botao {
        padding: 10px 16px;
        font-size: 0.7rem;
    }

    .contagem {
        gap: 4px;
    }

    .contagem strong {
        font-size: 1.7rem;
    }

    .contagem span {
        font-size: 0.54rem;
    }
}

/* ========================================
   HERO CINEMATOGRÁFICO V2 - CONSOLIDADO
   Uma única fonte de verdade para desktop/mobile
======================================== */

.banner {
    min-height: 100svh;
    height: auto;

    display: flex;
    align-items: center;
    justify-content: center;

    position: relative;
    overflow: hidden;
    isolation: isolate;

    color: #fff;
}

.banner::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;

    background:
        radial-gradient(
            circle at 50% 45%,
            transparent 0%,
            rgba(0, 0, 0, 0.18) 45%,
            rgba(0, 0, 0, 0.75) 100%
        );
}

#hero-three {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    pointer-events: none;
}

#hero-three canvas {
    position: absolute;
    inset: 0;
    width: 100% !important;
    height: 100% !important;
    pointer-events: none !important;
}

.banner-conteudo {
    position: relative;
    z-index: 3;

    width: min(1100px, 92%);
    margin: 0 auto;
    padding: 125px 0 70px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    text-align: center;
}

.banner-conteudo > *:not(#hero-three) {
    position: relative;
    z-index: 2;
}

.banner-conteudo::before {
    content: "LUCAS RUN";

    position: absolute;
    top: 50%;
    left: 50%;
    z-index: -1;

    width: 100vw;

    transform: translate(-50%, -50%);

    font-family: "Bebas Neue", sans-serif;
    font-size: clamp(150px, 22vw, 360px);
    line-height: 0.8;
    letter-spacing: -4px;

    color: transparent;
    -webkit-text-stroke: 1px rgba(255, 255, 255, 0.09);

    white-space: nowrap;
    pointer-events: none;
    user-select: none;
}

.banner .edicao {
    color: #f6bd00;

    font-size: 12px;
    font-weight: 700;
    letter-spacing: 6px;
    text-transform: uppercase;

    padding: 8px 15px;

    border: 1px solid rgba(246, 189, 0, 0.45);
    border-radius: 30px;

    background: rgba(246, 189, 0, 0.06);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}

.banner h1 {
    opacity: 0;

    max-width: none;
    margin: 18px 0 25px;

    font-family: "Bebas Neue", sans-serif;
    font-size: clamp(90px, 12vw, 190px);
    line-height: 0.78;
    letter-spacing: -2px;
    text-transform: uppercase;

    text-shadow: 0 15px 45px rgba(0, 0, 0, 0.45);

    transition: transform 0.15s ease-out;
    transform-style: preserve-3d;
    will-change: transform;
}

.banner .descricao {
    max-width: 520px;
    margin-bottom: 0;

    font-size: clamp(15px, 1.4vw, 19px);
    line-height: 1.6;

    color: rgba(255, 255, 255, 0.72);
}

.hero-informacoes {
    position: relative;
    z-index: 2;

    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;

    gap: 22px;
    margin: 18px auto 0;
    padding: 10px 18px;

    color: #fff;
    font-size: 0.95rem;
    font-weight: 500;

    border: 1px solid rgba(255, 255, 255, 0.08);
    border-radius: 40px;

    background: rgba(0, 0, 0, 0.25);

    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.hero-informacoes span {
    display: flex;
    align-items: center;
    gap: 6px;
}

.hero-v2-destaque {
    position: relative;
    z-index: 2;

    width: min(500px, 90%);
    margin: 28px auto 24px;

    display: flex;
    justify-content: center;
    align-items: center;
    gap: 18px;
}

.hero-v2-linha {
    flex: 1;
    height: 1px;

    background: linear-gradient(
        90deg,
        transparent,
        rgba(246, 189, 0, 0.8)
    );

    transform-origin: center;
}

.hero-v2-linha:last-child {
    background: linear-gradient(
        90deg,
        rgba(246, 189, 0, 0.8),
        transparent
    );
}

.hero-v2-edicao {
    display: flex;
    align-items: center;
    gap: 7px;
    color: #fff;
}

.hero-v2-edicao span {
    font-family: "Montserrat", sans-serif;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 4px;
    opacity: 0.7;
}

.hero-v2-edicao strong {
    color: #f6bd00;
    font-family: "Bebas Neue", sans-serif;
    font-size: 46px;
    line-height: 1;
}

.botao-v2 {
    position: relative;
    z-index: 2;

    min-width: 230px;
    padding: 15px 24px;

    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 18px;

    border-radius: 40px;

    box-shadow: 0 10px 40px rgba(246, 189, 0, 0.13);
}

.botao-seta {
    font-size: 22px;
    transition: transform 0.25s ease;
}

.botao-v2:hover .botao-seta {
    transform: translateX(6px);
}

/* Estado inicial usado pelo Anime.js */
.hero-informacoes span,
.hero-v2-linha,
.hero-v2-edicao span,
.hero-v2-edicao strong,
.botao-v2 {
    opacity: 0;
}

/* ========================================
   PATROCINADORES MINI
   Fora do hero, sem margem negativa/overlap
======================================== */

.patrocinadores-mini {
    position: relative;
    z-index: 10;

    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;

    gap: 10px;
    margin: 0;
    padding: 12px 16px;

    pointer-events: auto;
}

.patrocinadores-mini a {
    position: relative;
    z-index: 11;

    width: 80px;
    height: 100px;

    display: flex;
    align-items: center;
    justify-content: center;

    pointer-events: auto;
}

.patrocinadores-mini img {
    position: relative;
    z-index: 12;

    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;

    display: block;
    object-fit: contain;

    pointer-events: auto;
}

/* ========================================
   HERO - TABLET
======================================== */

@media (max-width: 768px) {
    .banner-conteudo {
        width: 92%;
        padding-top: 120px;
        padding-bottom: 58px;
    }

    .hero-informacoes {
        flex-wrap: nowrap;
        gap: 10px;

        font-size: 0.72rem;
        white-space: nowrap;
    }

    .hero-informacoes span {
        gap: 2px;
    }
}

/* ========================================
   HERO - MOBILE
======================================== */

@media (max-width: 600px) {
    .banner {
        min-height: 100svh;
        height: auto;

        /*
           Mantém o enquadramento que já estava funcionando,
           mas sem usar "top" nos elementos internos.
        */
        background-size: 140% auto;
        background-position: center center;
        background-repeat: no-repeat;
    }

    .banner-conteudo {
        width: 90%;

        /*
           Espaço real no fluxo: se houver zoom ou tela baixa,
           o hero cresce em vez de jogar elementos um por cima do outro.
        */
        padding-top: 125px;
        padding-bottom: 46px;
    }

    .banner-conteudo::before {
        content: "RUN";

        top: 45%;
        width: 120vw;

        transform: translate(-50%, -50%);

        font-size: clamp(150px, 55vw, 240px);
        line-height: 1;
        text-align: center;

        opacity: 0.8;
        white-space: nowrap;
    }

    .banner .edicao {
        font-size: 0.78rem;
        letter-spacing: 4px;
    }

    .banner h1 {
        /*
           Usa também a altura da tela para evitar que zoom/telas baixas
           façam o título invadir o menu.
        */
        font-size: clamp(68px, min(25vw, 15svh), 112px);
        line-height: 0.84;

        margin: 14px 0 18px;

        white-space: nowrap;
    }

    .banner .descricao {
        max-width: 560px;

        margin: 0 0 16px;

        font-size: clamp(0.92rem, 4vw, 1rem);
        line-height: 1.45;
    }

    .hero-informacoes {
        /*
           Subimos pelo fluxo usando margem, não transform/top.
           Assim Edição 02 e botão acompanham e não há sobreposição.
        */
        margin: -40px auto 0;
        padding: 9px 13px;

        gap: 8px;
        flex-wrap: nowrap;

        font-size: clamp(0.64rem, 2.75vw, 0.74rem);

        border-color: rgba(255, 255, 255, 0.035);
        border-radius: 20px;

        background: rgba(236, 233, 9, 0.05);

        backdrop-filter: blur(2px);
        -webkit-backdrop-filter: blur(2px);

        box-shadow: none;
        white-space: nowrap;
    }

    .hero-informacoes span {
        gap: 2px;
        opacity: 0.82;
    }

    .hero-v2-destaque {
        width: min(430px, 88%);
        margin: 18px auto 14px;
    }

    .hero-v2-edicao strong {
        font-size: 50px;
    }

    .botao-v2 {
        min-width: 0;
        width: min(82%, 290px);

        margin: 0 auto;

        padding: 14px 20px;

        /*
           Importante: sem translateY aqui.
           Anime.js controla transform durante a entrada.
        */
    }

    .patrocinadores-mini {
        gap: 6px;
        padding: 10px 8px 14px;
    }

    .patrocinadores-mini a {
        width: clamp(52px, 14vw, 72px);
        height: 74px;
    }
}

/* Telas realmente baixas / zoom alto */
@media (max-width: 768px) and (max-height: 800px) {
    .banner-conteudo {
        padding-top: 118px;
        padding-bottom: 42px;
    }

    .banner h1 {
        font-size: clamp(62px, min(22vw, 13svh), 96px);
    }

    .banner .descricao {
        margin-bottom: 12px;
    }

    .hero-v2-destaque {
        margin-top: 14px;
        margin-bottom: 10px;
    }
}

@media (max-width: 370px) {
    .banner-conteudo {
        width: 94%;
    }

    .banner h1 {
        font-size: clamp(60px, 22vw, 82px);
    }

    .hero-informacoes {
        gap: 4px;
        padding-left: 8px;
        padding-right: 8px;
        font-size: 0.61rem;
    }

    .hero-v2-edicao strong {
        font-size: 38px;
    }
}

/* ========================================
   MINI PATROCINADORES - CORREÇÃO FINAL
======================================== */

.banner .patrocinadores-mini {
    position: absolute;

    left: 50%;
    right: auto;
    bottom: 18px;

    transform: translateX(-50%);

    width: min(720px, 94%);

    margin: 0 !important;

    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;

    align-items: center;
    justify-content: center;

    gap: 14px;

    z-index: 20;

    pointer-events: auto;
}

.banner .patrocinadores-mini a {
    flex: 1 1 0;

    width: auto;
    min-width: 0;
    height: 70px;

    display: flex;
    align-items: center;
    justify-content: center;

    pointer-events: auto;
}

.banner .patrocinadores-mini img {
    display: block;

    width: 100%;
    height: 100%;

    max-width: 100%;
    max-height: 100%;

    object-fit: contain;

    pointer-events: auto;
}


/* MOBILE */

@media (max-width: 600px) {

    .banner .patrocinadores-mini {
        left: 50%;
        right: auto;

        bottom: 12px;

        width: calc(100% - 20px);

        transform: translateX(-50%);

        gap: 3px;
    }

    .banner .patrocinadores-mini a {
        flex: 1 1 0;

        width: 0;
        height: 58px;

        min-width: 0;
    }

    .banner .patrocinadores-mini img {
        width: 100%;
        height: 100%;

        object-fit: contain;
    }


    /* =====================================
       SOBE SOMENTE O BLOCO SUPERIOR
    ===================================== */

    /* 2ª EDIÇÃO */
    .banner .edicao {
        position: relative;
        top: -165px;
        transform: none;
    }

    /* LUCAS RUN */
    .banner h1 {
        position: relative;
        top: -140px;
    }

    /* Uma corrida para celebrar... */
    .banner .descricao {
        position: relative;
        top: -150px;
        transform: none;
    }

    /* Girassol / data / hora */
    .hero-informacoes {
        position: relative;
        top: -205px;
        transform: none;
    }

    /* sobe o bloco principal sem desmontar os espaçamentos internos */
    .banner-conteudo {
        position: relative;
        top: -35px;
    }

    /* Girassol / data / hora sobe um pouco mais */
    .hero-informacoes {
        position: relative;
        top: -20px;
    }

    /* botão fica um pouco mais próximo das logos */
    .botao-v2 {
        margin-bottom: -135px;
    }

    /* mini logos sobem um pouco */
    .banner .patrocinadores-mini {
        bottom: 38px;
    }

    
}

@media (min-width: 769px) {

    .banner h1 {
        font-size: clamp(220px, 80vw, 180px);
        white-space: nowrap;
    }

}

/* ========================================
   INFORMAÇÕES V2 - EDITORIAL ESPORTIVO
======================================== */

#informacoes {
    position: relative;
    overflow: hidden;

    padding-top: 110px;
    padding-bottom: 120px;

    background: #080808;
    color: #fff;
}


/* palavra gigante no fundo */

#informacoes::before {
    content: "RACE";

    position: absolute;
    right: -35px;
    top: 25px;

    font-family: "Bebas Neue", sans-serif;
    font-size: clamp(150px, 22vw, 340px);
    line-height: 1;

    color: transparent;
    -webkit-text-stroke: 1px rgba(246, 189, 0, 0.09);

    pointer-events: none;
}


/* título */

#informacoes .titulo-secao {
    position: relative;
    z-index: 2;

    max-width: 1200px;
    margin: 0 auto 55px;
}

#informacoes .titulo-secao p {
    color: #f6bd00;
    letter-spacing: 5px;
}

#informacoes .titulo-secao h2 {
    color: #fff;

    font-size: clamp(55px, 7vw, 100px);
    line-height: 0.9;

    max-width: 750px;
}


/* ========================================
   REMOVE VISUAL DE "CARD"
======================================== */

#informacoes .cards {
    position: relative;
    z-index: 2;

    max-width: 1200px;
    margin: 0 auto;

    display: grid;
    grid-template-columns: repeat(5, 1fr);

    gap: 0;

    border-top: 1px solid rgba(255,255,255,.15);
    border-bottom: 1px solid rgba(255,255,255,.15);
}


#informacoes .card {
    min-height: 230px;

    padding: 35px 22px;

    border: 0;
    border-radius: 0;

    background: transparent;

    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-start;

    text-align: left;

    border-right: 1px solid rgba(255,255,255,.15);

    box-shadow: none;
}


#informacoes .card:last-child {
    border-right: 0;
}


/* remove o efeito de caixinha */

#informacoes .card:hover {
    background: rgba(246,189,0,.04);
}


/* ÍCONE */

#informacoes .icone-card {
    position: absolute;

    top: 25px;
    left: 22px;

    font-size: 22px;

    opacity: .55;
}


/* TÍTULO PEQUENO */

#informacoes .card h3 {
    margin: 0 0 8px;

    font-family: "Montserrat", sans-serif;

    font-size: 11px;
    font-weight: 700;

    letter-spacing: 3px;

    text-transform: uppercase;

    color: rgba(255,255,255,.5);
}


/* INFORMAÇÃO PRINCIPAL */

#informacoes .card p {
    margin: 0;

    font-family: "Bebas Neue", sans-serif;

    font-size: clamp(28px, 3vw, 48px);
    line-height: .95;

    color: #fff;
}


/* palavra / detalhe amarelo */

#informacoes .card:nth-child(4) p {
    color: #f6bd00;

    font-size: clamp(48px, 5vw, 76px);
}


/* ========================================
   MOBILE
======================================== */

@media (max-width: 600px) {

    #informacoes {
        padding:
            75px
            20px
            85px;
    }

    #informacoes::before {
        content: "RACE";

        top: 15px;
        right: -20px;

        font-size: 42vw;
    }


    #informacoes .titulo-secao {
        margin-bottom: 40px;
    }

    #informacoes .titulo-secao h2 {
        font-size: 52px;
    }


    #informacoes .cards {
        grid-template-columns: 1fr;

        border-bottom: 0;
    }


    #informacoes .card {
        position: relative;

        min-height: 120px;

        padding:
            25px
            5px
            22px
            55px;

        border-right: 0;

        border-bottom:
            1px solid rgba(255,255,255,.13);
    }


    #informacoes .icone-card {
        top: 28px;
        left: 5px;

        font-size: 20px;
    }


    #informacoes .card h3 {
        font-size: 10px;
    }


    #informacoes .card p {
        font-size: 34px;
    }


    #informacoes .card:nth-child(4) p {
        font-size: 55px;
    }

}

/* ==========================================================
   LUCAS RUN V2 — SISTEMA EDITORIAL
   Kit + Premiação + Inscrição + Patrocinadores
========================================================== */


/* ==========================================================
   PADRÃO DOS TÍTULOS
========================================================== */

#kit,
#premiacao,
#inscricao,
#patrocinadores {
    position: relative;
    overflow: hidden;
}

#kit .titulo-secao,
#premiacao .titulo-secao,
#inscricao .titulo-secao,
#patrocinadores .titulo-secao {
    position: relative;
    z-index: 2;
}

#kit .titulo-secao p,
#premiacao .titulo-secao p,
#inscricao .titulo-secao p,
#patrocinadores .titulo-secao p {
    color: #f6bd00;
    text-transform: uppercase;
    letter-spacing: 5px;
    font-size: 11px;
    font-weight: 700;
}

#kit .titulo-secao h2,
#premiacao .titulo-secao h2,
#inscricao .titulo-secao h2,
#patrocinadores .titulo-secao h2 {
    font-family: "Bebas Neue", sans-serif;
    font-size: clamp(55px, 7vw, 100px);
    line-height: .9;
    letter-spacing: -1px;
}


/* ==========================================================
   01 — KIT
========================================================== */

#kit {
    padding-top: 110px;
    padding-bottom: 120px;
}

#kit::before {
    content: "KIT";

    position: absolute;
    right: -25px;
    top: 20px;

    font-family: "Bebas Neue", sans-serif;
    font-size: clamp(180px, 25vw, 380px);
    line-height: .8;

    color: transparent;
    -webkit-text-stroke: 1px rgba(246, 189, 0, .08);

    pointer-events: none;
}

#kit .cards {
    position: relative;
    z-index: 2;

    max-width: 1200px;
    margin: 55px auto 0;

    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;

    border-top: 1px solid rgba(0,0,0,.15);
    border-bottom: 1px solid rgba(0,0,0,.15);
}

#kit .card {
    position: relative;

    min-height: 260px;
    padding: 35px 28px;

    border: 0;
    border-radius: 0;
    border-right: 1px solid rgba(0,0,0,.15);

    background: transparent;
    box-shadow: none;

    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-start;

    text-align: left;
}

#kit .card:last-child {
    border-right: 0;
}

#kit .icone-card {
    position: absolute;
    top: 30px;
    left: 28px;

    font-size: 28px;
    opacity: .65;
}

#kit .card h3 {
    font-family: "Bebas Neue", sans-serif;
    font-size: clamp(30px, 3vw, 46px);
    line-height: 1;
    margin-bottom: 8px;
}

#kit .card p {
    max-width: 280px;
    line-height: 1.6;
    opacity: .7;
}


/* ==========================================================
   02 — PREMIAÇÃO
========================================================== */

#premiacao {
    padding-top: 120px;
    padding-bottom: 130px;

    background: #080808;
    color: #fff;
}

#premiacao::before {
    content: "TOP 5";

    position: absolute;
    left: -20px;
    bottom: -50px;

    font-family: "Bebas Neue", sans-serif;
    font-size: clamp(180px, 28vw, 430px);
    line-height: .8;

    color: rgba(246, 189, 0, .035);

    pointer-events: none;
}

#premiacao .titulo-secao h2 {
    color: #fff;
}

#premiacao .premiacao-fotos {
    position: relative;
    z-index: 2;

    max-width: 1200px;
    margin: 60px auto 0;

    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}


/* transforma cada foto em pôster */

#premiacao .foto-premiacao {
    min-height: 520px;

    border: 0;
    border-radius: 0;

    position: relative;
    overflow: hidden;

    background: #111;
}

#premiacao .foto-premiacao img {
    width: 100%;
    height: 100%;

    position: absolute;
    inset: 0;

    object-fit: cover;

    transition: transform .7s cubic-bezier(.2,.8,.2,1);
}

#premiacao .foto-premiacao::before {
    content: "";

    position: absolute;
    inset: 0;

    z-index: 1;

    background:
        linear-gradient(
            to top,
            rgba(0,0,0,.90),
            rgba(0,0,0,.05) 65%
        );

    pointer-events: none;
}

#premiacao .foto-premiacao span {
    position: absolute;
    left: 28px;
    bottom: 25px;

    z-index: 3;

    font-family: "Bebas Neue", sans-serif;
    font-size: clamp(35px, 4vw, 60px);
    line-height: 1;

    color: #fff;
}

@media (hover:hover) {

    #premiacao .foto-premiacao:hover img {
        transform: scale(1.045);
    }

    #premiacao .foto-premiacao:hover span {
        color: #f6bd00;
    }
}


/* ==========================================================
   03 — INSCRIÇÃO
========================================================== */

#inscricao {
    padding-top: 120px;
    padding-bottom: 130px;
}

#inscricao::before {
    content: "25";

    position: absolute;
    right: -30px;
    top: 30px;

    font-family: "Bebas Neue", sans-serif;
    font-size: clamp(250px, 38vw, 600px);
    line-height: .8;

    color: transparent;
    -webkit-text-stroke: 1px rgba(246, 189, 0, .10);

    pointer-events: none;
}


/* caixa principal deixa de parecer card */

#inscricao .inscricao-box {
    position: relative;
    z-index: 2;

    max-width: 1100px;
    margin: 60px auto 0;

    border: 0;
    border-radius: 0;
    box-shadow: none;

    border-top: 1px solid rgba(0,0,0,.16);
    border-bottom: 1px solid rgba(0,0,0,.16);

    background: transparent;

    padding: 55px 0;
}


/* preço vira protagonista */

#inscricao .inscricao-valor {
    font-family: "Bebas Neue", sans-serif;

    font-size: clamp(100px, 15vw, 220px);
    line-height: .75;

    letter-spacing: -3px;

    color: #f6bd00;
}


/* ==========================================================
   FORMULÁRIO
========================================================== */

#formulario {
    position: relative;
}

#formulario .formulario-inscricao {
    border-radius: 0;
    box-shadow: none;

    border-top: 1px solid rgba(0,0,0,.15);

    background: transparent;
}

#formulario .campo {
    margin-bottom: 25px;
}

#formulario input,
#formulario select {
    border: 0;
    border-radius: 0;

    border-bottom: 1px solid rgba(0,0,0,.25);

    background: transparent;

    padding-left: 0;
    padding-right: 0;
}

#formulario input:focus,
#formulario select:focus {
    border-bottom-color: #f6bd00 !important;

    box-shadow: none !important;
}


/* botão continua chamativo */

#botaoEnviarInscricao {
    border-radius: 0;

    min-height: 58px;

    font-family: "Montserrat", sans-serif;
    font-weight: 800;

    text-transform: uppercase;
    letter-spacing: 1px;
}


/* ==========================================================
   04 — PATROCINADORES
========================================================== */

#patrocinadores {
    padding-top: 120px;
    padding-bottom: 130px;

    background: #080808;
    color: #fff;
}

#patrocinadores::before {
    content: "APOIO";

    position: absolute;
    right: -25px;
    top: 20px;

    font-family: "Bebas Neue", sans-serif;
    font-size: clamp(180px, 27vw, 420px);
    line-height: .8;

    color: transparent;
    -webkit-text-stroke: 1px rgba(246,189,0,.08);

    pointer-events: none;
}

#patrocinadores .titulo-secao h2 {
    color: #fff;
}


/* grade */

#patrocinadores .grade-patrocinadores {
    position: relative;
    z-index: 2;

    max-width: 1100px;

    margin:
        55px
        auto
        0;

    display: grid;

    grid-template-columns:
        repeat(4, 1fr);

    gap: 0;

    border-top:
        1px solid rgba(255,255,255,.14);

    border-left:
        1px solid rgba(255,255,255,.14);
}


/* patrocinador deixa de ser card arredondado */

#patrocinadores .card-patrocinador {
    width: 100%;
    height: 170px;

    padding: 25px;

    border: 0;
    border-radius: 0;

    border-right:
        1px solid rgba(255,255,255,.14);

    border-bottom:
        1px solid rgba(255,255,255,.14);

    background: transparent;

    display: flex;
    align-items: center;
    justify-content: center;

    overflow: hidden;

    transition:
        background .3s ease,
        transform .3s ease;
}

#patrocinadores .card-patrocinador img {
    width: 100%;
    height: 100%;

    max-width: 150px;
    max-height: 100px;

    object-fit: contain;

    transition:
        transform .35s ease,
        filter .35s ease;
}

@media (hover:hover) {

    #patrocinadores .card-patrocinador:hover {
        transform: none !important;

        background:
            rgba(246,189,0,.06);
    }

    #patrocinadores .card-patrocinador:hover img {
        transform: scale(1.08);
    }
}


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 600px) {

    #kit,
    #premiacao,
    #inscricao,
    #patrocinadores {
        padding:
            80px
            20px
            90px;
    }


    /* títulos */

    #kit .titulo-secao h2,
    #premiacao .titulo-secao h2,
    #inscricao .titulo-secao h2,
    #patrocinadores .titulo-secao h2 {
        font-size: 52px;
    }


    /* ================= KIT ================= */

    #kit .cards {
        grid-template-columns: 1fr;

        margin-top: 40px;

        border-bottom: 0;
    }

    #kit .card {
        min-height: 150px;

        padding:
            30px
            10px
            25px
            60px;

        border-right: 0;

        border-bottom:
            1px solid rgba(0,0,0,.14);
    }

    #kit .icone-card {
        left: 5px;
        top: 30px;
    }

    #kit .card h3 {
        font-size: 34px;
    }


    /* ================= PREMIAÇÃO ================= */

    #premiacao .premiacao-fotos {
        grid-template-columns: 1fr;

        margin-top: 40px;

        gap: 10px;
    }

    #premiacao .foto-premiacao {
        min-height: 390px;
    }

    #premiacao .foto-premiacao span {
        left: 20px;
        bottom: 20px;

        font-size: 42px;
    }


    /* ================= INSCRIÇÃO ================= */

    #inscricao .inscricao-box {
        margin-top: 40px;

        padding:
            40px
            0;
    }

    #inscricao .inscricao-valor {
        font-size: 120px;
    }


    /* ================= PATROCINADORES ================= */

    #patrocinadores .grade-patrocinadores {
        grid-template-columns:
            repeat(2, 1fr);

        margin-top: 40px;
    }

    #patrocinadores .card-patrocinador {
        height: 125px;

        padding: 18px;
    }

    #patrocinadores .card-patrocinador img {
        max-width: 115px;
        max-height: 80px;
    }


    /* fundos gigantes */

    #kit::before,
    #patrocinadores::before {
        font-size: 45vw;
    }

    #premiacao::before {
        font-size: 48vw;
    }

    #inscricao::before {
        font-size: 70vw;
    }
}

/* ==========================================================
   CORREÇÃO DE CORES + HISTÓRIA
========================================================== */


/* ==========================================================
   HISTÓRIA — MESMO ASPECTO EDITORIAL
========================================================== */

.historia {
    position: relative;
    overflow: hidden;

    background: #080808 !important;
    color: #fff;

    padding-top: 110px;
    padding-bottom: 120px;
}


/* texto gigante decorativo */

.historia::before {
    content: "HISTÓRIA";

    position: absolute;
    right: -30px;
    top: 25px;

    font-family: "Bebas Neue", sans-serif;
    font-size: clamp(170px, 24vw, 370px);
    line-height: .8;

    color: transparent;
    -webkit-text-stroke:
        1px rgba(246, 189, 0, .08);

    pointer-events: none;
    user-select: none;
}


/* mantém o conteúdo atual */

.historia-conteudo {
    position: relative;
    z-index: 2;
}


/* subtítulo amarelo */

.historia-subtitulo {
    color: #f6bd00 !important;

    text-transform: uppercase;
    letter-spacing: 5px;

    font-size: 11px;
    font-weight: 700;
}


/* título */

.historia-conteudo h2 {
    color: #fff;

    font-family: "Bebas Neue", sans-serif;

    font-size: clamp(55px, 7vw, 100px);
    line-height: .9;

    letter-spacing: -1px;
}


/* texto */

.historia-conteudo p {
    color: rgba(255,255,255,.68);

    line-height: 1.8;
}


/* ==========================================================
   INFORMAÇÕES — CLARO
========================================================== */

#informacoes {
    background: #f4f4f1 !important;
    color: #111 !important;
}

#informacoes::before {
    -webkit-text-stroke:
        1px rgba(0,0,0,.07);
}

#informacoes .titulo-secao h2 {
    color: #111 !important;
}

#informacoes .cards {
    border-top:
        1px solid rgba(0,0,0,.15);

    border-bottom:
        1px solid rgba(0,0,0,.15);
}

#informacoes .card {
    color: #111;

    border-right:
        1px solid rgba(0,0,0,.15);
}

#informacoes .card:last-child {
    border-right: 0;
}

#informacoes .card h3 {
    color: rgba(0,0,0,.50);
}

#informacoes .card p {
    color: #111;
}

#informacoes .card:nth-child(4) p {
    color: #d6a400;
}

#informacoes .card:hover {
    background:
        rgba(246,189,0,.08);
}


/* ==========================================================
   KIT — PRETO
========================================================== */

#kit {
    background: #080808 !important;
    color: #fff !important;
}

#kit::before {
    -webkit-text-stroke:
        1px rgba(246,189,0,.08);
}

#kit .titulo-secao h2 {
    color: #fff !important;
}

#kit .cards {
    border-top:
        1px solid rgba(255,255,255,.15);

    border-bottom:
        1px solid rgba(255,255,255,.15);
}

#kit .card {
    color: #fff;

    border-right:
        1px solid rgba(255,255,255,.15);
}

#kit .card:last-child {
    border-right: 0;
}

#kit .card h3 {
    color: #fff;
}

#kit .card p {
    color: rgba(255,255,255,.68);
}

#kit .card:hover {
    background:
        rgba(246,189,0,.05);
}


/* ==========================================================
   PREMIAÇÃO — CLARO
========================================================== */

#premiacao {
    background: #f4f4f1 !important;
    color: #111 !important;
}

#premiacao .titulo-secao h2 {
    color: #111 !important;
}

#premiacao::before {
    color: transparent;

    -webkit-text-stroke:
        1px rgba(0,0,0,.06);
}


/* ==========================================================
   PATROCINADORES — CLARO
========================================================== */

#patrocinadores {
    background: #f4f4f1 !important;
    color: #111 !important;
}

#patrocinadores::before {
    color: transparent;

    -webkit-text-stroke:
        1px rgba(0,0,0,.07);
}

#patrocinadores .titulo-secao h2 {
    color: #111 !important;
}

#patrocinadores .grade-patrocinadores {
    border-top:
        1px solid rgba(0,0,0,.14);

    border-left:
        1px solid rgba(0,0,0,.14);
}

#patrocinadores .card-patrocinador {
    border-right:
        1px solid rgba(0,0,0,.14);

    border-bottom:
        1px solid rgba(0,0,0,.14);

    background: transparent;
}

@media (hover:hover) {

    #patrocinadores .card-patrocinador:hover {
        background:
            rgba(246,189,0,.10);
    }

}


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 600px) {

    .historia {
        padding:
            80px
            20px
            90px;
    }

    .historia::before {
        top: 20px;
        right: -15px;

        font-size: 42vw;
    }

    .historia-conteudo h2 {
        font-size: 52px;
    }


    #informacoes .card {
        border-right: 0;

        border-bottom:
            1px solid rgba(0,0,0,.14);
    }


    #kit .card {
        border-right: 0;

        border-bottom:
            1px solid rgba(255,255,255,.14);
    }

}

/* ==========================================================
   V2 DARK — CONTRASTE FINAL
   Informações + Kit + Patrocinadores
========================================================== */


/* ==========================================================
   BASE ESCURA
========================================================== */

#informacoes,
#kit,
#patrocinadores {
    background: #070707 !important;
    color: #fff !important;
}


/* ==========================================================
   TÍTULOS
========================================================== */

#informacoes .titulo-secao h2,
#kit .titulo-secao h2,
#patrocinadores .titulo-secao h2 {
    color: #fff !important;
}

#informacoes .titulo-secao p,
#kit .titulo-secao p,
#patrocinadores .titulo-secao p {
    color: #f6bd00 !important;
}


/* ==========================================================
   INFORMAÇÕES
========================================================== */

#informacoes {
    position: relative;

    background:
        radial-gradient(
            circle at 80% 25%,
            rgba(246,189,0,.055),
            transparent 30%
        ),
        #070707 !important;
}

#informacoes::before {
    color: transparent !important;

    -webkit-text-stroke:
        1px rgba(246,189,0,.10) !important;
}

#informacoes .cards {
    border-top:
        1px solid rgba(255,255,255,.14);

    border-bottom:
        1px solid rgba(255,255,255,.14);
}

#informacoes .card {
    position: relative;

    border-right:
        1px solid rgba(255,255,255,.14);

    background:
        linear-gradient(
            180deg,
            rgba(255,255,255,.015),
            rgba(255,255,255,.035)
        );

    color: #fff;
}

#informacoes .card:last-child {
    border-right: 0;
}

#informacoes .card h3 {
    color:
        rgba(255,255,255,.45) !important;
}

#informacoes .card p {
    color: #fff !important;
}

#informacoes .card:nth-child(4) p {
    color: #f6bd00 !important;
}


/* detalhe amarelo superior */

#informacoes .card::before {
    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 0;
    height: 3px;

    background: #f6bd00;

    transition: width .4s ease;
}

@media (hover:hover) {

    #informacoes .card:hover {
        background:
            rgba(246,189,0,.045);
    }

    #informacoes .card:hover::before {
        width: 100%;
    }
}


/* ==========================================================
   KIT
========================================================== */

#kit {
    position: relative;

    background:
        linear-gradient(
            110deg,
            #050505 0%,
            #090909 55%,
            #0d0c08 100%
        ) !important;
}


/* palavra gigante mais visível */

#kit::before {
    content: "KIT";

    color: transparent !important;

    -webkit-text-stroke:
        1px rgba(246,189,0,.11) !important;
}


/* faixa decorativa no fundo */

#kit::after {
    content: "";

    position: absolute;

    left: -10%;
    bottom: 90px;

    width: 120%;
    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(246,189,0,.30),
            transparent
        );

    pointer-events: none;
}


/* estrutura do kit */

#kit .cards {
    border-top:
        1px solid rgba(255,255,255,.14);

    border-bottom:
        1px solid rgba(255,255,255,.14);
}


/* cada item continua editorial */

#kit .card {
    position: relative;

    border-right:
        1px solid rgba(255,255,255,.14);

    background:
        rgba(255,255,255,.015);

    min-height: 285px;

    transition:
        background .35s ease;
}

#kit .card:last-child {
    border-right: 0;
}


/* alternância muito sutil */

#kit .card:nth-child(even) {
    background:
        rgba(255,255,255,.028);
}


/* ícones ganham pequena base */

#kit .icone-card {
    width: 44px;
    height: 44px;

    display: flex;
    align-items: center;
    justify-content: center;

    border:
        1px solid rgba(246,189,0,.20);

    background:
        rgba(246,189,0,.055);
}


/* títulos */

#kit .card h3 {
    color: #fff !important;
}


/* descrição menos apagada */

#kit .card p {
    color:
        rgba(255,255,255,.62) !important;
}


/* número decorativo de cada área */

#kit .card::before {
    position: absolute;

    right: 20px;
    top: 16px;

    font-family:
        "Bebas Neue",
        sans-serif;

    font-size: 68px;

    color:
        rgba(246,189,0,.035);

    line-height: 1;

    pointer-events: none;
}

#kit .card:nth-child(1)::before { content: "01"; }
#kit .card:nth-child(2)::before { content: "02"; }
#kit .card:nth-child(3)::before { content: "03"; }
#kit .card:nth-child(4)::before { content: "04"; }
#kit .card:nth-child(5)::before { content: "05"; }
#kit .card:nth-child(6)::before { content: "06"; }


@media (hover:hover) {

    #kit .card:hover {
        background:
            rgba(246,189,0,.045);
    }

}


/* ==========================================================
   PATROCINADORES
========================================================== */

#patrocinadores {
    position: relative;

    background:
        radial-gradient(
            circle at 20% 20%,
            rgba(246,189,0,.045),
            transparent 28%
        ),
        #070707 !important;

    min-height: 800px;
}


/* APOIO gigante */

#patrocinadores::before {
    content: "APOIO";

    color: transparent !important;

    -webkit-text-stroke:
        1px rgba(246,189,0,.10) !important;
}


/* linha decorativa horizontal */

#patrocinadores::after {
    content: "";

    position: absolute;

    left: 50%;
    bottom: 80px;

    transform:
        translateX(-50%);

    width: min(1000px, 80%);
    height: 1px;

    background:
        linear-gradient(
            90deg,
            transparent,
            rgba(246,189,0,.35),
            transparent
        );

    pointer-events: none;
}


/* texto introdutório */

#patrocinadores .apoio-conteudo {
    position: relative;
    z-index: 2;
}

#patrocinadores .apoio-conteudo > p {
    color:
        rgba(255,255,255,.62) !important;

    max-width: 850px;

    margin-left: auto;
    margin-right: auto;
}


/* grade ocupa melhor o espaço */

#patrocinadores .grade-patrocinadores {
    max-width: 1150px;

    margin-top: 60px;

    grid-template-columns:
        repeat(4, 1fr);

    border-top:
        1px solid rgba(255,255,255,.14);

    border-left:
        1px solid rgba(255,255,255,.14);
}


/* células */

#patrocinadores .card-patrocinador {
    height: 190px;

    border-right:
        1px solid rgba(255,255,255,.14);

    border-bottom:
        1px solid rgba(255,255,255,.14);

    background:
        rgba(255,255,255,.012);

    position: relative;

    transition:
        background .3s ease;
}


/* alterna suavemente */

#patrocinadores
.card-patrocinador:nth-child(even) {
    background:
        rgba(255,255,255,.025);
}


/* logo */

#patrocinadores .card-patrocinador img {
    max-width: 170px;
    max-height: 110px;

    filter:
        drop-shadow(
            0 5px 15px
            rgba(0,0,0,.35)
        );
}


/* hover */

@media (hover:hover) {

    #patrocinadores .card-patrocinador:hover {
        background:
            rgba(246,189,0,.055) !important;
    }

}


/* sua marca aqui */

#patrocinadores
.card-patrocinador span {
    color: #f6bd00 !important;

    font-family:
        "Montserrat",
        sans-serif;

    font-weight: 800;

    letter-spacing: .5px;
}


/* botão apoiador */

#patrocinadores .botao {
    position: relative;
    z-index: 3;

    margin-top: 28px;
}


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 600px) {

    #informacoes,
    #kit,
    #patrocinadores {
        background: #070707 !important;
    }


    /* informações */

    #informacoes .card {
        border-right: 0;

        border-bottom:
            1px solid rgba(255,255,255,.14);
    }


    /* kit */

    #kit .card {
        border-right: 0;

        border-bottom:
            1px solid rgba(255,255,255,.14);

        min-height: 160px;
    }


    #kit .card::before {
        font-size: 50px;
    }


    /* patrocinadores */

    #patrocinadores {
        min-height: auto;
    }

    #patrocinadores
    .grade-patrocinadores {
        grid-template-columns:
            repeat(2, 1fr);
    }

    #patrocinadores
    .card-patrocinador {
        height: 140px;
    }

}

/* ==========================================================
   LUCAS RUN V2 — DARK FULL WIDTH FINAL
   Corrige:
   - fundo preto em TODA a largura
   - Premiação escura
   - restaura as fotos dos pódios
   - Percurso escuro
   - Inscrição escura
   - Formulário escuro
   - Patrocinadores escuro
   - contraste entre as seções
========================================================== */


/* ==========================================================
   1. FUNDO GERAL DO SITE
========================================================== */

html,
body {
    background: #050505 !important;
    color: #fff;
}


/*
   A .secao antiga tinha max-width: 1200px.
   Agora a própria seção ocupa a tela inteira.
*/

.secao {
    max-width: none !important;
    width: 100% !important;
    margin: 0 !important;
}


/*
   O conteúdo interno continua limitado.
   Assim o fundo cobre 100%, mas o conteúdo
   não fica esticado numa tela gigante.
*/

.secao > .titulo-secao,
.secao > .cards,
.secao > .percurso-conteudo,
.secao > .inscricao-box,
.secao > .apoio-conteudo,
.secao > .grade-patrocinadores {
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}


/* ==========================================================
   2. HISTÓRIA
========================================================== */

.historia {
    background:
        radial-gradient(
            circle at 85% 40%,
            rgba(246,189,0,.045),
            transparent 32%
        ),
        #050505 !important;

    color: #fff !important;
}


/* ==========================================================
   3. INFORMAÇÕES
========================================================== */

#informacoes {
    background:
        radial-gradient(
            circle at 80% 25%,
            rgba(246,189,0,.055),
            transparent 30%
        ),
        #080808 !important;

    color: #fff !important;
}


/* ==========================================================
   4. KIT
========================================================== */

#kit {
    background:
        linear-gradient(
            120deg,
            #050505 0%,
            #090909 55%,
            #0d0b05 100%
        ) !important;

    color: #fff !important;
}


/* deixa o KIT gigante um pouco mais presente */

#kit::before {
    color: transparent !important;

    -webkit-text-stroke:
        1px rgba(246,189,0,.13) !important;
}


/* ==========================================================
   5. PREMIAÇÃO — TUDO ESCURO
========================================================== */

#premiacao {
    position: relative;
    overflow: hidden;

    background:
        radial-gradient(
            circle at 20% 30%,
            rgba(246,189,0,.06),
            transparent 26%
        ),
        #080808 !important;

    color: #fff !important;

    padding-top: 120px;
    padding-bottom: 130px;
}


/* título */

#premiacao .titulo-secao h2 {
    color: #fff !important;
}

#premiacao .titulo-secao p {
    color: #f6bd00 !important;
}


/* TOP 5 gigante */

#premiacao::before {
    content: "TOP 5";

    position: absolute;

    right: -20px;
    top: 30px;

    font-family: "Bebas Neue", sans-serif;

    font-size:
        clamp(190px, 28vw, 430px);

    line-height: .8;

    color: transparent !important;

    -webkit-text-stroke:
        1px rgba(246,189,0,.09);

    pointer-events: none;
}


/* ==========================================================
   RESTAURA AS FOTOS DOS PÓDIOS
========================================================== */

#premiacao .foto-premiacao {
    position: relative;

    width: min(90%, 900px);
    height: 430px;

    margin:
        35px
        auto
        0;

    padding: 30px;

    display: flex;

    align-items: flex-end;
    justify-content: flex-start;

    overflow: hidden;

    border-radius: 0;

    border:
        1px solid rgba(255,255,255,.10);

    box-shadow: none;

    background-size: cover !important;
    background-repeat: no-repeat !important;
}


/* PÓDIO MASCULINO */

#premiacao
.foto-premiacao-masculino {

    background-image:

        linear-gradient(
            to top,
            rgba(0,0,0,.88) 0%,
            rgba(0,0,0,.25) 55%,
            rgba(0,0,0,.10) 100%
        ),

        url("../imagens/podio-2025.jpeg") !important;

    background-position:
        center 28% !important;
}


/* PÓDIO FEMININO */

#premiacao
.foto-premiacao-feminino {

    background-image:

        linear-gradient(
            to top,
            rgba(0,0,0,.88) 0%,
            rgba(0,0,0,.25) 55%,
            rgba(0,0,0,.10) 100%
        ),

        url("../imagens/podio-2025f.jpeg") !important;

    background-position:
        center 28% !important;
}


/* texto sobre as fotos */

#premiacao .foto-premiacao span {
    position: relative;

    z-index: 3;

    color: #fff !important;

    font-family:
        "Bebas Neue",
        sans-serif;

    font-size:
        clamp(30px, 3vw, 48px);

    line-height: 1;

    letter-spacing: 0;
}


/* linha amarela embaixo */

#premiacao
.foto-premiacao::before {

    content: "";

    position: absolute;

    left: 30px;
    bottom: 20px;

    width: 65px;
    height: 3px;

    background: #f6bd00;

    z-index: 3;

    pointer-events: none;
}


/* hover */

@media (hover:hover) {

    #premiacao
    .foto-premiacao:hover {

        transform:
            translateY(-5px);

        border-color:
            rgba(246,189,0,.32);
    }

}


/* cards dos troféus */

#premiacao .cards {

    position: relative;

    z-index: 2;

    margin-top: 55px;

    display: grid;

    grid-template-columns:
        repeat(2, 1fr);

    gap: 0;

    border-top:
        1px solid rgba(255,255,255,.14);

    border-bottom:
        1px solid rgba(255,255,255,.14);
}


#premiacao .card {

    min-height: 220px;

    border: 0;

    border-radius: 0;

    border-right:
        1px solid rgba(255,255,255,.14);

    background:
        rgba(255,255,255,.018);

    color: #fff;

    box-shadow: none;
}


#premiacao .card:last-child {
    border-right: 0;
}


#premiacao .card h3 {
    color: #fff !important;
}


#premiacao .card p {
    color:
        rgba(255,255,255,.62) !important;
}


/* ==========================================================
   6. PERCURSO
========================================================== */

#percurso,
.percurso {

    background:

        linear-gradient(
            120deg,
            #050505 0%,
            #0a0a0a 65%,
            #0c0b07 100%
        ) !important;

    color: #fff !important;

    position: relative;
}


/* título */

#percurso .titulo-secao h2 {
    color: #fff !important;
}

#percurso .titulo-secao p {
    color: #f6bd00 !important;
}


/* caixa do mapa */

#percurso .percurso-imagem {

    background:
        #101010;

    border:
        1px solid rgba(255,255,255,.10);

    padding: 8px;
}


/* imagem continua normal */

#percurso .percurso-imagem img {

    display: block;

    width: 100%;
}


/* textos */

#percurso
.percurso-informacoes h3 {

    color: #fff !important;
}


#percurso
.percurso-informacoes p {

    color:
        rgba(255,255,255,.64) !important;
}


#percurso
.percurso-detalhes {

    border-top:
        1px solid rgba(255,255,255,.12);
}


#percurso
.percurso-detalhes div {

    border-bottom:
        1px solid rgba(255,255,255,.12);
}


#percurso
.percurso-detalhes span {

    color:
        rgba(255,255,255,.45) !important;
}


#percurso
.percurso-detalhes strong {

    color: #fff !important;
}


/* ==========================================================
   7. INSCRIÇÃO
========================================================== */

#inscricao,
.inscricao {

    position: relative;

    background:

        radial-gradient(
            circle at 90% 30%,
            rgba(246,189,0,.05),
            transparent 27%
        ),

        #080808 !important;

    color: #fff !important;
}


#inscricao
.titulo-secao h2 {

    color: #fff !important;
}


#inscricao
.titulo-secao p {

    color: #f6bd00 !important;
}


/* preço */

#inscricao
.inscricao-valor {

    color:
        #f6bd00 !important;
}


#inscricao
.inscricao-texto h3 {

    color: #fff !important;
}


#inscricao
.inscricao-texto p {

    color:
        rgba(255,255,255,.62) !important;
}


/* caixa deixa de sumir no preto */

#inscricao
.inscricao-box {

    border-top:
        1px solid rgba(255,255,255,.14);

    border-bottom:
        1px solid rgba(255,255,255,.14);

    background:
        rgba(255,255,255,.015);
}


/* vagas */

#inscricao
.vagas-disponiveis {

    border:
        1px solid rgba(246,189,0,.22);

    background:
        rgba(246,189,0,.045);
}


/* ==========================================================
   8. FORMULÁRIO
========================================================== */

#formulario {

    width: 100%;

    max-width: none !important;

    background:
        #060606 !important;

    color: #fff !important;
}


/* formulário interno */

#formulario
.formulario-inscricao {

    max-width: 1000px;

    margin-left: auto;
    margin-right: auto;

    background:
        #090909 !important;

    border-top:
        1px solid rgba(255,255,255,.10);

    border-bottom:
        1px solid rgba(255,255,255,.10);
}


/* título */

#formulario h2,
#formulario h3 {

    color: #fff !important;
}


#formulario label {

    color:
        #f6bd00 !important;
}


/* campos */

#formulario input,
#formulario select {

    color:
        #fff !important;

    background:
        transparent !important;

    border-bottom:
        1px solid rgba(255,255,255,.13) !important;
}


#formulario input::placeholder {

    color:
        rgba(255,255,255,.35);
}


#formulario select option {

    background:
        #101010;

    color:
        #fff;
}


/* ==========================================================
   9. PATROCINADORES
========================================================== */

#patrocinadores {

    position: relative;

    width: 100%;

    max-width: none !important;

    min-height: 850px;

    background:

        radial-gradient(
            circle at 20% 20%,
            rgba(246,189,0,.055),
            transparent 27%
        ),

        #080808 !important;

    color: #fff !important;
}


#patrocinadores
.titulo-secao h2 {

    color: #fff !important;
}


#patrocinadores
.titulo-secao p {

    color: #f6bd00 !important;
}


/* APOIO gigante */

#patrocinadores::before {

    content: "APOIO";

    color: transparent !important;

    -webkit-text-stroke:
        1px rgba(246,189,0,.10) !important;
}


/* textos */

#patrocinadores
.apoio-conteudo > p {

    color:
        rgba(255,255,255,.62) !important;
}


/* grade */

#patrocinadores
.grade-patrocinadores {

    max-width: 1150px;

    margin-top: 65px;

    grid-template-columns:
        repeat(4, 1fr);

    border-top:
        1px solid rgba(255,255,255,.13);

    border-left:
        1px solid rgba(255,255,255,.13);
}


/* células */

#patrocinadores
.card-patrocinador {

    height: 190px;

    background:
        rgba(255,255,255,.018);

    border-right:
        1px solid rgba(255,255,255,.13);

    border-bottom:
        1px solid rgba(255,255,255,.13);
}


#patrocinadores
.card-patrocinador:nth-child(even) {

    background:
        rgba(255,255,255,.03);
}


#patrocinadores
.card-patrocinador span {

    color:
        #f6bd00 !important;
}


@media (hover:hover) {

    #patrocinadores
    .card-patrocinador:hover {

        background:
            rgba(246,189,0,.06) !important;
    }

}


/* ==========================================================
   10. RODAPÉ
========================================================== */

footer {

    width: 100%;

    background:
        #030303 !important;

    color: #fff !important;

    border-top:
        1px solid rgba(255,255,255,.08);
}


/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 600px) {

    .secao {
        padding-left: 20px !important;
        padding-right: 20px !important;
    }


    #premiacao
    .foto-premiacao {

        width: 100%;

        height: 270px;

        padding: 20px;
    }


    #premiacao
    .foto-premiacao span {

        font-size: 32px;
    }


    #premiacao .cards {

        grid-template-columns:
            1fr;
    }


    #premiacao .card {

        border-right: 0;

        border-bottom:
            1px solid rgba(255,255,255,.13);
    }


    #patrocinadores {

        min-height: auto;
    }


    #patrocinadores
    .grade-patrocinadores {

        grid-template-columns:
            repeat(2, 1fr);
    }


    #patrocinadores
    .card-patrocinador {

        height: 140px;
    }

}

/* HERO — FUNDO CINZA COMO ANTES */

.banner {
    background-color: #5c5c5c !important;
}

/* PREMIAÇÃO — ENQUADRAMENTO MAIS FECHADO DAS FOTOS */

#premiacao .foto-premiacao {
    background-size: 180% auto !important;
    background-repeat: no-repeat !important;
}

#premiacao .foto-premiacao-masculino {
    background-position: center 30% !important;
}

#premiacao .foto-premiacao-feminino {
    background-position: center 30% !important;
}

/* PREMIAÇÃO — ESCURECER UM POUCO AS FOTOS */

#premiacao .foto-premiacao-masculino,
#premiacao .foto-premiacao-feminino {
    background-blend-mode: multiply;
    background-color: rgba(0, 0, 0, 0.40);
}

/* TESTE — PRETO UM POUCO MAIS CINZENTO */

.historia,
#informacoes,
#kit,
#premiacao,
#percurso,
.percurso,
#inscricao,
.inscricao,
#formulario,
#patrocinadores,
footer {
    background-color: #080808 !important;
    background-image: none !important;
}

@media (max-width: 600px) {
    #premiacao .foto-premiacao {
        background-size: 200% auto !important;
    }

    #premiacao .foto-premiacao-masculino,
    #premiacao .foto-premiacao-feminino {
        background-position: center 20% !important;
    }
}

/* Centraliza botão "Quero ser um apoiador" */
#patrocinadores .botao {
    display: block;
    width: fit-content;
    margin: 70px auto 0 !important;
}