/* assets/css/pages/infinite-theme.css */

:root {
    --brand-color-start: #a3e635; /* Verde Limão */
    --brand-color-end: #facc15;   /* Amarelo */
    --brand-bg-light: #f7fee7;   /* Verde Limão bem clarinho */
    --brand-main-text: #1f2937;  /* Cinza-escuro/Preto */
    --brand-shadow-color: rgba(163, 230, 53, 0.4);
}

.brand-bg { 
    background-image: linear-gradient(to right, var(--brand-color-start), var(--brand-color-end)); 
}
.brand-text-gradient { 
    background-image: linear-gradient(to right, var(--brand-color-start), var(--brand-color-end));
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}
.brand-border { border-color: var(--brand-main-text); }

.prose h2 i {
    color: var(--brand-main-text);
    background-color: #f3f4f6; /* Cinza claro */
}

/* Aplica o gradiente no ícone de check da lista */
.prose ul li i.brand-text-gradient {
    font-size: 1.25rem; /* Ajusta o tamanho do ícone */
}

.cta-button:hover {
    transform: translateY(-4px) scale(1.03); 
    box-shadow: 0 15px 25px -5px var(--brand-shadow-color), 0 10px 10px -5px rgba(163, 230, 53, 0.2);
}

/* Remove o ::before padrão para usar o <i> personalizado */
.prose ul li::before {
    content: none;
}
.prose ul li {
    padding-left: 0; /* Reseta o padding se não for mais necessário */
}