

body {
    overflow-x: hidden;
}

main#landPrincipal div, main#landPrincipal span, main#landPrincipal applet, main#landPrincipal object, main#landPrincipal iframe,
main#landPrincipal h1, main#landPrincipal h2, main#landPrincipal h3, main#landPrincipal h4, main#landPrincipal h5, main#landPrincipal h6, main#landPrincipal p, main#landPrincipal blockquote, main#landPrincipal pre,
main#landPrincipal a, main#landPrincipal abbr, main#landPrincipal acronym, main#landPrincipal address, main#landPrincipal big, main#landPrincipal cite, main#landPrincipal code,
main#landPrincipal del, main#landPrincipal dfn, main#landPrincipal em, main#landPrincipal img, main#landPrincipal ins, main#landPrincipal kbd, main#landPrincipal q, main#landPrincipal s, main#landPrincipal samp,
main#landPrincipal small, main#landPrincipal strike, main#landPrincipal strong, main#landPrincipal sub, main#landPrincipal sup, main#landPrincipal tt, main#landPrincipal var,
main#landPrincipal b, main#landPrincipal u, main#landPrincipal i, main#landPrincipal center,
main#landPrincipal dl, main#landPrincipal dt, main#landPrincipal dd, main#landPrincipal ol, main#landPrincipal ul, main#landPrincipal li,
main#landPrincipal fieldset, main#landPrincipal form, main#landPrincipal label, main#landPrincipal legend,
main#landPrincipal table, main#landPrincipal caption, main#landPrincipal tbody, main#landPrincipal tfoot, main#landPrincipal thead, main#landPrincipal tr, main#landPrincipal th, main#landPrincipal td,
main#landPrincipal article, main#landPrincipal aside, main#landPrincipal canvas, main#landPrincipal details, main#landPrincipal embed, 
main#landPrincipal figure, main#landPrincipal figcaption, main#landPrincipal footer, main#landPrincipal header, main#landPrincipal hgroup, 
main#landPrincipal menu, main#landPrincipal nav, main#landPrincipal output, main#landPrincipal ruby, main#landPrincipal section, main#landPrincipal summary,
main#landPrincipal time, main#landPrincipal mark, main#landPrincipal audio, main#landPrincipal video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;

}
/* HTML5 display-role reset for older browsers */
main#landPrincipal article, main#landPrincipal aside, main#landPrincipal details, main#landPrincipal figcaption, main#landPrincipal figure, 
main#landPrincipal footer, main#landPrincipal header, main#landPrincipal hgroup, main#landPrincipal menu, main#landPrincipal nav, main#landPrincipal section {
	display: block;
}
main#landPrincipal blockquote, main#landPrincipal q {
	quotes: none;
}
main#landPrincipal blockquote:before, main#landPrincipal blockquote:after,
main#landPrincipal q:before, main#landPrincipal q:after {
	content: '';
	content: none;
}
main#landPrincipal table {
	border-collapse: collapse;
	border-spacing: 0;
}

main#landPrincipal a {
 color:inherit;
 text-decoration: none;
}     

/***************** CLASSES E IDS GERAIS ******************/

main#landPrincipal {
	width: 100%;
    position: relative;
    display: block;
    font-size: 16px;
    font-family: "Netshoes Ritmo Text Regular", sans-serif;
}

main#landPrincipal .container{
    width: 1306px;
    margin: auto;
    padding: 0px 20px;
    box-sizing: border-box;
}


main#landPrincipal img {
    display: block;
    max-width: 100%;
}



@media screen and (max-width: 1305px){

    main#landPrincipal .container{
        width: 930px;
        margin:auto;
        box-sizing: border-box;
        padding: 0px 15px;
    }
}

@media screen and (max-width: 930px){

    main#landPrincipal .container{
        width: 100%;
        margin:auto;
	    box-sizing: border-box;
        padding: 0px 15px;
    }
}

@media screen and (max-width: 767px){

    main#landPrincipal .container{
        width: 100%;
        margin:auto;
	    box-sizing: border-box;
        padding: 0px 15px;
    }
}






/*Media Queries resoluções tela cheia a partir de 930 pra cima*/

@media (min-width: 930px) and (max-width: 1000px){
    main#landPrincipal section.container-dois{
        width: 1000px;
        position: relative;
        left: 50%;
        margin-left: -500px;
        float: left;
        clear: both;
    }  
}

@media (min-width: 1001px) and (max-width: 1050px){
    main#landPrincipal section.container-dois{
        width: 1050px;
        position: relative;
        left: 50%;
        margin-left: -525px;
        float: left;
        clear: both;
    }  
}

@media (min-width: 1051px) and (max-width: 1150px){
    main#landPrincipal section.container-dois{
        width: 1100px;
        position: relative;
        left: 50%;
        margin-left: -550px;
        float: left;
        clear: both;
    }  
}

@media (min-width: 1101px) and (max-width: 1150px){
    main#landPrincipal section.container-dois{
        width: 1150px;
        position: relative;
        left: 50%;
        margin-left: -575px;
        float: left;
        clear: both;
    }  
}

@media (min-width: 1151px) and (max-width: 1200px){
    main#landPrincipal section.container-dois{
        width: 1200px;
        position: relative;
        left: 50%;
        margin-left: -600px;
        float: left;
        clear: both;
    }  
}

@media (min-width: 1201px) and (max-width: 1250px){
    main#landPrincipal section.container-dois{
        width: 1250px;
        position: relative;
        left: 50%;
        margin-left: -625px;
        float: left;
        clear: both;
    }  
}

