/* New module variations for the October homepage refresh. */
section#hero.layout-fifty-fifty-background {
  min-height: 772px;
  display: flex;
  align-items: center;
  padding-top: 100px;
  padding-bottom: 100px;
}
section#hero.layout-fifty-fifty-background > .grid { position: static; }
section#hero.layout-fifty-fifty-background .content-container.half { padding-right: 40px; }
section#hero.layout-fifty-fifty-background .hero-background-media {
  position: absolute;
  top: 0;
  right: max(0px, calc((100vw - 1440px) / 2));
  width: min(1078px, 75vw);
  height: 100%;
  z-index: 1;
  pointer-events: none;
}
section#hero.layout-fifty-fifty-background .hero-background-media #media-container,
section#hero.layout-fifty-fifty-background .hero-background-media #image-container,
section#hero.layout-fifty-fifty-background .hero-background-media #video-container { height: 100%; }
section#hero.layout-fifty-fifty-background .hero-background-media img,
section#hero.layout-fifty-fifty-background .hero-background-media video {
  width: 100%; height: 100%; object-fit: contain; object-position: right center;
}
section#hero.layout-fifty-fifty-background .hero-background-media::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(90deg, #000 0%, rgba(0,0,0,.75) 18%, transparent 45%);
}

/* Alex's global comic-heading update: Desktop/H6, Inter Medium. */
.heading.comic, h1.comic, h2.comic, h3.comic, h4.comic, h5.comic, h6.comic,
.h1.comic, .h2.comic, .h3.comic, .h4.comic, .h5.comic, .h6.comic {
  font-family: 'Inter', sans-serif;
  font-weight: 500;
  font-style: normal;
  font-size: 24px !important;
  line-height: 1.4;
  letter-spacing: 0;
  text-transform: none;
}
section#comic-masonry #comic-card .comic-copy { width: 100%; }
section#comic-masonry #comic-card { padding: 20px; gap: 20px; }
section#comic-masonry #comic-card.comic-heading-card { padding: 30px; }
section#comic-masonry #comic-card #comic-card-content-block,
section#comic-masonry #comic-card #heading-container .content-container { gap: 20px; }
section#comic-masonry #comic-card.comic-fifty-fifty #comic-card-content-block {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
  gap: 30px;
}
section#comic-masonry #comic-card.comic-fifty-fifty #media-container { margin-top: 0; min-width: 0; }
section#comic-masonry #comic-card.comic-media-first .comic-copy { grid-column: 2; grid-row: 1; }
section#comic-masonry #comic-card.comic-media-first #media-container { grid-column: 1; grid-row: 1; }
section#copy-image.stacked > .grid.image-first > .media-container { grid-row: 1; }
section#copy-image.stacked > .grid.image-first > .content { grid-row: 2; }

/* Solink's proximity border, recolored with Binalyze's neon and gold. */
[data-proximity-card] {
  --proximity-active: 0;
  --proximity-x: 50%;
  --proximity-y: 50%;
  --proximity-glow-center: rgba(248,237,63,.95);
  --proximity-glow-edge: rgba(255,204,0,.9);
  --proximity-glow-fade: rgba(255,204,0,0);
  position: relative;
  border-radius: 8px;
}
[data-proximity-card]::before,
[data-proximity-card] > .proximity-glow::before {
  position: absolute; z-index: 3; inset: -1px; padding: 2px;
  border-radius: inherit;
  background: radial-gradient(circle 190px at var(--proximity-x) var(--proximity-y), var(--proximity-glow-center) 0 18%, var(--proximity-glow-edge) 58%, var(--proximity-glow-fade) 100%);
  content: ''; opacity: var(--proximity-active); pointer-events: none;
  transition: opacity 220ms ease-out;
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask-composite: exclude;
}
[data-proximity-card] > .proximity-glow {
  position: absolute;
  z-index: 2;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  /* Blur the masked border's parent so its halo extends beyond the edge. */
  filter: blur(10px);
}
[data-proximity-card] > .proximity-glow::before {
  inset: -2px;
  padding: 6px;
  opacity: calc(var(--proximity-active) * .9);
}
section#columns .column.boxed[data-proximity-card] > .content-container {
  transition: background-color .3s cubic-bezier(.25,1,.5,1), box-shadow .3s cubic-bezier(.25,1,.5,1);
}
/* Match the G2 quote cards' gold hover fill and border. */
section#columns .column.boxed[data-proximity-card]:focus-within > .content-container {
  background: radial-gradient(100.1% 100.1% at 0% 0%, rgba(255,204,0,.25) 0%, rgba(255,204,0,0) 75%), rgba(255,204,0,.2);
  box-shadow: inset 0 0 0 1px #fc0;
}
@media (hover: hover) and (pointer: fine) {
  section#columns .column.boxed[data-proximity-card]:hover > .content-container {
    background: radial-gradient(100.1% 100.1% at 0% 0%, rgba(255,204,0,.25) 0%, rgba(255,204,0,0) 75%), rgba(255,204,0,.2);
    box-shadow: inset 0 0 0 1px #fc0;
  }
}
[data-proximity-card]:focus-within { outline: 2px solid #f8ed3f; outline-offset: 2px; }

@media (max-width: 1024px) {
  section#hero.layout-fifty-fifty-background { min-height: 660px; padding-top: 60px; padding-bottom: 60px; }
  section#hero.layout-fifty-fifty-background .content-container.half { padding-right: 0; }
}
@media (max-width: 768px) {
  section#hero.layout-fifty-fifty-background { min-height: 0; display: block; padding-top: 50px; padding-bottom: 30px; }
  section#hero.layout-fifty-fifty-background > .grid { display: flex; flex-direction: column; gap: 20px; }
  section#hero.layout-fifty-fifty-background .content-container.half { width: 100%; }
  section#hero.layout-fifty-fifty-background .hero-background-media { position: relative; right: auto; width: 100%; height: auto; order: 0; }
  section#hero.layout-fifty-fifty-background .hero-background-media img,
  section#hero.layout-fifty-fifty-background .hero-background-media video { height: auto; }
  section#hero.layout-fifty-fifty-background .hero-background-media::after { display: none; }
  section#comic-masonry #comic-card.comic-fifty-fifty #comic-card-content-block { display: flex; flex-direction: column; gap: 20px; }
  section#comic-masonry #comic-card.comic-media-first #media-container { order: -1; }
  section#comic-masonry #comic-card.comic-heading-card { padding: 20px; }
  .heading.comic, h1.comic, h2.comic, h3.comic, h4.comic, h5.comic, h6.comic,
  .h1.comic, .h2.comic, .h3.comic, .h4.comic, .h5.comic, .h6.comic { font-size: 20px !important; }
}
@media (prefers-reduced-motion: reduce) {
  [data-proximity-card]::before, [data-proximity-card] > .proximity-glow::before,
  section#columns .column.boxed[data-proximity-card] > .content-container { transition: none; }
}