@charset "UTF-8";

/* --------- BASE --------- */
body {
  background:#0a0a0a;
  color:#f2f2f2;
  font-family:Verdana,Arial,sans-serif;
  font-size:14px;
  line-height:1.6;
  margin:0;
  padding:0;
}

/* Links */
a:link,a:active,a:hover {
  color:#ff2e92;
  text-decoration:none;
  font-weight:bold;
}

a:visited {
  color:#ff63b2;
}

/* Títulos */
h1,h2,h3 {
  color:#ff2e92;
  text-transform:uppercase;
  letter-spacing:2px;
  text-align:center;
  margin:10px 0;
}

/* Contenedor principal */
.profileBox,.section {
  background:rgba(255,255,255,0.05);
  border:2px solid #ff2e92;
  border-radius:12px;
  padding:16px;
  margin:14px auto;
  width:92%;
  max-width:980px;
  box-shadow:0 0 12px rgba(255,46,146,.25);
}

/* Banner */
.banner {
  background:#000 url(https://i.imgur.com/xgV6tVd.jpeg) center/cover no-repeat;
  height:220px;
  border:3px solid #ff2e92;
  border-radius:14px;
}

/* Filas */
.row {
  display:flex;
  gap:14px;
  flex-wrap:wrap;
}

.col {
  flex:1 1 300px;
}

/* Listas bonitas */
.ul-clean {
  list-style:none;
  padding:0;
  margin:0;
}

.ul-clean li {
  padding:8px 10px;
  margin:6px 0;
  background:rgba(255,46,146,.08);
  border-left:3px solid #ff2e92;
  border-radius:6px;
}

/* Tablas */
.table {
  width:100%;
  border-collapse:collapse;
  overflow:hidden;
  border-radius:10px;
  border:1px solid #ff2e92;
}

.table th,.table td {
  padding:10px;
  text-align:left;
}

.table thead {
  background:rgba(255,46,146,.15);
}

.table tr:nth-child(even) {
  background:rgba(255,255,255,.03);
}

/* Tags */
.tag {
  display:inline-block;
  margin:4px;
  padding:6px 10px;
  border:1px solid #ff63b2;
  border-radius:999px;
  font-size:12px;
  color:#ffd9ec;
  background:rgba(255,46,146,.12);
}

/* Imágenes */
img {
  max-width:100%;
  border-radius:10px;
  border:3px solid #ff2e92;
  transition:transform .25s;
}

img:hover {
  transform:scale(1.03);
  border-color:#ff63b2;
}

/* Botón */
.btn {
  display:inline-block;
  padding:10px 16px;
  border-radius:10px;
  background:#ff2e92;
  color:#fff;
  font-weight:bold;
  box-shadow:0 0 10px rgba(255,46,146,.45);
}

/* Pie */
.small {
  font-size:12px;
  color:#bbbbbb;
}

.center {
  text-align:center;
}