@media (min-width: 1251px) and (max-width: 1300px){
    main#landPrincipal section.container-dois{
        width: 1300px;
        position: relative;
        left: 50%;
        margin-left: -650px;
        float: left;
        clear: both;
    }  
}

/* Responsavel pelo layout pegar tela inteira a partir de 1300px quando o site coloca um breakpoint */
@media (min-width: 1301px){
    main#landPrincipal section.container-dois{
        width: 100vw;
        position: relative;
        left: 50%;
        margin-left: -50vw;
        float: left;
        clear: both;
    }  
}



/* Espaçador do fim do template (antes era style inline no HTML) */
main#landPrincipal .limpa-float {
    width: 100%;
    height: 10px;
    clear: both;
}


/***************** BLACK FRIDAY 2026 NETSHOES ******************/

main#landPrincipal {
    --bf-preto: #000000;
    --bf-branco: #ffffff;
    --bf-lima: #d4ff3d;
    --bf-lima-forte: #d0ff00;
    --bf-agua: #46fad7;
    --bf-roxo: #8200ff;
    --bf-roxo-cadastro: #811bd7;
    --bf-roxo-card: #7a00ec;
    --bf-cinza: #888888;
}

/* Fontes: 8049_Netshoes-Ritmo-Text.css declara cada peso como uma família.
   PSD (Ritmo Display) -> site: XBold/Bold/SemiBold = Bold, Medium = Medium, Regular/Light = Regular */
main#landPrincipal strong,
main#landPrincipal b {
    font-family: "Netshoes Ritmo Text Bold", sans-serif;
}

main#landPrincipal .bf-titulo {
    font-family: "Netshoes Ritmo Text Bold", sans-serif;
    font-size: clamp(1.5rem, 2.1vw, 2.5rem);
    line-height: 1.1;
    text-transform: uppercase;
    text-align: center;
    color: var(--bf-branco);
}

main#landPrincipal .bf-titulo--lima {
    color: var(--bf-lima);
}

main#landPrincipal .bf-btn {
    display: inline-block;
    padding: 12px 32px;
    border-radius: 4px;
    background: var(--bf-lima-forte);
    color: var(--bf-preto);
    font-family: "Netshoes Ritmo Text Bold", sans-serif;
    font-size: 1rem;
    text-transform: lowercase;
}

/* Artes laterais decorativas */
main#landPrincipal .bf-arte {
    position: absolute;
    top: 0;
    height: 100%;
    width: auto;
    max-width: none;
    pointer-events: none;
}

/* Borda interna suavizada para fundir com a cor de fundo da secao */
main#landPrincipal .bf-arte--esq {
    left: 0;
    -webkit-mask-image: linear-gradient(to right, #000 75%, transparent);
    mask-image: linear-gradient(to right, #000 75%, transparent);
}

main#landPrincipal .bf-arte--dir {
    right: 0;
    -webkit-mask-image: linear-gradient(to left, #000 75%, transparent);
    mask-image: linear-gradient(to left, #000 75%, transparent);
}


/* Banner principal */
main#landPrincipal .bf-hero img {
    width: 100%;
    height: auto;
}


/* Introducao */
main#landPrincipal section.bf-intro {
    padding: 34px 0 40px;
    background: var(--bf-preto);
    color: var(--bf-branco);
    text-align: center;
}

main#landPrincipal .bf-intro h1 {
    font-family: "Netshoes Ritmo Text Bold", sans-serif;
    font-size: clamp(1.75rem, 2.6vw, 3.125rem);
    line-height: 1;
    text-transform: uppercase;
    color: var(--bf-lima);
}

main#landPrincipal .bf-intro p {
    margin-top: 26px;
    font-family: "Netshoes Ritmo Text Medium", sans-serif;
    font-size: 1rem;
    line-height: 1.4;
}

main#landPrincipal section.bf-tarja {
    padding: 22px 0;
    background: var(--bf-agua);
    text-align: center;
}

main#landPrincipal .bf-tarja p {
    font-family: "Netshoes Ritmo Text Bold", sans-serif;
    font-size: 1rem;
    color: var(--bf-preto);
}


/* Vitrines: espaço em branco reservado (o time da Netshoes insere a Smarthint depois).
   Altura das áreas de vitrine no PSD: ~500-640px */
main#landPrincipal section.bf-vitrine {
    min-height: 600px;
    padding: 30px 0;
    box-sizing: border-box;
    background: var(--bf-branco);
}

main#landPrincipal .sh-iframe-recommendations {
    width: 100%;
}

main#landPrincipal .hidden-sh-iframe-recommendations {
    visibility: hidden;
}


/* Cadastro */
main#landPrincipal section.bf-cadastro {
    position: relative;
    overflow: hidden;
    padding: 30px 0 34px;
    background: var(--bf-roxo-cadastro);
    text-align: center;
}

main#landPrincipal section.bf-cadastro .container {
    position: relative;
}

main#landPrincipal .bf-cadastro h2 {
    font-family: "Netshoes Ritmo Text Bold", sans-serif;
    font-size: clamp(1.5rem, 2.2vw, 2.5rem);
    line-height: 1.15;
    text-transform: uppercase;
    color: var(--bf-lima-forte);
}

main#landPrincipal .bf-cadastro form {
    max-width: 1150px;
    margin: 36px auto 0;
}

