:root{
  --text-color: #ffffff;
  --accent: #c6b06e; /* dourado sutil para títulos */
}

/* Fundo com gradiente escuro / azul, mantendo aparência da imagem */
.biobg{
  background: radial-gradient( circle at 10% 10%, rgba(12,27,39,0.6) 0%, rgba(5,12,18,0.9) 30%, rgba(2,6,10,1) 100% ), linear-gradient(135deg, rgba(3,12,24,0.6) 0%, rgba(6,18,34,0.45) 50%, rgba(2,8,18,0.9) 100% );
  color: var(--text-color);
  font-family: 'Montserrat', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial;
}

.profile-wrap{ width:170px; height:170px; border-radius:28px; padding:6px; background: linear-gradient(180deg, rgba(198,176,110,0.25), rgba(198,176,110,0.15)); display:flex; align-items:center; justify-content:center; border:4px solid rgba(198,176,110,0.9);}
.profile-img{ width:100%; height:100%; object-fit:cover; border-radius:20px; display:block; }

.display-name{ font-family: 'Bungee', 'Montserrat', sans-serif; font-size:34px; letter-spacing:2px; margin-top:6px; color:#ffffff; text-shadow: 0 2px 0 rgba(0,0,0,0.4);} 
.subtitle{ color: var(--accent); font-weight:700; margin-top:4px; letter-spacing:1px; }
.divider{ font-size:30px; color:#ffffff; opacity:0.85; margin-top:8px; }
.description{ color:#ffffff; opacity:0.95; line-height:1.6; font-size:16px; }

.platforms-title{ color:var(--accent); font-weight:700; letter-spacing:3px; font-size:22px; }

/* Cards */
.platform-card{ background: linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01)); border:1px solid rgba(255,255,255,0.06); border-radius:14px; padding:12px; box-shadow: 0 6px 24px rgba(2,6,10,0.6);}
.card-illustration{ max-width:120px; width:100%; height:auto; border-radius:10px; box-shadow: 0 6px 16px rgba(0,0,0,0.6); }
.card-title{ color:var(--accent); font-weight:800; font-size:20px; margin-bottom:6px; }
.card-text{ color:#ffffff; opacity:0.9; font-size:14px; }
.btn-cta{ border-radius:28px; padding:10px 14px; border:2px solid rgba(198,176,110,0.95); background:transparent; color:var(--text-color); font-weight:700; font-size:13px; text-decoration:none; }
.btn-cta:hover{ background: rgba(198,176,110,0.08); color:var(--text-color); }

/* Responsividade */
@media (max-width: 575px){
  .profile-wrap{ width:150px; height:150px; }
  .display-name{ font-size:28px; }
  .description{ font-size:15px; padding-left:6px; padding-right:6px; }
  .card-illustration{ max-width:100px; }
}

@media (max-width: 400px){
  .display-name{ font-size:24px; }
  .profile-wrap{ width:130px; height:130px; }
}
.social-links a {
  transition: transform 0.2s ease, color 0.2s ease;
}

.social-links a:hover {
  transform: scale(1.2);
  color: #00aaff;
}
.social-links a:active {
  transform: scale(0.95);
  color: #0077cc;
}