/* Avisos de la Hermandad: tipografías corporativas de la web (Merriweather en titulares, Open Sans en textos) */
.hsa-aviso { --hsa-fondo: #5a0000; --hsa-fondo2: #7a0d0d; --hsa-txt: #fff; --hsa-suave: rgba(255,255,255,.82); --hsa-acento: #f3d28a; --hsa-borde: rgba(243,210,138,.45);
  position: relative; overflow: hidden; margin: 0 0 28px; border-radius: 18px; color: var(--hsa-txt);
  background: radial-gradient(120% 140% at 0% 0%, var(--hsa-fondo2) 0%, var(--hsa-fondo) 55%, #3f0000 100%);
  box-shadow: 0 14px 34px rgba(60,0,0,.22); }
.hsa-aviso::after { content: ""; position: absolute; inset: 10px; border: 1px solid var(--hsa-borde); border-radius: 12px; pointer-events: none; }
.hsa-aviso.hsa-crema { --hsa-fondo: #fbf3dc; --hsa-fondo2: #fff8e6; --hsa-txt: #5a0000; --hsa-suave: #4a3a30; --hsa-acento: #8a6510; --hsa-borde: rgba(138,101,16,.35);
  background: linear-gradient(120deg, #fff8e6 0%, #f6e2a4 100%); box-shadow: 0 8px 22px rgba(120,80,0,.12); }
.hsa-fondo { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none !important; object-fit: cover; opacity: .16; pointer-events: none; }
.hsa-int { position: relative; z-index: 1; display: flex; align-items: center; gap: 34px; padding: 34px 42px; }
.hsa-imagen { flex: 0 0 auto; width: min(40%, 380px); }
.hsa-imagen img { display: block; width: 100%; height: auto; max-height: 190px; object-fit: contain; filter: drop-shadow(0 6px 14px rgba(0,0,0,.18)); }
.hsa-txt { flex: 1 1 auto; min-width: 0; }
.hsa-aviso p { margin: 0; color: inherit; }
.hsa-sobre { font-family: 'Open Sans', Arial, sans-serif; font-size: 12px !important; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--hsa-acento) !important; margin-bottom: 8px !important; }
.hsa-titulo { font-family: 'Merriweather', Georgia, serif; font-size: 26px !important; line-height: 1.2 !important; font-weight: 700; color: var(--hsa-txt) !important; }
.hsa-lema { font-family: 'Merriweather', Georgia, serif; font-style: normal; font-weight: 700; font-size: clamp(21px, 2.4vw, 29px) !important; line-height: 1.3 !important; letter-spacing: -0.3px; color: var(--hsa-acento) !important; margin-top: 4px !important; }
.hsa-titulo + .hsa-lema { font-size: clamp(18px, 1.9vw, 22px) !important; font-weight: 400; }
.hsa-texto p { font-family: 'Open Sans', Arial, sans-serif; font-size: 15px !important; line-height: 1.6 !important; color: var(--hsa-suave) !important; margin: 10px 0 0 !important; }
.hsa-texto a { color: var(--hsa-acento) !important; text-decoration: underline; }
.hsa-botones { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px !important; }
.hsa-btn, .hsa-btn:link, .hsa-btn:visited { display: inline-flex; align-items: center; gap: 6px; padding: 11px 20px; border-radius: 999px; border: 2px solid var(--hsa-acento); background: var(--hsa-acento); color: #3f0000 !important;
  font-family: 'Open Sans', Arial, sans-serif; font-size: 14px; font-weight: 700; text-decoration: none !important; line-height: 1.2; transition: background .2s ease, color .2s ease, transform .2s ease; }
.hsa-btn:hover, .hsa-btn:focus-visible { background: transparent; color: var(--hsa-acento) !important; transform: translateY(-1px); }
.hsa-btn-2, .hsa-btn-2:link, .hsa-btn-2:visited { background: transparent; color: var(--hsa-acento) !important; }
.hsa-btn-2:hover, .hsa-btn-2:focus-visible { background: var(--hsa-acento); color: #3f0000 !important; }
.hsa-crema .hsa-btn, .hsa-crema .hsa-btn:link, .hsa-crema .hsa-btn:visited { background: #5a0000; border-color: #5a0000; color: #fff !important; }
.hsa-crema .hsa-btn:hover { background: transparent; color: #5a0000 !important; }
.hsa-crema .hsa-btn-2, .hsa-crema .hsa-btn-2:link, .hsa-crema .hsa-btn-2:visited { background: transparent; color: #5a0000 !important; }
@media (max-width: 760px) {
  .hsa-int { flex-direction: column; text-align: center; gap: 18px; padding: 28px 22px 26px; }
  .hsa-imagen { width: min(92%, 340px); }
  .hsa-botones { justify-content: center; }
}

/* Ventana emergente */
.hsa-modal[hidden] { display: none !important; }
.hsa-modal { position: fixed; inset: 0; z-index: 100000; display: flex; align-items: center; justify-content: center; padding: 18px; }
.hsa-modal-fondo { position: absolute; inset: 0; background: rgba(20,0,0,.62); animation: hsaFade .25s ease; }
.hsa-modal-caja { position: relative; width: min(720px, 100%); max-height: calc(100vh - 36px); overflow: auto; border-radius: 18px; animation: hsaSube .3s ease; outline: none; }
.hsa-modal-caja .hsa-aviso { margin: 0; }
.hsa-modal-caja .hsa-int { flex-direction: column; text-align: center; gap: 18px; padding: 44px 34px 34px; }
.hsa-modal-caja .hsa-imagen { width: min(88%, 420px); }
.hsa-modal-caja .hsa-botones { justify-content: center; }
.hsa-cerrar { position: absolute; top: 12px; right: 12px; z-index: 3; width: 40px; height: 40px; border-radius: 50%; border: 0; background: rgba(255,255,255,.16); color: #fff; font-size: 26px; line-height: 40px; padding: 0; cursor: pointer; }
.hsa-cerrar:hover, .hsa-cerrar:focus-visible { background: rgba(255,255,255,.3); }
.hsa-modal-caja .hsa-crema ~ .hsa-cerrar, .hsa-modal-caja:has(.hsa-crema) > .hsa-cerrar { background: rgba(90,0,0,.1); color: #5a0000; }
@keyframes hsaFade { from { opacity: 0; } }
@keyframes hsaSube { from { opacity: 0; transform: translateY(18px) scale(.98); } }

/* Franja superior */
.hsa-franja { position: relative; z-index: 999; background: #5a0000; color: #fff; font-family: 'Open Sans', Arial, sans-serif; }
.hsa-franja.hsa-crema { background: #f6e2a4; color: #5a0000; }
.hsa-franja[hidden] { display: none !important; }
.hsa-franja-int { display: flex; align-items: center; justify-content: center; gap: 14px; max-width: 1180px; margin: 0 auto; padding: 8px 56px; flex-wrap: wrap; }
.hsa-franja-img { height: 30px; width: auto; }
.hsa-franja-txt { font-family: 'Merriweather', Georgia, serif; font-weight: 700; font-size: 15px; }
.hsa-franja-btn, .hsa-franja-btn:link, .hsa-franja-btn:visited { color: #f3d28a !important; font-weight: 700; font-size: 14px; text-decoration: underline !important; }
.hsa-franja.hsa-crema .hsa-franja-btn { color: #5a0000 !important; }
.hsa-franja .hsa-cerrar { top: 50%; transform: translateY(-50%); right: 10px; width: 32px; height: 32px; font-size: 22px; line-height: 32px; }
.hsa-franja.hsa-crema .hsa-cerrar { color: #5a0000; background: rgba(90,0,0,.08); }
@media (prefers-reduced-motion: reduce) { .hsa-modal-fondo, .hsa-modal-caja { animation: none; } .hsa-btn { transition: none; } }
/* Móvil: la franja va abajo, para no chocar con la barra fija del nombre y el menú */
@media (max-width: 979px) {
  .hsa-franja { position: fixed; left: 0; right: 0; bottom: 0; z-index: 996; box-shadow: 0 -4px 16px rgba(0,0,0,.18); }
  .hsa-franja-int { gap: 6px 12px; padding: 9px 50px 10px 14px; justify-content: flex-start; }
  .hsa-franja-img { height: 24px; }
  .hsa-franja-txt { font-size: 14px; flex: 1 1 60%; }
  body.hsa-hay-franja { padding-bottom: 64px; }
}

/* Aviso en franja (logo + lema y texto, sin botones): baja, de lado a lado, sin marco interior */
.hsa-aviso.hsa-compacto { border-radius: 12px; box-shadow: 0 8px 22px rgba(60,0,0,.18); }
.hsa-aviso.hsa-compacto::after { display: none; }
.hsa-compacto .hsa-int { gap: 36px; padding: 14px 30px; }
.hsa-compacto .hsa-imagen { width: auto; flex: 0 0 auto; }
.hsa-compacto .hsa-imagen img { width: auto; height: 86px; max-height: none; }
.hsa-compacto .hsa-lema { margin: 0 !important; font-size: clamp(20px, 2.1vw, 27px) !important; }
.hsa-compacto .hsa-texto p { margin-top: 6px !important; font-size: 15px !important; line-height: 1.5 !important; }
@media (max-width: 760px) {
  .hsa-compacto .hsa-int { flex-direction: row; text-align: left; gap: 14px; padding: 10px 14px; }
  .hsa-compacto .hsa-imagen img { height: 44px; }
  .hsa-compacto .hsa-lema { font-size: 15px !important; line-height: 1.25 !important; }
  .hsa-compacto .hsa-texto p { font-size: 13px !important; margin-top: 3px !important; }
}
@media (max-width: 600px) { .hsa-compacto .hsa-texto { display: none; } .hsa-compacto .hsa-imagen img { height: 38px; } }
/* Móvil: la ventana emergente arriba (bajo la barra) y más compacta, para que quepa con el aviso de cookies abajo */
@media (max-width: 760px) {
  .hsa-modal { align-items: flex-start; padding: 84px 12px 12px; }
  .hsa-modal-caja .hsa-int { padding: 24px 18px 20px; gap: 8px; }
  .hsa-modal-caja .hsa-imagen { width: min(70%, 250px); }
  .hsa-modal-caja .hsa-sobre { font-size: 10.5px !important; margin-bottom: 4px !important; }
  .hsa-modal-caja .hsa-lema { font-size: 19px !important; }
  .hsa-modal-caja .hsa-texto p { font-size: 13.5px !important; line-height: 1.5 !important; margin-top: 6px !important; }
  .hsa-modal-caja .hsa-botones { margin-top: 12px !important; }
  .hsa-modal-caja .hsa-btn { padding: 9px 16px; font-size: 13.5px; }
  .hsa-modal .hsa-cerrar { top: 8px; right: 8px; width: 34px; height: 34px; font-size: 22px; line-height: 34px; }
}

/* ---------- Efectos (se eligen en el aviso: Destello, Estrellas o Latido) ---------- */
.hsa-brillo, .hsa-estrellas { position: absolute; inset: 0; pointer-events: none; z-index: 2; overflow: hidden; border-radius: inherit; }
.hsa-brillo::before { content: ""; position: absolute; top: -20%; bottom: -20%; left: -40%; width: 28%; transform: skewX(-22deg) translateX(-120%);
  background: linear-gradient(90deg, rgba(255,240,200,0) 0%, rgba(255,236,190,.10) 30%, rgba(255,246,220,.5) 50%, rgba(255,236,190,.10) 70%, rgba(255,240,200,0) 100%);
  animation: hsaBrillo 5s ease-in-out .6s infinite; }
@keyframes hsaBrillo { 0% { transform: skewX(-22deg) translateX(-120%); } 50%, 100% { transform: skewX(-22deg) translateX(620%); } }
.hsa-crema .hsa-brillo::before { background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.55) 50%, rgba(255,255,255,0)); }

.hsa-estrellas { z-index: 0; }
.hsa-estrellas i { position: absolute; width: 18px; height: 18px; margin: -9px 0 0 -9px; filter: drop-shadow(0 0 4px rgba(255,226,150,.9)); opacity: 0; animation: hsaTitila 4.2s ease-in-out infinite;
  background: radial-gradient(circle, #fffaf0 0 18%, #f3d28a 19% 40%, rgba(243,210,138,.6) 41% 70%);
  clip-path: polygon(50% 0, 60% 40%, 100% 50%, 60% 60%, 50% 100%, 40% 60%, 0 50%, 40% 40%); }
.hsa-crema .hsa-estrellas i { background: radial-gradient(circle, #b8892a 0 20%, rgba(184,137,42,.7) 21% 30%, rgba(184,137,42,0) 62%); }
.hsa-estrellas i:nth-child(1) { left: 22%; top: 18%; animation-delay: 0s; }
.hsa-estrellas i:nth-child(2) { left: 41%; top: 74%; width: 13px; height: 13px; animation-delay: .9s; }
.hsa-estrellas i:nth-child(3) { left: 58%; top: 16%; width: 22px; height: 22px; animation-delay: 1.8s; }
.hsa-estrellas i:nth-child(4) { left: 76%; top: 70%; width: 15px; height: 15px; animation-delay: 2.6s; }
.hsa-estrellas i:nth-child(5) { left: 88%; top: 24%; animation-delay: 3.3s; }
.hsa-estrellas i:nth-child(6) { left: 95%; top: 76%; width: 12px; height: 12px; animation-delay: 1.3s; }
.hsa-estrellas i:nth-child(7) { left: 31%; top: 30%; width: 12px; height: 12px; animation-delay: 2.2s; }
.hsa-estrellas i:nth-child(8) { left: 68%; top: 36%; width: 13px; height: 13px; animation-delay: .4s; }
.hsa-estrellas i:nth-child(9) { left: 4%; top: 84%; width: 13px; height: 13px; animation-delay: 3s; }
@keyframes hsaTitila { 0%, 100% { opacity: 0; transform: scale(.4) rotate(0deg); } 45% { opacity: 1; transform: scale(1.15) rotate(20deg); } 60% { opacity: .85; transform: scale(1) rotate(28deg); } }

.hsa-efecto-latido .hsa-imagen img { animation: hsaLatido 3.6s ease-in-out infinite; }
@keyframes hsaLatido {
  0%, 100% { filter: drop-shadow(0 6px 14px rgba(0,0,0,.18)) drop-shadow(0 0 0 rgba(255,226,150,0)); transform: scale(1); }
  50% { filter: drop-shadow(0 6px 14px rgba(0,0,0,.18)) drop-shadow(0 0 14px rgba(255,226,150,.75)); transform: scale(1.035); } }
.hsa-crema.hsa-efecto-latido .hsa-imagen img { animation-name: hsaLatidoCrema; }
@keyframes hsaLatidoCrema { 0%, 100% { filter: drop-shadow(0 0 0 rgba(184,137,42,0)); transform: scale(1); } 50% { filter: drop-shadow(0 0 12px rgba(184,137,42,.55)); transform: scale(1.035); } }

@media (prefers-reduced-motion: reduce) {
  .hsa-brillo, .hsa-estrellas { display: none; }
  .hsa-efecto-latido .hsa-imagen img { animation: none; }
}