main#landPrincipal .bf-cadastro .form-control {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 40px;
}

main#landPrincipal .bf-cadastro input[type="text"],
main#landPrincipal .bf-cadastro input[type="tel"] {
    width: 100%;
    height: 38px;
    padding: 0 10px;
    box-sizing: border-box;
    border: 1px solid #8c8c8c;
    border-radius: 2px;
    background: var(--bf-branco);
    font-family: "Netshoes Ritmo Text Regular", sans-serif;
    font-size: 0.9375rem;
    color: #333;
    outline: none;
}

main#landPrincipal .bf-cadastro input::placeholder {
    color: var(--bf-cinza);
}

main#landPrincipal .bf-cadastro input:focus {
    border-color: var(--bf-lima-forte);
    box-shadow: 0 0 0 2px var(--bf-lima-forte);
}

main#landPrincipal .bf-cadastro .form-linha {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 30px;
    margin-top: 28px;
}

main#landPrincipal .checkbox-wrapper {
    display: flex;
    align-items: center;
    gap: 12px;
    max-width: 260px;
    text-align: left;
    font-family: "Netshoes Ritmo Text Regular", sans-serif;
    font-size: 0.8125rem;
    line-height: 1.25;
    color: var(--bf-branco);
}

main#landPrincipal .checkbox-wrapper label {
    display: flex;
    cursor: pointer;
}

main#landPrincipal .checkbox {
    position: relative;
    display: inline-block;
}

main#landPrincipal .checkbox input {
    position: absolute;
    width: 0;
    height: 0;
    opacity: 0;
}

main#landPrincipal .checkbox-marker {
    position: relative;
    display: inline-block;
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    box-sizing: border-box;
    border: 1px solid #ccc;
    background: var(--bf-branco);
}

main#landPrincipal .checkbox input:checked + .checkbox-marker::after {
    content: '';
    position: absolute;
    left: 7px;
    top: 3px;
    width: 5px;
    height: 10px;
    border: solid var(--bf-roxo-cadastro);
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

main#landPrincipal .checkbox input:focus-visible + .checkbox-marker {
    outline: 2px solid var(--bf-lima-forte);
    outline-offset: 2px;
}

main#landPrincipal #buttonSubmit {
    width: 200px;
    height: 44px;
    border: 0;
    border-radius: 2px;
    background: var(--bf-lima-forte);
    color: var(--bf-roxo-cadastro);
    font-family: "Netshoes Ritmo Text Bold", sans-serif;
    font-size: 1.0625rem;
    cursor: pointer;
    transition: filter .2s ease;
}

main#landPrincipal #buttonSubmit:hover:not(:disabled) {
    filter: brightness(1.08);
}

main#landPrincipal #buttonSubmit:disabled {
    opacity: .85;
    cursor: not-allowed;
}

main#landPrincipal #formMessage {
    display: block;
    margin-top: 12px;
    font-size: 0.875rem;
}

main#landPrincipal #formMessage.success-message {
    color: var(--bf-lima-forte);
}

main#landPrincipal #formMessage.error-message {
    color: #ffd6d6;
}


/* Categorias e Outras ofertas: fundo separado + carrossel de cards */
main#landPrincipal section.bf-categorias {
    padding: 56px 0 70px;
    background: var(--bf-preto) url(https://static.netshoes.com.br/bnn/l_netshoes/2026-10-29/4160_bg-categorias.jpg) center top / cover no-repeat;
}

main#landPrincipal .bf-carrossel {
    padding: 0 40px;
    box-sizing: border-box;
}

main#landPrincipal .slider-categorias,
main#landPrincipal .slider-outras {
    margin-top: 14px;
}

main#landPrincipal .bf-card {
    display: block;
    text-align: center;
}

main#landPrincipal .bf-card img {
    width: 100%;
    height: auto;
    transition: transform .3s ease;
}

main#landPrincipal .bf-card:hover img {
    transform: translateY(-6px);
}

main#landPrincipal .bf-card h3 {
    margin-top: 10px;
    font-family: "Netshoes Ritmo Text Bold", sans-serif;
    font-size: clamp(1rem, 1.35vw, 1.75rem);
    line-height: 1.1;
    text-transform: uppercase;
    color: var(--bf-agua);
}

main#landPrincipal .slider-outras .bf-card h3 {
    margin-top: 2.3vw;
}

/* Entrada de baixo para cima ao chegar na seção */
main#landPrincipal.js-anima .bf-anima .bf-card {
    opacity: 0;
    transform: translateY(80px);
}

main#landPrincipal.js-anima .bf-anima.is-visivel .bf-card {
    opacity: 1;
    transform: none;
    transition: opacity .7s ease, transform .7s cubic-bezier(.2, .7, .3, 1);
    transition-delay: var(--atraso, 0s);
}

@media (prefers-reduced-motion: reduce) {
    main#landPrincipal.js-anima .bf-anima .bf-card {
        opacity: 1;
        transform: none;
        transition: none;
    }
}


/* Destaques */
main#landPrincipal section.bf-destaques {
    position: relative;
    overflow: hidden;
    padding: 30px 0;
    background: var(--bf-preto);
}

main#landPrincipal section.bf-destaques .container {
    position: relative;
}

main#landPrincipal .bf-destaques__lista {
    display: flex;
    justify-content: center;
    gap: 90px;
    list-style: none;
}

