.elementor-3764 .elementor-element.elementor-element-a2df01e{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;}.elementor-3764 .elementor-element.elementor-element-a2df01e:not(.elementor-motion-effects-element-type-background), .elementor-3764 .elementor-element.elementor-element-a2df01e > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-text );}.elementor-3764 .elementor-element.elementor-element-a2df01e.e-con{--flex-grow:0;--flex-shrink:0;}:root{--page-title-display:none;}@media(min-width:768px){.elementor-3764 .elementor-element.elementor-element-a2df01e{--width:100%;}}/* Start custom CSS for html, class: .elementor-element-79a4eb5 *//* GUARDIAN FILES PAGE */

.guardian-files-page {
  position: relative;
  overflow: hidden;
  background: #050914;
  color: #ffffff;
  padding-bottom: 90px;
}

/* CORNER GUARDIAN */

.guardian-corner-hangout {
  position: fixed;
  right: 24px;
  bottom: 20px;
  width: 190px;
  height: auto;
  z-index: 999;
  pointer-events: none;
  background: transparent;
  animation: guardianCornerFloat 4s ease-in-out infinite;
}

@keyframes guardianCornerFloat {
  0%, 100% {
    transform: translateY(0) rotate(0deg);
  }

  50% {
    transform: translateY(-8px) rotate(-1deg);
  }
}

/* HERO */

.guardian-files-hero {
  position: relative;
  overflow: hidden;
  min-height: 620px;
  padding: 130px 8% 110px;
  background:
    radial-gradient(circle at 80% 20%, rgba(57, 167, 255, 0.22), transparent 34%),
    radial-gradient(circle at 15% 80%, rgba(57, 255, 182, 0.16), transparent 34%),
    linear-gradient(135deg, #050914 0%, #071827 50%, #02040a 100%);
  border-bottom: 1px solid rgba(57, 167, 255, 0.25);
}

.guardian-files-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(255,255,255,0.045) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.045) 1px, transparent 1px);
  background-size: 42px 42px;
  opacity: 0.55;
  z-index: 0;
}

.guardian-files-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    repeating-linear-gradient(
      0deg,
      rgba(255,255,255,0.04) 0px,
      rgba(255,255,255,0.04) 1px,
      transparent 1px,
      transparent 5px
    );
  opacity: 0.18;
  mix-blend-mode: screen;
  pointer-events: none;
}

.guardian-glitch-lines {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(90deg, transparent 0%, rgba(57,167,255,0.2) 50%, transparent 100%);
  width: 30%;
  opacity: 0;
  animation: guardianScan 5s ease-in-out infinite;
  z-index: 1;
}

@keyframes guardianScan {
  0%, 70%, 100% {
    transform: translateX(-120%);
    opacity: 0;
  }

  78% {
    opacity: 0.7;
  }

  88% {
    transform: translateX(430%);
    opacity: 0;
  }
}

.guardian-files-kicker,
.guardian-glitch-title,
.guardian-files-intro,
.guardian-hero-buttons {
  position: relative;
  z-index: 2;
  max-width: 980px;
}

.guardian-files-kicker {
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: #39ffb6;
  font-size: 0.8rem;
  font-weight: 900;
  margin-bottom: 18px;
}

/* TITLE STYLE - BLUE/GREEN GLITCH ON ALL WORDS */

.guardian-glitch-title {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.18em;
  font-size: clamp(3.5rem, 10vw, 8.8rem);
  line-height: 0.9;
  margin: 0 0 26px;
  text-transform: uppercase;
  letter-spacing: -0.06em;
  color: #ffffff;
}

.guardian-title-word {
  position: relative;
  display: inline-block;
  color: #ffffff;
  text-shadow:
    0 0 18px rgba(57, 167, 255, 0.42),
    0 0 42px rgba(57, 255, 182, 0.26);
}

.guardian-title-word::before {
  content: attr(data-text);
  position: absolute;
  left: 0;
  top: 0;
  color: #39a7ff;
  opacity: 0.72;
  transform: translate(2px, -1px);
  clip-path: inset(0 0 58% 0);
  pointer-events: none;
  animation: guardianTitleGlitchOne 3s infinite linear alternate-reverse;
}

.guardian-title-word::after {
  content: attr(data-text);
  position: absolute;
  left: 0;
  top: 0;
  color: #39ffb6;
  opacity: 0.72;
  transform: translate(-2px, 1px);
  clip-path: inset(54% 0 0 0);
  pointer-events: none;
  animation: guardianTitleGlitchTwo 2.6s infinite linear alternate-reverse;
}

@keyframes guardianTitleGlitchOne {
  0%, 92%, 100% {
    transform: translate(2px, -1px);
  }

  94% {
    transform: translate(-5px, 1px);
  }

  96% {
    transform: translate(4px, -2px);
  }
}

