@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@700&family=Roboto:wght@400;700&display=swap');:root{--primary-color: #8A2BE2;--secondary-color: #00FFFF;--accent-color: #39FF14;--dark-bg: #1a1a2e;--light-dark-bg: #2a2a4e;--text-color: #e0e0e0;--text-muted: #a0a0c0;--card-bg: #1f1f3a;--border-color: rgba(138, 43, 226, 0.3);--card-hover-border-color: var(--secondary-color);--primary-rgb: 138, 43, 226;--secondary-rgb: 0, 255, 255;--accent-rgb: 57, 255, 20;} body{font-family: 'Roboto', sans-serif;background-color: var(--dark-bg);color: var(--text-color);line-height: 1.6;position: relative;padding-top: 70px;} h1, h2, h3, h4, h5, h6, .navbar-brand, .hero-title, .section-title, .page-title{font-family: 'Orbitron', sans-serif;font-weight: 700;color: #ffffff;} a{color: var(--secondary-color);text-decoration: none;transition: color 0.3s ease;} a:hover{color: var(--accent-color);text-decoration: none;} .highlight{color: var(--accent-color);text-shadow: 0 0 5px rgba(var(--accent-rgb), 0.5);} .navbar{background-color: rgba(26, 26, 46, 0.9) !important;backdrop-filter: blur(5px);transition: background-color 0.3s ease;padding-top: 0.5rem;padding-bottom: 0.5rem;} .navbar-brand{color: #ffffff !important;font-size: 1.5rem;} .navbar-brand i{color: var(--primary-color);} .nav-link{color: var(--text-muted) !important;margin-left: 10px;padding-top: 0.5rem;padding-bottom: 0.5rem;transition: color 0.3s ease;position: relative;} .nav-link.active, .nav-link:hover{color: var(--secondary-color) !important;} @media (min-width: 992px){.nav-link::after{content: '';position: absolute;bottom: 0;left: 50%;transform: translateX(-50%) scaleX(0);width: 70%;height: 2px;background-color: var(--secondary-color);transition: transform 0.3s ease-out;transform-origin: center;} .nav-link.active::after, .nav-link:hover::after{transform: translateX(-50%) scaleX(1);}} .hero-section{padding-top: 120px;padding-bottom: 100px;min-height: 95vh;background: linear-gradient(rgba(26, 26, 46, 0.85), rgba(26, 26, 46, 0.98)), url('https://via.placeholder.com/1920x1080/1a1a2e/333?text=Circuit+Background+Low+Opacity') center center/cover no-repeat;background-attachment: fixed;position: relative;overflow: hidden;margin-top: -70px;} .hero-title{font-size: 3rem;text-shadow: 0 0 15px rgba(var(--primary-rgb), 0.7);} .hero-subtitle{font-size: 1.2rem;color: var(--text-muted);max-width: 700px;margin-left: auto;margin-right: auto;} .btn-cta{background-color: var(--primary-color);border-color: var(--primary-color);color: #ffffff;padding: 12px 35px;font-size: 1.1rem;border-radius: 50px;transition: all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);box-shadow: 0 5px 15px rgba(var(--primary-rgb), 0.4);display: inline-block;} .btn-cta:hover, .btn-cta:focus{background-color: var(--secondary-color);border-color: var(--secondary-color);color: var(--dark-bg);transform: translateY(-4px) scale(1.03);box-shadow: 0 10px 25px rgba(var(--secondary-rgb), 0.6);} .page-header-section{background-color: var(--light-dark-bg);padding: 3rem 1rem;text-align: center;border-bottom: 3px solid var(--primary-color);margin-bottom: 3rem;} .page-title{font-size: 2.8rem;margin-bottom: 0.5rem;} .page-title i{margin-right: 10px;color: var(--primary-color);} .page-subtitle{font-size: 1.1rem;color: var(--text-muted);max-width: 800px;margin: 0 auto;font-weight: 300;} main{padding-top: 3rem;padding-bottom: 3rem;} .content-section{background-color: var(--light-dark-bg);padding: 2.5rem 2rem;margin-bottom: 2rem;border-radius: 10px;border: 1px solid var(--border-color);color: var(--text-color);} .content-section h2{color: var(--secondary-color);font-size: 1.8rem;margin-top: 1.5rem;margin-bottom: 1.5rem;padding-bottom: 0.5rem;border-bottom: 1px solid var(--border-color);display: block;font-family: 'Roboto', sans-serif;font-weight: 700;} .content-section h2:first-of-type{margin-top: 0;} .content-section h3{color: var(--accent-color);font-size: 1.4rem;margin-top: 1.5rem;margin-bottom: 1rem;font-family: 'Roboto', sans-serif;font-weight: 700;} .content-section p, .content-section ul, .content-section li{color: var(--text-muted);font-size: 1rem;line-height: 1.7;margin-bottom: 1rem;} .content-section ul{list-style: none;padding-left: 0;} .content-section li{padding-left: 1.5em;position: relative;} .content-section li::before{content: "»";position: absolute;left: 0;color: var(--primary-color);font-size: 1.1em;top: 0px;} .content-section strong{color: var(--text-color);font-weight: 700;} .content-section a{color: var(--secondary-color);font-weight: 600;} .content-section a:hover{color: var(--accent-color);text-decoration: underline;} section{padding-top: 80px;padding-bottom: 80px;overflow: hidden;} .section-title{color: #ffffff;margin-bottom: 4rem !important;font-size: 2.5rem;position: relative;} .section-title .highlight::after{content: '';position: absolute;bottom: -15px;left: 50%;transform: translateX(-50%);width: 70px;height: 4px;background: linear-gradient(90deg, var(--primary-color), var(--secondary-color));border-radius: 3px;box-shadow: 0 0 10px rgba(var(--secondary-rgb), 0.5);} .bg-light-dark{background-color: var(--light-dark-bg);} .card{background-color: var(--card-bg);border: 1px solid var(--border-color);border-bottom: 3px solid transparent;border-radius: 10px;transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease, border-bottom-color 0.4s ease-out;color: var(--text-color);display: flex;flex-direction: column;position: relative;overflow: hidden;height: 100%;} .card:hover{transform: translateY(-8px);box-shadow: 0 12px 25px rgba(0, 0, 0, 0.4);border-color: var(--border-color);border-bottom-color: var(--card-hover-border-color);} .card .card-body{flex-grow: 1;padding: 1.5rem;z-index: 2;position: relative;display: flex;flex-direction: column;text-align: center;} .card .card-title{color: #ffffff;margin-bottom: 0.75rem;font-size: 1.3rem;font-family: 'Orbitron', sans-serif;min-height: 3em;display: flex;align-items: center;justify-content: center;} .card .card-text, .card .card-description{color: var(--text-muted);font-size: 0.95rem;margin-bottom: 1rem;flex-grow: 1;} .tool-card, .service-card, .game-card{background-color: var(--card-bg);border: 1px solid var(--border-color);border-bottom: 3px solid transparent;border-radius: 10px;transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease, border-bottom-color 0.4s ease-out;color: var(--text-color);display: flex;flex-direction: column;position: relative;overflow: hidden;height: 100%;} .tool-card:hover, .service-card:hover, .game-card:hover{transform: translateY(-8px);box-shadow: 0 12px 25px rgba(0, 0, 0, 0.4);border-color: var(--border-color);border-bottom-color: var(--card-hover-border-color);} .tool-card .card-body, .service-card .card-body, .game-card .card-body{flex-grow: 1;padding: 1.5rem;z-index: 2;position: relative;display: flex;flex-direction: column;text-align: center;} .tool-card .card-title, .service-card .card-title, .game-card .card-title{color: #ffffff;margin-bottom: 0.75rem;font-size: 1.3rem;font-family: 'Orbitron', sans-serif;min-height: 3em;display: flex;align-items: center;justify-content: center;} .tool-card .card-text, .service-card .card-text, .game-card .card-text, .tool-card .card-description, .service-card .card-description, .game-card .card-description{color: var(--text-muted);font-size: 0.95rem;margin-bottom: 1rem;flex-grow: 1;} .card-icon, .tool-icon{margin-bottom: 1rem;height: 50px;line-height: 50px;} .card-icon i, .tool-icon i{font-size: 2.5rem;color: var(--primary-color);transition: color 0.3s ease, transform 0.3s cubic-bezier(0.68, -0.55, 0.27, 1.55);} .tool-card:hover .tool-icon i, .service-card:hover .card-icon i, .game-card:hover .card-icon i{color: var(--accent-color);transform: scale(1.25) rotate(8deg);} .card-details{font-size: 0.85rem;color: var(--text-muted);margin-top: auto;padding-top: 1rem;border-top: 1px dashed rgba(var(--secondary-rgb), 0.2);text-align: left;width: 100%;} .card-details p{margin-bottom: 0.5rem;padding-left: 1.2em;position: relative;font-size: 0.85rem;} .card-details p::before{font-family: "Font Awesome 6 Free";font-weight: 900;position: absolute;left: 0;color: var(--primary-color);font-size: 0.9em;top: 6px;} .card-details p.como-usar::before{content: '\f054';} .card-details p.publico::before{content: '\f02b';} .card-details p.publico strong{font-weight: 600;color: var(--text-color);} .card-footer-text{font-size: 0.85rem;color: var(--text-muted);font-style: italic;margin-bottom: 0;padding: 0.5rem 0 0.2rem 0;border-top: 1px dashed rgba(var(--secondary-rgb), 0.2);transition: color 0.3s ease, border-color 0.3s ease;margin-top: auto;} .tool-card:hover .card-footer-text{color: var(--text-color);border-top-color: rgba(var(--secondary-rgb), 0.4);} .testimonial-card{background-color: var(--card-bg);border: 1px solid var(--border-color);border-left: 5px solid var(--primary-color);border-radius: 8px;padding: 25px;color: var(--text-color);position: relative;overflow: hidden;transition: transform 0.3s ease, box-shadow 0.3s ease;display: flex;flex-direction: column;} .testimonial-quote-icon{position: absolute;top: 10px;left: 15px;font-size: 3.5rem;color: var(--primary-color);opacity: 0.08;z-index: 0;transition: opacity 0.3s ease, transform 0.3s ease;} .testimonial-card:hover{transform: translateY(-6px);box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3), 0 0 20px rgba(var(--secondary-rgb), 0.5), 0 0 10px rgba(var(--primary-rgb), 0.2) inset;} .testimonial-card:hover .testimonial-quote-icon{opacity: 0.12;transform: rotate(-3deg) scale(1.05);} .testimonial-card .card-body{flex-grow: 1;position: relative;z-index: 1;} .testimonial-avatar{width: 80px;height: 80px;border-radius: 50%;object-fit: cover;margin: 0 auto 20px auto;display: block;border: 4px solid var(--secondary-color);box-shadow: 0 0 15px rgba(var(--secondary-rgb), 0.3);position: relative;z-index: 2;transition: border-color 0.3s ease, box-shadow 0.3s ease;} .testimonial-card:hover .testimonial-avatar{border-color: var(--accent-color);box-shadow: 0 0 25px rgba(var(--secondary-rgb), 0.7);} .testimonial-card .card-text{font-size: 1rem;margin-bottom: 1.5rem;color: var(--text-muted);} .testimonial-card .blockquote-footer{color: var(--text-color);font-size: 0.9rem;} .testimonial-card .blockquote-footer strong{color: var(--accent-color);} footer{background-color: var(--dark-bg);border-top: 1px solid var(--border-color);padding-top: 3rem;padding-bottom: 2rem;color: var(--text-muted);margin-top: 3rem;} .footer-link{color: var(--text-muted);display: block;margin-bottom: 8px;transition: color 0.3s ease, transform 0.3s ease;} .footer-link:hover{color: var(--secondary-color);transform: translateX(5px);} .social-icon i{color: var(--text-muted);transition: color 0.3s ease, transform 0.3s ease;font-size: 1.8rem;} .social-icon:hover i{color: var(--primary-color);transform: scale(1.2) translateY(-3px);} footer h5{color: #ffffff;margin-bottom: 1.2rem !important;} footer p{color: var(--text-muted);margin-bottom: 0.5rem;font-size: 0.9rem;} footer p i{color: var(--secondary-color);margin-right: 8px;} footer hr{border-color: rgba(255, 255, 255, 0.1);} footer .small{font-size: 0.85rem;color: var(--text-muted);} .footer-warning{font-style: italic;color: var(--text-muted);margin-bottom: 1.5rem;font-size: 0.85rem;} .footer-warning b{color: var(--text-color);} @media (max-width: 991.98px){.hero-title{font-size: 2.5rem;} .hero-subtitle{font-size: 1.1rem;} .page-title{font-size: 2.2rem;} .page-subtitle{font-size: 1rem;} .section-title{font-size: 2rem;} .navbar-nav .nav-link{margin-left: 0;text-align: center;} .nav-link::after{display: none;}} @media (max-width: 767.98px){.hero-section{min-height: auto;padding-top: 80px;padding-bottom: 60px;background-attachment: scroll;} .hero-title{font-size: 2rem;} .hero-subtitle{font-size: 1rem;} .page-header-section{padding: 2rem 1rem;} .page-title{font-size: 1.8rem;} .page-subtitle{font-size: 0.95rem;} .btn-cta{padding: 10px 25px;font-size: 1rem;} main{padding-top: 2rem;padding-bottom: 2rem;} section{padding-top: 60px;padding-bottom: 60px;} .content-section{padding: 1.5rem 1rem;} .section-title{font-size: 1.8rem;margin-bottom: 3rem !important;} .section-title .highlight::after{width: 50px;height: 3px;bottom: -10px;} .content-section h2{font-size: 1.5rem;} .content-section h3{font-size: 1.2rem;} footer .col-md-4{text-align: center !important;margin-bottom: 30px;} footer .col-md-4:last-child{margin-bottom: 0;} .card-footer-text{font-size: 0.8rem;} .testimonial-quote-icon{font-size: 2.5rem;top: 15px;left: 10px;} .tool-card .card-title, .service-card .card-title, .game-card .card-title{font-size: 1.1rem;min-height: auto;} .card-icon i, .tool-icon i{font-size: 2rem;} .card-details{font-size: 0.8rem;} .card-details p{font-size: 0.8rem;} .social-icon i{font-size: 1.6rem;} footer{padding-top: 2rem;} footer h5{font-size: 1.1rem;}} [data-aos]{opacity: 0;transition-property: transform, opacity;}