main#landPrincipal .bf-destaques__lista li {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 268px;
    min-height: 191px;
    padding: 14px 16px 18px;
    box-sizing: border-box;
    border: 2px solid var(--bf-lima);
    border-radius: 18px;
    background: var(--bf-preto);
    text-align: center;
    color: var(--bf-branco);
}

main#landPrincipal .bf-destaques__lista img {
    width: 56px;
}

main#landPrincipal .bf-destaques__lista h3 {
    margin-top: 10px;
    font-family: "Netshoes Ritmo Text Bold", sans-serif;
    font-size: 2rem;
    line-height: 0.9;
    text-transform: uppercase;
    color: var(--bf-lima);
}

main#landPrincipal .bf-destaques__lista p {
    margin-top: 8px;
    font-family: "Netshoes Ritmo Text Medium", sans-serif;
    font-size: 0.9375rem;
    line-height: 1.1;
    white-space: nowrap;
}


/* App + Outras ofertas: um fundo único para as duas partes (PSD y 4269-6159, 1920x1890).
   Em cima, a moldura "O maior barato do ano" com o conteúdo em HTML dentro;
   embaixo, o título e o carrossel de Outras ofertas. */
main#landPrincipal section.bf-app-ofertas {
    position: relative;
    background: var(--bf-preto) url(https://static.netshoes.com.br/bnn/l_netshoes/2026-10-29/8736_app-ofertas.jpg) center top / 100% auto no-repeat;
    color: var(--bf-branco);
}

/* Parte de cima: altura da moldura (y 4269-5380 = 1111px) */
main#landPrincipal .bf-app {
    position: relative;
    aspect-ratio: 1920 / 1111;
}

main#landPrincipal .bf-app__arte {
    display: none;
}

/* Parte de baixo: título em y 5430, cards em y 5542 (x 149-1788) */
main#landPrincipal .bf-outras {
    padding: 2.6vw 0 3vw;
}

main#landPrincipal .bf-outras .bf-titulo {
    line-height: 1;
}

main#landPrincipal .bf-outras .slider-outras {
    width: calc(85.4vw + 80px);
    margin: 3.9vw auto 0;
}

main#landPrincipal .bf-app__slogan {
    display: none;
}

/* Desktop: mesmo posicionamento do PSD (x 362 / y 203 dentro da moldura de 1920x1111) */
main#landPrincipal .bf-app__conteudo {
    position: absolute;
    left: 18.85%;
    top: 18.27%;
    width: 26%;
}

main#landPrincipal .bf-app__conteudo h2 {
    font-family: "Netshoes Ritmo Text Bold", sans-serif;
    font-size: clamp(1.75rem, 3.15vw, 3.75rem);
    line-height: .95;
    text-transform: uppercase;
}

main#landPrincipal .bf-app__conteudo p {
    margin-top: 1.4vw;
    font-family: "Netshoes Ritmo Text Medium", sans-serif;
    font-size: clamp(.875rem, 1.15vw, 1.375rem);
    line-height: 1.1;
}

main#landPrincipal .bf-app__conteudo p strong {
    text-transform: uppercase;
}

main#landPrincipal .bf-app__conteudo p em {
    font-style: italic;
}

main#landPrincipal .bf-app__acoes {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2vw;
    margin-top: 2vw;
}

main#landPrincipal .bf-app__qr {
    width: 14.9vw;
    max-width: 286px;
    height: auto;
    padding: .55vw;
    background: var(--bf-branco);
    box-sizing: border-box;
}

main#landPrincipal .bf-app__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 9.6vw;
    height: 2.7vw;
    min-height: 36px;
    padding: 0 1.2em;
    background: var(--bf-lima-forte);
    color: var(--bf-preto);
    font-family: "Netshoes Ritmo Text Bold", sans-serif;
    font-size: clamp(.8125rem, 1vw, 1.25rem);
    box-sizing: border-box;
    transition: filter .2s ease;
}

main#landPrincipal .bf-app__btn:hover {
    filter: brightness(1.08);
}

main#landPrincipal .bf-app__btn-mob {
    display: none;
}

/* Tablet e celular: texto em cima, arte do Rafa embaixo */
@media screen and (max-width: 1023px) {

    main#landPrincipal section.bf-app-ofertas {
        background: var(--bf-preto);
    }

    main#landPrincipal .bf-app {
        display: flex;
        flex-direction: column;
        aspect-ratio: auto;
    }

    main#landPrincipal .bf-app__slogan {
        display: block;
        order: 1;
        width: 100%;
        height: auto;
    }

    main#landPrincipal .bf-app__conteudo {
        position: static;
        order: 2;
        width: auto;
        padding: 40px 24px 8px;
        text-align: center;
    }

    main#landPrincipal .bf-app__conteudo h2 {
        font-size: clamp(1.75rem, 6.5vw, 2.75rem);
    }

    main#landPrincipal .bf-app__conteudo h2 br {
        display: none;
    }

    main#landPrincipal .bf-app__conteudo p {
        max-width: 420px;
        margin: 14px auto 0;
        font-size: 1rem;
        line-height: 1.3;
    }

    main#landPrincipal .bf-app__conteudo p br {
        display: none;
    }

    main#landPrincipal .bf-app__acoes {
        flex-direction: row;
        justify-content: center;
        align-items: center;
        gap: 28px;
        margin-top: 24px;
    }

    main#landPrincipal .bf-app__qr {
        width: 150px;
        padding: 8px;
    }

    main#landPrincipal .bf-app__btn {
        min-width: 180px;
        height: 48px;
        font-size: 1rem;
        text-transform: uppercase;
    }

    main#landPrincipal .bf-app__btn-desk {
        display: none;
    }

    main#landPrincipal .bf-app__btn-mob {
        display: inline;
    }

    /* Continuação da arte do Rafa (mesmo recorte, logo abaixo): um fundo só */
    main#landPrincipal .bf-outras {
        padding: calc(8.3vw + 18px) 0 50px;
        background:
            linear-gradient(to bottom, rgba(0, 0, 0, 0) 55%, var(--bf-preto) 100%) center top / 100% calc(100vw * 703 / 900) no-repeat,
            var(--bf-preto) url(https://static.netshoes.com.br/bnn/l_netshoes/2026-10-29/4170_bg-outras-mob.jpg) center top / 100% auto no-repeat;
    }

    main#landPrincipal .bf-outras .slider-outras {
        width: auto;
        margin-top: 14px;
    }

    main#landPrincipal .bf-app__arte {
        order: 3;
        display: block;
        width: 100%;
        height: auto;
        -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 18%);
        mask-image: linear-gradient(to bottom, transparent 0, #000 18%);
    }
}

