/* Redes sociales de FerStudio (pie, menú lateral y fichas). Logos oficiales de Simple Icons (CC0). */
.redes{margin-block:18px 16px}
.redes-titulo{font-family:var(--f-titulo);font-weight:700;font-size:.9375rem;color:var(--tinta);margin:0 0 10px}
.redes-lista{list-style:none;display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0}
.red{--rc:#000;width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:var(--rc);color:#fff;
  text-decoration:none;box-shadow:0 3px 0 rgba(0,0,0,.22);transition:transform .12s ease-out,box-shadow .12s,filter .15s}
.red:hover{transform:translateY(-2px);filter:brightness(1.08)}
.red:active{transform:translateY(2px);box-shadow:0 1px 0 rgba(0,0,0,.22)}
.red:focus-visible,.red-tarjeta:focus-visible{outline:3px solid var(--amarillo);outline-offset:3px}
.red-logo{width:22px;height:22px}
.red--youtube{--rc:#ff0000}
.red--tiktok{--rc:#000}
.red--whatsapp{--rc:#25d366}
.red--x{--rc:#000}
.red--instagram{--rc:#ff0069;background:radial-gradient(circle at 30% 107%,#fdf497 0%,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285aeb 90%)}
:root[data-tema="oscuro"] .red--tiktok,:root[data-tema="oscuro"] .red--x{box-shadow:0 0 0 1px #3b4470,0 3px 0 rgba(0,0,0,.4)}
@media (prefers-color-scheme:dark){:root:not([data-tema="claro"]) .red--tiktok,:root:not([data-tema="claro"]) .red--x{box-shadow:0 0 0 1px #3b4470,0 3px 0 rgba(0,0,0,.4)}}

.cajon-redes{padding:14px 18px 6px;border-top:1px solid var(--linea)}

.siguenos-txt{color:var(--texto-2);margin:-4px 0 14px;font-size:.9375rem}
.redes-tarjetas{list-style:none;margin:0;padding:0;display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(190px,1fr))}
.red-tarjeta{display:flex;align-items:center;gap:12px;padding:10px 14px 10px 10px;border-radius:16px;border:1px solid var(--linea);
  background:var(--sup);color:var(--tinta);text-decoration:none;transition:transform .12s ease-out,border-color .15s}
.red-tarjeta:hover{transform:translateY(-2px);border-color:var(--linea-fuerte)}
.red-tarjeta .red-icono{--rc:#000;flex:none;width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:var(--rc);color:#fff}
.red-tarjeta.red--youtube .red-icono{--rc:#ff0000}
.red-tarjeta.red--whatsapp .red-icono{--rc:#25d366}
.red-tarjeta.red--instagram .red-icono{background:radial-gradient(circle at 30% 107%,#fdf497 0%,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285aeb 90%)}
.red-tarjeta .red-logo{width:22px;height:22px}
.red-tarjeta .red-txt{display:grid;line-height:1.2;min-width:0}
.red-tarjeta strong{font-family:var(--f-titulo);font-size:1rem}
.red-tarjeta small{font-size:.8125rem;color:var(--texto-2)}
:root[data-tema="oscuro"] .red-tarjeta.red--tiktok .red-icono,:root[data-tema="oscuro"] .red-tarjeta.red--x .red-icono{box-shadow:0 0 0 1px #3b4470}

/* Más específico que los estilos generales del pie (.pie ul / .pie ul a) y del menú lateral (.cajon a). */
.pie .redes-lista,.cajon .redes-lista{display:flex;flex-wrap:wrap;gap:10px}
.pie .redes-lista a.red,.cajon .redes-lista a.red{display:grid;place-items:center;width:44px;height:44px;padding:0;gap:0;color:#fff;text-decoration:none;font-weight:400}
.pie .redes-lista a.red:hover,.cajon .redes-lista a.red:hover{color:#fff;text-decoration:none;background:var(--rc)}
.cajon .redes-lista a.red--instagram:hover,.pie .redes-lista a.red--instagram:hover{background:radial-gradient(circle at 30% 107%,#fdf497 0%,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285aeb 90%)}
.pie .red-logo,.cajon .red-logo{width:22px;height:22px;flex:none}