/* sitio-comun.css - Estilos compartidos por todas las páginas públicas
   (redes sociales, botón flotante de WhatsApp, íconos de contacto) */

.hb-social { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.hb-social a {
    width: 46px;
    height: 46px;
    border-radius: 50%;
    display: inline-grid;
    place-items: center;
    background: #f1c50e;
    color: #0b0b0c !important;
    font-size: 1.3rem;
    text-decoration: none !important;
    transition: transform .25s ease, background .25s ease;
}
.hb-social a:hover { transform: translateY(-3px); background: #ffd84a; }
.hb-social-lg a { width: 58px; height: 58px; font-size: 1.6rem; }
.u-section-3 .hb-social { justify-content: flex-start; }
@media (max-width: 767px) { .u-section-3 .hb-social { justify-content: center; } }

/* En el footer los íconos van alineados a la derecha, como en el diseño original */
.hb-social-footer { position: relative; float: right; margin: 22px 0 0; }
.hb-social-footer a { width: 36px; height: 36px; font-size: 1rem; background: #fff; }
.hb-social-footer a:hover { background: #f1c50e; }
@media (max-width: 767px) { .hb-social-footer { float: none; justify-content: center; margin: 16px auto; } }

/* Íconos de la sección Contacto */
.hb-contact-icon { display: inline-grid !important; place-items: center; font-size: 1.6rem; }

/* Botón flotante de WhatsApp */
.hb-wa-float {
    position: fixed;
    right: 28px;
    bottom: 28px;
    z-index: 1000;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: #25d366;
    color: #fff !important;
    display: grid;
    place-items: center;
    font-size: 1.9rem;
    box-shadow: 0 8px 24px rgba(0,0,0,.25);
    text-decoration: none !important;
    transition: transform .25s ease, background .25s ease;
}
.hb-wa-float:hover { transform: scale(1.08); background: #1ebe5a; }
@media (max-width: 575px) { .hb-wa-float { right: 16px; bottom: 16px; width: 54px; height: 54px; font-size: 1.7rem; } }

.hb-negrita { font-weight: 700; }

/* Fondo animado de "Síguenos en nuestras redes" (assets/js/web-desarmada.js) */
.hb-con-animacion { position: relative; overflow: hidden; }
.hb-con-animacion > .hb-code-bg { position: absolute !important; inset: 0; width: 100%; height: 100%; margin: 0 !important; z-index: 0; pointer-events: none; }
.hb-con-animacion > .u-sheet { position: relative; z-index: 1; }
/* Degradé para que el texto de la izquierda se lea siempre bien */
.hb-con-animacion::after {
    content: '';
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    background: linear-gradient(90deg, rgba(0,0,0,.85) 0%, rgba(0,0,0,.55) 38%, rgba(0,0,0,0) 60%);
}
@media (max-width: 767px) {
    .hb-con-animacion::after { background: rgba(0,0,0,.6); }
    .hb-con-animacion .u-text { text-shadow: 0 1px 6px rgba(0,0,0,.95); }
}
/* Los íconos quedan por encima con un leve halo para separarse del fondo */
.hb-con-animacion .hb-social a { box-shadow: 0 0 0 6px rgba(0,0,0,.55), 0 8px 22px rgba(0,0,0,.5); }

/* Menú del header: en pantallas medianas se achica para que entren todos los ítems sin tapar el logo */
@media (min-width: 992px) and (max-width: 1299px) {
    .u-header .u-nav-1 > .u-nav-item > .u-nav-link { padding: 10px 9px !important; font-size: .86rem !important; }
}