/* CSS Básico para Estrutura e Legibilidade - Personalize à vontade */
        :root {
            --primary-color: #28a745; /* Um tom de verde mais fechado para os botões e destaques */
            --dark-background-start: #121212; /* Cor mais escura para o início do gradiente */
            --dark-background-end: #1a1a1a;   /* Cor ligeiramente mais clara para o fim do gradiente */
            --darker-background: #0d0d0d; /* Fundo mais escuro para alternar seções */
            --light-text-color: #e0e0e0; /* Texto principal claro */
            --lighter-text-color: #a0a0a0; /* Texto secundário/leve */
            --white: #fff;
            --shadow-color-light: rgba(255, 255, 255, 0.05); /* Sombra para simular luz */
            --shadow-color-dark: rgba(0, 0, 0, 0.4); /* Sombra para simular profundidade */
        }

        body {
            font-family: 'Segoe UI', 'Roboto', 'Helvetica Neue', Arial, sans-serif;
            line-height: 1.6;
            margin: 0;
            padding: 0;
            color: var(--light-text-color); /* Texto principal claro */
            /* Gradiente de fundo */
            background: linear-gradient(to bottom, var(--dark-background-start), var(--dark-background-end));
            background-attachment: fixed; /* Fixa o gradiente para rolar o conteúdo por cima */
            min-height: 100vh; /* Garante que o gradiente cubra toda a altura da viewport */
        }

        .container {
            max-width: 1000px;
            margin: 0 auto;
            padding: 20px;
        }

        /* Header */
        header {
            background-color: var(--dark-background-end); /* Usando a cor final do gradiente para o header */
            padding: 40px 20px;
            text-align: center;
            box-shadow: 0 5px 15px var(--shadow-color-dark); /* Sombra para profundidade */
        }

        header .logo img {
            max-width: 150px;
            height: auto;
            margin-bottom: 20px;
            filter: invert(1) brightness(0.8); /* Inverte cores para logos escuros em fundo escuro, ajuste conforme seu logo */
        }

        header h1 {
            font-size: 2.8em;
            color: var(--white); /* Título em branco */
            margin-bottom: 10px;
            line-height: 1.1;
            text-shadow: 0 0 10px var(--shadow-color-light); /* Leve brilho */
        }

        header .subtitle {
            font-size: 1.3em;
            color: var(--lighter-text-color); /* Subtítulo em cinza mais claro */
            margin-bottom: 30px;
        }

        header .hero-image img {
            max-width: 100%;
            height: auto;
            margin: 30px 0;
            border-radius: 8px;
            box-shadow: 0 8px 20px var(--shadow-color-dark), 0 0 30px rgba(255, 255, 255, 0.08) inset; /* Profundidade e leve luz interna */
        }

        .cta-button {
            display: inline-block;
            background-color: var(--primary-color);
            color: var(--white);
            padding: 15px 30px;
            text-decoration: none;
            border-radius: 8px;
            font-size: 1.1em;
            font-weight: bold;
            transition: background-color 0.3s ease, transform 0.2s ease, box-shadow 0.3s ease;
            margin-top: 20px;
            border: none;
            cursor: pointer;
            box-shadow: 0 5px 15px var(--shadow-color-dark); /* Sombra para destacar o botão */
        }

        .cta-button:hover {
            background-color: #218838; /* Tom mais escuro do verde */
            transform: translateY(-2px); /* Efeito de elevação */
            box-shadow: 0 8px 20px var(--shadow-color-dark), 0 0 15px rgba(255, 255, 255, 0.1); /* Sombra e brilho maiores */
        }

        /* Sections */
        section {
            padding: 60px 20px;
            text-align: center;
            /* Usamos transparent para deixar o gradiente do body aparecer */
            background-color: transparent;
        }

        section:nth-of-type(even) {
            background-color: var(--darker-background); /* Fundo um pouco mais escuro para seções alternadas */
            box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.5); /* Leve sombra interna para profundidade */
        }

        section h2 {
            font-size: 2em;
            color: var(--white); /* Títulos em branco */
            margin-bottom: 20px;
            line-height: 1.2;
            text-shadow: 0 0 5px var(--shadow-color-light);
        }

        section h3 {
            font-size: 1.5em;
            color: var(--light-text-color); /* Subtítulos em cinza claro */
            margin-top: 30px;
            line-height: 1.3;
        }

        section p {
            max-width: 700px;
            margin: 0 auto 20px auto;
            font-size: 1.1em;
            color: var(--lighter-text-color); /* Parágrafos em cinza mais claro */
        }

        section ul {
            list-style: none;
            padding: 0;
            max-width: 700px;
            margin: 20px auto;
            text-align: left;
        }

        section ul li {
            background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="%2328a745"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41L9 16.17z"/></svg>') no-repeat left 8px; /* Mantém o check verde */
            background-size: 18px;
            padding-left: 30px;
            margin-bottom: 10px;
            font-size: 1.1em;
            color: var(--light-text-color); /* Itens da lista em cinza claro */
        }

        /* Sobre o Autor Original */
        #sobre-o-autor-original .author-photo {
            width: 150px;
            height: 150px;
            border-radius: 50%;
            object-fit: cover;
            margin: 0 auto 20px auto;
            border: 4px solid var(--primary-color);
            box-shadow: 0 0 15px rgba(0, 0, 0, 0.6), 0 0 20px rgba(255, 255, 255, 0.1) inset; /* Sombra e leve brilho interno */
        }

        /* Depoimentos */
        .testimonial-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
            gap: 30px;
            margin-top: 40px;
            max-width: 900px;
            margin-left: auto;
            margin-right: auto;
        }

        .testimonial-item {
            background-color: var(--darker-background); /* Fundo do depoimento ligeiramente mais escuro */
            border-radius: 8px;
            padding: 30px;
            box-shadow: 0 5px 15px var(--shadow-color-dark), inset 0 0 10px rgba(0, 0, 0, 0.5); /* Sombra para fora e interna para profundidade */
            text-align: left;
        }

        .testimonial-item p {
            font-style: italic;
            margin-bottom: 15px;
            max-width: none;
            color: var(--lighter-text-color); /* Texto do depoimento em cinza mais claro */
        }

        .testimonial-item .author-info {
            display: flex;
            align-items: center;
        }

        .testimonial-item .author-info img {
            width: 50px;
            height: 50px;
            border-radius: 50%;
            margin-right: 15px;
            object-fit: cover;
            border: 2px solid var(--primary-color);
        }

        .testimonial-item .author-info strong {
            font-size: 1em;
            color: var(--light-text-color); /* Nome do autor do depoimento */
        }

        /* Oferta */
        #oferta .ebook-cover-offer img {
            max-width: 250px;
            height: auto;
            margin: 0 auto 30px auto;
            border-radius: 8px;
            box-shadow: 0 8px 20px var(--shadow-color-dark), 0 0 30px rgba(255, 255, 255, 0.08) inset; /* Profundidade e leve luz interna */
        }

        #oferta .price {
            font-size: 2.5em;
            font-weight: bold;
            color: var(--primary-color); /* Preço em verde */
            margin-bottom: 20px;
            text-shadow: 0 0 10px rgba(40, 167, 69, 0.5); /* Leve brilho no preço */
        }
        #oferta .price span {
            font-size: 0.6em;
            font-weight: normal;
            color: var(--lighter-text-color); /* Texto "De R\$ XX,XX por" */
            text-decoration: line-through;
        }
        #oferta ul li {
            background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 24 24" fill="%2328a745"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41L9 16.17z"/></svg>');
        }
        #oferta .guarantee {
            font-size: 0.9em;
            color: var(--lighter-text-color);
            margin-top: 30px;
        }


        /* Footer */
        footer {
            background-color: var(--darker-background); /* Fundo do footer mais escuro */
            color: var(--lighter-text-color);
            padding: 40px 20px;
            font-size: 0.9em;
            text-align: center;
            box-shadow: inset 0 5px 15px var(--shadow-color-dark); /* Sombra interna para profundidade */
        }

        footer ul {
            display: flex;
            justify-content: center;
            padding: 0;
            margin-bottom: 20px;
            flex-wrap: wrap;
        }

        footer ul li {
            margin: 0 15px;
            padding-left: 0;
            color: var(--lighter-text-color); /* Texto do footer */
        }

        footer ul li a {
            color: var(--lighter-text-color); /* Links do footer */
            text-decoration: none;
            transition: color 0.3s ease;
        }

        footer ul li a:hover {
            color: var(--primary-color);
        }

        /* Acessibilidade: Garante que os botões e links sejam discerníveis no foco */
        .cta-button:focus,
        footer ul li a:focus {
            outline: 2px solid var(--primary-color); /* Muda a cor do outline para o verde primário */
            outline-offset: 3px;
        }

        /* Responsividade Básica */
        @media (max-width: 768px) {
            header h1 {
                font-size: 2em;
            }
            header .subtitle {
                font-size: 1.1em;
            }
            section h2 {
                font-size: 1.7em;
            }
            section p, section ul li {
                font-size: 1em;
            }
            .cta-button {
                padding: 12px 25px;
                font-size: 1em;
            }
            footer ul li {
                margin: 5px 10px;
            }
        }