                                                                                          :root {
                                                                                             --bg-color: #0a0a12;
                                                                                             --card-bg: rgba(20, 20, 35, 0.7);
                                                                                             --primary: #8b0000;
                                                                                             /* Vermelho escuro */
                                                                                             --primary-glow: #ff0055;
                                                                                             --primary-color: #8b0000;
                                                                                             /* Rosa/Vermelho Neon */
                                                                                             --secondary-color: #c90303;
                                                                                             --secondary: #8b0000;
                                                                                             /* Verde Neon */
                                                                                             --text-color: #e2e8f0;
                                                                                             --text: #e2e8f0;
                                                                                             --grid-line: rgba(0, 255, 204, 0.05);
                                                                                         }
                                                                                         
                                                                                         body {
                                                                                             font-family: 'Montserrat', sans-serif;
                                                                                             background-color: #0b111e;
                                                                                             color: #ffffff;
                                                                                             margin: 0;
                                                                                             overflow-x: hidden;
                                                                                             /* Evita barras de rolagem horizontais por causa das animações */
                                                                                         }
                                                                                         /* 1. menu-toggle TOP BAR display: none; hero-overlay */
                                                                                         
                                                                                         .menu-toggle {
                                                                                             left: 20px;
                                                                                             bottom: 20px;
                                                                                             /* Bem no final da tela */
                                                                                             width: 60px;
                                                                                             height: 60px;
                                                                                             color: #fff;
                                                                                             border-radius: 50%;
                                                                                             display: flex;
                                                                                             align-items: center;
                                                                                             justify-content: center;
                                                                                             cursor: pointer;
                                                                                             box-shadow: 0 8px 25px rgba(0, 0, 0, .3);
                                                                                             transition: .3s;
                                                                                             z-index: 9999;
                                                                                             /* Animação chamando atenção */
                                                                                             animation: pulse 2s infinite;
                                                                                         }
                                                                                         
                                                                                         .menu-toggle i {
                                                                                             font-size: 32px;
                                                                                         }
                                                                                         
                                                                                         .menu-toggle::after {
                                                                                             content: "Menu";
                                                                                             position: absolute;
                                                                                             left: 70px;
                                                                                             background: rgba(0, 0, 0, .85);
                                                                                             color: #fff;
                                                                                             padding: 6px 12px;
                                                                                             border-radius: 20px;
                                                                                             font-size: 14px;
                                                                                             white-space: nowrap;
                                                                                             opacity: 0;
                                                                                             transform: translateX(-10px);
                                                                                             transition: .3s;
                                                                                         }
                                                                                         
                                                                                         .menu-toggle:hover::after {
                                                                                             opacity: 1;
                                                                                             transform: translateX(0);
                                                                                         }
                                                                                         
                                                                                         @keyframes pulse {
                                                                                             0% {
                                                                                                 box-shadow: 0 0 0 0 rgba(13, 110, 253, .5);
                                                                                             }
                                                                                             70% {
                                                                                                 box-shadow: 0 0 0 15px rgba(13, 110, 253, 0);
                                                                                             }
                                                                                             100% {
                                                                                                 box-shadow: 0 0 0 0 rgba(13, 110, 253, 0);
                                                                                             }
                                                                                         }
                                                                                         
                                                                                         .top-bar {
                                                                                             background: linear-gradient(90deg, #101c36 0%, #080d1a 100%);
                                                                                             font-size: 0.85rem;
                                                                                             border-bottom: 1px solid #1a2947;
                                                                                         }
                                                                                         
                                                                                         .badge-lancamento {
                                                                                             background-color: #de0e12;
                                                                                             color: #fff;
                                                                                             padding: 2px 10px;
                                                                                             border-radius: 20px;
                                                                                             font-weight: bold;
                                                                                             font-size: 0.75rem;
                                                                                         }
                                                                                         
                                                                                         .btn-topbar {
                                                                                             background-color: #007bff;
                                                                                             color: white;
                                                                                             border-radius: 4px;
                                                                                             padding: 4px 15px;
                                                                                             font-weight: 700;
                                                                                             text-decoration: none;
                                                                                             font-size: 0.8rem;
                                                                                         }
                                                                                         /* 2. NAVBAR FIXA COM TRANSIÇÃO DE COR */
                                                                                         /* 2. NAVBAR RIGIDAMENTE FIXA (Independente do elemento pai) */
                                                                                         /* 2. NAVBAR (Flui normalmente no topo, fica fixa apenas no scroll) */
                                                                                         
                                                                                         .navbar {
                                                                                             background-color: #0b111e;
                                                                                             padding: 0.2rem 0;
                                                                                             transition: background-color 0.4s ease, padding 0.4s ease, box-shadow 0.4s ease;
                                                                                             position: relative;
                                                                                             /* Flui normalmente com a página no início */
                                                                                             width: 100%;
                                                                                             z-index: 999;
                                                                                         }
                                                                                         /* Esta classe entra em ação via Vue.js ASSIM QUE O SCROLL COMEÇA */
                                                                                         
                                                                                         .navbar-scrolled {
                                                                                             position: fixed !important;
                                                                                             /* Torna-se fixa rigidamente na janela */
                                                                                             top: 0;
                                                                                             left: 0;
                                                                                             background-color: #060a12 !important;
                                                                                             padding: 0.8rem 0;
                                                                                             box-shadow: 0 4px 20px rgba(0, 0, 0, 0.6);
                                                                                             border-bottom: 1px solid #1e293b;
                                                                                             animation: slideDown 0.3s ease-out;
                                                                                             /* Opcional: dá um efeito suave ao surgir */
                                                                                         }
                                                                                         /* Opcional: Animação simples para o menu não surgir do nada ao fixar */
                                                                                         
                                                                                         @keyframes slideDown {
                                                                                             from {
                                                                                                 transform: translateY(-100%);
                                                                                             }
                                                                                             to {
                                                                                                 transform: translateY(0);
                                                                                             }
                                                                                         }
                                                                                         /* 3. HERO SECTION (Voltamos ao padding original, pois o menu ocupa espaço no início) */
                                                                                         
                                                                                         .hero-section {
                                                                                             position: relative;
                                                                                             padding: 60px 0 100px 0;
                                                                                             /* Ajustado para encaixar visualmente */
                                                                                             overflow: hidden;
                                                                                             background-color: #0b111e;
                                                                                         }
                                                                                         /* Quando a TopBar está visível, empurramos a Navbar para baixo para não cobrir */
                                                                                         
                                                                                         .navbar-with-topbar {
                                                                                             top: 45px;
                                                                                             /* Altura aproximada da top-bar */
                                                                                         }
                                                                                         
                                                                                         .navbar.navbar-scrolled {
                                                                                             background-color: #060a12 !important;
                                                                                             padding: 0.8rem 0;
                                                                                             box-shadow: 0 4px 20px rgba(0, 0, 0, 0.6);
                                                                                             border-bottom: 1px solid #1e293b;
                                                                                             top: 0 !important;
                                                                                             /* Quando rola, ela gruda no topo absoluto mesmo se a topbar sumir */
                                                                                         }
                                                                                         
                                                                                         .navbar-brand {
                                                                                             font-weight: 900;
                                                                                             font-size: 1.8rem;
                                                                                             color: #ffffff !important;
                                                                                         }
                                                                                         
                                                                                         .navbar-brand span {
                                                                                             color: #de0e12;
                                                                                         }
                                                                                         
                                                                                         .nav-link {
                                                                                             color: #e2e8f0 !important;
                                                                                             font-weight: 600;
                                                                                             font-size: 0.95rem;
                                                                                         }
                                                                                         
                                                                                         .nav-link:hover {
                                                                                             color: #de0e12 !important;
                                                                                         }
                                                                                         
                                                                                         .dropdown-menu {
                                                                                             background-color: #121d33;
                                                                                             border: 1px solid #1e2f52;
                                                                                         }
                                                                                         
                                                                                         .dropdown-item {
                                                                                             color: #cbd5e1;
                                                                                             font-weight: 600;
                                                                                         }
                                                                                         
                                                                                         .dropdown-item:hover {
                                                                                             background-color: #de0e12;
                                                                                             color: white;
                                                                                         }
                                                                                         
                                                                                         .nav-icons .btn-icon {
                                                                                             background: none;
                                                                                             border: none;
                                                                                             color: #ffffff;
                                                                                             margin-left: 18px;
                                                                                             font-size: 1.2rem;
                                                                                             position: relative;
                                                                                         }
                                                                                         
                                                                                         .nav-icons .badge-notif {
                                                                                             position: absolute;
                                                                                             top: -4px;
                                                                                             right: -6px;
                                                                                             background-color: #ff4747;
                                                                                             color: white;
                                                                                             border-radius: 50%;
                                                                                             padding: 2px 5px;
                                                                                             font-size: 0.6rem;
                                                                                         }
                                                                                         
                                                                                         .search-box {
                                                                                             max-width: 0;
                                                                                             overflow: hidden;
                                                                                             transition: max-width 0.4s ease;
                                                                                             display: inline-block;
                                                                                         }
                                                                                         
                                                                                         .search-box.active {
                                                                                             max-width: 180px;
                                                                                             margin-left: 10px;
                                                                                         }
                                                                                         /* 3. HERO SECTION COM VÍDEO DE FUNDO */
                                                                                         /* Estilização para o vídeo ocupar 100% da área cobrindo a seção */
                                                                                         
                                                                                         .hero-video-bg {
                                                                                             position: absolute;
                                                                                             top: 50%;
                                                                                             left: 50%;
                                                                                             min-width: 100%;
                                                                                             min-height: 100%;
                                                                                             width: auto;
                                                                                             height: auto;
                                                                                             z-index: 1;
                                                                                             transform: translate(-50%, -50%);
                                                                                             object-fit: cover;
                                                                                             /* Faz o vídeo se comportar como background-size: cover */
                                                                                             pointer-events: none;
                                                                                             /* Evita que cliques acidentais pausem o vídeo */
                                                                                         }
                                                                                         /* Degradê que protege a leitura do texto sobre o vídeo em movimento */
                                                                                         
                                                                                         .hero-overlay {
                                                                                             position: absolute;
                                                                                             top: 0;
                                                                                             left: 0;
                                                                                             width: 100%;
                                                                                             height: 100%;
                                                                                             background: linear-gradient(135deg, rgba(0, 0, 0, 0.95) 0%, rgba(8, 4, 4, 0.582) 55%, rgba(255, 0, 0, 0.2) 100%);
                                                                                             z-index: 2;
                                                                                         }
                                                                                         
                                                                                         .hero-content {
                                                                                             position: relative;
                                                                                             z-index: 3;
                                                                                             /* Coloca o conteúdo de texto e o mascote acima do vídeo */
                                                                                         }
                                                                                         
                                                                                         .hero-tagline {
                                                                                             font-size: 0.95rem;
                                                                                             font-weight: 700;
                                                                                             color: #de0e12;
                                                                                         }
                                                                                         
                                                                                         .logotipo {
                                                                                             width: 150px;
                                                                                         }
                                                                                         
                                                                                         .hero-title {
                                                                                             font-size: 4.2rem;
                                                                                             font-weight: 900;
                                                                                             line-height: 1.1;
                                                                                             color: #f6f8fa;
                                                                                         }
                                                                                         
                                                                                         .hero-title-2 {
                                                                                             font-size: 3.2rem;
                                                                                             font-weight: 900;
                                                                                             line-height: 1.1;
                                                                                             color: #f6f8fa;
                                                                                         }
                                                                                         
                                                                                         .hero-title-2 span {
                                                                                             color: #de0e12;
                                                                                         }
                                                                                         
                                                                                         .hero-title-5 {
                                                                                             font-size: 1.2rem;
                                                                                             font-weight: 900;
                                                                                             line-height: 1.1;
                                                                                         }
                                                                                         
                                                                                         .hero-title-5 span {
                                                                                             color: #de0e12;
                                                                                         }
                                                                                         
                                                                                         .hero-title span {
                                                                                             color: #de0e12;
                                                                                         }
                                                                                         
                                                                                         .hero-features {
                                                                                             font-size: 1.05rem;
                                                                                             color: #cbd5e1;
                                                                                         }
                                                                                         
                                                                                         .hero-features i {
                                                                                             color: #de0e12;
                                                                                         }
                                                                                         
                                                                                         .btn-yellow {
                                                                                             background-color: #fffb00;
                                                                                             color: #0b111e;
                                                                                             font-weight: 800;
                                                                                             padding: 16px 36px;
                                                                                             border-radius: 30px;
                                                                                             border: none;
                                                                                             font-size: 1.1rem !important;
                                                                                             transition: all 0.2s;
                                                                                         }
                                                                                         
                                                                                         .btn-yellow:hover {
                                                                                             background-color: hsl(359, 77%, 88%);
                                                                                             transform: translateY(-2px);
                                                                                             box-shadow: 0 6px 20px rgba(241, 21, 21, 0.4);
                                                                                         }
                                                                                         
                                                                                         .price-text {
                                                                                             font-size: 1.2rem;
                                                                                             color: #94a3b8;
                                                                                         }
                                                                                         
                                                                                         .price-highlight {
                                                                                             font-weight: 800;
                                                                                             color: #de0e12;
                                                                                             font-size: 1.6rem;
                                                                                         }
                                                                                         /* 4. ÁREA DA IMAGEM DO JACARÉ E SELOS */
                                                                                         
                                                                                         .hero-artwork-container {
                                                                                             position: relative;
                                                                                             text-align: right;
                                                                                         }
                                                                                         
                                                                                         .img-jacare-principal {
                                                                                             width: 100%;
                                                                                             max-width: 100%;
                                                                                             height: auto;
                                                                                             position: relative;
                                                                                             margin-bottom: -180px;
                                                                                             z-index: 2;
                                                                                         }
                                                                                         
                                                                                         .art-discount-badge {
                                                                                             position: absolute;
                                                                                             top: -30px;
                                                                                             left: 55%;
                                                                                             background: linear-gradient(135deg, #ff2328 0%, #b81619 100%);
                                                                                             padding: 12px 15px;
                                                                                             border-radius: 8px;
                                                                                             transform: rotate(-10deg);
                                                                                             box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
                                                                                             border: 2px solid #ffffff;
                                                                                             z-index: 10;
                                                                                             text-align: center;
                                                                                         }
                                                                                         
                                                                                         .art-discount-badge .ate {
                                                                                             font-size: 0.75rem;
                                                                                             font-weight: 800;
                                                                                             display: block;
                                                                                             text-transform: uppercase;
                                                                                             color: #fff;
                                                                                         }
                                                                                         
                                                                                         .art-discount-badge .num {
                                                                                             font-size: 2.5rem;
                                                                                             font-weight: 900;
                                                                                             line-height: 1;
                                                                                             color: #ffffff;
                                                                                             text-shadow: 2px 2px 0px #331200;
                                                                                         }
                                                                                         
                                                                                         .art-discount-badge .off {
                                                                                             font-size: 1.6rem;
                                                                                             font-weight: 900;
                                                                                             color: #ffffff;
                                                                                             display: block;
                                                                                             margin-top: -5px;
                                                                                         }
                                                                                         
                                                                                         .dummy-section {
                                                                                             padding: 100px 0;
                                                                                             background-color: #0e1626;
                                                                                             text-align: center;
                                                                                             color: #475569;
                                                                                             border-top: 1px solid #1e293b;
                                                                                         }
                                                                                         /* 5. MEGA MENU ATRAENTE */
                                                                                         
                                                                                         .navbar .position-static {
                                                                                             position: relative;
                                                                                         }
                                                                                         
                                                                                         .mega-menu-container {
                                                                                             background-color: #111a2e !important;
                                                                                             border: 1px solid #1e2e4d !important;
                                                                                             border-radius: 12px;
                                                                                             box-shadow: 0 15px 40px rgba(0, 0, 0, 0.5);
                                                                                             margin-top: 10px;
                                                                                         }
                                                                                         
                                                                                         .mega-menu-link {
                                                                                             display: flex;
                                                                                             align-items: center;
                                                                                             gap: 15px;
                                                                                             padding: 12px 16px;
                                                                                             border-radius: 8px;
                                                                                             text-decoration: none;
                                                                                             color: #cbd5e1 !important;
                                                                                             transition: all 0.25s ease-in-out;
                                                                                             background: transparent;
                                                                                         }
                                                                                         
                                                                                         .mega-menu-link:hover {
                                                                                             background: rgba(255, 108, 34, 0.08);
                                                                                             color: #ffffff !important;
                                                                                             transform: translateX(5px);
                                                                                         }
                                                                                         
                                                                                         .mega-menu-icon {
                                                                                             display: flex;
                                                                                             align-items: center;
                                                                                             justify-content: center;
                                                                                             width: 40px;
                                                                                             height: 40px;
                                                                                             border-radius: 8px;
                                                                                             background-color: rgba(255, 255, 255, 0.05);
                                                                                             color: #de0e12;
                                                                                             font-size: 1.25rem;
                                                                                             transition: all 0.25s ease;
                                                                                         }
                                                                                         
                                                                                         .mega-menu-link:hover .mega-menu-icon {
                                                                                             background-color: #de0e12;
                                                                                             color: #ffffff;
                                                                                             box-shadow: 0 0 12px rgba(255, 108, 34, 0.4);
                                                                                         }
                                                                                         
                                                                                         .mega-menu-cta {
                                                                                             background: linear-gradient(135deg, #162542 0%, #0d1629 100%);
                                                                                             border: 1px solid #22375e;
                                                                                             border-radius: 10px;
                                                                                             position: relative;
                                                                                             /*  overflow: hidden; */
                                                                                         }
                                                                                         
                                                                                         @media (max-width: 991.98px) {
                                                                                             .hero-title-2 {
                                                                                                 font-size: 1.6rem;
                                                                                                 font-weight: 800;
                                                                                                 line-height: 1.1;
                                                                                             }
                                                                                             .hero-title {
                                                                                                 font-size: 2.1rem;
                                                                                             }
                                                                                             .hero-tagline {
                                                                                                 font-size: 0.75rem;
                                                                                             }
                                                                                             .logotipo {
                                                                                                 width: 120px;
                                                                                             }
                                                                                             .price-text {
                                                                                                 font-size: 0.85rem;
                                                                                             }
                                                                                             .price-highlight {
                                                                                                 font-weight: 600;
                                                                                                 font-size: 1.0rem;
                                                                                             }
                                                                                             .btn-yellow {
                                                                                                 font-weight: 800;
                                                                                                 padding: 16px 36px;
                                                                                                 border-radius: 30px;
                                                                                                 border: none;
                                                                                                 font-size: 0.8rem !important;
                                                                                                 transition: all 0.2s;
                                                                                             }
                                                                                             .hero-artwork-container {
                                                                                                 text-align: center;
                                                                                                 margin-top: 50px;
                                                                                             }
                                                                                             .hero-artwork-container img {
                                                                                                 margin-top: -40%;
                                                                                                 margin-left: 12%;
                                                                                             }
                                                                                             .art-discount-badge {
                                                                                                 left: 5%;
                                                                                                 transform: translateX(-50%) rotate(-10deg);
                                                                                                 top: -50px;
                                                                                             }
                                                                                         }
                                                                                         /* AREA DE IMAGEM COM EFEITO */
                                                                                         
                                                                                         .hero-section {
                                                                                             position: relative;
                                                                                             min-height: 100vh;
                                                                                             display: flex;
                                                                                             padding: 80px 20px;
                                                                                             overflow: hidden;
                                                                                         }
                                                                                         /* Imagem de Fundo animada pelo Vue */
                                                                                         
                                                                                         .hero-bg-image {
                                                                                             position: absolute;
                                                                                             top: 0;
                                                                                             left: 0;
                                                                                             width: 100%;
                                                                                             height: 100%;
                                                                                             background-image: url('https://images.unsplash.com/photo-1498050108023-c5249f4df085?q=80&w=1920&auto=format&fit=crop');
                                                                                             background-position: center;
                                                                                             background-repeat: no-repeat;
                                                                                             background-size: cover;
                                                                                             /* Suavidade na transição de estilo */
                                                                                             transition: transform 0.1s ease-out, opacity 0.1s ease-out;
                                                                                             will-change: transform, opacity;
                                                                                             z-index: 1;
                                                                                         }
                                                                                         /* Overlay Escuro / Glassmorphism */
                                                                                         
                                                                                         .hero-bg-email {
                                                                                             position: absolute;
                                                                                             top: 0;
                                                                                             left: 0;
                                                                                             width: 100%;
                                                                                             height: 100%;
                                                                                             background-image: url('./../img/email.jpg');
                                                                                             background-position: center;
                                                                                             background-repeat: no-repeat;
                                                                                             background-size: cover;
                                                                                             /* Suavidade na transição de estilo */
                                                                                             transition: transform 0.1s ease-out, opacity 0.1s ease-out;
                                                                                             will-change: transform, opacity;
                                                                                             z-index: 1;
                                                                                         }
                                                                                         /* Conteúdo Principal */
                                                                                         
                                                                                         .hero-container {
                                                                                             position: relative;
                                                                                             z-index: 3;
                                                                                             max-width: 1100px;
                                                                                             width: 100%;
                                                                                         }
                                                                                         /* AREA DE SUBMENUS EM SERVICOS ABAIXO DO MENU*/
                                                                                         /* Faixa intermediária */
                                                                                         
                                                                                         .transicao-branco-preto {
                                                                                             height: 100px;
                                                                                             /* Ajuste a altura para controlar a suavidade da transição */
                                                                                             background: linear-gradient(to bottom, #ffffff, #0a0a12);
                                                                                         }
                                                                                         
                                                                                         .submenu {
                                                                                             font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
                                                                                             color: #111;
                                                                                             background-color: #fff;
                                                                                         }
                                                                                         /* Submenu Topo */
                                                                                         
                                                                                         .subnav-link {
                                                                                             color: #111;
                                                                                             text-decoration: none;
                                                                                             font-weight: 500;
                                                                                             padding-bottom: 8px;
                                                                                             font-size: 0.95rem;
                                                                                         }
                                                                                         
                                                                                         .subnav-link.active {
                                                                                             border-bottom: 3px solid #111;
                                                                                             font-weight: 700;
                                                                                         }
                                                                                         
                                                                                         .subnav-brand {
                                                                                             font-weight: 800;
                                                                                             font-size: 1.1rem;
                                                                                             text-decoration: none;
                                                                                             color: #111;
                                                                                         }
                                                                                         /* Card de Imagem */
                                                                                         
                                                                                         .banner-card {
                                                                                             background-color: #d8c3b0;
                                                                                             border-radius: 16px;
                                                                                             overflow: hidden;
                                                                                             position: relative;
                                                                                             min-height: 380px;
                                                                                         }
                                                                                         
                                                                                         .banner-img {
                                                                                             width: 100%;
                                                                                             height: 100%;
                                                                                             object-fit: cover;
                                                                                             display: block;
                                                                                         }
                                                                                         /* Caixa Flutuante Informativa */
                                                                                         
                                                                                         .floating-info-box {
                                                                                             background-color: #fff;
                                                                                             border-radius: 8px;
                                                                                             padding: 16px;
                                                                                             box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
                                                                                             font-size: 0.80rem;
                                                                                             line-height: 1.4;
                                                                                             max-width: 320px;
                                                                                             color: #333;
                                                                                         }
                                                                                         /* Título e Lista */
                                                                                         
                                                                                         .section-subtitle {
                                                                                             letter-spacing: 1.5px;
                                                                                             font-weight: 700;
                                                                                             font-size: 0.8rem;
                                                                                         }
                                                                                         
                                                                                         .main-title {
                                                                                             font-size: 2.5rem;
                                                                                             font-weight: 800;
                                                                                             line-height: 1.15;
                                                                                         }
                                                                                         
                                                                                         .feature-list {
                                                                                             list-style: none;
                                                                                             padding: 0;
                                                                                         }
                                                                                         
                                                                                         .feature-list li {
                                                                                             font-size: 1.05rem;
                                                                                             margin-bottom: 12px;
                                                                                             display: flex;
                                                                                             align-items: center;
                                                                                             gap: 12px;
                                                                                         }
                                                                                         
                                                                                         .feature-list i {
                                                                                             font-size: 1.25rem;
                                                                                         }
                                                                                         
                                                                                         .dashed-underline {
                                                                                             text-decoration: underline dotted;
                                                                                             text-underline-offset: 4px;
                                                                                         }
                                                                                         /* Botão Principal */
                                                                                         
                                                                                         .btn-godaddy-blue {
                                                                                             background-color: #ff2424;
                                                                                             color: white;
                                                                                             font-weight: 700;
                                                                                             padding: 12px 28px;
                                                                                             border-radius: 6px;
                                                                                             border: none;
                                                                                             text-decoration: none;
                                                                                             display: inline-block;
                                                                                         }
                                                                                         
                                                                                         .btn-godaddy-blue:hover {
                                                                                             background-color: #fa3e3e;
                                                                                             color: white;
                                                                                         }
                                                                                         /* Avaliações */
                                                                                         
                                                                                         .stars-badge {
                                                                                             background-color: #8b0000;
                                                                                             color: white;
                                                                                             padding: 4px 6px;
                                                                                             display: inline-flex;
                                                                                             gap: 2px;
                                                                                             align-items: center;
                                                                                         }
                                                                                         
                                                                                         .rating-text {
                                                                                             font-size: 0.875rem;
                                                                                             font-weight: 600;
                                                                                         }
                                                                                         /* FIM AREA DE SUBMENUS EM SERVICOS ABAIXO DO MENU */
                                                                                         
                                                                                         .btn-topbar-mobile {
                                                                                             font-size: 0.55rem;
                                                                                             /* Ajuste aqui o tamanho desejado (ex: 11px ou 12px) */
                                                                                             padding: 0.25rem 0.5rem;
                                                                                             /* Opcional: ajusta o espaçamento interno para caber melhor */
                                                                                         }
                                                                                         
                                                                                         .bg-image-tech {
                                                                                             background-image: url('https://images.unsplash.com/photo-1518770660439-4636190af475?ixlib=rb-4.0.3&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1740&q=80');
                                                                                             /* Substitua por sua imagem tecnológica preferida */
                                                                                             background-size: cover;
                                                                                             background-position: center;
                                                                                             background-repeat: no-repeat;
                                                                                         }
                                                                                         /* AREA DE FORMULARIO */
                                                                                         
                                                                                         .orbitron-font {
                                                                                             font-family: 'Orbitron', sans-serif;
                                                                                         }
                                                                                         /* Banner Titulo */
                                                                                         
                                                                                         .banner-titulo {
                                                                                             background-color: var(--primary-color);
                                                                                             color: #ffffff;
                                                                                             letter-spacing: 1.5px;
                                                                                             box-shadow: 0 0 15px rgba(139, 0, 0, 0.5);
                                                                                             border: 1px solid rgba(255, 0, 85, 0.3);
                                                                                         }
                                                                                         /* Cards Cyberpunk */
                                                                                         
                                                                                         .cyber-card {
                                                                                             background: var(--card-bg);
                                                                                             border: 1px solid rgba(139, 0, 0, 0.2);
                                                                                             backdrop-filter: blur(10px);
                                                                                             box-shadow: 0 0 15px rgba(0, 0, 0, 0.5);
                                                                                         }
                                                                                         
                                                                                         .summary-card {
                                                                                             background: rgba(15, 15, 28, 0.95);
                                                                                             border: 1px solid rgba(255, 255, 255, 0.1);
                                                                                             backdrop-filter: blur(10px);
                                                                                         }
                                                                                         /* Form Controls Customizados */
                                                                                         
                                                                                         .form-label {
                                                                                             color: var(--text-color);
                                                                                             letter-spacing: 0.5px;
                                                                                         }
                                                                                         
                                                                                         .form-label i {
                                                                                             color: var(--secondary-color);
                                                                                         }
                                                                                         
                                                                                         .select-wrapper {
                                                                                             position: relative;
                                                                                         }
                                                                                         
                                                                                         .form-select-custom {
                                                                                             background-color: rgba(10, 10, 18, 0.85);
                                                                                             color: #fff;
                                                                                             border: 1px solid var(--secondary-color);
                                                                                             box-shadow: 0 0 5px rgba(139, 0, 0, 0.2);
                                                                                             transition: all 0.3s ease;
                                                                                         }
                                                                                         
                                                                                         .form-select-custom:focus {
                                                                                             background-color: rgba(10, 10, 18, 0.95);
                                                                                             color: #fff;
                                                                                             border-color: var(--secondary-color);
                                                                                             box-shadow: 0 0 12px rgba(139, 0, 0, 0.5);
                                                                                         }
                                                                                         
                                                                                         .form-select-custom option {
                                                                                             background-color: #0a0a12;
                                                                                             color: #fff;
                                                                                         }
                                                                                         /* Ícone de Check verde dentro do Select */
                                                                                         
                                                                                         .select-wrapper::after {
                                                                                             content: "\f00c";
                                                                                             font-family: "Font Awesome 6 Free";
                                                                                             font-weight: 900;
                                                                                             position: absolute;
                                                                                             right: 15px;
                                                                                             top: 50%;
                                                                                             transform: translateY(-50%);
                                                                                             color: var(--secondary-color);
                                                                                             pointer-events: none;
                                                                                             font-size: 0.95rem;
                                                                                         }
                                                                                         /* Valores e Divisores */
                                                                                         
                                                                                         .summary-divider {
                                                                                             height: 1px;
                                                                                             background: rgba(139, 0, 0, 0.2);
                                                                                         }
                                                                                         
                                                                                         .summary-total-value {
                                                                                             color: var(--secondary-color);
                                                                                             text-shadow: 0 0 8px rgba(139, 0, 0, 0.4);
                                                                                             ;
                                                                                         }
                                                                                         /* Botão Customizado */
                                                                                         
                                                                                         .btn-cyber {
                                                                                             background: var(--primary-color);
                                                                                             color: #fff;
                                                                                             border: 1px solid var(--primary-glow);
                                                                                             box-shadow: 0 0 10px rgba(139, 0, 0, 0.5);
                                                                                             transition: all 0.3s ease;
                                                                                         }
                                                                                         
                                                                                         .btn-cyber:hover {
                                                                                             background: var(--primary-glow);
                                                                                             color: #fff;
                                                                                             box-shadow: 0 0 20px var(--primary-glow);
                                                                                             transform: translateY(-2px);
                                                                                         }
                                                                                         /* FIM AREA DE FORMULARIO */
                                                                                         /* --- RESET & VARIÁVEIS CYBERPUNK --- */
                                                                                         /* --- SEÇÃO DE RECURSOS --- */
                                                                                         
                                                                                         .grid-recursos {
                                                                                             display: grid;
                                                                                             grid-template-columns: repeat(4, 1fr);
                                                                                             gap: 20px;
                                                                                             background: var(--cor-card);
                                                                                             border: 1px solid rgba(139, 0, 0, 0.5);
                                                                                             border-radius: 8px;
                                                                                             padding: 40px 20px;
                                                                                             backdrop-filter: blur(10px);
                                                                                             box-shadow: 0 0 20px rgba(0, 0, 0, 0.4);
                                                                                         }
                                                                                         
                                                                                         .item-recurso {
                                                                                             text-align: center;
                                                                                             padding: 10px;
                                                                                             position: relative;
                                                                                         }
                                                                                         
                                                                                         .item-recurso__marcador {
                                                                                             position: absolute;
                                                                                             top: 0;
                                                                                             left: 50%;
                                                                                             transform: translateX(-55px);
                                                                                             width: 20px;
                                                                                             height: 20px;
                                                                                             border-radius: 50%;
                                                                                             border: 1px solid rgba(255, 255, 255, 0.3);
                                                                                             display: flex;
                                                                                             align-items: center;
                                                                                             justify-content: center;
                                                                                             font-size: 0.6rem;
                                                                                             color: rgba(255, 255, 255, 0.6);
                                                                                         }
                                                                                         
                                                                                         .item-recurso__circulo-icone {
                                                                                             width: 90px;
                                                                                             height: 90px;
                                                                                             background: radial-gradient(circle, #de0e12 0%, #5c0103 100%);
                                                                                             border-radius: 50%;
                                                                                             display: flex;
                                                                                             align-items: center;
                                                                                             justify-content: center;
                                                                                             margin: 0 auto 20px auto;
                                                                                             box-shadow: 0 0 20px rgba(252, 7, 7, 0.4);
                                                                                             border: 2px solid rgba(255, 255, 255, 0.2);
                                                                                             transition: transform 0.3s ease, box-shadow 0.3s ease;
                                                                                         }
                                                                                         
                                                                                         .item-recurso:hover .item-recurso__circulo-icone {
                                                                                             transform: translateY(-5px);
                                                                                             box-shadow: 0 0 30px rgba(255, 0, 0, 0.7);
                                                                                         }
                                                                                         
                                                                                         .item-recurso__circulo-icone i {
                                                                                             font-size: 2.2rem;
                                                                                             color: #ffffff;
                                                                                         }
                                                                                         
                                                                                         .item-recurso__titulo {
                                                                                             font-family: 'Orbitron', sans-serif;
                                                                                             font-size: 1.05rem;
                                                                                             font-weight: 700;
                                                                                             color: #ffffff;
                                                                                             margin-bottom: 12px;
                                                                                             letter-spacing: 0.5px;
                                                                                         }
                                                                                         
                                                                                         .item-recurso__descricao {
                                                                                             font-size: 0.9rem;
                                                                                             color: var(--cor-texto-suave);
                                                                                             line-height: 1.4;
                                                                                         }
                                                                                         /* RESPONSIVIDADE */
                                                                                         
                                                                                         @media (max-width: 850px) {
                                                                                             .grid-recursos {
                                                                                                 grid-template-columns: repeat(2, 1fr);
                                                                                                 gap: 30px;
                                                                                             }
                                                                                         }
                                                                                         
                                                                                         @media (max-width: 500px) {
                                                                                             .grid-recursos {
                                                                                                 grid-template-columns: 1fr;
                                                                                             }
                                                                                         }