/*
 * La firma del artículo y la ficha de la página de autor.
 *
 * Van en su propio fichero y no en style.css a propósito: style.css es enorme
 * y se queda pegado en la caché del navegador y de Cloudflare, y hasta que se
 * refresca la foto sale cuadrada y los iconos del color equivocado. Este
 * fichero es nuevo, así que se sirve limpio desde el primer momento.
 *
 * Los !important son para ganarle a las reglas viejas de style.css que siguen
 * ahí dentro; cuando esa copia caduque se pueden quitar.
 */

/* --- Firma debajo del titular: foto pequeña, redonda, y el nombre --- */
.pce-article-meta .pce-firma {
  display: inline-flex !important; align-items: center; gap: 8px;
  color: inherit; font-weight: 700; text-decoration: none;
}
.pce-article-meta .pce-firma-foto {
  width: 26px !important; height: 26px !important;
  min-width: 26px; border-radius: 50% !important;
  object-fit: cover; flex: 0 0 auto;
}
.pce-article-meta .pce-firma:hover { color: var(--brand); }

/* --- Ficha de la página de autor --- */
.pce-autor-ficha {
  display: flex; flex-direction: column; align-items: center; gap: 10px;
  max-width: 620px; margin: 0 auto; text-align: center;
}
.pce-autor-ficha .pce-autor-foto {
  width: 68px !important; height: 68px !important;
  border-radius: 50% !important; object-fit: cover; flex: 0 0 auto;
  border: 2px solid rgba(255, 255, 255, .85);
}
.pce-autor-datos h1 { margin: 0; font-size: 30px; line-height: 1.15; }
.pce-autor-rol { margin: 4px 0 0; font-weight: 700; font-size: 14px; opacity: .92; }
.pce-autor-bio { margin: 10px 0 0; font-size: 15px; line-height: 1.55; opacity: .95; }

/*
 * Redes: círculo BLANCO con el icono oscuro. Antes eran iconos blancos sobre
 * un borde translúcido y, encima del degradado rojo de la cabecera, no se
 * veían; el usuario lo dijo tal cual: «el color confunde, no se ven».
 */
.pce-autor-redes { display: flex; flex-wrap: wrap; gap: 9px; justify-content: center; margin-top: 15px; }
.pce-autor-redes a {
  display: inline-flex !important; align-items: center; justify-content: center;
  width: 38px; height: 38px; border-radius: 50%;
  background: #fff !important; color: #1f2328 !important;
  border: 0; text-decoration: none;
  box-shadow: 0 2px 8px rgba(0, 0, 0, .18);
  transition: transform .15s ease, box-shadow .15s ease;
}
.pce-autor-redes a:hover { transform: translateY(-2px); box-shadow: 0 5px 14px rgba(0, 0, 0, .26); }
.pce-autor-redes svg { width: 18px; height: 18px; display: block; }

@media (max-width: 600px) {
  .pce-autor-ficha .pce-autor-foto { width: 60px !important; height: 60px !important; }
  .pce-autor-datos h1 { font-size: 25px; }
  .pce-autor-bio { font-size: 14.5px; }
  .pce-autor-redes a { width: 36px; height: 36px; }
}

@media (prefers-reduced-motion: reduce) {
  .pce-autor-redes a { transition: none; }
}