/* Solo los adornos de Halloween. */
.halloween-banner { position: relative; overflow: hidden; background: transparent; min-height: 100px; }
.pumpkin-hangers { max-width: 1000px; height: 100px; margin: auto; display: flex; justify-content: space-around; padding: 0 75px; }
.pumpkin-hanger { display: flex; flex-direction: column; align-items: center; transform-origin: top center; align-self: flex-start; }
.pumpkin-string { display: block; width: 1px; height: 26px; background: #8c749e; }
.season-pumpkin { width: 39px; height: 39px; margin-top: -3px; flex-shrink: 0; }
.hanger-two .pumpkin-string { height: 44px; }
.hanger-three .pumpkin-string { height: 18px; }
.hanger-four .pumpkin-string { height: 37px; }
.halloween-web { position: absolute; top: 0; width: 105px; height: 84px; color: #8c749e; opacity: .45; }
.web-left { left: 0; }
.web-right { right: 0; transform: scaleX(-1); }
@media(prefers-reduced-motion:no-preference) {
  .pumpkin-hanger { animation: pumpkin-sway 5s ease-in-out infinite; }
  .hanger-two { animation-delay: -1.5s; }
  .hanger-three { animation-delay: -3s; }
  .hanger-four { animation-delay: -2s; }
  @keyframes pumpkin-sway { 0%,100% { transform: rotate(-5deg); } 50% { transform: rotate(5deg); } }
}
@media(prefers-color-scheme:dark) { .pumpkin-string { background: #bca8cc; } .halloween-web { color: #d8c4e8; opacity: .3; } }
@media(max-width:640px) {
  .halloween-banner { min-height: 85px; }
  .pumpkin-hangers { height: 85px; padding: 0 40px; }
  .season-pumpkin { width: 30px; height: 30px; }
  .halloween-web { width: 60px; height: 48px; }
}
@media print { .halloween-banner { display: none; } }

/* Nombre de la clínica con colores de Halloween, solo en esta temporada. */
header .header-name {
  background: linear-gradient(90deg, #bc4d00 0%, #bc4d00 49%, #7036a3 51%, #7036a3 100%);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  width: max-content;
}
@media(prefers-color-scheme:dark) {
  header .header-name {
    background-image: linear-gradient(90deg, #ffad57 0%, #ffad57 49%, #c9a0ef 51%, #c9a0ef 100%);
  }
}
@media(forced-colors:active) {
  header .header-name { background: none; color: CanvasText; -webkit-text-fill-color: CanvasText; }
}