/* Fonte personalizada */ @import url("https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;700&display=swap");

/* Variáveis de cores para facilitar mudanças */ :root { --background-gradient: linear-gradient(to bottom, #1e293b, #0f172a); --text-color: #f1f5f9; --accent-color: #38bdf8; --link-hover: #0ea5e9; --shadow-color: rgba(0, 0, 0, 0.3); }

/* Estilização geral */ body { font-family: 'Nunito', sans-serif; background: var(--background-gradient); color: var(--text-color); margin: 0; padding: 0; display: flex; justify-content: center; align-items: center; height: 100vh; overflow: hidden; transition: all 0.3s ease-in-out; }

/* Transição suave ao passar o mouse */ body:hover { background: linear-gradient(to bottom, #0f172a, #1e293b); }

/* Adicionando sombra para o conteúdo */ main { background: rgba(255, 255, 255, 0.05); padding: 30px; border-radius: 15px; box-shadow: 0 10px 20px var(--shadow-color); text-align: center; max-width: 600px; transition: transform 0.2s ease-in-out; }

main:hover { transform: scale(1.02); }

/* Estilização do título */ h1 { font-size: 2.5rem; font-weight: 700; margin-bottom: 15px; color: var(--accent-color); text-transform: uppercase; text-shadow: 0 4px 6px var(--shadow-color); }

/* Parágrafo de texto */ p { font-size: 1.1rem; font-weight: 300; line-height: 1.6; margin-bottom: 20px; }

/* Botões ou links */ a { display: inline-block; font-weight: 700; color: var(--accent-color); background-color: transparent; text-decoration: none; border: 2px solid var(--accent-color); padding: 10px 20px; border-radius: 5px; transition: all 0.3s ease-in-out; }

a:hover { background-color: var(--accent-color); color: var(--text-color); box-shadow: 0 5px 15px var(--shadow-color); } CASO PRECISE TESTAR

Bem-vindo(a) ao Meu Portfólio!

Este é o lugar onde eu compartilho minha paixão por design e desenvolvimento. Explore minhas criações e veja como transformo ideias em realidade.