/* No celular o QR code não tem uso (já está no aparelho): fica só o botão */
@media screen and (max-width: 767px) {

    main#landPrincipal .bf-app__qr {
        display: none;
    }

    main#landPrincipal .bf-app__btn {
        width: 100%;
        max-width: 320px;
    }
}


/* Arte full */
main#landPrincipal .bf-arte-full img {
    width: 100%;
    height: auto;
}


/* Marcas */
main#landPrincipal section.bf-marcas {
    padding: 95px 0 140px;
    background: var(--bf-preto);
}

main#landPrincipal .bf-marcas__lista {
    display: grid;
    grid-template-columns: repeat(9, 1fr);
    gap: 40px 20px;
    max-width: 1320px;
    margin: 70px auto 0;
    list-style: none;
}

main#landPrincipal .bf-marcas__lista li {
    display: flex;
    align-items: center;
    justify-content: center;
}

main#landPrincipal .bf-marcas__lista a {
    display: block;
    transition: opacity .2s ease, transform .2s ease;
}

main#landPrincipal .bf-marcas__lista a:hover {
    opacity: .75;
    transform: scale(1.05);
}

main#landPrincipal .bf-marcas__lista img {
    max-height: 70px;
    width: auto;
}


/* Beneficios */
main#landPrincipal section.bf-beneficios {
    position: relative;
    overflow: hidden;
    padding: 30px 0 28px;
    background: linear-gradient(to bottom, var(--bf-roxo-card) 0, var(--bf-roxo-card) 110px, var(--bf-lima) 110px);
}

main#landPrincipal section.bf-beneficios .container {
    position: relative;
}

main#landPrincipal .bf-beneficios__lista {
    display: flex;
    justify-content: center;
    gap: 16px;
    margin-top: 50px;
    list-style: none;
}

main#landPrincipal .bf-beneficios__lista li {
    position: relative;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 278px;
    min-height: 321px;
    padding: 12px 18px 54px;
    box-sizing: border-box;
    border: 2px solid var(--bf-branco);
    border-radius: 12px;
    background: var(--bf-roxo-card);
    text-align: center;
    color: var(--bf-branco);
}

main#landPrincipal .bf-beneficios__lista li:after {
    content: '';
    position: absolute;
    bottom: 22px;
    left: 50%;
    width: 0;
    height: 0;
    margin-left: -30px;
    border-left: 30px solid transparent;
    border-right: 30px solid transparent;
    border-bottom: 18px solid rgba(255, 255, 255, .18);
}

/* Ícones no tamanho original, centralizados numa faixa fixa (como no PSD) */
main#landPrincipal .bf-beneficios__lista img {
    flex-shrink: 0;
    width: 100%;
    height: 88px;
    object-fit: scale-down;
    object-position: center;
}

/* Título + texto centralizados entre o ícone e a seta */
main#landPrincipal .bf-beneficios__lista h3 {
    margin-top: auto;
    padding-top: 8px;
    font-family: "Netshoes Ritmo Text Bold", sans-serif;
    font-size: 1.125rem;
    line-height: 27px;
    text-transform: uppercase;
    color: var(--bf-lima);
}

main#landPrincipal .bf-beneficios__lista p {
    margin-top: 10px;
    margin-bottom: auto;
    font-family: "Netshoes Ritmo Text Medium", sans-serif;
    font-size: 0.9375rem;
    line-height: 22px;
    white-space: nowrap;
}


/* Texto SEO */
main#landPrincipal section.box-textos {
    padding: 50px 0;
    background: var(--bf-preto);
    color: var(--bf-branco);
}

main#landPrincipal .box-textos .container > * {
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
}

main#landPrincipal .box-textos h2,
main#landPrincipal .box-textos h3 {
    padding-top: 1.5rem;
    font-size: 1rem;
    text-transform: uppercase;
    text-align: center;
    color: var(--bf-lima);
}

main#landPrincipal .box-textos h2:first-child {
    padding-top: 0;
}

main#landPrincipal .box-textos p,
main#landPrincipal .box-textos li {
    margin-top: 12px;
    font-size: 0.875rem;
    line-height: 1.5;
}

main#landPrincipal .box-textos ul {
    padding-left: 20px;
    list-style: disc;
}

main#landPrincipal .box-textos li {
    margin-top: 6px;
}

