body {
            background-color: #121212;
            color: #ffffff;
            font-family: 'Montserrat', sans-serif;
            -webkit-font-smoothing: antialiased;
        }

        /* Container centralizado para simular mobile no desktop */
        .funnel-container {
            max-width: 550px;
            margin: 0 auto;
            padding: 2rem 1rem;
            min-height: 100vh;
            display: flex;
            flex-direction: column;
            justify-content: center;
        }

        /* Cores de destaque */
        .text-red { color: #e52d2d !important; }
        .text-yellow { color: #ffeb3b !important; }

        /* Botões */
        .btn-red {
            background-color: #e52d2d;
            color: #ffffff;
            font-weight: 800;
            text-transform: uppercase;
            padding: 1rem;
            border-radius: 8px;
            border: none;
            width: 100%;
            font-size: 1.1rem;
            transition: all 0.3s ease;
            margin-top: 1.5rem;
        }
        .btn-red:hover {
            background-color: #cc2222;
            color: #ffffff;
            transform: scale(1.02);
        }

        .btn-green {
            background-color: rgb(23, 194, 0);
            color: #ffffff;
            font-weight: 800;
            text-transform: uppercase;
            padding: 1rem;
            border-radius: 8px;
            border: none;
            width: 100%;
            font-size: 1.1rem;
            transition: all 0.3s ease;
            margin-top: 1.5rem;
        }
        .btn-green:hover {
            background-color: rgb(23, 194, 0);
            color: #ffffff;
            transform: scale(1.02);
        }

        /* Lógica de exibição das etapas */
        .step { display: none; animation: fadeIn 0.4s ease-in-out; }
        .step.active { display: block; }

        @keyframes fadeIn {
            from { opacity: 0; transform: translateY(10px); }
            to { opacity: 1; transform: translateY(0); }
        }

        /* Estilos do Aviso Amarelo */
        .warning-box {
            background-color: #ffdd00;
            color: #000;
            border-radius: 12px;
            border: 1px solid #fff08f;
            padding: 25px;
            margin-bottom: 1.5rem;
        }
        
        .warning-box h4 { font-weight: 800; display: flex; align-items: center; gap: 10px; font-size: 1rem; line-height: 1.25rem;} 
        .warning-box p { font-weight: 500; margin-bottom: 1rem; font-size: .875rem; line-height: 1.25rem;}

        /* Estilos do Quiz */
        .quiz-option {
            background-color: #1a1a1a;
            border: 2px solid #e52d2d;
            border-radius: 8px;
            padding: 1rem;
            margin-bottom: 1rem;
            cursor: pointer;
            display: flex;
            align-items: center;
            gap: 15px;
            transition: all 0.2s;
        }
        .quiz-option:hover { border-color: #e52d2d; }
        .quiz-option .circle {
            width: 20px;
            height: 20px;
            border-radius: 50%;
            border: 2px solid #fff;
            flex-shrink: 0;
        }
        .quiz-option.selected { border-color: #e52d2d; }
        .quiz-option.selected .circle { border-color: #e52d2d; border-width: 6px; }

        .progress { height: 4px; background-color: #333; margin-bottom: 2rem; overflow: visible; }
        .progress-bar { background-color: #e52d2d; position: relative; }
        
        .footer-text {
            text-align: center;
            color: #555;
            font-size: 0.8rem;
            margin-top: 3rem;
        }

        .pulse {
          animation: pulse 0.7s infinite;
          margin: 0 auto;
          display: table;
          margin-top: 30px;
          animation-direction: alternate;
          -webkit-animation-name: pulse;
          animation-name: pulse;
        }

        @-webkit-keyframes pulse {
          0% {
            -webkit-transform: scale(1);
            -webkit-filter: brightness(100%);
          }
          100% {
            -webkit-transform: scale(1.05);
            -webkit-filter: brightness(100%);
          }
        }

        @keyframes pulse {
          0% {
            transform: scale(1);
            filter: brightness(100%);
          }
          100% {
            transform: scale(1.05);
            filter: brightness(100%);
          }
        }

        /* --- Estilos do Carrossel de Fotos --- */
.photo-carousel-container img{
    border-radius: 12px;
    /*background-color: #1a1a1a;
    border-radius: 12px;
    padding: 1.5rem;
    position: relative;
    border: 1px solid #333;
    overflow: hidden;*/ /* Garante que as imagens fiquem dentro do container */
}



/* Customizando as setas do carrossel */
.custom-carousel-control {
    width: 36px;
    height: 36px;
    background-color: rgba(40, 40, 40, 0.9);
    border-radius: 50%;
    top: 50%;
    transform: translateY(-50%);
    opacity: 1;
    border: 1px solid #555;
}

.custom-carousel-control:hover {
    background-color: rgba(60, 60, 60, 1);
    opacity: 1;
}

/* Posicionamento das setas */
.carousel-control-prev.custom-carousel-control { left: 10px; }
.carousel-control-next.custom-carousel-control { right: 10px; }

/* Customizando os dots (indicadores) */
.carousel-indicators [data-bs-target] {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: #555;
    border: none;
    margin: 0 4px;
}
.carousel-indicators .active {
    background-color: #e52d2d; /* Vermelho do tema */
}
.carousel-indicators {
    bottom: 10px;
}

/* --- Estilos Step 11: Card Branco e Checks --- */
.white-card {
    background-color: #ffffff;
    color: #121212;
    border-radius: 12px;
    padding: 2rem 1.5rem;
    text-align: left;
}
.check-list-item {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    margin-bottom: 1.2rem;
    font-size: 19px;
    line-height: 1.5rem;
    font-weight: 400;
}
.check-icon {
    color: #00b000; /* Verde bem vivo igual da imagem */
    font-size: 1.3rem;
    flex-shrink: 0;
    margin-top: -3px;
}

/* --- Estilos Step 13: Cards de Bônus --- */
.bonus-card {
    background: linear-gradient(145deg, #1f1f1f, #0a0a0a);
    border: 1px solid #333;
    border-radius: 8px;
    padding: 1.2rem 1rem;
    display: flex;
    gap: 15px;
    align-items: center;
    margin-bottom: 1rem;
    text-align: left;
}
.bonus-card img {
    width: 90px;
    border-radius: 4px;
    box-shadow: 0 4px 8px rgba(0,0,0,0.6);
    flex-shrink: 0;
}
.bonus-card p {
    font-size: 0.85rem;
    color: #dcdcdc;
    margin-bottom: 0.8rem;
    line-height: 1.4;
}
.price-tag {
    font-weight: 800;
    font-size: 0.95rem;
    color: #fff;
}
.strike-price {
    color: #e52d2d;
    text-decoration: line-through;
    margin-right: 4px;
}

        .titulo-01{
            font-size: 21px;
            font-weight: 700;
            color: #fff;
        }

        .titulo-02{
            font-size: 24px;
            font-weight: 700;
            color: #fff;
        }

        .texto-01{
            font-size: 1rem;
            line-height: 1.5rem;
            font-weight: 300;
            color: #fff;
        }

        .texto-02{
            font-size: 19px;
            line-height: 1.5rem;
            font-weight: 300;
            color: #fff;
        }

        .texto-01 b{
            font-weight: 700;
        }

        .texto-02 b{
            font-weight: 700;
        }

        .img-logo{
            width: 160px;
            height: 100%;
        }

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

}