.elementor-kit-5391{--e-global-color-primary:#FFFFFF;--e-global-color-secondary:#F3F5F8;--e-global-color-text:#143565;--e-global-color-accent:#467FF7;--e-global-color-c696dce:#FFFFFF;--e-global-color-14ef391:#C8D5DC;--e-global-color-764183d:#F9FAFD;--e-global-color-d6cea4e:#FFFFFF;--e-global-color-86b4fcd:#02010100;--e-global-color-57c8da2:#000000CC;--e-global-typography-primary-font-family:"Poppins";--e-global-typography-primary-font-size:25px;--e-global-typography-primary-font-weight:600;--e-global-typography-primary-text-transform:none;--e-global-typography-primary-font-style:normal;--e-global-typography-primary-text-decoration:none;--e-global-typography-primary-line-height:1.2em;--e-global-typography-primary-letter-spacing:0px;--e-global-typography-secondary-font-family:"Poppins";--e-global-typography-secondary-font-size:36px;--e-global-typography-secondary-font-weight:600;--e-global-typography-secondary-text-transform:capitalize;--e-global-typography-secondary-font-style:normal;--e-global-typography-secondary-text-decoration:none;--e-global-typography-secondary-line-height:1.1em;--e-global-typography-secondary-letter-spacing:0px;--e-global-typography-text-font-family:"Poppins";--e-global-typography-text-font-size:16px;--e-global-typography-text-font-weight:300;--e-global-typography-text-text-transform:none;--e-global-typography-text-font-style:normal;--e-global-typography-text-text-decoration:none;--e-global-typography-text-line-height:1.5em;--e-global-typography-text-letter-spacing:0px;--e-global-typography-accent-font-family:"Poppins";--e-global-typography-accent-font-size:16px;--e-global-typography-accent-font-weight:400;--e-global-typography-accent-text-transform:capitalize;--e-global-typography-accent-font-style:normal;--e-global-typography-accent-text-decoration:none;--e-global-typography-accent-line-height:1em;--e-global-typography-accent-letter-spacing:0px;--e-global-typography-1f325be-font-family:"Cabin";--e-global-typography-1f325be-font-weight:600;--e-global-typography-392b9e0-font-family:"Poppins";--e-global-typography-392b9e0-font-size:22px;--e-global-typography-392b9e0-font-weight:600;--e-global-typography-392b9e0-text-transform:capitalize;--e-global-typography-392b9e0-font-style:normal;--e-global-typography-392b9e0-text-decoration:none;--e-global-typography-392b9e0-line-height:1.2em;--e-global-typography-392b9e0-letter-spacing:0px;--e-global-typography-c05b693-font-family:"Poppins";--e-global-typography-c05b693-font-size:22px;--e-global-typography-c05b693-font-weight:300;--e-global-typography-c05b693-text-transform:none;--e-global-typography-c05b693-font-style:normal;--e-global-typography-c05b693-text-decoration:none;--e-global-typography-c05b693-line-height:1.5em;--e-global-typography-c05b693-letter-spacing:0px;--e-global-typography-6558fb1-font-family:"Poppins";--e-global-typography-6558fb1-font-size:16px;--e-global-typography-6558fb1-font-weight:300;--e-global-typography-6558fb1-text-transform:none;--e-global-typography-6558fb1-font-style:normal;--e-global-typography-6558fb1-text-decoration:none;--e-global-typography-6558fb1-line-height:1.5em;--e-global-typography-6558fb1-letter-spacing:10px;--e-global-typography-92bce3b-font-family:"Poppins";--e-global-typography-92bce3b-font-size:16px;--e-global-typography-92bce3b-font-weight:400;--e-global-typography-92bce3b-text-transform:capitalize;--e-global-typography-92bce3b-font-style:italic;--e-global-typography-92bce3b-text-decoration:underline;--e-global-typography-92bce3b-line-height:1em;--e-global-typography-92bce3b-letter-spacing:0px;--e-global-typography-b2deeae-font-family:"Poppins";--e-global-typography-b2deeae-font-size:85px;--e-global-typography-b2deeae-font-weight:600;--e-global-typography-b2deeae-text-transform:none;--e-global-typography-b2deeae-font-style:normal;--e-global-typography-b2deeae-text-decoration:none;--e-global-typography-b2deeae-line-height:1em;--e-global-typography-b2deeae-letter-spacing:0px;--e-global-typography-fb1a3e0-font-family:"Poppins";--e-global-typography-fb1a3e0-font-size:200px;--e-global-typography-fb1a3e0-font-weight:600;--e-global-typography-fb1a3e0-text-transform:none;--e-global-typography-fb1a3e0-font-style:normal;--e-global-typography-fb1a3e0-text-decoration:none;--e-global-typography-fb1a3e0-line-height:1.2em;--e-global-typography-fb1a3e0-letter-spacing:0px;--e-global-typography-397e168-font-family:"Poppins";--e-global-typography-397e168-font-size:16px;--e-global-typography-397e168-font-weight:400;--e-global-typography-397e168-text-transform:capitalize;--e-global-typography-397e168-font-style:italic;--e-global-typography-397e168-text-decoration:none;--e-global-typography-397e168-line-height:1.3em;--e-global-typography-397e168-letter-spacing:0px;background-color:transparent;background-image:linear-gradient(180deg, var( --e-global-color-c696dce ) 0%, #FFFFFF 100%);}.elementor-kit-5391 h4{color:var( --e-global-color-primary );font-family:var( --e-global-typography-392b9e0-font-family ), Sans-serif;font-size:var( --e-global-typography-392b9e0-font-size );font-weight:var( --e-global-typography-392b9e0-font-weight );text-transform:var( --e-global-typography-392b9e0-text-transform );font-style:var( --e-global-typography-392b9e0-font-style );text-decoration:var( --e-global-typography-392b9e0-text-decoration );line-height:var( --e-global-typography-392b9e0-line-height );letter-spacing:var( --e-global-typography-392b9e0-letter-spacing );word-spacing:var( --e-global-typography-392b9e0-word-spacing );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-container{--container-max-width:1140px;}.elementor-widget:not(:last-child){margin-bottom:20px;}.elementor-element{--widgets-spacing:20px;}@media(max-width:1024px){.elementor-kit-5391{--e-global-typography-primary-font-size:45px;--e-global-typography-secondary-font-size:25px;--e-global-typography-text-font-size:14px;--e-global-typography-accent-font-size:14px;--e-global-typography-c05b693-font-size:14px;--e-global-typography-6558fb1-font-size:14px;--e-global-typography-92bce3b-font-size:14px;--e-global-typography-b2deeae-font-size:65px;--e-global-typography-fb1a3e0-font-size:145px;--e-global-typography-397e168-font-size:14px;}.elementor-kit-5391 h4{font-size:var( --e-global-typography-392b9e0-font-size );line-height:var( --e-global-typography-392b9e0-line-height );letter-spacing:var( --e-global-typography-392b9e0-letter-spacing );word-spacing:var( --e-global-typography-392b9e0-word-spacing );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-container{--container-max-width:1024px;}}@media(max-width:767px){.elementor-kit-5391{--e-global-typography-primary-font-size:28px;--e-global-typography-primary-line-height:1.1em;--e-global-typography-secondary-font-size:20px;--e-global-typography-392b9e0-font-size:18px;--e-global-typography-b2deeae-font-size:48px;--e-global-typography-b2deeae-line-height:1em;--e-global-typography-fb1a3e0-font-size:100px;--e-global-typography-fb1a3e0-line-height:1em;}.elementor-kit-5391 h4{font-size:var( --e-global-typography-392b9e0-font-size );line-height:var( --e-global-typography-392b9e0-line-height );letter-spacing:var( --e-global-typography-392b9e0-letter-spacing );word-spacing:var( --e-global-typography-392b9e0-word-spacing );}.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-container{--container-max-width:767px;}}/* Start custom CSS */<!DOCTYPE html>
<html lang="pt-BR">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Landing Page RLX Fluidos Refrigerantes</title>
    <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap" rel="stylesheet">
    <style>
        /* Reset CSS básico */
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        body {
            font-family: 'Montserrat', sans-serif;
            line-height: 1.6;
            color: #fff;
            background: linear-gradient(135deg, #001F3F 0%, #0A2540 100%);
            overflow-x: hidden;
        }
        .container {
            max-width: 1200px;
            margin: 0 auto;
            padding: 0 20px;
        }
        /* Hero Section */
        .hero {
            display: flex;
            align-items: center;
            justify-content: space-between;
            min-height: 100vh;
            padding: 50px 0;
        }
        .hero-left {
            flex: 1;
            padding-right: 50px;
        }
        .logo {
            font-size: 36px;
            font-weight: 700;
            margin-bottom: 20px;
            color: #fff;
        }
        .headline {
            font-size: 48px;
            font-weight: 700;
            margin-bottom: 20px;
        }
        .subheadline {
            font-size: 20px;
            color: #ccc;
        }
        .hero-right {
            flex: 1;
            max-width: 400px;
        }
        .form {
            background: #7B2CBF;
            border-radius: 20px;
            padding: 30px;
            box-shadow: 0 10px 30px rgba(0,0,0,0.3);
        }
        .form h3 {
            font-size: 24px;
            margin-bottom: 10px;
        }
        .form p {
            font-size: 16px;
            margin-bottom: 20px;
            color: #eee;
        }
        .form input, .form select {
            width: 100%;
            padding: 10px;
            margin-bottom: 15px;
            border: none;
            border-radius: 5px;
            font-size: 16px;
        }
        .form button {
            width: 100%;
            padding: 15px;
            background: #7B2CBF;
            color: #fff;
            border: none;
            border-radius: 5px;
            font-size: 18px;
            cursor: pointer;
            transition: background 0.3s;
        }
        .form button:hover {
            background: #5a1a8a;
        }
        .privacy {
            font-size: 12px;
            margin-top: 10px;
            color: #ddd;
        }
        /* Seção Evolução */
        .evolucao {
            padding: 100px 0;
            text-align: center;
        }
        .evolucao h2 {
            font-size: 48px;
            margin-bottom: 20px;
        }
        .evolucao p {
            font-size: 20px;
            margin-bottom: 50px;
            color: #ccc;
        }
        .grid {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 30px;
        }
        .box {
            background: #7B2CBF;
            padding: 30px;
            border-radius: 10px;
            text-align: center;
            transition: transform 0.3s;
        }
        .box:hover {
            transform: translateY(-10px);
        }
        .box svg {
            width: 50px;
            height: 50px;
            margin-bottom: 20px;
        }
        .box h4 {
            font-size: 24px;
            margin-bottom: 10px;
        }
        .box p {
            font-size: 16px;
        }
        .cta-btn {
            display: inline-block;
            padding: 15px 30px;
            background: #7B2CBF;
            color: #fff;
            text-decoration: none;
            border-radius: 5px;
            font-size: 18px;
            margin-top: 50px;
            transition: background 0.3s;
        }
        .cta-btn:hover {
            background: #5a1a8a;
        }
        /* Seção Pureza */
        .pureza {
            padding: 100px 0;
            text-align: center;
        }
        .pureza h2 {
            font-size: 48px;
            margin-bottom: 20px;
        }
        .pureza p {
            font-size: 20px;
            margin-bottom: 50px;
            color: #ccc;
        }
        .cilindros {
            display: flex;
            justify-content: space-around;
            flex-wrap: wrap;
        }
        .cilindro {
            width: 100px;
            height: 200px;
            border-radius: 50px 50px 20px 20px;
            margin: 10px;
            position: relative;
        }
        .cilindro::before {
            content: '';
            position: absolute;
            top: 10px;
            left: 10px;
            right: 10px;
            bottom: 10px;
            border-radius: 40px 40px 10px 10px;
            background: rgba(255,255,255,0.2);
        }
        .rlx290 { background: #FFD700; }
        .rlx410 { background: #FF0000; }
        .rlx600 { background: #FFA500; }
        .rlx453 { background: #00FFFF; }
        .rlx453-alt { background: #800080; }
        .rlx134 { background: #FFA500; }
        /* Seção Indústrias */
        .industrias {
            padding: 100px 0;
            text-align: center;
        }
        .industrias h2 {
            font-size: 48px;
            margin-bottom: 20px;
        }
        .industrias p {
            font-size: 20px;
            margin-bottom: 50px;
            color: #ccc;
        }
        .logos {
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
        }
        .logo-item {
            margin: 20px;
            font-size: 24px;
            color: #ccc;
        }
        /* Formulário Final */
        .form-final {
            padding: 100px 0;
            text-align: center;
        }
        .form-final h2 {
            font-size: 48px;
            margin-bottom: 20px;
        }
        .form-final p {
            font-size: 20px;
            margin-bottom: 50px;
            color: #ccc;
        }
        /* Responsivo */
        @media (max-width: 768px) {
            .hero {
                flex-direction: column;
                text-align: center;
            }
            .hero-left {
                padding-right: 0;
                margin-bottom: 50px;
            }
            .headline {
                font-size: 36px;
            }
            .grid {
                grid-template-columns: 1fr;
            }
            .cilindros {
                flex-direction: column;
                align-items: center;
            }
            .logos {
                flex-direction: column;
            }
        }
        /* Animações */
        .fade-in {
            opacity: 0;
            transform: translateY(20px);
            transition: opacity 1s, transform 1s;
        }
        .fade-in.visible {
            opacity: 1;
            transform: translateY(0);
        }
    </style>
</head>
<body>
    <section class="hero container fade-in" id="hero">
        <div class="hero-left">
            <div class="logo">RLX Fluidos Refrigerantes</div>
            <h1 class="headline">Compre seus fluidos refrigerantes direto com a RLX</h1>
            <p class="subheadline">Venda apenas para empresas com inscrição estadual, a partir de 20 cilindros ou 240 latas por produto.</p>
        </div>
        <div class="hero-right">
            <form class="form" id="hero-form" action="#" method="post">
                <h3>Receba um orçamento de RLX 453</h3>
                <p>Informe seus dados cadastrais e o volume desejado para receber uma proposta comercial da nossa equipe.</p>
                <input type="text" name="nome" placeholder="Nome completo*" required>
                <input type="email" name="email" placeholder="E-mail*" required>
                <input type="text" name="cnpj" placeholder="CNPJ* (00.000.000/0000-00)" required>
                <input type="text" name="inscricao" placeholder="Inscrição estadual*" required>
                <input type="text" name="cidade" placeholder="Cidade/Estado* (Ex: São Paulo/SP)" required>
                <input type="number" name="quantidade" placeholder="Quantos cilindros ou latas?* (Mínimo: 20)" min="20" required>
                <p class="privacy">*Mínimo de 20 cilindros ou 20 caixas de latas, apenas para empresas com inscrição estadual.</p>
                <button type="submit">✓ Enviar dados e receber orçamento</button>
                <p class="privacy">Seus dados serão usados apenas para contato comercial. Não enviamos spam.</p>
            </form>
        </div>
    </section>

    <section class="evolucao container fade-in" id="evolucao">
        <h2>A evolução do seu sistema começa com quem entende do assunto</h2>
        <p>Por trás do RLX 453 existe uma estrutura sólida, preparada para atender grandes demandas com qualidade, segurança e previsibilidade de fornecimento.</p>
        <div class="grid">
            <div class="box">
                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2L2 7v10c0 5.55 3.84 9.74 9 11 5.16-1.26 9-5.45 9-11V7l-10-5z"/></svg>
                <h4>Fábrica Moderna</h4>
                <p>Equipamentos de última geração para produção eficiente.</p>
            </div>
            <div class="box">
                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9 1L7 9l2 8c0 0 5-1 5-5s-5-5-5-5l-1-7z"/></svg>
                <h4>Laboratório Avançado</h4>
                <p>Testes rigorosos para garantir a pureza dos fluidos.</p>
            </div>
            <div class="box">
                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"/></svg>
                <h4>Qualidade Diamante</h4>
                <p>Pureza de 99,9% em todos os produtos.</p>
            </div>
            <div class="box">
                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z"/></svg>
                <h4>Prêmios de Excelência</h4>
                <p>Reconhecida pelas maiores indústrias do Brasil.</p>
            </div>
            <div class="box">
                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z"/></svg>
                <h4>Certificações</h4>
                <p>Compliance com normas internacionais.</p>
            </div>
            <div class="box">
                <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z"/></svg>
                <h4>Ciclo Sustentável</h4>
                <p>Processos ecológicos e responsáveis.</p>
            </div>
        </div>
        <a href="#form-final" class="cta-btn">Quero contar com a RLX como parceira →</a>
    </section>

    <section class="pureza container fade-in" id="pureza">
        <h2>Fluidos com 99,9% de pureza, direto da fábrica com a maior capacidade produtiva da América Latina</h2>
        <p>Amplo portfólio com fluidos para todas as necessidades de refrigeração.</p>
        <div class="cilindros">
            <div class="cilindro rlx290"></div>
            <div class="cilindro rlx410"></div>
            <div class="cilindro rlx600"></div>
            <div class="cilindro rlx453"></div>
            <div class="cilindro rlx453-alt"></div>
            <div class="cilindro rlx134"></div>
        </div>
    </section>

    <section class="industrias container fade-in" id="industrias">
        <h2>O fluido refrigerante original das grandes indústrias.</h2>
        <p>A RLX é o fornecedor de grandes marcas de ar-condicionado, refrigeração, automotivas e de outros setores que atuam no Brasil.</p>
        <div class="logos">
            <div class="logo-item">AGCO</div>
            <div class="logo-item">BUSSCAR</div>
            <div class="logo-item">BASTON</div>
            <div class="logo-item">Carrier</div>
            <div class="logo-item">Midea</div>
        </div>
    </section>

    <section class="form-final container fade-in" id="form-final">
        <h2>Pronto para migrar do R 22 para o RLX 453?</h2>
        <p>Envie seus dados e nossa equipe comercial retorna rapidamente com o orçamento ideal para o seu projeto.</p>
        <form class="form" action="#" method="post" id="final-form">
            <input type="text" name="nome" placeholder="Nome completo*" required>
            <input type="email" name="email" placeholder="E-mail*" required>
            <input type="text" name="cnpj" placeholder="CNPJ* (00.000.000/0000-00)" required>
            <input type="text" name="inscricao" placeholder="Inscrição estadual*" required>
            <input type="text" name="cidade" placeholder="Cidade/Estado* (Ex: São Paulo/SP)" required>
            <input type="number" name="quantidade" placeholder="Quantos cilindros ou latas?* (Mínimo: 20)" min="20" required>
            <p class="privacy">*Mínimo de 20 cilindros ou 20 caixas de latas, apenas para empresas com inscrição estadual.</p>
            <button type="submit">✓ Enviar dados e receber orçamento</button>
            <p class="privacy">Seus dados serão usados apenas para contato comercial. Não enviamos spam.</p>
        </form>
    </section>

    <script>
        // Validação básica e simulação de envio
        document.getElementById('hero-form').addEventListener('submit', function(e) {
            e.preventDefault();
            alert('Dados enviados com sucesso! Entraremos em contato em breve.');
        });
        document.getElementById('final-form').addEventListener('submit', function(e) {
            e.preventDefault();
            alert('Dados enviados com sucesso! Entraremos em contato em breve.');
        });

        // Smooth scroll
        document.querySelectorAll('a[href^="#"]').forEach(anchor => {
            anchor.addEventListener('click', function (e) {
                e.preventDefault();
                document.querySelector(this.getAttribute('href')).scrollIntoView({
                    behavior: 'smooth'
                });
            });
        });

        // Animações fade-in
        const observer = new IntersectionObserver((entries) => {
            entries.forEach(entry => {
                if (entry.isIntersecting) {
                    entry.target.classList.add('visible');
                }
            });
        });
        document.querySelectorAll('.fade-in').forEach(el => observer.observe(el));
    </script>
</body>
</html>/* End custom CSS */