main#landPrincipal .box-textos a {
    color: var(--bf-lima);
    text-decoration: underline;
}

main#landPrincipal .box-textos__toggle {
    display: none;
}


/* Dicas do blog */
main#landPrincipal section.netshoes--blog {
    padding: 40px 0 50px;
    background: linear-gradient(180deg, var(--bf-lima) 0, var(--bf-lima) 40%, var(--bf-preto) 40%);
}

main#landPrincipal .netshoes--blog h2 {
    margin-bottom: 24px;
    font-family: "Netshoes Ritmo Text Bold", sans-serif;
    font-size: clamp(1.25rem, 1.6vw, 1.75rem);
    text-transform: uppercase;
    text-align: center;
    color: var(--bf-preto);
}

main#landPrincipal .slider-blog {
    padding: 0 2rem;
    box-sizing: border-box;
}

main#landPrincipal .netshoes--blog img {
    border: 2px solid var(--bf-lima);
    border-radius: 20px;
    box-sizing: border-box;
}

main#landPrincipal .netshoes--blog h3 {
    margin-top: 1rem;
    font-family: "Netshoes Ritmo Text Bold", sans-serif;
    font-size: 1rem;
    text-transform: uppercase;
    text-align: center;
    color: var(--bf-branco);
}

main#landPrincipal .netshoes--blog p {
    margin-top: 10px;
    font-size: 0.875rem;
    line-height: 1.4;
    text-align: center;
    color: var(--bf-branco);
}

main#landPrincipal .owl-theme .owl-nav [class*=owl-] {
    background: transparent;
}

main#landPrincipal .owl-nav > button {
    position: absolute;
    top: 50%;
    margin-top: -55px;
    color: var(--bf-branco);
}

main#landPrincipal .owl-nav > button span {
    font-size: 5rem;
}

main#landPrincipal .owl-nav > button:hover {
    color: #ccc;
}

main#landPrincipal .owl-nav .owl-prev {
    left: 0;
}

main#landPrincipal .owl-nav .owl-next {
    right: 0;
}

main#landPrincipal .owl-dots {
    display: none;
}


/* Perguntas frequentes */
main#landPrincipal section.bf-faq {
    position: relative;
    overflow: hidden;
    padding: 100px 0 110px;
    background: var(--bf-roxo);
}

main#landPrincipal section.bf-faq .container {
    position: relative;
}

/* Arte lateral com tamanho fixo (altura da seção com só a 1ª pergunta aberta),
   para não crescer/mudar quando as perguntas abrem. A base esmaece no roxo. */
main#landPrincipal .bf-faq .bf-arte {
    height: 1100px;
    /* Cada arte ocupa só a lateral livre: vão de 820px no meio para as perguntas (720px) */
    width: max(0px, calc((100% - 820px) / 2));
    object-fit: cover;
}

main#landPrincipal .bf-faq .bf-arte--esq {
    object-position: left top;
}

main#landPrincipal .bf-faq .bf-arte--dir {
    object-position: right top;
}

main#landPrincipal .bf-faq .bf-arte--esq {
    -webkit-mask-image: linear-gradient(to right, #000 75%, transparent), linear-gradient(to bottom, #000 80%, transparent);
    -webkit-mask-composite: source-in;
    mask-image: linear-gradient(to right, #000 75%, transparent), linear-gradient(to bottom, #000 80%, transparent);
    mask-composite: intersect;
}

main#landPrincipal .bf-faq .bf-arte--dir {
    -webkit-mask-image: linear-gradient(to left, #000 75%, transparent), linear-gradient(to bottom, #000 80%, transparent);
    -webkit-mask-composite: source-in;
    mask-image: linear-gradient(to left, #000 75%, transparent), linear-gradient(to bottom, #000 80%, transparent);
    mask-composite: intersect;
}

main#landPrincipal .bf-faq .bf-titulo {
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
}

main#landPrincipal .bf-faq .perguntas-frequentes {
    max-width: 720px;
    margin: 46px auto 0;
}

main#landPrincipal .bf-faq details {
    border-bottom: 2px solid var(--bf-branco);
}

main#landPrincipal .bf-faq summary {
    position: relative;
    display: block;
    padding: 26px 50px 12px 0;
    font-family: "Netshoes Ritmo Text Bold", sans-serif;
    font-size: 1.375rem;
    text-transform: uppercase;
    color: var(--bf-lima);
    list-style: none;
    cursor: pointer;
}

main#landPrincipal .bf-faq summary::-webkit-details-marker {
    display: none;
}

main#landPrincipal .bf-faq summary:after {
    content: '';
    position: absolute;
    right: 12px;
    bottom: 20px;
    width: 14px;
    height: 14px;
    border-right: 2px solid var(--bf-branco);
    border-bottom: 2px solid var(--bf-branco);
    transform: rotate(45deg);
    transition: transform .2s ease;
}

main#landPrincipal .bf-faq details[open] summary:after {
    bottom: 12px;
    transform: rotate(-135deg);
}

main#landPrincipal .bf-faq .content {
    padding: 14px 0 20px;
}

main#landPrincipal .bf-faq .content p {
    font-size: 1rem;
    line-height: 1.4;
    color: var(--bf-branco);
}

main#landPrincipal .bf-faq .content p + p {
    margin-top: 16px;
}



/* Grupo Magazine Luiza */
main#landPrincipal section.logos-parceiras {
    padding: 40px 0;
    background: var(--bf-preto);
}

