/* MixGeo Halloween 1.0.0. Enable with <body class="mg-site mg-halloween">. */
.mg-site.mg-halloween {
  --hw-orange: #ff9d54;
  --hw-purple: #b89be9;
  background: radial-gradient(ellipse 85% 650px at 0 90px, #47233335, transparent),
              radial-gradient(ellipse 65% 720px at 100% 120px, #49307335, transparent), #0d0c17;
}
.mg-site.mg-halloween .mg-header {
  background: linear-gradient(110deg, #1b121ef5, #141120f5 65%, #201527f5);
  border-bottom-color: #ff9d542e;
}
.mg-halloween .mg-header::before,
.mg-halloween .mg-header::after {
  content: "";
  position: absolute;
  top: 0;
  width: 110px;
  height: 86px;
  background: url("../images/halloween/web.svg") left top / contain no-repeat;
  opacity: .24;
  pointer-events: none;
}
.mg-halloween .mg-header::before { left: 0; }
.mg-halloween .mg-header::after { right: 0; transform: scaleX(-1); }
.mg-halloween .mg-header-row,
.mg-halloween .mg-search { position: relative; }
.mg-halloween .mg-brand span { color: var(--hw-orange); }
.mg-halloween .mg-brand i { display: none; }
.mg-halloween .mg-brand::after {
  content: "";
  display: block;
  width: 30px;
  height: 30px;
  flex: 0 0 30px;
  margin-left: 9px;
  background: url("../images/halloween/pumpkin.svg") center / contain no-repeat;
  pointer-events: none;
}
.mg-halloween .mg-header .mg-menu,
.mg-halloween .mg-header .mg-icon,
.mg-halloween .mg-account {
  background: #251c30;
  border-color: #b98bdd40;
  color: #f0deff;
}
.mg-halloween .mg-header .mg-menu:hover,
.mg-halloween .mg-header .mg-menu[aria-expanded=true],
.mg-halloween .mg-account:hover { background: #3c2440; border-color: #ff9d5480; }
.mg-halloween .mg-drawer-panel {
  background: linear-gradient(145deg, #26182f, #14111e 65%);
  border-color: #ad79d544;
}
.mg-halloween .mg-drawer a:hover,
.mg-halloween .mg-drawer a[aria-current=page] {
  background: #ff9d5410;
  color: #ffc798;
  border-left-color: var(--hw-orange);
}
.mg-halloween .mg-drawer-icon { background: #a568e21c; color: #c6a5f0; }
.mg-halloween .mg-button {
  background: linear-gradient(110deg, #ad481e, #863b72);
  border-color: #ffb77944;
}
.mg-halloween .mg-search input[type=search] { background: #1d1729; border-color: #745082; }
.mg-halloween .mg-hero {
  border: 1px solid #ba7ce044;
  box-shadow: 0 16px 55px #0003, 0 0 36px #9a3c4810;
}
.mg-halloween .mg-hero-pages .swiper-pagination-bullet-active { background: var(--hw-orange); }
.mg-halloween .mg-eyebrow i { background: var(--hw-orange); box-shadow: 0 0 12px #ff9d5460; }
.mg-halloween .mg-section-heading .mg-eyebrow,
.mg-halloween .mg-fullstory .mg-eyebrow { color: var(--hw-purple); }
.mg-halloween .mg-explore a { background: #1a1424; border-color: #bb8ce21f; }
.mg-halloween .mg-explore a:hover { border-color: #ff9d5480; color: #ffd4b1; }
.mg-halloween .mg-poster,
.mg-halloween .mg-collection-image { border-color: #b891de35; transition: border-color .2s, box-shadow .2s; }
.mg-halloween .mg-card:hover .mg-poster,
.mg-halloween .mg-poster:focus-visible,
.mg-halloween .mg-collection-link:hover .mg-collection-image {
  border-color: #ff9d54b0;
  box-shadow: 0 0 0 1px #ff9d5426, 0 8px 22px #6c314333;
}
.mg-halloween .mg-play { background: #b45328ed; border: 1px solid #ffc48b85; }
.mg-halloween .mg-more span,
.mg-halloween .mg-route-heading a { color: #ffc291; }
.mg-halloween .mg-app {
  background: radial-gradient(ellipse at 95% 0, #824cab33, transparent 65%), #1a1426;
  border-color: #aa78ce44;
}
.mg-halloween .mg-footer { border-top-color: #ff9d5426; }
.mg-halloween .mg-footer .mg-brand::after { width: 24px; height: 24px; flex-basis: 24px; }

/* Homepage banner: inserted only when a homepage hero is present. */
.mg-hw-banner { display: none; }
.mg-halloween .mg-hw-banner {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: center;
  gap: 20px;
  min-height: 122px;
  margin-top: 24px;
  padding: 23px 28px;
  overflow: hidden;
  border: 1px solid #a668ba55;
  border-radius: 18px;
  background: radial-gradient(ellipse at 0 90%, #ad4b2430, transparent 56%),
              radial-gradient(ellipse at 85% 20%, #7544ab3b, transparent 64%), #191121;
  box-shadow: 0 10px 30px #0002;
}
.mg-hw-pumpkin {
  display: block;
  width: 72px;
  height: 72px;
  flex: 0 0 72px;
  background: url("../images/halloween/pumpkin.svg") center / contain no-repeat;
  filter: drop-shadow(0 0 17px #ff861f38);
}
.mg-hw-copy { position: relative; min-width: 0; flex: 1; z-index: 1; }
.mg-hw-label {
  display: block;
  margin-bottom: 7px;
  color: #ffbd89;
  font: 10px/1.5 'BPG Arial Caps', sans-serif;
  letter-spacing: 1.4px;
}
.mg-hw-banner h2 {
  margin: 0;
  color: #fff1e8;
  font: 23px/1.5 'BPG Arial Caps', sans-serif;
  overflow-wrap: anywhere;
}
.mg-hw-banner p { margin: 6px 0 0; color: #c8b6d5; font: 13px/1.8 'BPG Arial', sans-serif; }
.mg-hw-art { position: absolute; inset: 0; z-index: 0; pointer-events: none; overflow: hidden; }
.mg-hw-art::after {
  content: "";
  position: absolute;
  right: -24px;
  top: -28px;
  width: 230px;
  height: 180px;
  background: url("../images/halloween/web.svg") top left / contain no-repeat;
  transform: scaleX(-1);
  opacity: .2;
}
.mg-hw-bat {
  position: absolute;
  right: 25%;
  top: 22%;
  width: 44px;
  height: 24px;
  background: url("../images/halloween/bat.svg") center / contain no-repeat;
  opacity: .46;
  animation: mg-hw-float 6s ease-in-out infinite;
}
.mg-hw-bat:nth-child(2) { right: 18%; top: 64%; width: 28px; opacity: .28; animation-delay: -2s; }
.mg-hw-bat:nth-child(3) { right: 39%; top: 15%; width: 20px; opacity: .23; animation-delay: -4s; }
.mg-hw-motion {
  position: relative;
  z-index: 1;
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-height: 40px;
  padding: 9px 12px;
  border: 1px solid #caa3e23b;
  border-radius: 9px;
  background: #1a1429dd;
  color: #e4ceef;
  font: 11px/1.5 'BPG Arial', sans-serif;
  cursor: pointer;
}
.mg-hw-motion:hover { border-color: #ffa96399; background: #32203b; }
.mg-hw-motion svg { width: 15px; height: 15px; flex-shrink: 0; fill: currentColor; }
.mg-hw-motion:focus-visible { outline: 2px solid #ffc291; outline-offset: 4px; }
.mg-halloween.mg-hw-motion-off .mg-hw-bat { animation-play-state: paused; }
@keyframes mg-hw-float { 0%, 100% { transform: translate(0, 0) rotate(-8deg); } 50% { transform: translate(-14px, 7px) rotate(6deg); } }
@media (max-width: 900px) {
  .mg-halloween .mg-hw-banner { gap: 16px; padding: 20px; }
  .mg-hw-banner h2 { font-size: 20px; }
  .mg-hw-motion span { display: none; }
  .mg-hw-motion { min-width: 40px; justify-content: center; padding: 10px; }
  .mg-hw-bat { right: 14%; }
}
@media (max-width: 600px) {
  .mg-halloween .mg-header::before, .mg-halloween .mg-header::after { width: 60px; height: 55px; opacity: .16; }
  .mg-halloween .mg-brand::after { display: none; }
  .mg-halloween .mg-hw-banner { min-height: 108px; margin-top: 16px; gap: 12px; padding: 17px 15px; border-radius: 13px; }
  .mg-hw-pumpkin { width: 44px; height: 48px; flex-basis: 44px; }
  .mg-hw-label { font-size: 8px; letter-spacing: 1px; margin-bottom: 4px; }
  .mg-hw-banner h2 { font-size: 16px; line-height: 1.55; }
  .mg-hw-banner p { font-size: 11px; margin-top: 4px; }
  .mg-hw-bat { animation: none; right: 8%; top: 14%; opacity: .18; }
  .mg-hw-bat:nth-child(2), .mg-hw-bat:nth-child(3), .mg-hw-motion { display: none; }
  .mg-hw-art::after { width: 130px; height: 110px; opacity: .12; }
}
@media (prefers-reduced-motion: reduce) {
  .mg-hw-bat { animation: none; }
  .mg-hw-motion { display: none; }
  .mg-halloween .mg-poster, .mg-halloween .mg-collection-image { transition: none; }
}
@media print {
  .mg-hw-banner, .mg-halloween .mg-brand::after,
  .mg-halloween .mg-header::before, .mg-halloween .mg-header::after { display: none; }
}