@keyframes guardianTitleGlitchTwo {
  0%, 88%, 100% {
    transform: translate(-2px, 1px);
  }

  91% {
    transform: translate(5px, 1px);
  }

  95% {
    transform: translate(-4px, -1px);
  }
}

.guardian-files-intro {
  font-size: clamp(1rem, 2vw, 1.25rem);
  line-height: 1.75;
  color: rgba(255,255,255,0.78);
  margin-bottom: 34px;
}

.guardian-hero-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
}

.guardian-primary-btn,
.guardian-secondary-btn,
.guardian-read-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 24px;
  border-radius: 999px;
  text-decoration: none;
  font-weight: 900;
  transition: transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease;
}

.guardian-primary-btn {
  background: linear-gradient(135deg, #39ffb6, #39a7ff);
  color: #06101d !important;
  box-shadow: 0 0 28px rgba(57, 167, 255, 0.28);
}

.guardian-secondary-btn {
  border: 1px solid rgba(57,255,182,0.45);
  color: #ffffff !important;
  background: rgba(255,255,255,0.04);
}

.guardian-primary-btn:hover,
.guardian-secondary-btn:hover,
.guardian-read-btn:hover {
  transform: translateY(-3px);
}

/* ALERT STRIP */

.guardian-alert-strip {
  width: 100%;
  overflow: hidden;
  padding: 14px 0;
  background: #39a7ff;
  color: #02040a;
  white-space: nowrap;
}

.guardian-alert-track {
  display: inline-flex;
  align-items: center;
  gap: 42px;
  min-width: max-content;
  animation: guardianTicker 22s linear infinite;
}

.guardian-alert-track span {
  display: inline-flex;
  align-items: center;
  font-size: 0.85rem;
  font-weight: 1000;
  text-transform: uppercase;
  letter-spacing: 0.12em;
}

.guardian-alert-track span::after {
  content: "⚡";
  margin-left: 42px;
  color: #06101d;
}

@keyframes guardianTicker {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(-50%);
  }
}

/* FEATURED COMIC */

.guardian-featured-comic {
  display: grid;
  grid-template-columns: 1fr 0.95fr;
  gap: 36px;
  align-items: center;
  padding: 90px 8%;
  background:
    radial-gradient(circle at 90% 40%, rgba(57,167,255,0.14), transparent 30%),
    #050914;
}

.guardian-section-label {
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: #39ffb6;
  font-size: 0.78rem;
  font-weight: 900;
  margin-bottom: 12px;
}

.guardian-featured-copy h2 {
  font-size: clamp(2rem, 5vw, 4.2rem);
  line-height: 1;
  margin: 0 0 20px;
  color: #ffffff;
}

.guardian-featured-copy p {
  color: rgba(255,255,255,0.76);
  font-size: 1.05rem;
  line-height: 1.7;
  margin-bottom: 28px;
}

.guardian-read-btn {
  background: linear-gradient(135deg, #39ffb6, #39a7ff) !important;
  color: #06101d !important;
  border: none;
  box-shadow: 0 0 24px rgba(57, 167, 255, 0.28);
}

.guardian-read-btn:hover {
  color: #06101d !important;
  box-shadow: 0 0 34px rgba(57, 167, 255, 0.35);
}

.guardian-featured-panel {
  position: relative;
  min-height: 390px;
  border-radius: 28px;
  padding: 18px;
  background:
    linear-gradient(135deg, rgba(57,255,182,0.3), rgba(57,167,255,0.25)),
    rgba(255,255,255,0.04);
  border: 1px solid rgba(57,167,255,0.35);
  box-shadow: 0 24px 70px rgba(0,0,0,0.35);
  overflow: hidden;
}

.guardian-comic-badge {
  position: absolute;
  top: 26px;
  right: 26px;
  z-index: 5;
  padding: 8px 14px;
  border-radius: 999px;
  background: #39ffb6;
  color: #06101d;
  font-weight: 1000;
  font-size: 0.8rem;
}

/* FEATURED CHAPTER TEASER CARD */

.guardian-chapter-teaser-card {
  position: relative;
  display: block;
  min-height: 350px;
  height: 100%;
  border-radius: 20px;
  overflow: hidden;
  text-decoration: none;
  background-image:
    linear-gradient(
      135deg,
      rgba(5, 9, 20, 0.92),
      rgba(5, 9, 20, 0.58)
    ),
    url("https://teknovatecp.com/wp-content/uploads/2026/06/CH1.png");
  background-size: 260%;
  background-position: center 18%;
  background-repeat: no-repeat;
  border: 1px solid rgba(57, 167, 255, 0.35);
  transition: transform 0.25s ease, background-size 0.35s ease, box-shadow 0.25s ease;
}

.guardian-chapter-teaser-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    repeating-linear-gradient(
      0deg,
      rgba(255,255,255,0.08) 0px,
      rgba(255,255,255,0.08) 1px,
      transparent 1px,
      transparent 5px
    );
  opacity: 0.18;
  pointer-events: none;
}