main#landPrincipal .logos-parceiras h2,
main#landPrincipal .nuvem-palavras h2 {
    margin-bottom: 24px;
    font-family: "Netshoes Ritmo Text Bold", sans-serif;
    font-size: clamp(1.25rem, 1.6vw, 1.75rem);
    text-transform: uppercase;
    text-align: center;
    color: var(--bf-lima);
}

main#landPrincipal .logos-parceiras--flex {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    max-width: 900px;
    margin: 0 auto;
}

main#landPrincipal .logos-parceiras--item {
    max-width: 140px;
    border: 2px solid var(--bf-preto);
    box-sizing: border-box;
}

main#landPrincipal .logos-parceiras--item:hover {
    border-color: var(--bf-lima);
}

/* Logo ocupa a largura do quadro mantendo a proporção original (209x112) */
main#landPrincipal .logos-parceiras--item img {
    display: block;
    width: 100%;
    height: auto;
}


/* Canais de atendimento */
main#landPrincipal section.canais-atendimento {
    padding: 40px 0;
    background: var(--bf-lima);
    color: #363636;
    text-align: center;
}

main#landPrincipal .canais-atendimento h2 {
    margin-bottom: 24px;
    font-family: "Netshoes Ritmo Text Bold", sans-serif;
    font-size: clamp(1.25rem, 1.6vw, 1.75rem);
    text-transform: uppercase;
}

main#landPrincipal .canais-atendimento-flex {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1rem;
}

main#landPrincipal .canais-atendimento-flex__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    max-width: 220px;
}

main#landPrincipal .canais-atendimento-flex__item img {
    width: 70px;
    height: auto;
}

main#landPrincipal .canais-atendimento h3 {
    margin-top: 6px;
    font-family: "Netshoes Ritmo Text Bold", sans-serif;
    font-size: 1rem;
    text-transform: uppercase;
}

main#landPrincipal .canais-atendimento p {
    margin-top: 6px;
    font-size: 0.875rem;
    line-height: 1.4;
}

main#landPrincipal .canais-atendimento .italic {
    font-style: italic;
}


/* Termos mais procurados */
main#landPrincipal section.nuvem-palavras {
    padding: 50px 0 60px;
    background: var(--bf-roxo);
}

main#landPrincipal .nuvem-palavras-flex {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    max-width: 960px;
    margin: 0 auto;
    padding: 2rem;
    border-radius: 20px;
    background: #f1f1f1;
    box-sizing: border-box;
}

main#landPrincipal .nuvem-item {
    padding: 5px 10px;
    border: 1px solid var(--bf-preto);
    border-radius: 10px;
    font-family: "Netshoes Ritmo Text Bold", sans-serif;
    font-size: 0.75rem;
    text-transform: uppercase;
    text-align: center;
    box-sizing: border-box;
}

main#landPrincipal .nuvem-item.verde {
    background: var(--bf-lima);
    color: var(--bf-preto);
}

main#landPrincipal .nuvem-item.roxo {
    background: var(--bf-roxo-card);
    color: var(--bf-branco);
}


@media screen and (max-width: 1305px) {

    main#landPrincipal .bf-arte {
        opacity: .5;
    }

    main#landPrincipal .bf-destaques__lista {
        gap: 30px;
    }

    main#landPrincipal .bf-marcas__lista {
        grid-template-columns: repeat(6, 1fr);
    }

    /* 4 cards de 278px não cabem: grade 2x2, todos do mesmo tamanho */
    main#landPrincipal .bf-beneficios__lista {
        flex-wrap: wrap;
        max-width: 572px;
        margin-left: auto;
        margin-right: auto;
    }
}

@media screen and (max-width: 1100px) {

    main#landPrincipal .bf-arte {
        display: none;
    }

}

@media screen and (max-width: 930px) {

    main#landPrincipal .bf-cadastro .form-control {
        gap: 16px;
    }

    main#landPrincipal .bf-destaques__lista {
        flex-direction: column;
        align-items: center;
        gap: 16px;
    }
}

