🌸 Endria Carem — Portfólio

Desenvolvedora Full Stack · Prêmio 3M 25 Mulheres na Ciência · Fundadora da World Girls Tech

🔗 Acessar o site → endriacarem.github.io/mypage.github.io

---

✨ Sobre o Projeto

Landing page pessoal desenvolvida do zero com HTML, CSS e JavaScript puro — sem frameworks, sem dependências pesadas. Design sofisticado com tema escuro/claro, animações suaves e experiência imersiva.

👉 Site no ar: https://endriacarem.github.io/mypage.github.io/

---

🎨 Funcionalidades

Recurso	Descrição
🌗 Tema claro / escuro	Alternância com persistência via localStorage
📻 Music Player	Player com rádios online sem anúncios (SomaFM / Radio Paradise) + playlist instrumental opcional
🌺 Favicon personalizado	Lírio branco com centro lilás desenhado em SVG puro
✨ Scroll Reveal	Elementos entram com fade + slide ao aparecerem na tela
🖱️ Cursor personalizado	Cursor e anel seguidor com transição suave via requestAnimationFrame
🎯 Botões magnéticos	CTAs do hero que seguem levemente o cursor
🏆 Seção Destaques	Card do Prêmio ClientConnect / 3M e carrossel da comunidade World Girls Tech
📊 Barras de habilidades	Animação por seção com efeito cintilante lilás/branco no scroll
📱 Responsivo	Breakpoints para mobile (576px) e tablet (768px)
💫 Partículas	Fundo com particles.js integrado

---

🗂️ Estrutura

mypage.github.io/
├── index.html          # Estrutura principal
├── styles.css          # Todos os estilos (tema, animações, componentes)
├── script.js           # Interatividade, player de música, carrossel, efeitos
└── assets/
    └── images/
        ├── favicon.svg         # Lírio SVG personalizado
        ├── endria-perfil.jpg   # Foto de perfil (hero)
        ├── eu.png              # Foto da seção Sobre
        ├── premio.png          # Imagem do prêmio 3M
        ├── player-mascot.png   # Mascote do player de música
        ├── comunidade-1.png    # Slides do carrossel World Girls Tech
        ├── comunidade-2.png
        ├── comunidade-3.png
        └── comunidade-4.png

---

🛠️ Tecnologias

• HTML5 semântico
• CSS3 — variáveis, grid, flexbox, keyframes, glassmorphism, gradientes
• JavaScript ES6+ — IntersectionObserver, áudio HTML5, YouTube IFrame API, touch events
• particles.js — fundo de partículas
• Font Awesome 6 — ícones
• Google Fonts — Inter

---

🚀 Como rodar localmente

# Clone o repositório
git clone https://github.com/EndriaCarem/mypage.github.io.git

# Entre na pasta
cd mypage.github.io

# Abra com qualquer servidor estático, ex:
python3 -m http.server 8000
# depois acesse http://localhost:8000

# ou simplesmente abra index.html no navegador

---

🏅 Reconhecimentos

• 3M — 25 Mulheres na Ciência (Edição Especial Indústria): projeto ClientConnect reconhecido entre as 25 iniciativas de destaque no Brasil.
• World Girls Tech: comunidade fundada para fortalecer a presença feminina na tecnologia — @world_girls_tech

---

🔗 Acessar o site ao vivo

Feito com 💜 por Endria Carem

LinkedIn · GitHub · Instagram