/* Definindo as cores da marca como variáveis CSS */
:root {
    --brand-purple: #6B0384;
    --brand-yellow: #FFD81E;
}

body {
    font-family: 'Inter', sans-serif;
    scroll-behavior: smooth;
}

/* Novo Hero com gradiente e imagem de fundo */
.hero-bg {
    background-image: linear-gradient(45deg, rgba(107, 3, 132, 0.85), rgba(179, 1, 174, 0.75), rgba(251, 119, 45, 0.65)), url('https://luisfernandomoraes.com/wp-content/uploads/2025/07/Image_fx.png');
    background-size: cover;
    background-position: center;
}

/* Aplicando as cores da marca */
.bg-brand-purple { background-color: var(--brand-purple); }
.bg-brand-yellow { background-color: var(--brand-yellow); }
.text-brand-purple { color: var(--brand-purple); }
.text-brand-yellow { color: var(--brand-yellow); }
.border-brand-yellow { border-color: var(--brand-yellow); }

.cta-button {
    transition: all 0.3s ease;
}
.cta-button:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}
.plan-card {
    transition: all 0.3s ease;
    border: 2px solid transparent;
}
.plan-card:hover, .plan-card-popular {
    transform: scale(1.05);
    border-color: var(--brand-yellow);
}
.faq-item summary {
    cursor: pointer;
    list-style: none; /* Remove default marker */
}
.faq-item summary::-webkit-details-marker {
    display: none; /* Chrome/Safari */
}