.guardian-chapter-teaser-card::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 70% 30%, rgba(57,255,182,0.26), transparent 38%),
    radial-gradient(circle at 20% 80%, rgba(57,167,255,0.22), transparent 36%);
  pointer-events: none;
}

.guardian-chapter-teaser-card:hover {
  transform: translateY(-4px);
  background-size: 290%;
  box-shadow: 0 0 36px rgba(57, 167, 255, 0.22);
}

.guardian-chapter-teaser-content {
  position: absolute;
  left: 24px;
  right: 24px;
  bottom: 24px;
  z-index: 3;
}

.guardian-chapter-teaser-content p {
  margin: 0 0 8px;
  color: #39ffb6;
  font-size: 0.78rem;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.14em;
}

.guardian-chapter-teaser-content h3 {
  margin: 0 0 18px;
  color: #ffffff;
  font-size: clamp(2rem, 4vw, 3.4rem);
  line-height: 0.9;
  text-transform: uppercase;
  text-shadow:
    0 0 18px rgba(57,167,255,0.45),
    0 0 38px rgba(57,255,182,0.2);
}

.guardian-chapter-teaser-content span {
  display: inline-flex;
  padding: 10px 16px;
  border-radius: 999px;
  background: linear-gradient(135deg, #39ffb6, #39a7ff);
  color: #06101d;
  font-weight: 900;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  font-size: 0.78rem;
}

/* MISSION ARCHIVE */

.guardian-mission-archive {
  padding: 60px 8% 120px;
}

.guardian-section-heading {
  margin-bottom: 34px;
}

.guardian-section-heading p {
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: #39ffb6;
  font-size: 0.78rem;
  font-weight: 900;
  margin-bottom: 10px;
}

.guardian-section-heading h2 {
  font-size: clamp(2.4rem, 6vw, 5rem);
  line-height: 0.95;
  margin: 0;
  color: #ffffff;
}

.guardian-comic-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px;
}

.guardian-comic-card {
  position: relative;
  overflow: hidden;
  min-height: 310px;
  padding: 26px;
  border-radius: 24px;
  background:
    linear-gradient(145deg, rgba(255,255,255,0.08), rgba(255,255,255,0.025));
  border: 1px solid rgba(57,167,255,0.22);
  box-shadow: 0 18px 50px rgba(0,0,0,0.22);
  transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}

.guardian-comic-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at top right, rgba(57,167,255,0.18), transparent 32%),
    linear-gradient(90deg, transparent, rgba(57,255,182,0.08), transparent);
  opacity: 0.75;
}

.guardian-comic-card:hover {
  transform: translateY(-8px);
  border-color: rgba(57,255,182,0.55);
  box-shadow: 0 26px 70px rgba(57,167,255,0.14);
}

.guardian-comic-card > * {
  position: relative;
  z-index: 2;
}

.guardian-card-topline {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  color: #39ffb6;
  font-weight: 900;
  margin-bottom: 28px;
}

.guardian-comic-card h3 {
  font-size: 1.45rem;
  line-height: 1.1;
  margin: 0 0 16px;
  color: #ffffff;
}

.guardian-comic-card p {
  color: rgba(255,255,255,0.68);
  line-height: 1.6;
  margin-bottom: 38px;
}

.guardian-comic-card a {
  position: absolute;
  left: 26px;
  bottom: 24px;
  color: #39a7ff !important;
  font-weight: 1000;
  text-decoration: none;
}

.guardian-comic-card.active a {
  color: #39ffb6 !important;
}

.guardian-comic-card.locked {
  opacity: 0.68;
}

.guardian-comic-card.locked::after {
  content: "LOCKED";
  position: absolute;
  right: -34px;
  bottom: 30px;
  transform: rotate(-35deg);
  color: rgba(255,255,255,0.06);
  font-size: 3rem;
  font-weight: 1000;
  letter-spacing: 0.08em;
}

/* RESPONSIVE */

@media (max-width: 1024px) {
  .guardian-featured-comic {
    grid-template-columns: 1fr;
  }

  .guardian-comic-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .guardian-corner-hangout {
    width: 145px;
  }
}

@media (max-width: 767px) {
  .guardian-files-hero {
    min-height: auto;
    padding: 90px 28px 80px;
  }

  .guardian-featured-comic,
  .guardian-mission-archive {
    padding-left: 28px;
    padding-right: 28px;
  }

  .guardian-comic-grid {
    grid-template-columns: 1fr;
  }

  .guardian-corner-hangout {
    width: 105px;
    right: 12px;
    bottom: 12px;
  }

  .guardian-alert-strip {
    font-size: 0.72rem;
  }

  .guardian-hero-buttons {
    flex-direction: column;
    align-items: flex-start;
  }

  .guardian-chapter-teaser-card {
    background-size: 330%;
    background-position: center 15%;
  }
}/* End custom CSS */