:root{--primary-color:#8a2be2; --secondary-color:#ff1493; --dark-color:#1a1a1a; --light-color:#f8f8f8; --gradient-primary:linear-gradient(135deg,var(--primary-color) 0%,var(--secondary-color) 100%);--gradient-dark:linear-gradient(135deg,#000000 0%,var(--primary-color) 100%);--font-primary: 'Montserrat',sans-serif;--font-secondary:'Poppins',sans-serif;--transition:all 0.3s ease;}*{margin:0;padding:0;box-sizing:border-box;}html{scroll-behavior:smooth;}body{font-family:var(--font-secondary);font-size:16px;line-height:1.6;color:#333;background-color:#fff;overflow-x:hidden;}.container{width:100%;max-width:1200px;margin:0 auto;padding:0 20px;}h1,h2,h3,h4,h5,h6{font-family:var(--font-primary);font-weight:700;line-height:1.2;margin-bottom:20px;}p{margin-bottom:20px;}a{text-decoration:none;color:var(--primary-color);transition:var(--transition);}a:hover{color:var(--secondary-color);}img{max-width:100%;height:auto;}section{padding:80px 0;}.btn{display:inline-block;padding:12px 30px;border-radius:50px;font-family:var(--font-primary);font-weight:600;text-transform:uppercase;letter-spacing:1px;transition:var(--transition);cursor:pointer;border:none;text-align:center;}.btn-primary{background:var(--gradient-primary);color:white;box-shadow:0 4px 15px rgba(138,43,226,0.4);}.btn-primary:hover{transform:translateY(-3px);box-shadow:0 8px 25px rgba(138,43,226,0.5);color:white;}.btn-secondary{background:transparent;color:var(--primary-color);border:2px solid var(--primary-color);}.btn-secondary:hover{background:var(--primary-color);color:white;}.btn-large{padding:15px 40px;font-size:18px;} .header{position:fixed;top:0;left:0;width:100%;z-index:1000;background-color:rgba(26,26,26,0.9);backdrop-filter:blur(10px);padding:15px 0;transition:var(--transition);}.header .container{display:flex;justify-content:space-between;align-items:center;}.logo img{height:50px;}.main-nav ul{display:flex;list-style:none;}.main-nav ul li{margin:0 15px;}.main-nav ul li a{color:white;font-weight:500;padding:5px 0;position:relative;}.main-nav ul li a::after{content:'';position:absolute;bottom:0;left:0;width:0;height:2px;background:var(--secondary-color);transition:var(--transition);}.main-nav ul li a:hover::after{width:100%;}.mobile-menu-toggle{display:none;flex-direction:column;justify-content:space-between;width:30px;height:21px;cursor:pointer;}.mobile-menu-toggle span{display:block;width:100%;height:3px;background-color:white;border-radius:3px;transition:var(--transition);}.mobile-cta-button{display:none;} .hero{position:relative;padding:180px 0 100px;background:var(--gradient-dark);color:white;overflow:hidden;}.hero .container{display:flex;align-items:center;position:relative;z-index:2;flex-wrap:nowrap;}.hero-content{flex:1;padding-right:50px;}.hero-image{flex:1;text-align:center;max-width:50%;}.hero-image img{max-width:100%;height:auto;}.hero h1{font-size:48px;font-weight:800;margin-bottom:20px;line-height:1.1;}.hero h2{font-size:24px;color:var(--secondary-color);margin-bottom:30px;}.hero p{font-size:18px;margin-bottom:40px;opacity:0.9;}.hero-shape{position:absolute;bottom:-100px;right:-100px;width:500px;height:500px;background:radial-gradient(circle,rgba(255,20,147,0.2) 0%,rgba(138,43,226,0) 70%);border-radius:50%;z-index:1;} .featured-services{background-color:var(--light-color);padding:80px 0;text-align:center;}.featured-services h2{font-size:36px;margin-bottom:15px;color:var(--dark-color);}.section-subtitle{font-size:18px;color:#666;margin-bottom:50px;max-width:700px;margin-left:auto;margin-right:auto;}.featured-services-grid{display:flex;justify-content:center;gap:30px;flex-wrap:wrap;}.featured-service-item{flex:1;min-width:300px;max-width:350px;background-color:white;border-radius:10px;padding:40px 30px;text-align:left;transition:var(--transition);box-shadow:0 5px 15px rgba(0,0,0,0.05);border-bottom:4px solid transparent;}.featured-service-item:hover{transform:translateY(-10px);box-shadow:0 15px 30px rgba(0,0,0,0.1);border-bottom:4px solid var(--secondary-color);}.featured-service-icon{width:70px;height:70px;margin-bottom:25px;display:flex;align-items:center;justify-content:center;background:var(--gradient-primary);border-radius:50%;font-size:28px;color:white;}.featured-service-item h3{font-size:22px;margin-bottom:15px;color:var(--primary-color);}.featured-service-item p{font-size:16px;color:#666;margin-bottom:20px;line-height:1.6;}.featured-service-benefits{list-style:none;padding:0;margin:0;}.featured-service-benefits li{display:flex;align-items:center;margin-bottom:10px;font-size:15px;color:#555;}.featured-service-benefits li i{color:var(--secondary-color);margin-right:10px;font-size:14px;}@media (max-width:768px){.featured-service-item{min-width:100%;}} .services{background-color:var(--dark-color);color:white;padding:100px 0;}.services .container{display:flex;justify-content:space-between;flex-wrap:wrap;gap:30px;}.service-card{flex:1;min-width:300px;background-color:rgba(255,255,255,0.05);border-radius:10px;padding:40px 30px;text-align:center;transition:var(--transition);border:1px solid rgba(255,255,255,0.1);}.service-card:hover{transform:translateY(-10px);box-shadow:0 20px 30px rgba(0,0,0,0.2);border-color:var(--secondary-color);}.service-icon{width:80px;height:80px;margin:0 auto 30px;display:flex;align-items:center;justify-content:center;background:var(--gradient-primary);border-radius:50%;font-size:30px;}.service-card h3{font-size:20px;margin-bottom:20px;min-height:80px;}.service-card p{font-size:16px;opacity:0.8;} .why-choose{padding:100px 0;background-color:white;}.why-choose .container{display:flex;align-items:center;gap:50px;}.why-choose-content{flex:1;}.why-choose-image{flex:1;text-align:center;}.why-choose h2{font-size:36px;margin-bottom:40px;color:var(--dark-color);}.feature{display:flex;margin-bottom:30px;}.feature-number{font-family:var(--font-primary);font-size:24px;font-weight:800;color:var(--secondary-color);margin-right:20px;min-width:40px;}.feature-text h3{font-size:20px;margin-bottom:10px;color:var(--primary-color);}.feature-text p{font-size:16px;color:#666;} .about{background-color:var(--light-color);padding:100px 0;}.about .container{display:flex;align-items:center;gap:50px;}.about-image{flex:1;position:relative;}.founder-image{position:relative;width:350px;height:350px;margin:0 auto;}.founder-image::before{content:'';position:absolute;top:-10px;left:-10px;width:calc(100% + 20px);height:calc(100% + 20px);border-radius:50%;background:radial-gradient(circle,rgba(255,20,147,0.2) 0%,rgba(138,43,226,0.2) 100%);z-index:1;}.founder-image img{width:100%;height:100%;object-fit:cover;border-radius:50%;position:relative;z-index:2;padding:0;}.about-content{flex:1;}.about h2{font-size:36px;margin-bottom:30px;color:var(--dark-color);}.about p{font-size:16px;color:#666;margin-bottom:20px;} .our-work{padding:100px 0;background-color:var(--light-color);text-align:center;}.our-work h2{font-size:36px;margin-bottom:50px;color:var(--dark-color);}.work-features{display:flex;flex-wrap:wrap;justify-content:center;gap:30px;}.work-feature{width:calc(25% - 30px);min-width:250px;padding:20px;background-color:white;border-radius:10px;box-shadow:0 5px 15px rgba(0,0,0,0.05);transition:var(--transition);}.work-feature:hover{transform:translateY(-5px);box-shadow:0 10px 25px rgba(0,0,0,0.1);}.work-feature-icon{font-size:30px;color:var(--primary-color);margin-bottom:15px;}.work-feature p{font-size:16px;color:#666;margin-bottom:0;} .contact{padding:100px 0;background:var(--gradient-dark);color:white;}.contact .container{display:flex;align-items:center;gap:50px;flex-wrap:wrap;}.contact-content{flex:1;min-width:300px;}.contact h2{font-size:36px;margin-bottom:30px;}.contact p{font-size:18px;opacity:0.9;margin-bottom:30px;}.contact-form{flex:1;min-width:300px;background-color:rgba(255,255,255,0.05);border-radius:10px;padding:40px;border:1px solid rgba(255,255,255,0.1);}.form-group{margin-bottom:20px;}.form-group input{width:100%;padding:15px;border-radius:5px;border:none;background-color:rgba(255,255,255,0.1);color:white;font-family:var(--font-secondary);font-size:16px;}.form-group textarea{width:100%;padding:15px;border-radius:5px;border:none;background-color:rgba(255,255,255,0.1);color:white;font-family:var(--font-secondary);font-size:16px;min-height:120px;resize:vertical;}.form-link{text-align:center;margin-top:10px;}.form-complete-link{color:var(--secondary-color);font-size:15px;transition:var(--transition);display:inline-flex;align-items:center;}.form-complete-link i{margin-left:5px;transition:var(--transition);}.form-complete-link:hover{color:white;}.form-complete-link:hover i{transform:translateX(3px);}.form-group input::placeholder,.form-group textarea::placeholder,.form-group select::placeholder{color:rgba(255,255,255,0.7);}.form-group select{width:100%;padding:15px;border-radius:5px;border:none;background-color:rgba(255,255,255,0.1);color:white;font-family:var(--font-secondary);font-size:16px;appearance:none;background-image:url('data:image/svg+xml;utf8,');background-repeat:no-repeat;background-position:right 15px center;cursor:pointer;}.form-group select option{background-color:var(--dark-color);color:white;}.form-group button{width:100%;} .footer{background-color:var(--dark-color);color:white;padding:80px 0 30px;}.footer-top{display:flex;justify-content:space-between;flex-wrap:wrap;margin-bottom:50px;}.footer-logo img{height:60px;margin-bottom:20px;}.footer-social h3,.footer-contact h3{font-size:18px;margin-bottom:20px;color:var(--secondary-color);}.social-icons{display:flex;gap:15px;}.social-icons a{display:flex;align-items:center;justify-content:center;width:40px;height:40px;background-color:rgba(255,255,255,0.1);border-radius:50%;color:white;font-size:18px;transition:var(--transition);}.social-icons a:hover{background-color:var(--secondary-color);transform:translateY(-3px);}.footer-contact p{display:flex;align-items:center;margin-bottom:10px;font-size:16px;opacity:0.8;}.footer-contact p i{margin-right:10px;color:var(--secondary-color);}.whatsapp-link{display:flex;align-items:center;color:white;opacity:0.8;transition:var(--transition);}.whatsapp-link:hover{opacity:1;color:#25D366;}.whatsapp-link i{margin-right:10px;color:var(--secondary-color);}.footer-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:30px;border-top:1px solid rgba(255,255,255,0.1);flex-wrap:wrap;}.footer-bottom p{font-size:14px;opacity:0.7;margin-bottom:0;}.privacy-policy{color:white;font-size:14px;opacity:0.7;}.privacy-policy:hover{color:var(--secondary-color);opacity:1;} @media (max-width:1024px){.hero h1{font-size:40px;}.hero h2{font-size:20px;}.service-card h3{font-size:18px;}.why-choose-image,.about-image{display:none;}.why-choose-content,.about-content,.contact-content,.contact-form{flex:100%;}}@media (max-width:768px){.header .container{padding:0 15px;}.header{padding:15px 0;}.logo img{max-height:40px;}.main-nav{display:none;}.mobile-menu-toggle{display:flex;z-index:1001; /* Ensure toggle is clickable */}.header .cta-button{display:none;}.mobile-cta-button{display:block;position:fixed;bottom:20px;left:50%;transform:translateX(-50%);z-index:99;width:auto;max-width:280px;text-align:center;}.mobile-cta-button .btn{width:100%;padding:10px 16px;font-size:13px;box-shadow:0 4px 15px rgba(0,0,0,0.3);white-space:nowrap;}.hero .container{flex-direction:column;}.hero-content{padding-right:0;text-align:center;margin-bottom:40px;}.hero h1{font-size:32px;}.hero h2{font-size:18px;}.hero p{font-size:16px;}.service-card{min-width:100%;}.feature{flex-direction:column;}.feature-number{margin-right:0;margin-bottom:10px;}.work-feature{width:100%;}.footer-top > div{width:100%;margin-bottom:30px;text-align:center;}.social-icons{justify-content:center;}.footer-contact p{justify-content:center;}.footer-bottom{flex-direction:column;text-align:center;}.footer-bottom p{margin-bottom:10px;}}@media (max-width:480px){.hero h1{font-size:28px;}.section{padding:60px 0;}.contact-form{padding:30px 20px;}} .main.main-nav.active{display:flex !important;flex-direction:column;background-color:rgba(0,0,0,0.95);position:absolute;top:70px; /* Adjusted based on mobile header height */left:0;width:100%;padding:20px;z-index:1001; /* Ensure menu is above header */}er */}.main-nav.active ul{flex-direction:column;gap:15px;align-items:center;}.mobile-cta-button .btn{font-size:13px;padding:10px 16px;}@media (max-width:480px){.mobile-cta-button .btn{font-size:12px;padding:8px 14px;}}@media (max-width:480px){.mobile-cta-button .btn{font-size:10px;padding:6px 12px;}} @media (max-width:768px){ .hero { padding: 120px 0 80px; /* Reduzido de 180px 0 100px para diminuir o espaço roxo superior */ } .hero .container{ flex-direction:column-reverse; text-align:center; } .hero-image{ max-width:100%; margin-top:10px; /* Reduzido de 20px para diminuir espaço entre imagem e texto */ } .about .container{ flex-direction:column; text-align:center; } .about-image{ display:block !important; margin-bottom:20px; } .founder-image{ width:200px; height:200px; margin:0 auto; } } @media (max-width:768px){.why-choose .container{flex-direction:column;text-align:center;}.why-choose-image{display:block !important;margin-bottom:20px;max-width:100%;}.why-choose-image img{width:100%;height:auto;}} /* Correção para sobreposição do botão flutuante mobile */ @media (max-width: 768px) { body { /* Adiciona espaço na parte inferior para evitar que o botão flutuante (.mobile-cta-button) cubra o conteúdo próximo ao rodapé, como o botão do formulário de contato. Ajuste o valor (80px) se necessário, baseado na altura do botão e no espaçamento desejado. */ padding-bottom: 80px; } } /* Correção Z-index para botão Hero em Mobile */ @media (max-width: 768px) { .hero-content { position: relative; /* Garante contexto de empilhamento */ z-index: 5; /* Traz o conteúdo (incluindo o botão) para frente */ } } /* Correção Final Z-index/Pointer Events para botão Hero em Mobile */ @media (max-width: 768px) { #hero-cta-button { position: relative; /* Garante contexto de empilhamento próprio */ z-index: 10; /* Coloca o botão acima de outros elementos na seção hero */ pointer-events: auto; /* Garante que o botão possa receber eventos de clique/toque */ } } @media (max-width: 768px) { .mobile-menu-toggle { display: none !important; } .main-nav { display: none !important; } } @media (max-width: 768px) { .hero { padding-bottom: 40px !important; } .our-work { padding-top: 40px !important; } .section, section { padding-top: 40px !important; padding-bottom: 40px !important; } } @media (max-width: 768px) { .hero { padding-top: 140px !important; } } @media (max-width: 768px) { .hero { padding-top: 140px !important; } }