* { margin: 0; padding: 0; box-sizing: border-box; font-family: 'Segoe UI', sans-serif; }

html { scroll-behavior: smooth; }

:root { --primary-color: #4f46e5; --secondary-color: #7c3aed; --dark: #0f172a; --moredark: #0a0f1c; --light: #e2e8f0; --glass: rgba(255, 255, 255, 0.1); }

body { background-color: var(--dark); color: var(--light); }

.navegação { position: fixed; top:0; background:rgba(255, 255, 255, 0.1); width: 100%; z-index: 100; padding: 1.5rem; }

.menu {display: flex; list-style: none; justify-content: center; gap: 3rem;}

.menu-link { text-decoration: none; color: var(--light); font-weight: 500; position: relative; padding: 0.5rem;}

.menu-link::after { content: ''; height: 2px; width: 0; position: absolute; bottom: 0; left: 0; background: linear-gradient(90deg, var(--primary-color), var(--secondary-color)); transition: width 0.5s ease; }

.menu-link:hover::after { width: 100%; }

.cabecalho { min-height: 100vh; display: flex; justify-content: center; align-items: center; flex-direction: column; }

.foto-perfil { width: 350px; height: 350px; box-shadow: 0 0 20px rgba(79, 70, 229, 0.3); border-radius: 50%; border: 4px solid var(--glass); animation: flutuar 5s ease-in-out infinite; }

h1 { font-size: 3.5rem; color: var(--primary-color); font-weight: bold; margin: 20px;}

.cabecalho-sub-titulo { font-size: 2rem; color: var(--light);}

.sobre { padding: 20px; display: flex; flex-direction: column; align-items: center; margin-bottom: 4rem; gap: 20px;}

.sobre-titulo { font-size: 3rem; color: var(--light); margin-bottom: 20px; text-align: center;}

.sobre-caixa { padding: 1rem; max-width: 800px; margin: 0 auto; border-radius: 20px; border: 1px solid var(--glass); backdrop-filter: blur(10px); background: rgba(255, 255, 255, 0.1);}

.sobre-paragrafo { text-align: center; font-size: 1.25rem;}

.projetos {padding: 6rem 2rem; margin-bottom: 4rem;}

.projetos-caixa {display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; }

.projetos-card {transition: all 0.5s ease; border-radius: 16px; border: 1px solid var(--glass); backdrop-filter: blur(5px); overflow: hidden; padding: 1rem;}

.projetos-titulo {text-align: center; font-size: 2.5rem; color: var(--light); margin-bottom: 40px;}

.projetos-card:hover {box-shadow: 0 10px 20px rgba(79, 70, 229, 0.2); transform: translateY(-10px) scale(1.03); transition: all 0.5s ease; cursor: pointer;}

.projetos-imagem {width: 100%; height: 200px; object-fit: cover; border-radius: 12px;}

.caixa-textos-projetos {padding: 1.5rem;}

.paragrafo-objetos {color: rgba(226, 232, 240, 0.8); line-height: 1.25rem;}

.info-projetos {margin-bottom: 5px;}

.contatos {padding: 6rem 2rem; display: flex; flex-direction: column; align-items: center;}

.contatos-titulo {text-align: center; font-size: 2.5rem; margin-bottom: 40px;}

.formulario-contato {width: 100%; max-width: 600px; margin: 0 auto; background: rgba(255, 255, 255, 0.1); backdrop-filter: blur(5px); padding: 2rem; border: 1px solid var(--glass); border-radius: 20px;}

.campo-form {width: 100%; padding: 1rem; background: rgba(255, 255, 255, 0.1); border-radius: 8px; color: var(--light); border: 1px solid var(--glass); outline: none; }

.campo-form:focus {border-color: var(--secondary-color); box-shadow: 0 0 10px rgba(79, 70, 229, 0.5);}

.grupo-form {margin-bottom: 1.5rem;}

.botao-form {color: var(--light); background: linear-gradient(45deg, var(--primary-color), var(--secondary-color)); border: none; padding: 1rem 2rem; border-radius: 8px; cursor: pointer; font-weight: bold; width: 100%; transition: all 0.5s ease;}

.botao-form:hover {transform: translateY(-4px); box-shadow: 0 5px 15px rgba(79, 70, 229, 0.4);}

.particulas {position: fixed; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; z-index: -1; opacity: 0.5; background-image: radial-gradient(circle at 10% 20%, var(--primary-color), transparent 70%), radial-gradient(circle at 90% 80%, var(--secondary-color), transparent 70%), radial-gradient(circle at 50% 80%, var(--primary-color), transparent 70%); }

@keyframes flutuar { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-20px); } }