@media screen and (max-width: 767px) {

    main#landPrincipal section.bf-intro {
        padding: 28px 0 30px;
    }

    main#landPrincipal section.bf-vitrine {
        min-height: 460px;
    }

    main#landPrincipal .bf-intro p {
        margin-top: 16px;
        font-size: 0.875rem;
    }

    main#landPrincipal .bf-intro p br {
        display: none;
    }

    main#landPrincipal .bf-tarja p {
        font-size: 0.875rem;
    }

    main#landPrincipal .bf-cadastro h2 br {
        display: none;
    }

    main#landPrincipal .bf-cadastro form {
        margin-top: 22px;
    }

    main#landPrincipal .bf-cadastro .form-control {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    main#landPrincipal .bf-cadastro input[type="text"],
    main#landPrincipal .bf-cadastro input[type="tel"] {
        height: 44px;
        font-size: 1rem;
    }

    main#landPrincipal .bf-cadastro .form-linha {
        flex-direction: column;
        gap: 20px;
        margin-top: 20px;
    }

    main#landPrincipal .checkbox-wrapper {
        max-width: none;
    }

    main#landPrincipal #buttonSubmit {
        width: 100%;
    }

    main#landPrincipal section.bf-categorias {
        padding: 36px 0 44px;
    }

    main#landPrincipal .bf-outras {
        padding: calc(8.3vw + 14px) 0 40px;
    }

    main#landPrincipal .bf-carrossel {
        padding: 0 36px;
    }

    main#landPrincipal .slider-outras .bf-card h3 {
        margin-top: 14px;
    }

    main#landPrincipal section.bf-marcas {
        padding: 56px 0 64px;
    }

    main#landPrincipal .bf-marcas__lista {
        grid-template-columns: repeat(3, 1fr);
        gap: 30px 16px;
        margin-top: 36px;
    }

    main#landPrincipal .bf-marcas__lista img {
        max-height: 44px;
    }

    main#landPrincipal section.bf-beneficios {
        background: linear-gradient(to bottom, var(--bf-roxo-card) 0, var(--bf-roxo-card) 90px, var(--bf-lima) 90px);
    }

    /* Benefícios viram carrossel (iniciado no scripts.js) */
    main#landPrincipal .bf-beneficios__lista {
        display: block;
        margin-top: 36px;
    }

    main#landPrincipal .bf-beneficios__lista li {
        width: 100%;
        max-width: 300px;
        margin: 0 auto;
    }


    main#landPrincipal section.bf-faq {
        padding: 56px 0 64px;
    }

    main#landPrincipal .bf-faq .bf-titulo br {
        display: none;
    }

    main#landPrincipal .bf-faq summary {
        padding-top: 20px;
        font-size: 1rem;
    }

    main#landPrincipal .bf-faq summary:after {
        right: 4px;
        width: 10px;
        height: 10px;
    }

    /* Banner */
    main#landPrincipal .bf-hero img {
        width: 100%;
        height: auto;
    }

    /* Aceite: o texto também marca o checkbox */
    main#landPrincipal .checkbox-title {
        cursor: pointer;
    }

    main#landPrincipal .checkbox-wrapper {
        min-height: 44px;
    }

    /* Destaques mais compactos: ícone ao lado do texto */
    main#landPrincipal .bf-destaques__lista li {
        display: grid;
        grid-template-columns: 48px 1fr;
        column-gap: 14px;
        align-items: center;
        width: 100%;
        max-width: 420px;
        min-height: 0;
        padding: 14px 18px;
        text-align: left;
    }

    main#landPrincipal .bf-destaques__lista img {
        grid-row: span 2;
        width: 48px;
    }

    main#landPrincipal .bf-destaques__lista h3 {
        margin-top: 0;
        font-size: 1.25rem;
    }

    main#landPrincipal .bf-destaques__lista p {
        margin-top: 4px;
    }

    /* Texto SEO recolhido com "Ler mais" */
    main#landPrincipal section.box-textos {
        padding: 36px 0 40px;
    }

    main#landPrincipal .box-textos__conteudo {
        position: relative;
        max-height: 420px;
        overflow: hidden;
    }

    main#landPrincipal .box-textos__conteudo:after {
        content: '';
        position: absolute;
        left: 0;
        right: 0;
        bottom: 0;
        height: 120px;
        background: linear-gradient(to bottom, rgba(0, 0, 0, 0), var(--bf-preto));
        pointer-events: none;
    }

    main#landPrincipal .box-textos.is-aberto .box-textos__conteudo {
        max-height: none;
    }

    main#landPrincipal .box-textos.is-aberto .box-textos__conteudo:after {
        display: none;
    }

    main#landPrincipal .box-textos__toggle {
        display: block;
        min-width: 160px;
        height: 44px;
        margin: 20px auto 0;
        padding: 0 24px;
        border: 2px solid var(--bf-lima);
        border-radius: 4px;
        background: transparent;
        color: var(--bf-lima);
        font-family: "Netshoes Ritmo Text Bold", sans-serif;
        font-size: 1rem;
        text-transform: uppercase;
        cursor: pointer;
    }

    main#landPrincipal .box-textos a {
        padding: 2px 0;
    }

    /* Setas do carrossel com área de toque maior */
    main#landPrincipal .slider-blog {
        padding: 0 36px;
    }

    main#landPrincipal .owl-nav > button {
        width: 36px;
        height: 64px;
        margin-top: -70px;
    }

    main#landPrincipal .owl-nav > button span {
        display: block;
        line-height: 0.8;
    }

    main#landPrincipal .owl-nav > button span {
        font-size: 3rem;
    }

    main#landPrincipal .logos-parceiras--item {
        width: calc(33.333% - 7px);
        max-width: none;
    }


    main#landPrincipal .canais-atendimento-flex__item {
        flex: 0 0 calc(50% - 0.5rem);
    }

    main#landPrincipal .nuvem-palavras-flex {
        gap: 6px 4px;
        max-height: 420px;
        overflow-y: auto;
        padding: 0.8rem;
    }

    main#landPrincipal .nuvem-item {
        display: inline-flex;
        align-items: center;
        min-height: 32px;
        padding: 4px 10px;
        font-size: 0.6875rem;
    }
}


/* Celulares pequenos: fonte um pouco menor para manter as quebras do PSD */
@media screen and (max-width: 400px) {

    main#landPrincipal .bf-destaques__lista li {
        padding-left: 14px;
        padding-right: 14px;
    }

    main#landPrincipal .bf-destaques__lista p {
        font-size: 0.8125rem;
    }

    main#landPrincipal .bf-beneficios__lista.bf-carrossel {
        padding: 0 28px;
    }

    main#landPrincipal .bf-beneficios__lista li {
        padding-left: 10px;
        padding-right: 10px;
    }

    main#landPrincipal .bf-beneficios__lista p {
        font-size: 0.8125rem;
    }
}
