.matrix-pill-choice {
  display: flex;
  justify-content: center;
  gap: 2rem;
  margin: 2rem 0;
  flex-wrap: wrap;
}

.pill-btn {
  padding: 0.8rem 2.2rem;
  font-size: 1rem;
  font-family: monospace;
  border: none;
  border-radius: 999px; /* literal pill shape */
  text-decoration: none;
  text-transform: uppercase;
  font-weight: bold;
  letter-spacing: 1px;
  transition: all 0.3s ease-in-out;
  position: relative;
  box-shadow: 0 0 10px currentColor, inset 0 0 5px currentColor;
  display: inline-block;
}

.blue-pill {
  background: linear-gradient(145deg, #00cfff, #007acc);
  color: #000;
  box-shadow: 0 0 12px #00cfff, inset 0 0 6px #005577;
}

.blue-pill:hover {
  box-shadow: 0 0 18px #00e0ff, inset 0 0 8px #003355;
  transform: translateY(-2px);
}

.red-pill {
  background: linear-gradient(145deg, #ff0044, #cc0033);
  color: #000;
  box-shadow: 0 0 12px #ff0044, inset 0 0 6px #770011;
}

.red-pill:hover {
  box-shadow: 0 0 18px #ff3366, inset 0 0 8px #440000;
  transform: translateY(-2px);
}


#matrix-rain {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: -1;
    background: radial-gradient(ellipse at center, #003300 0%, #000000 100%);
    pointer-events: none;
    mix-blend-mode: screen;
}

.glass, h1, h2, h3, h4, h5, h6, header, nav, .entry-content p, .comment, .wp-block-columns, .blurb, .custom-nav-list li a, p, pre, .mepr-price-box, .mepr-form, .mp_wrapper {
    background: rgba(0, 0, 0, 0.4) !important; 
    border: 1px solid rgba(0, 255, 170, 0.2) !important;
    border-radius: 12px !important;
    padding: 1rem 1.5rem !important;
    margin-bottom: 1.5rem !important;
//    color: #CCFFEE !important;
    backdrop-filter: blur(6px) brightness(1.2) !important;
    -webkit-backdrop-filter: blur(6px) brightness(1.2) !important;
    box-shadow: 0 0 8px rgba(0, 255, 170, 0.3) !important;
//    font-family: 'Courier New', monospace !important;
    transition: box-shadow 0.3s ease, border-color 0.3s ease !important;
}

header, .entry-content p:hover {
    border-color: rgba(0, 255, 170, 0.6);
    box-shadow: 0 0 12px rgba(0, 255, 170, 0.6), 0 0 24px rgba(0, 255, 170, 0.4);
}

html, body, .wp-site-blocks, .wp-block-group, .site, .is-layout-constrained {
    background: transparent !important;
    z-index: 0 !important;
    color: #CCFFEE !important;
}

body::after {
    content: '';
    position: fixed;
    top: 0; left: 0;
    width: 100vw; height: 100vh;
    pointer-events: none;
    background: repeating-linear-gradient(
        to bottom,
        rgba(0, 255, 0, 0.02),
        rgba(0, 255, 0, 0.02) 1px,
        transparent 1px,
        transparent 2px
    );
    z-index: 1000;
}

/* Glitch effect keyframes */
@keyframes glitch {
    0% {
        text-shadow: 2px 0 red, -2px 0 blue;
    }
    20% {
        text-shadow: -2px 0 red, 2px 0 blue;
    }
    40% {
        text-shadow: 2px 2px red, -2px -2px blue;
    }
    60% {
        text-shadow: -2px -2px red, 2px 2px blue;
    }
    80% {
        text-shadow: 2px 0 red, -2px 0 blue;
    }
    100% {
        text-shadow: none;
    }
}

h1, h2, h3, h4, h5, h6 {
	color: lime;
}

/* 🧨 Readable author name, date, reply link, edit link */
li.comment .wp-block-comment-author-name,
li.comment .wp-block-comment-date,
li.comment .wp-block-comment-edit-link,
li.comment .wp-block-comment-reply-link {
	color: #00ffcc !important;
	font-weight: 600 !important;
	text-shadow: 0 0 1px #00ffcc, 0 0 4px #00ffcc !important;
	opacity: 1 !important;
}

/* 💀 Neutralize WP's "small" font styles */
.has-small-font-size {
	font-size: 0.875rem !important; /* Slightly reduced but readable */
	color: #00ffcc !important;
	opacity: 1 !important;
}

/* 💥 Highlight post author (you) with cyber pink */
li.bypostauthor .wp-block-comment-author-name {
	color: #ff00aa !important;
	text-shadow: 0 0 1px #ff00aa, 0 0 8px #ff00aa !important;
}

/* 🪪 Add ADMIN tag to author name */
li.bypostauthor .wp-block-comment-author-name::after {
	content: " ADMIN";
	background: rgba(255, 0, 170, 0.15);
	color: #ff00aa;
	margin-left: 0.5rem;
	padding: 0.1rem 0.5rem;
	border-radius: 4px;
	font-size: 0.75rem;
	font-weight: bold;
	text-shadow: 0 0 1px #ff00aa;
}


.centered-title {
  width: 100%;
  text-align: center;
  margin: 1.5rem auto;
  font-size: 2.25rem;
  color: #00ffcc;
  font-family: 'Share Tech Mono', monospace;
  animation: glitch-flicker 2.5s infinite;
  backdrop-filter: blur(6px) brightness(1.3);
  border: 1px solid rgba(0, 255, 170, 0.3);
  border-radius: 10px;
  display: inline-block;
  padding: 0.5rem 1.5rem;
  box-shadow: 0 0 12px rgba(0, 255, 170, 0.5);
}

.centered-title:hover {
  animation: glitch-flicker 0.6s infinite;
  text-shadow: 2px 0 red, -2px 0 blue;
}


@keyframes glitch-flicker {
  0% {
    text-shadow: 1px 0 red, -1px 0 blue;
    transform: translate(0, 0);
  }
  15% {
    text-shadow: -1px -1px red, 1px 1px blue;
    transform: translate(-0.5px, 0.5px);
  }
  30% {
    text-shadow: 2px 0 red, -2px 0 blue;
    transform: translate(0.5px, -0.5px);
  }
  45% {
    text-shadow: 0 2px red, 0 -2px blue;
    transform: translate(-1px, 1px);
  }
  60% {
    text-shadow: -2px 0 red, 2px 0 blue;
    transform: translate(0, 0);
  }
  75% {
    text-shadow: 2px -2px red, -2px 2px blue;
    transform: translate(0.5px, -1px);
  }
  90% {
    text-shadow: none;
    transform: translate(0, 0);
  }
  100% {
    text-shadow: 1px 0 red, -1px 0 blue;
    transform: translate(0, 0);
  }
}

/* this is the buy button */

.mepr-submit {
  background-color: #00ff00; /* neon green */
  border: 1px solid #00ff00;
  color: black;
  font-weight: bold;
  font-family: 'Courier New', monospace;
  padding: 12px 28px;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  border-radius: 6px;
  box-shadow: 0 0 10px #00ff00, 0 0 20px #00ff00 inset;
  transition: all 0.2s ease-in-out;
}

.mepr-submit:hover {
  background-color: black;
  color: #00ff00;
  box-shadow: 0 0 12px #00ff00, 0 0 25px #00ff00, inset 0 0 10px #00ff00;
  cursor: pointer;
  transform: scale(1.03);
}

/* this was the buy button*/

.iti {
	color:black;
}

/* this is the call to action (CTA) button */
/* radioactive breathing CTA */
.cta-button {
  display: inline-block;
  padding: 0.6rem 1.4rem;
  font-size: 1.1rem;
  font-weight: bold;
  color: #000;
  background: #00ff99;
  text-shadow: 0 0 2px #000;
  border: none;
  border-radius: 6px;
  text-decoration: none;
  cursor: pointer;

  /* static glow */
  box-shadow: 0 0 10px #00ff99, 0 0 20px #00ff99;

  /* breathing effect */
  animation: radioactive-breath 3s ease-in-out infinite;
  transition: transform 0.3s ease-in-out;
}

.cta-button:hover {
  background: #00ffaa;
  transform: scale(1.08);
}

/* radioactive glow breathing */
@keyframes radioactive-breath {
  0%, 100% {
    box-shadow: 0 0 10px #00ff99, 0 0 20px #00ff99, 0 0 40px rgba(0,255,153,0.6);
    transform: scale(1);
  }
  50% {
    box-shadow: 0 0 15px #00ffcc, 0 0 35px #00ffcc, 0 0 60px rgba(0,255,170,0.8);
    transform: scale(1.05);
  }
}