* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  width: 100%;
  background: #0a0315;
  font-family: "Inter", sans-serif;
  overflow-x: hidden;
}

#page-loader {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: #000;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  transition: opacity 0.9s ease;
}

#page-loader.hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

#scroll-wrapper {
  position: relative;
  width: 100%;
  overflow: clip;
}

#viewport-container {
  position: sticky;
  top: 0;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  z-index: 1;
   background: #0a0315;
}

#canvas {
  position: absolute;
  inset: 0;
  will-change: filter;
}

.vignette {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 2;
}

.main-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100vw;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 5%;
  z-index: 103;
 /* background: rgba(10, 3, 21, 0.85);*/
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(225, 225, 225, 0.2);
  box-sizing: border-box;
  transform: translateZ(0);
  will-change: transform;
}

.header-title {
  position: fixed;
  top: 20px;
  left: 5%;
  color: #ff00ff;
  font-size: clamp(0.9rem, 2vw, 1.3rem);
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  background: linear-gradient(90deg, #ff00ff, #ff1493);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  z-index: 104;
}

/* Header sweep + logo pulse + nav letter-wave below are ported from
   index.html's own inline header CSS, so every page sharing this
   stylesheet (about.html, services.html, the-agent.html, etc.) gets the
   same header treatment as index.html by default instead of each page
   re-declaring its own body.page-X copy of the same thing. var(--pos)/
   var(--accent) fall back to fixed gold/violet tones for pages that don't
   define those custom properties themselves (only index.html's scroll-
   driven theme sets them live). */
.main-header::after {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: -1px; height: 1px;
  background: linear-gradient(90deg, transparent, rgba(216,127,255,0.95), rgba(255,208,35,0.5), transparent);
  background-size: 60% 100%;
  background-repeat: no-repeat;
  animation: headerSweep 7s ease-in-out infinite;
  pointer-events: none;
  opacity: .8;
}
@keyframes headerSweep {
  0%   { background-position: -60% 0; }
  50%  { background-position: 130% 0; }
  100% { background-position: -60% 0; }
}

.logo img {
  width: clamp(130px, 12vw, 175px);
  filter: drop-shadow(0 0 15px rgba(168, 85, 247, 0.4));
  animation: logoGlowPulse 4.5s ease-in-out infinite;
}
@keyframes logoGlowPulse {
  0%, 100% { filter: drop-shadow(0 0 14px rgba(168,85,247,0.4)); }
  50%      { filter: drop-shadow(0 0 26px rgba(216,127,255,0.8)); }
}

.nav-center {
  display: flex;
  gap: clamp(10px, 2vw, 32px);
  flex: 1;
  justify-content: center;
  padding: 0 clamp(10px, 2vw, 30px);
  min-width: 0;
}

/* Simplified to match index.html: no more underline-sweep background-image
   or the ::before ghost-lift/::after glow-dot pseudo-elements — just plain
   link styling, with the per-letter wave (.ltr spans, added by each page's
   own nav-wrap script) doing all the hover motion now. */
.nav-center a {
  text-decoration: none;
  color: #fff;
  font-size: clamp(0.75rem, 1.5vw, 0.9rem);
  cursor: pointer;
  letter-spacing: 0.01em;
  white-space: nowrap;
  position: relative;
  padding: 4px 0;
  display: inline-block;
}

.nav-center a .ltr {
  display: inline-block;
  transition: transform 0.35s cubic-bezier(0.34,1.56,0.64,1), color 0.35s ease, text-shadow 0.35s ease;
}

.nav-center a:hover .ltr {
  animation: navLetterWave 0.6s cubic-bezier(0.34,1.56,0.64,1) forwards;
  animation-delay: calc(var(--i) * 28ms);
}

@keyframes navLetterWave {
  0%   { transform: translateY(0); color: #fff; text-shadow: none; }
  45%  { transform: translateY(-7px); color: var(--pos, #ffc857); text-shadow: 0 0 10px color-mix(in srgb, var(--pos, #ffc857) 80%, transparent); }
  100% { transform: translateY(0); color: var(--accent, #a855f7); text-shadow: 0 0 8px color-mix(in srgb, var(--accent, #a855f7) 50%, transparent); }
}

.header-buttons {
  display: flex;
  gap: 15px;
  align-items: center;
}

.header-contact {
  display: none;
}

.btn-warrant {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(8px, 1.5vw, 11px) clamp(18px, 3vw, 30px);
  color: #ffffff;
  text-decoration: none;
  font-size: clamp(0.75rem, 1.5vw, 0.88rem);
  font-weight: 600;
  letter-spacing: 0.03em;
  border: none;
  border-radius: 999px;
  background: linear-gradient(135deg, #d946ef 0%, #a21caf 50%, #e11d9e 100%);
  box-shadow: 0 0 18px rgba(217, 70, 239, 0.55), 0 0 6px rgba(217, 70, 239, 0.3) inset;
  transition: all 0.3s ease;
  overflow: hidden;
  cursor: pointer;
  white-space: nowrap;
}

.btn-warrant::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.25), transparent);
  transition: left 0.5s ease;
  z-index: 1;
}

.btn-warrant:hover {
  background: linear-gradient(135deg, #e879f9 0%, #c026d3 50%, #f43f9e 100%);
  box-shadow: 0 0 28px rgba(217, 70, 239, 0.8), 0 0 10px rgba(217, 70, 239, 0.4) inset;
  transform: translateY(-2px);
}

.btn-warrant:hover::before {
  left: 100%;
}

.btn-reward {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: clamp(8px, 1.5vw, 11px) clamp(18px, 3vw, 30px);
  color: #000000;
  text-decoration: none;
  font-size: clamp(0.75rem, 1.5vw, 0.88rem);
  font-weight: 700;
  letter-spacing: 0.03em;
  border-radius: 999px;
  border: none;
  background: linear-gradient(135deg, #22c55e 0%, #84cc16 50%, #a3e635 100%);
  box-shadow:
    0 0 22px rgba(34, 197, 94, 0.55),
    0 0 40px rgba(132, 204, 22, 0.3),
    inset 0 1px 0 rgba(255, 255, 255, 0.2);
  transition: all 0.3s ease;
  overflow: hidden;
  cursor: pointer;
  white-space: nowrap;
}

.btn-reward::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.2), transparent);
  transition: left 0.5s ease;
  z-index: 1;
}

.btn-reward:hover {
  background: linear-gradient(135deg, #16a34a 0%, #65a30d 50%, #84cc16 100%);
  box-shadow:
    0 0 32px rgba(34, 197, 94, 0.75),
    0 0 55px rgba(132, 204, 22, 0.45),
    inset 0 1px 0 rgba(255, 255, 255, 0.2);
  transform: translateY(-2px);
}

.btn-reward:hover::before {
  left: 100%;
}

.hamburger {
  display: none;
  flex-direction: column;
  gap: 6px;
  cursor: pointer;
  z-index: 105;
}

.hamburger span {
  width: 28px;
  height: 2px;
  background-color: #f0e8ff;
  transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
  display: block;
  box-shadow: 0 0 5px rgba(168, 85, 247, 0.4);
}

.hamburger.active span:nth-child(1) {
  transform: translateY(8px) rotate(45deg);
}

.hamburger.active span:nth-child(2) {
  opacity: 0;
}

.hamburger.active span:nth-child(3) {
  transform: translateY(-8px) rotate(-45deg);
}

.mobile-slide-menu {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  max-width: 320px;
  height: 100vh;
  background: #0a0315;
  backdrop-filter: blur(20px);
  z-index: 104;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 30px;
  transform: translateX(calc(100vw + 10px));
  transition: transform 0.5s cubic-bezier(0.77, 0, 0.175, 1);
  border-left: 1px solid rgba(168, 85, 247, 0.2);
  box-shadow: -10px 0 30px rgba(0, 0, 0, 0.8);
  will-change: transform;
}

.mobile-slide-menu.active {
  transform: translateX(calc(100vw - 320px));
}

.close-menu {
  position: absolute;
  top: 30px;
  right: 30px;
  width: 35px;
  height: 35px;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: transform 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.close-menu:hover {
  transform: rotate(180deg) scale(1.1);
}

.close-menu span {
  position: absolute;
  width: 26px;
  height: 2px;
  background: #f0e8ff;
  box-shadow: 0 0 8px rgba(168, 85, 247, 0.8);
}

.close-menu span:first-child {
  transform: rotate(45deg);
}

.close-menu span:last-child {
  transform: rotate(-45deg);
}

.mobile-slide-menu .menu-item {
  text-decoration: none;
  color: #f0e8ff;
  font-size: 1.3rem;
  font-weight: 500;
  letter-spacing: 0.05em;
  opacity: 0;
  transform: translateX(60px);
  transition: all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.mobile-slide-menu.active .menu-item {
  opacity: 1;
  transform: translateX(0);
  transition-delay: calc(0.1s * var(--i));
}

.mobile-slide-menu a.menu-item:hover {
  color: #ffd023;
  transform: scale(1.05) translateX(0);
}

.mobile-menu-cta {
  margin-top: 10px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 80%;
  opacity: 0;
  transform: translateY(40px);
  transition: all 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.mobile-slide-menu.active .mobile-menu-cta {
  opacity: 1;
  transform: translateY(0);
  transition-delay: calc(0.1s * var(--i));
}

.mobile-menu-cta .btn-warrant,
.mobile-menu-cta .btn-reward {
  width: 100%;
  justify-content: center;
  padding: 12px 24px;
  font-size: 0.88rem;
}

#cosmic-shadow-line,
#cosmic-shadow-line2 {
  position: absolute;
  width: 100vw;
  filter: blur(30px);
  opacity: 0.6;
  z-index: 1;
  pointer-events: none;
  user-select: none;
  will-change: transform, opacity;
}

#cosmic-shadow-line {
  top: -15%;
  left: -5%;
  height: 10vh;
  background: radial-gradient(ellipse at center, rgba(4, 1, 49, 0.6) 0%, rgba(57, 33, 186, 0.6) 50%, transparent 80%);
  transform: rotate(-35deg);
}

#cosmic-shadow-line2 {
  top: 18%;
  left: -5%;
  height: 5vh;
  background: linear-gradient(90deg, transparent 0%, rgba(57, 33, 186, 0.6) 50%, transparent 100%);
  transform: rotate(-35deg);
}

#descent-vignette {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 3;
  opacity: 0;
  transition: none;
  will-change: opacity;
}

#services-dive-overlay {
  position: fixed;
  inset: 0;
  z-index: 10000;
  opacity: 0;
  pointer-events: none;
  background: radial-gradient(circle at 50% 35%, rgba(168, 85, 247, 0.18) 0%, rgba(0, 0, 0, 0.65) 45%, rgba(0, 0, 0, 0.92) 70%, #000 100%);
  backdrop-filter: blur(10px);
  transition: opacity 0.25s ease;
}

#services-dive-overlay::after {
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.05) 1px, transparent 1px, transparent 3px);
  opacity: 0.0;
  mix-blend-mode: screen;
  pointer-events: none;
}

body.services-dive-active #services-dive-overlay {
  opacity: 1;
  pointer-events: auto;
}

body.services-dive-active #services-dive-overlay::after {
  opacity: 0.35;
}

body.services-dive-active .orb-label {
  opacity: 0 !important;
  filter: blur(10px);
  pointer-events: none;
}

body.services-dive-active #hero-layer {
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity 0.3s ease !important;
}

#hero-layer {
  position: absolute;
  inset: 0;
  z-index: 5;
  pointer-events: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 22px;
  text-align: center;
  padding: 0 5%;
}

#hero-layer.force-hidden {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition: none !important;
}

.hero-title {
  font-weight: 700;
  font-size: clamp(1.3rem, 3.5vw, 2.3rem);
  color: #f0e8ff;
  line-height: 1.2;
  word-spacing: 2px;
}

.orb-label {
  position: fixed;
  z-index: 999;
  pointer-events: all;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  transform: translate(-50%, -50%);
  width: max-content;
  max-width: min(340px, 44vw);
}

.orb-label-tag {
  font-family: "Inter", sans-serif;
  font-size: clamp(1.2rem, 3vw, 2.2rem);
  font-weight: 700;
  color: #f0e8ff;
  line-height: 1.15;
}

.orb-label-sub {
  font-size: clamp(0.7rem, 1.5vw, 0.82rem);
  color: #f0e8ff;
  margin-top: 15px;
  line-height: 1.5;
  white-space: normal;
  letter-spacing: -0.5px;
}

.orb-label:hover {
  transform: translate(-50%, -50%) scale(1.06);
  filter: drop-shadow(0 0 18px rgba(168, 85, 247, 0.45)) drop-shadow(0 0 12px rgba(255, 208, 35, 0.18));
}

.orb-label:hover .orb-label-tag {
  color: #ffd023;
  text-shadow: 0 0 26px rgba(168, 85, 247, 0.25);
}

.orb-label:hover .orb-label-sub {
  color: rgba(255, 240, 190, 0.92);
}

.text-white {
  color: #fff;
}

.text-red {
  color: #f41712;
}

.text-yellow {
  color: #ffd023;
}

.text-deep-orange {
  color: #ff6900;
}

.text-light-orange {
  color: #ff7b2e;
}

.text-l {
  margin-left: 150px;
  line-height: 35px !important;
}

.text-r {
  margin-right: 150px;
  line-height: 35px !important;
}

.text-big {
  font-size: clamp(1.2rem, 4vw, 1.5rem);
  line-height: 1.4;
}

.text-mid {
  font-size: clamp(0.9rem, 3.5vw, 1.1rem);
  line-height: 35px;
}

.text-small {
  font-size: clamp(0.85rem, 2.5vw, 0.9rem);
  font-weight: 400;
  line-height: 1.6 !important;
}

.collapse-section {
  position: absolute;

  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100vh;
  max-height: 100vh;
  z-index: 6;
  pointer-events: none;
  overflow: hidden;

  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: clamp(30px, 4vw, 60px);
  padding: 100px 8%;
  box-sizing: border-box;

  opacity: 0;
  visibility: hidden;
  will-change: opacity, transform, filter;
}

.collapse-section::-webkit-scrollbar {
  display: none;

}

.collapse-bg-video-layer {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;

  z-index: 0;
  pointer-events: none;
  opacity: 1;
  will-change: opacity;
  overflow: hidden;
}

.collapse-bg-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  display: block;

  transform: translateZ(0);
  -webkit-transform: translateZ(0);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}

.collapse-bg-video-layer::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.6) 0%,
    rgba(0, 0, 0, 0.4) 45%,
    rgba(0, 0, 0, 0.55) 100%
  );
}

.collapse-section .main-content,
.collapse-section .sidebar-content {
  position: relative;
  z-index: 2;
}

#failures-bg-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 6;
  pointer-events: none;
  background: url('section1.png') center center / cover no-repeat;
  opacity: 0;
  will-change: opacity;
}

#failures-bg-img::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.55) 0%,
    rgba(0, 0, 0, 0.25) 40%,
    rgba(0, 0, 0, 0.25) 60%,
    rgba(0, 0, 0, 0.65) 100%
  );
}

.industry-failures-section {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  max-height: 100vh;
  z-index: 7;

  pointer-events: none;

  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: clamp(30px, 4vw, 60px);
  padding: 100px 8%;
  box-sizing: border-box;

  opacity: 0;
  visibility: hidden;
  will-change: opacity, transform, filter;

  isolation: isolate;
  overflow: hidden;
}

#failures-thunder-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  pointer-events: none;
  border-radius: inherit;
}

.failures-flash-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: radial-gradient(ellipse at 40% 20%, rgba(116, 74, 232, 0.9) 0%, rgba(90, 40, 200, 0.4) 30%, transparent 70%);
  opacity: 0;
  transition: opacity 0.04s linear;
  mix-blend-mode: screen;
}

.failures-red-grid {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(160, 10, 10, 0.06) 1px, transparent 1px),
    linear-gradient(90deg, rgba(160, 10, 10, 0.06) 1px, transparent 1px);
  background-size: 60px 60px;
  animation: failures-grid-drift 18s linear infinite;
  mask-image: radial-gradient(ellipse at 50% 50%, black 30%, transparent 75%);
}

@keyframes failures-grid-drift {
  0% {
    background-position: 0 0, 0 0;
  }

  100% {
    background-position: 60px 60px, 60px 60px;
  }
}

.industry-failures-section .container {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  gap: clamp(30px, 4vw, 60px);
  width: 100%;
}

.industry-failures-section .failure-item {
  display: flex;
  align-items: flex-start;
  gap: 5px;
  padding: 6px 12px;
  background: rgba(15, 10, 30, 0.55);
  border-radius: 8px;
  backdrop-filter: blur(8px);
  border-left: 4px solid #d42828;
  background: rgb(22 22 24 / 70%);
  transition: border-left-color 0.2s ease, box-shadow 0.2s ease;
  animation: item-ember-pulse 4s ease-in-out infinite;
  animation-delay: calc(var(--i, 0) * 0.6s);
}

@keyframes item-ember-pulse {

  0%,
  100% {
    box-shadow: inset 0 0 0 rgba(212, 40, 40, 0);
  }

  50% {
    box-shadow: inset 3px 0 18px rgba(212, 40, 40, 0.18);
  }
}

.industry-failures-section .failure-item:nth-child(1) {
  --i: 0;
}

.industry-failures-section .failure-item:nth-child(2) {
  --i: 1;
}

.industry-failures-section .failure-item:nth-child(3) {
  --i: 2;
}

.industry-failures-section .failure-item:nth-child(4) {
  --i: 3;
}

.industry-failures-section .failure-item:nth-child(5) {
  --i: 4;
}

.industry-failures-section .sub-heading {
  font-size: clamp(0.7rem, 1.5vw, 0.82rem);
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: #ff2f1a;
  font-weight: 400;
  animation: sub-heading-flicker 6s ease-in-out infinite;
}

@keyframes sub-heading-flicker {

  0%,
  94%,
  96%,
  98%,
  100% {
    opacity: 1;
    text-shadow: 0 0 8px rgba(255, 47, 26, 0.7);
  }

  95% {
    opacity: 0.6;
  }

  97% {
    opacity: 0.85;
  }
}

.industry-failures-section .content-col {
  flex: 3.2;
  display: flex;
  flex-direction: column;
  gap: 5px;
  text-align: left;
}

.industry-failures-section .main-heading {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-weight: 700;
  font-size: 3.5rem;
  color: #ffffff;
  letter-spacing: -0.01em;
  display: inline-block;
  position: relative;
  padding-bottom: 12px;
}

.industry-failures-section .main-heading::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 80%;
  height: 3px;
  background: linear-gradient(to right,
      #7a0b12 0%,
      rgba(122, 11, 18, 0.4) 30%,
      transparent 100%);
}

.industry-failures-section .failures-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.industry-failures-section .item-text {
  font-size: clamp(0.82rem, 1.5vw, 1.2rem);
  color: #cbd5e0;
  line-height: 1.55;
  margin: 0;
}

.industry-failures-section .item-text strong {
  color: #f0e8ff;
}

.industry-failures-section .sidebar-col {
  flex: 0.8;
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: center;
}

.industry-failures-section .learn-more-btn {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-size: 1rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: #f7ebeb;
  background-color: #b30424;
  border: none;
  cursor: pointer;
  padding: 10px 30px;
  border-radius: 10px;
  position: relative;
  overflow: hidden;
  text-shadow:
    1px 1px 0px #6d0216, 2px 2px 0px #6d0216, 3px 3px 0px #6d0216, 4px 4px 0px #6d0216,
    5px 5px 0px #6d0216, 6px 6px 0px #6d0216, 7px 7px 0px #6d0216, 8px 8px 0px #6d0216,
    9px 9px 0px #6d0216, 10px 10px 0px #6d0216, 11px 11px 0px #6d0216, 12px 12px 0px #6d0216,
    13px 13px 0px #6d0216, 14px 14px 0px #6d0216, 15px 15px 0px #6d0216, 16px 16px 0px #6d0216,
    17px 17px 0px #6d0216, 18px 18px 0px #6d0216, 19px 19px 0px #6d0216, 20px 20px 0px #6d0216,
    21px 21px 0px #6d0216, 22px 22px 0px #6d0216, 23px 23px 0px #6d0216, 24px 24px 0px #6d0216,
    25px 25px 0px #6d0216, 26px 26px 0px #6d0216, 27px 27px 0px #6d0216, 28px 28px 0px #6d0216,
    29px 29px 0px #6d0216, 30px 30px 0px #6d0216, 31px 31px 0px #6d0216, 32px 32px 0px #6d0216,
    33px 33px 0px #6d0216, 34px 34px 0px #6d0216, 35px 35px 0px #6d0216, 36px 36px 0px #6d0216,
    37px 37px 0px #6d0216, 38px 38px 0px #6d0216, 39px 39px 0px #6d0216, 40px 40px 0px #6d0216;
}

.industry-failures-section .learn-more-btn:hover {
  transform: translate(4px, 4px);
  text-shadow:
    1px 1px 0px #6d0216, 2px 2px 0px #6d0216, 3px 3px 0px #6d0216, 4px 4px 0px #6d0216,
    5px 5px 0px #6d0216, 6px 6px 0px #6d0216, 7px 7px 0px #6d0216, 8px 8px 0px #6d0216,
    9px 9px 0px #6d0216, 10px 10px 0px #6d0216, 11px 11px 0px #6d0216, 12px 12px 0px #6d0216,
    13px 13px 0px #6d0216, 14px 14px 0px #6d0216, 15px 15px 0px #6d0216, 16px 16px 0px #6d0216,
    17px 17px 0px #6d0216, 18px 18px 0px #6d0216, 19px 19px 0px #6d0216, 20px 20px 0px #6d0216;
}

.industry-failures-section .learn-more-btn:active {
  transform: translate(8px, 8px);
  text-shadow: none;
}

.industry-failures-section .sidebar-footer {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-weight: 400;
  font-size: 1rem;
  letter-spacing: 1px;
  margin: 0;
  background: linear-gradient(to right,
      #e11b93 0%,
      #e97554 22%,
      #f2cc3a 40%,
      #c48b62 62%,
      #8e4cb3 83%,
      #4a06cf 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  margin-top: 15px;
}

.industry-failures-section .gradient-text {
  background: linear-gradient(90deg, #60a5fa, #a78bfa);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  font-weight: 700;
}

.competitive-landscape-section {
  position: absolute;
  top: 10%;
  left: 50%;
  transform: translate(-50%, -10%);
  width: 100%;
  max-height: 100vh;
  z-index: 8;

  pointer-events: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 80px 7%;
  box-sizing: border-box;
  background: transparent;
  opacity: 0;
  visibility: hidden;
  will-change: opacity, transform, filter;
}

.landscape-container {
  width: 100%;
  max-width: 1300px;
  display: flex;
  flex-direction: column;
  gap: 0px;
  justify-content: center;
  height: 100%;
}

.heading-container {
  display: flex;
  flex-direction: column;
  gap: 0px;
  align-items: flex-start;
}

.landscape-heading {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-weight: 700;
  font-size: 3.5rem;
  color: #ffffff;
  letter-spacing: -0.01em;
  display: inline-block;
  position: relative;
  margin-bottom: 20px;
}

.cards-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.landscape-card::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 14px;

  pointer-events: none;
}

.landscape-card:hover {
  border-color: #8f232466;
}

.card-number {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  color: #c084fc;
  opacity: 0.7;
}

.card-title {
  font-size: clamp(1rem, 1.8vw, 1.25rem);
  font-weight: 700;
  color: #f0e8ff;
  margin: 0;
  line-height: 1.2;
}

.card-living-object {

  color: rgba(192, 132, 252, 0.45);
  align-self: flex-end;
  margin-top: auto;
  flex-shrink: 0;
}

.landscape-footer-bar {
  padding: 20px 26px;
  background: rgba(192, 132, 252, 0.06);
  border: 1px solid rgba(192, 132, 252, 0.15);
  border-radius: 10px;
  backdrop-filter: blur(10px);
}

.footer-bar-text {
  font-size: clamp(0.85rem, 1.5vw, 1rem);
  color: #94a3b8;
  line-height: 1.7;
  margin: 0;
  text-align: left;
}

.footer-bar-text .highlight-purple {
  color: #c084fc;
  font-weight: 600;
}

.main-content {
  flex: 1.2;
  display: flex;
  flex-direction: column;
  gap: 24px;
  text-align: left;
}

.main-title {
  font-size: clamp(2.5rem, 5vw, 4rem);

  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-weight: 900;

  font-size: 4rem;

  letter-spacing: -0.02em;

  background: linear-gradient(to right,
      #ff11a8 0%,

      #ff705a 20%,

      #ffe600 42%,

      #e1b63c 60%,

      #c48682 72%,

      #a256bd 85%,

      #5326cf 100%

    );

  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;

}

.body-text {
  font-size: 1.25rem;
  line-height: 1.5;
  color: #e2e8f0;
  margin: 0;
  font-weight: 400;
}

.body-text.highlight {
  color: #ffffff;
  font-size: clamp(1.1rem, 2vw, 1.35rem);
  border-left: 3px solid #a855f7;
  padding-left: 20px;
}

.orange-text {
  font-size: 1.15rem;
  line-height: 1.5;
  color: #ff6b35;
  margin-top: 10px;
}

.sidebar-content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 20px;
  max-height: 80vh;
}

.next-era-card,
.prospect-card,
.mystery-card,
.standards-list {
  border-radius: 8px;
  backdrop-filter: blur(10px);
}

.next-era-card {
  text-align: center;
  padding: 30px;
  background: rgba(25, 16, 39, 0.6);
  border: 1px solid rgba(255, 208, 35, 0.2);
}

.next-era-title {
  font-weight: 800;
  font-size: clamp(1.8rem, 3vw, 2.5rem);
  color: #ffd023;
  text-transform: uppercase;
  letter-spacing: 2px;
  margin: 0 0 15px 0;
  text-shadow: 0 0 15px rgba(255, 208, 35, 0.4);
}

.next-era-desc {
  font-size: 1.05rem;
  color: #f0e8ff;
  max-width: 600px;
  line-height: 1.6;
  margin: 0 auto;
  opacity: 0.85;
}

.prospect-card {
  background: rgba(20, 12, 30, 0.7);
  padding: 25px;
  text-align: center;
  border: 1px solid rgba(255, 255, 255, 0.05);
}

.prospect-meta {
  font-size: 0.85rem;
  color: #a0aec0;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.prospect-quote {
  font-family: "Plus Jakarta Sans", "Poppins", "Inter", sans-serif;
  font-weight: 700;
  font-size: 2.5rem;
  line-height: 1.0;
  margin: 10px 0px;
  text-align: center;
  letter-spacing: -0.01em;
  background: linear-gradient(135deg,
      #a848c4 0%,
      #e7238a 25%,
      #ff5376 55%,
      #ff8041 85%,
      #fca414 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

.prospect-subtext {
  font-size: 0.75rem;
  color: #a0aec0;
  font-style: italic;
  line-height: 1.4;
  margin: 0;
}

.mystery-card {
  background: rgba(30, 10, 40, 0.5);
  padding: 15px 20px;
  text-align: center;
  border: 1px solid rgba(255, 255, 255, 0.05);
}

.mystery-title {
  font-family: "Plus Jakarta Sans", "Poppins", "Inter", sans-serif;
  font-weight: 700;
  font-size: 1.5rem;
  line-height: 1.2;
  text-align: center;
  letter-spacing: -0.01em;
  background: linear-gradient(135deg,
      #a848c4 0%,
      #e7238a 25%,
      #ff5376 55%,
      #ff8041 85%,
      #fca414 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

.standards-list {
  background: rgba(15, 8, 25, 0.8);
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  border: 1px solid rgba(255, 255, 255, 0.05);
}

.list-item {
  font-size: 0.9rem;
  color: #cbd5e0;
  display: flex;
  align-items: center;
  gap: 10px;
}

.bullet {
  width: 6px;
  height: 6px;
  background-color: #c332cc;
  display: inline-block;
  border-radius: 10px;
  box-shadow: 0 0 8px #c332cc;
}

#sound-toggle {
  position: fixed;
  bottom: 30px;
  right: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: 50%;
  cursor: pointer;
  transition: background 0.3s, border-color 0.3s, transform 0.2s;
  flex-shrink: 0;
  z-index: 102;
  margin: 0;
}

#sound-toggle:hover {
  background: rgba(168, 85, 247, 0.18);
  border-color: #a855f7;
  transform: scale(1.1);
}

#sound-toggle svg {
  display: block;
}

#sound-toggle .icon-muted {
  display: none;
}

#sound-toggle.muted .icon-playing {
  display: none;
}

#sound-toggle.muted .icon-muted {
  display: block;
}

@keyframes sound-ripple {
  0% {
    box-shadow: 0 0 0 0 rgba(168, 85, 247, 0.45);
  }

  70% {
    box-shadow: 0 0 0 10px rgba(168, 85, 247, 0);
  }

  100% {
    box-shadow: 0 0 0 0 rgba(168, 85, 247, 0);
  }
}

#sound-toggle:not(.muted) {
  animation: sound-ripple 2s ease-out infinite;
}

#scroll-indicator {
  position: fixed;
  bottom: 36px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 102;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  cursor: pointer;
  pointer-events: all;
  opacity: 1;
  transition: opacity 0.5s ease;
}

#scroll-indicator.hidden {
  opacity: 0;
  pointer-events: none;
}

.scroll-pill {
  width: 28px;
  height: 46px;
  border: 2px solid #d946ef;
  border-radius: 999px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.scroll-arrow-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  animation: arrow-drop 1.6s ease-in-out infinite;
}

@keyframes arrow-drop {
  0% {
    transform: translateY(-6px);
    opacity: 0;
  }

  30% {
    opacity: 1;
  }

  70% {
    opacity: 1;
  }

  100% {
    transform: translateY(6px);
    opacity: 0;
  }
}

.scroll-arrow-inner svg {
  width: 14px;
  height: 18px;
  stroke: #d946ef;
  stroke-width: 2;
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

#creative-footer {
  position: relative;
  width: 100%;
  min-height: 100vh;
  background: #0a0315;
  color: #f0e8ff;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
  padding: 0;
  z-index: 110;
  display: flex;
  flex-direction: column;
  justify-content: space-between;

  opacity: 0;
  filter: blur(30px);
  transform: translateY(50px);
}

.footer-avant-garde {
  display: flex;
  flex-wrap: wrap;
  flex-grow: 1;
  padding: 10vh 5%;
  gap: 60px;
  align-items: center;
}

.fg-pane {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.fg-left {
  flex: 1.2;
  min-width: 300px;
  border-right: 1px solid rgba(255, 255, 255, 0.1);
  padding-right: clamp(20px, 4vw, 60px);
}

.fg-right {
  flex: 1;
  min-width: 300px;
  display: flex;
  flex-direction: column;
  gap: 30px;
}

.cyber-heading {
  font-size: clamp(2.5rem, 6vw, 5.5rem);
  font-family: "Inter", sans-serif;
  line-height: 1.05;
  text-transform: uppercase;
  color: transparent;
  -webkit-text-stroke: 1.5px #a855f7;
  margin: 30px 0;
  letter-spacing: 2px;
  transition: 0.5s ease-in-out;
  cursor: default;
}

.cyber-heading:hover {
  color: #ffd023;
  -webkit-text-stroke: 1.5px #ffd023;
  transform: scale(1.02) translateX(10px);
}

.fg-block {
  background: rgba(255, 255, 255, 0.02);
  border: 1px solid rgba(255, 255, 255, 0.05);
  padding: clamp(20px, 4vw, 40px);
  border-radius: 12px;
  backdrop-filter: blur(10px);
  transition: 0.3s;
}

.fg-block:hover {
  border-color: rgba(168, 85, 247, 0.3);
  background: rgba(255, 255, 255, 0.04);
}

.status-terminal {
  display: flex;
  flex-direction: column;
  gap: 15px;
  font-family: "Inter", sans-serif;
}

.links-block {
  display: flex;
  gap: clamp(20px, 4vw, 40px);
  flex-wrap: wrap;
}

.links-col {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-width: 120px;
}

.footer-logo-box img {
  width: clamp(100px, 12vw, 150px);
  filter: drop-shadow(0 0 15px rgba(168, 85, 247, 0.4));
}

.footer-mission {
  font-size: clamp(0.65rem, 2vw, .8rem);
  line-height: 1.5;
  opacity: 0.7;
  max-width: 400px;
  font-weight: 300;
}

.cell-label {
  font-size: 0.7rem;
  text-transform: uppercase;
  letter-spacing: 0.3em;
  color: #a855f7;
  margin-bottom: 25px;
  font-weight: 700;
  display: block;
}

.f-link {
  text-decoration: none;
  color: inherit;
  font-size: 0.95rem;
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  transition: 0.4s cubic-bezier(0.23, 1, 0.32, 1);
  opacity: 0.6;
}

.f-link::before {
  content: '>';
  margin-right: 12px;
  color: #ffd023;
  opacity: 0;
  transform: translateX(-10px);
  transition: 0.3s;
}

.f-link:hover {
  opacity: 1;
  color: #fff;
  padding-left: 8px;
}

.f-link:hover::before {
  opacity: 1;
  transform: translateX(0);
}

.status-row {
  display: flex;
  justify-content: space-between;
  font-size: 0.85rem;
  letter-spacing: 1px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.05);
  padding-bottom: 8px;
}

.status-row:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.status-indicator {
  color: #00ffaa;
  text-shadow: 0 0 8px rgba(0, 255, 170, 0.5);
  font-weight: bold;
}

.footer-bar {
  padding: 30px 5%;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: space-between;
  align-items: center;
  font-size: 0.7rem;
  letter-spacing: 0.15em;
  opacity: 0.5;
  background: #030303;
  border-top: 1px solid rgba(255, 255, 255, 0.05);
}

.line-wrapper {
  overflow: hidden;
  display: block;
}

.text-line {
  display: block;
  transform: translateY(100%);
  opacity: 0;
  filter: blur(10px);
  will-change: transform, opacity, filter;
}

.typing::after {
  content: '|';
  animation: blink 0.7s infinite;
  color: #a855f7;
}

@keyframes blink {
  50% {
    opacity: 0;
  }
}

.contact-wrapper {
  perspective: 1000px;
}

.contact-neural {
  position: relative;
  display: inline-block;
  padding: clamp(8px, 1.5vw, 12px) clamp(16px, 3vw, 28px);
  color: #ffffff;
  text-decoration: none;
  font-size: clamp(0.75rem, 1.5vw, 0.9rem);
  letter-spacing: 0.01em;
  border: 1px solid rgba(255, 255, 255, 0.9);
  transition: all 0.3s ease;
  background: rgba(0, 0, 0, 0.5);
  overflow: visible;
}

.contact-neural::before {
  content: attr(data-value);
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #a855f7;
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.4s cubic-bezier(0.7, 0, 0.3, 1);
  clip-path: inset(0 100% 0 0);
  z-index: 2;
}

.contact-neural:hover {
  border-color: #a855f7;
  box-shadow: -5px 5px 0px #ffd023;
  transform: translate(3px, -3px);
}

.contact-neural:hover::before {
  clip-path: inset(0 0 0 0);
  transform: translate(-8px, 8px);
}

.neural-line {
  position: absolute;
  top: 0;
  left: 0;
  width: 2px;
  height: 100%;
  background: #fff;
  box-shadow: 0 0 10px #fff;
  opacity: 0;
  z-index: 3;
}

.contact-neural:hover .neural-line {
  animation: scan 1.5s infinite;
  opacity: 1;
}

@keyframes scan {
  0% {
    left: 0%;
  }

  100% {
    left: 100%;
  }
}

@media (max-width: 1024px) {
  .collapse-section {
    flex-direction: column;
    justify-content: flex-start;
    align-items: stretch;
    padding-top: 100px;
  }

  .main-content,
  .sidebar-content {
    flex: none;
    width: 100%;
    gap: 0px;
  }

  .sidebar-content {
    max-height: none;
  }

  .fg-left {
    border-right: none;
    padding-right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    padding-bottom: 40px;
  }

  .footer-avant-garde {
    flex-direction: column;
    gap: 40px;
    padding-top: 5vh;
  }
  .prospect-card{
    padding: 5px
  }
}

@media (max-width: 1024px) {
  .nav-center {
    display: none;
  }

  .hamburger {
    display: flex;
  }

  .header-buttons {
    display: none;
  }

  .btn-warrant,
  .btn-reward {
    padding: 8px 12px;
    font-size: 0.7rem;
  }

  .header-title {
    font-size: 0.8rem;
    left: 50px;
    top: 25px;
  }

  .main-header {
    justify-content: space-between;
    gap: 10px;
  }

  .main-header>div:last-child {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 15px;
  }

  .text-l,
  .text-r {
    margin-left: 0;
    margin-right: 0;
  }

  .orb-label-sub {
    font-size: clamp(0.65rem, 2.8vw, 0.78rem);
  }

  .orb-label-tag {
    font-size: clamp(1rem, 5.5vw, 1.5rem);
  }
}

@media (max-width: 600px) {
  .links-block {
    flex-direction: column;
    gap: 30px;
  }
}

.collapse-section {
  perspective: 1300px;

}

.main-content,
.sidebar-content,
.fg-pane {
  transform-style: preserve-3d;
  will-change: transform, opacity, filter;
}

.main-title,
.body-text,
.fg-block,
.next-era-card,
.prospect-card,
.standards-list,
.cell-label {
  will-change: transform, opacity, filter;
  transform-style: preserve-3d;
  backface-visibility: hidden;
}

body {
  margin: 0;
  background-color: #0a0315;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  color: #ffffff;
}

.industry-failures-section {
  background-color: transparent;
  background-image: none;

  padding: 60px 40px;
  display: flex;
  justify-content: center;
}

.container {
  display: flex;
  max-width: 1300px;
  width: 100%;
  gap: 30px;
}

.content-col {
  flex: 3.5;
}

.sub-heading {
  color: #d62828;
  font-size: 0.95rem;
  font-weight: 700;
  letter-spacing: 0.5px;
  display: block;
  margin-bottom: 5px;
}

.main-heading {
  font-size: 3.4rem;
  font-weight: 700;
  margin: 0 0 40px 0;
  letter-spacing: -0.5px;
}

.failures-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.failure-item {
  background-color: #121214;
  border-left: 4px solid #d62828;
  border-radius: 8px;
  padding: 16px 24px;
  display: flex;
  align-items: flex-start;
}

.item-number {
  color: #d62828;
  font-weight: 700;
  font-size: 1.15rem;
  margin-right: 8px;
  white-space: nowrap;
}

.item-text {
  margin: 0;
  font-size: 1.15rem;
  color: #9c9c9c;
  line-height: 1.4;
}

.item-text strong {
  color: #ffffff;
}

.sidebar-col {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-end;
  padding-bottom: 20px;
  min-width: 260px;
}

.image-wrapper {
  width: 100%;
  text-align: center;
  margin-bottom: 20px;
}

.sidebar-img {
  max-width: 100%;
  height: auto;
}

video.sidebar-img {
  display: block;
  max-width: 100%;
  height: auto;
  object-fit: cover;
  background: transparent;
  pointer-events: none;
}

.learn-more-btn {
  background-color: #b0003a;
  color: #ffffff;
  border: none;
  font-weight: 700;
  font-size: 0.95rem;
  padding: 12px 36px;
  border-radius: 6px;
  letter-spacing: 1px;
  cursor: pointer;
}

.sidebar-footer {
  margin-top: 15px;
  font-size: 1rem;
  font-weight: 600;
  color: #ffffff;
}

.gradient-text {
  background: linear-gradient(to right, #e0115f, #702963, #ffcc00);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 700;
}

@media (max-width: 850px) {
  .container {
    flex-direction: column;
  }

  .sidebar-col {
    margin-top: 10px;
    width: 100%;
    flex-direction: row;
  }
}

.competitive-landscape-section {
  background-color: transparent;

  color: #ffffff;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  padding: 60px 40px;
  display: flex;
  justify-content: center;
}

.landscape-container {
  max-width: 1300px;
  width: 100%;
}

.landscape-tag {
  color: #c92a2a;
  font-weight: 700;
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  display: block;
  margin-bottom: 8px;
}

.landscape-heading {
  font-size: 3.2rem;
  font-weight: 700;
  margin: 0 0 45px 0;
  letter-spacing: -0.5px;
  display: inline-block;
  padding-bottom: 8px;
}

.cards-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-bottom: 35px;
}

.card-title {
  font-size: 1.6rem;
  font-weight: 700;
  margin: 0 0 16px 0;
  color: #ffffff;
}

.card-description {
  color: #989a98;
  font-size: 1.0rem;
  line-height: 1.4;
  margin: 0;
  z-index: 2;

}

.card-bg-icon {
  position: absolute;
  bottom: -10px;
  right: -10px;
  width: 150px;
  height: 150px;
  opacity: 0.08;

  pointer-events: none;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: bottom right;
}

.icon-lock {
  background-image: url('data:image/svg+xml;utf8,...');
}

.icon-circus {
  background-image: url('data:image/svg+xml;utf8,...');
}

.icon-mask {
  background-image: url('data:image/svg+xml;utf8,...');
}

.landscape-footer-bar {
  background-color: rgba(18, 18, 20, 0.6);
  border-left: 6px solid #6366f1;

  padding: 22px 30px;
  border-radius: 4px;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.footer-bar-text {
  margin: 0;
  font-size: 1.3rem;
  font-weight: 700;
  line-height: 1.4;
  color: #ffffff;
}

.highlight-purple {
  color: #a855f7;

}

@media (max-width: 992px) {
  .cards-grid {
    grid-template-columns: 1fr;

    gap: 20px;
  }

  .landscape-heading {
    font-size: 2.5rem;
  }

  .footer-bar-text {
    font-size: 1.1rem;
  }
}

.competitive-landscape-section {
  background-color: transparent;

  color: #ffffff;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  padding: 80px 40px;
  display: flex;
  justify-content: center;
}

.landscape-container {
  max-width: 1300px;
  width: 100%;
}

.landscape-tag {
  color: #e63946;
  font-weight: 700;
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 2px;
  display: block;
  margin-bottom: 6px;
}

.heading-wrapper {
  display: inline-block;
  margin-bottom: 50px;
}

.landscape-heading {
  font-size: 3.4rem;
  font-weight: 700;
  margin: 0;
  letter-spacing: -0.5px;
}

.heading-underline {
  display: block;
  width: 96%;
  height: 4px;
  background-color: #ffffff;
  border-radius: 4px;
  margin-top: 8px;
}

.cards-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  margin-bottom: 25px;
}

.card-title {
  font-size: 1.5rem;
  font-weight: 500;
  margin: 0 0 8px 0;
  color: #ffffff;
  letter-spacing: -0.3px;
  position: relative;
  z-index: 2;
}

.card-living-object {
  position: absolute;

  color: #e63946;
  opacity: 0.08;

  pointer-events: none;
  z-index: 1;
}

.landscape-footer-bar {
  background-color: rgba(17, 17, 18, 0.6);
  border-left: 5px solid #7148e3;

  padding: 15px 25px;
  border-radius: 6px;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.footer-bar-text {
  margin: 0;
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1.5;
  color: #ffffff;
  letter-spacing: -0.2px;
}

.highlight-purple {
  color: #9f7aea;

}

@media (max-width: 992px) {
  .cards-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .landscape-heading {
    font-size: 2.6rem;
  }

  .footer-bar-text {
    font-size: 1.15rem;
  }
}

.card-title {
  font-size: 1.7rem;
  font-weight: 700;
  margin: 0 0 18px 0;
  color: #ffffff;
  letter-spacing: -0.3px;
}

.card-living-object {
  position: absolute;

  color: #cf2a2a;
  opacity: 0.07;
  pointer-events: none;
  z-index: 1;
}

.landscape-card {
  position: relative;
  background-color: rgba(17, 17, 18, 0.6);

  border-radius: 24px;
  padding: 40px 25px 55px 25px;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  box-sizing: border-box;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);

  box-shadow:
    0 30px 60px -15px rgba(0, 0, 0, 0.6),
    0 0 40px rgba(207, 42, 42, 0.04);
    border:1px solid #2b2b2b;
}

.landscape-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 60%;
  background: radial-gradient(circle at 50% -15%, rgba(143, 35, 36, 0.4) 0%, rgba(143, 35, 36, 0.2) 30%, transparent 50%);
  pointer-events: none;
  z-index: 1;
}

.landscape-card::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 24px;
  padding: 1.5px;
  padding-top: 6px;
  background: linear-gradient(to bottom, #ef3c36 0%, rgba(207, 42, 42, 0.5) 15%, transparent 65%);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
  z-index: 3;
}

.card-number {
  color: #802020;
  font-size: 3rem;
  font-weight: 700;
  line-height: 1;
  margin-bottom: 15px;
  letter-spacing: -1px;
  position: relative;
  z-index: 2;
}

.card-title {
  font-size: 1.75rem;
  font-weight: 700;
  margin: 0 0 10px 0;
  color: #ffffff;
  letter-spacing: -0.3px;
  position: relative;
  z-index: 2;
}

.card-living-object {
  position: absolute;
  bottom: 0px;
  right: 0px;

  color: #cf2a2a;
  opacity: 0.12;
  pointer-events: none;
  z-index: 1;
}

.card-living-object1 {
  width: 180px;
  height: auto;
}

.card-living-object2 {
  width: 190px;
  height: auto;
  right: -16px;
}

.card-living-object3 {
  width: 125px;
  height: auto;
  right: -15px;
}

.card-living-object4 {
  width: 120px;
  height: 120px;
}

.heading-container {
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;

  padding: 0px;
}

.landscape-tag {
  color: #c92a2a;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  font-weight: 400;
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  margin-bottom: 0px;
}

.landscape-heading {
  position: relative;
  color: #ffffff;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  font-size: 3.2rem;
  font-weight: 700;
  margin: 0;
  letter-spacing: -0.5px;

  margin-bottom: 25px;
  padding-bottom: 15px;
}

.landscape-heading::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 14px;

  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 10' preserveAspectRatio='none'><path d='M0,8 Q50,2 100,6' stroke='%23c92a2a' stroke-width='2.5' fill='transparent' stroke-linecap='round'/></svg>");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  pointer-events: none;
}

.negation-landscape-section {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100vh;
  z-index: 9;

  pointer-events: none;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  overflow: hidden;
  background-color: transparent;

  color: #ffffff;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  padding: 50px 40px;
  opacity: 0;
  visibility: hidden;
  will-change: opacity, transform, filter;
}

.negation-container {
  max-width: 1300px;
  width: 100%;
}

.negation-tag {
  color: #cf2a2a;
  font-weight: 700;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  display: block;
  margin-bottom: 4px;
}

.negation-heading-wrapper {
  display: inline-flex;
  margin-bottom: 18px;
}

.negation-heading-wrapper span {
  position: relative;
  color: #ffffff;
  font-size: 3.2rem;
  font-weight: 700;
  margin: 0;
  letter-spacing: -0.5px;
  margin-bottom: 25px;
  margin-right: 12px;
}

.negation-heading {
  position: relative;
  color: #ffffff;
  font-size: 3.2rem;
  font-weight: 700;
  margin: 0;
  letter-spacing: -0.5px;
  margin-bottom: 25px;
  padding-bottom: 10px;
}

.negation-heading::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 95%;
  height: 14px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 10' preserveAspectRatio='none'><path d='M0,8 Q50,2 100,6' stroke='%23cf2a2a' stroke-width='2.5' fill='transparent' stroke-linecap='round'/></svg>");
  background-repeat: no-repeat;
  background-size: 100% 100%;
  pointer-events: none;
}

.negation-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-bottom: 20px;

}

.negation-card {
  position: relative;
  background-color: rgba(17, 17, 18, 0.6);
  border-radius: 14px;
  padding: 8px 20px;

  display: flex;
  align-items: flex-start;
  box-sizing: border-box;

  border-left: 4px solid #cf2a2a;
}

.negation-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 50%;

  pointer-events: none;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

.negation-card::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 14px;
  padding: 1.5px;

  background: linear-gradient(to bottom, #ef3c36 0%, rgba(207, 42, 42, 0.4) 15%, transparent 60%);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
}

.card-icon-column {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-shrink: 0;
  width: 45px;

}

.icon-cross {
  color: #cf2a2a;
  font-size: 3.5rem;
  font-weight: 700;
  line-height: 0.7;

  transform: translateY(-2px);

}

.card-content-column {
  display: flex;
  flex-direction: column;
  margin-left: 16px;

  position: relative;
  z-index: 2;
}

.negation-card-title {
  font-size: 1.25rem;
  font-weight: 700;
  color: #ffffff;
  margin: 0 0 8px 0;

  letter-spacing: -0.2px;
}

.negation-card-description {
  color: #8c8c8c;
  font-size: 1.0rem;
  font-style: italic;
  line-height: 1.5;
  margin: 0;
}

.negation-footer-bar {
  background-color: rgba(18, 18, 20, 0.6);
  border-left: 5px solid #8942eb;
  border-radius: 6px;
  padding: 24px 35px;
  display: flex;
  align-items: center;
  gap: 24px;
  box-shadow: 0 20px 45px rgba(0, 0, 0, 0.4);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.icon-check {
  color: #8942eb;
  font-size: 2.2rem;
  font-weight: 700;
  line-height: 1;
  flex-shrink: 0;
}

.negation-footer-text {
  margin: 0;
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1.5;
  color: #ffffff;
  letter-spacing: -0.2px;
}

.text-purple {
  color: #8942eb;
}

.text-yellow {
  color: #fbbf24;
}

@media (max-width: 992px) {
  .negation-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .negation-heading {
    font-size: 2.6rem;
  }

  .negation-footer-text {
    font-size: 1.15rem;
  }
}

.linguistic-architecture-section {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100vh;
  z-index: 10;

  pointer-events: none;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  overflow: hidden;
  background-color: transparent;

  color: #ffffff;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  padding: 50px 40px;
  opacity: 0;
  visibility: hidden;
  will-change: opacity, transform, filter;
  isolation: isolate;
}

.linguistic-container {
  max-width: 1300px;
  width: 100%;
}

.linguistic-tag {
  color: #7148e3;
  font-weight: 600;
  font-size: 0.85rem;
  text-transform: uppercase;
  letter-spacing: 2px;
  display: block;
  margin-bottom: 0px;
}

.linguistic-heading {
  font-size: 3.2rem;
  font-weight: 700;
  margin: 0 0 10px 0;
  letter-spacing: -1.2px;
}

.highlight-red {
  color: #ef3c36;
  position: relative;
  display: inline-block;

  text-shadow:
    0 0 12px rgba(255, 51, 51, 0.6),
    0 0 35px rgba(255, 51, 51, 0.35),
    0 0 70px rgba(255, 51, 51, 0.2);
}

.comparison-table {
  display: grid;
  grid-template-columns: 1fr 50px 1fr;
  align-items: center;
  row-gap: 4px;

  margin-bottom: 16px;
}

.table-column-header {
  font-size: 1.35rem;
  font-weight: 700;
  text-align: center;
  margin-bottom: 0px;
  letter-spacing: -0.3px;
}

.text-purple-glow {
  color: #7148e3;
  text-shadow: 0 0 15px rgba(99, 102, 241, 0.3);
}

.text-gray {
  color: #6b7280;
}

.term-box {
  background-color: rgba(17, 17, 18, 0.6);
  border: 1px solid rgb(100 100 100 / 20%);
  border-radius: 5px;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);

  padding: 3px 16px;
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: -0.2px;
  box-sizing: border-box;
  height: 30px;

  display: flex;
  align-items: center;
  justify-content: center;
}

.left-term {
  color: #ffffff;
  border-left: 4px solid #7148e3;
  box-shadow:
    inset 8px 0 16px -8px rgb(113 72 227 / 40%),
    0 2px 6px rgba(0, 0, 0, 0.4);
}

.right-term {
  color: #4b5563;
  background-color: rgba(12, 12, 13, 0.6);
  border: 1px solid rgb(100 100 100 / 20%);
}

.arrow-column {
  color: #646464;
  font-size: 1.15rem;
  text-align: center;
  font-weight: 500;
  display: flex;
  justify-content: center;
  align-items: center;
}

.strikes {
  text-decoration: line-through;
  text-decoration-color: #374151;
  text-decoration-thickness: 1.5px;
}

.banned-footer-banner {
  background: #290809;
  border: 1px solid rgba(239, 68, 68, 0.12);
  padding: 12px 20px;
  display: flex;
  align-items: center;
  gap: 20px;
  border-radius: 4px;
}

.banned-badge {
  color: #ef4444;
  font-weight: 800;
  font-size: 0.9rem;
  text-transform: uppercase;
  letter-spacing: 1.5px;
  flex-shrink: 0;
}

.banned-terms-list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  row-gap: 6px;
  column-gap: 0;
  color: #fff;
  font-size: 0.8rem;
  font-weight: 400;
}

.banned-terms-list span {
  display: inline-flex;
  align-items: center;
}

.banned-terms-list span:not(:last-child)::after {
  content: "|";
  color: #822225;
  margin: 0 5px;
  font-weight: 300;
  font-size: 0.85rem;
}

@media (max-width: 868px) {
  .comparison-table {
    grid-template-columns: 1fr;
    row-gap: 4px;
  }

  .arrow-column {
    transform: rotate(90deg);
    height: 20px;
  }

  .table-column-header {
    display: none;
  }

  .linguistic-heading {
    font-size: 2.4rem;
  }

  .banned-footer-banner {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
}

.revenue-topology-section {
  max-width: 1300px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 100vh;
  z-index: 11;

  pointer-events: none;
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  overflow: hidden;
  background-color: transparent;

  color: #ffffff;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  padding: 50px 40px;
  opacity: 0;
  visibility: hidden;
  will-change: opacity, transform, filter;
}

.topology-container {
  max-width: 1300px;
  width: 100%;
}

.topology-tag {
  color: #7545c0;
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  display: block;
  margin-bottom: 0px;
}

.topology-heading {
  font-size: 3.2rem;
  font-weight: 700;
  margin: 0 0 10px 0;
  letter-spacing: -1px;
}

.strike-funnel {
  color: #4b5563;
  text-decoration: line-through;
  text-decoration-color: #6b7280;
  text-decoration-thickness: 3px;
}

.topology-content-split {
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: 24px;
  align-items: center;
}

.topology-table-wrapper {
  background-color: rgba(17, 17, 18, 0.6);
  border: 1px solid rgba(255, 255, 255, 0.05);
  border-radius: 6px;
  overflow: hidden;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);
}

.topology-table {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
}

.topology-table th {
  font-size: 0.8rem;
  font-weight: 700;
  color: #7548c0;
  letter-spacing: 1px;
  padding: 10px 15px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.08);
  background-color: rgb(42 41 48 / 40%);
}

.col-phase {
  width: 10%;
}

.col-name {
  width: 25%;
}

.col-desc {
  width: 65%;
}

.topology-table td {
  padding: 4px 20px;
  font-size: .95rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.04);
  vertical-align: middle;
}

.topology-table tr:last-child td {
  border-bottom: none;
}

.phase-num {
  color: #7548c0;
  font-weight: 600;
  background-color: rgb(42 41 48 / 40%);
}

.revacity-name {
  color: #ffffff;
  font-weight: 700;

  text-shadow: 0 0 10px rgba(167, 139, 250, 0.25);
  border-left: 2px solid #7548c0;
}

.phase-desc {
  color: #9ca3af;
  font-weight: 400;
}

.topology-graphic-sidebar {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}

.vector-graphic-wrapper {
  width: 100%;
  max-width: 320px;
  position: relative;
}

.topology-svg {
  width: 100%;
  height: auto;
  overflow: visible;
  filter: drop-shadow(0 0 25px rgba(139, 92, 246, 0.4));
}

.topology-footnote {
  margin-top: 35px;
  color: #6b7280;
  font-style: italic;
  font-size: 1.05rem;
  font-weight: 400;
  letter-spacing: -0.2px;
}

@media (max-width: 992px) {
  .topology-content-split {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .topology-graphic-sidebar {
    margin: 20px auto 0 auto;
  }

  .topology-heading {
    font-size: 2.3rem;
  }
}

.broken-models-section {
  background: transparent;
  color: #ffffff;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  padding: 80px 30px;
  display: flex;
  justify-content: center;
}

.models-container {
  max-width: 1280px;
  width: 100%;
}

.models-header-row {
  margin-bottom: 12px;
  position: relative;
}

.models-context-tag {
  color: #c084fc;
  font-size: 0.85rem;
  font-weight: 400;
  letter-spacing: 1px;
  text-transform: uppercase;
  display: block;
  margin-bottom: 0px;
  opacity: 0.5;
}

.models-title-wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 20px;
}

.models-main-title {
  font-size: 2.8rem;
  font-weight: 700;
  letter-spacing: -1px;
  margin: 0;

}

.dying-agency-badge {
  background-color: #1e0b36;
  border: 1px solid #3b176d;
  color: #f59e0b;
  font-size: 0.95rem;
  font-weight: 500;
  letter-spacing: 0.5px;
  padding: 12px 20px;
  border-radius: 4px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.4);
}

.models-columns-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 25px;
  align-items: stretch;
}

.model-card {
  background-color: #0f061e;
  border: 1px solid rgb(78 65 108 / 80%);
  border-radius: 8px;
  padding: 15px 20px;
  display: flex;
  flex-direction: column;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.6);
  transition: border-color 0.3s ease;
}

.model-card:hover {
  border-color: rgba(255, 255, 255, 0.08);
}

.card-icon-row svg {
  width: 28px;
  height: 28px;
  margin-bottom: 5px;
}

.stroke-pink svg {
  color: #ec4899;
  filter: drop-shadow(0 0 8px rgba(236, 72, 153, 0.3));
}

.stroke-yellow svg {
  color: #fbbf24;
  filter: drop-shadow(0 0 8px rgba(251, 191, 36, 0.3));
}

.stroke-blue svg {
  color: #38bdf8;
  filter: drop-shadow(0 0 8px rgba(56, 189, 248, 0.3));
}

.card-heading {
  font-size: 1.6rem;
  font-weight: 700;
  letter-spacing: -0.5px;
  margin: 0 0 14px 0;
}

.card-pill-tag {
  display: inline-flex;
  align-self: flex-start;
  font-size: 0.65rem;
  font-weight: 600;
  letter-spacing: 1px;
  padding: 4px 10px;
  border-radius: 20px;
  margin-bottom: 15px;
}

.tag-purple {
  background-color: #24123a;
  color: #a78bfa;
  border: 1px solid #3b1c5c;
}

.tag-brown {
  background-color: #271714;
  color: #f59e0b;
  border: 1px solid #45241b;
}

.tag-blue {
  background-color: #101f30;
  color: #38bdf8;
  border: 1px solid #173454;
}

.card-body-text {
  color: #ffffff;
  font-size: 0.9rem;
  line-height: 1.4;
  margin: 0 0 15px 0;
  font-weight: 300;
  opacity: 0.85;
}

.alternative-divider {
  border-top: 1px solid rgba(255, 255, 255, 0.06);
  margin-top: auto;

  padding-top: 15px;
}

.alternative-title {
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 1.5px;
  margin: 0 0 12px 0;
}

.text-purple {
  color: #818cf8;
}

.text-orange {
  color: #f97316;
}

.text-teal {
  color: #2dd4bf;
}

.alternative-body-text {
  color: #ffffff;
  font-size: 0.9rem;
  line-height: 1.4;
  margin: 0;
  font-weight: 300;
}

@media (max-width: 1024px) {
  .models-columns-grid {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .models-main-title {
    font-size: 2.2rem;
  }

  .dying-agency-badge {
    width: 100%;
    text-align: center;
  }
}

.diagnostic-booking-section {
  background: transparent;
  color: #ffffff;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  padding: 90px 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.diagnostic-container {
  max-width: 820px;
  width: 100%;
  text-align: center;
}

.diagnostic-main-heading {
  font-size: 4.2rem;
  font-weight: 800;
  letter-spacing: -2px;
  margin: 0 0 20px 0;
  font-family: Arial Black, -apple-system, sans-serif;
}

.diagnostic-lead-subtext {
  font-size: 0.9rem;
  color: #9ca3af;
  line-height: 1.4;
  font-weight: 400;
  margin: 0 auto 15px auto;
  max-width: 720px;
}

.financial-certainty-banner {
  font-size: 1.85rem;
  font-weight: 600;
  font-style: italic;
  letter-spacing: -0.5px;
  margin-bottom: 15px;
}

.purple-glow-text {
  color: #c084fc;
  font-weight: 700;
  text-shadow: 0 0 20px rgba(168, 85, 247, 0.75), 0 0 40px rgba(168, 85, 247, 0.3);
}

.skeptic-cta-block {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 15px;
}

.skeptic-title {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-weight: 800;
  font-size: 1.5rem;
  letter-spacing: -0.02em;
  line-height: 1.5;

  background: linear-gradient(to right,
      #fd352b 0%,

      #ff6655 23%,

      #fff000 45%,

      #dca366 65%,

      #fd352b 84%,

      #fd352b 100%

    );

  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

.skeptic-desc {
  font-size: 1.4rem;
  font-weight: 700;
  margin: 0 0 15px 0;
  color: #ffffff;
}

.compare-action-row {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: transparent;
}

.compare-text {
  font-family: "Inter", "Helvetica Neue", Arial, sans-serif;
  font-weight: 600;
  font-size: 1.1rem;
  line-height: 1.3;
  letter-spacing: -0.01em;
  background: linear-gradient(to right,
      #4905f5 0%,
      #8207e0 35%,
      #bd06bd 70%,
      #e004a5 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

.mobile-break {
  display: block;
}

.go-capsule-btn {
  background: linear-gradient(90deg, #d946ef 0%, #ca8a04 100%);
  background-color: #e02424;
  padding: 2px;
  border-radius: 30px;
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  transition: transform 0.2s ease;
}

.go-capsule-btn:hover {
  transform: scale(1.03);
}

.go-text {
  color: #ffffff;
  font-weight: 900;
  font-size: 1.15rem;
  padding: 0 14px 0 18px;
}

.arrow-icon {
  background-color: #ffffff;
  color: #e02424;
  font-size: 1.5rem;
  font-weight: 900;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}

.diagnostic-intake-form {
  border-top: 1px solid rgba(255, 255, 255, 0.15);
  padding-top: 15px;
  text-align: left;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.form-grid-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.form-input-group {
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.form-input-group label {
  color: #4b5563;

  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 1.5px;
}

.form-input-group input,
.form-input-group select,
.form-input-group textarea {
  background-color: #0a0315;
  border: 1px solid #3e3e43;
  border-radius: 4px;
  color: #38383e;
  font-size: 1.05rem;
  padding: 7px 16px;
  width: 100%;
  box-sizing: border-box;
  outline: none;
  transition: all 0.2s ease;
  font-family: arial;
}

.form-input-group input::placeholder,
.form-input-group textarea::placeholder {
  color: #3f3f46;
}

.form-input-group input:focus,
.form-input-group select:focus,
.form-input-group textarea:focus {
  border-color: #7c3aed;
  box-shadow: 0 0 10px rgba(124, 58, 237, 0.2);
}

.custom-select-wrapper {
  position: relative;
  width: 100%;
}

.form-input-group select {
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
}

.custom-select-wrapper::after {
  content: "";
  position: absolute;
  right: 18px;
  top: 50%;
  transform: translateY(-20%);
  border-width: 6px 5px 0 5px;
  border-style: solid;
  border-color: #4b5563 transparent transparent transparent;
  pointer-events: none;
}

.form-input-group select option {
  background-color: #0d0d0e;
  color: #ffffff;
}

@media (max-width: 768px) {
  .diagnostic-main-heading {
    font-size: 2.8rem;
  }

  .form-grid-row {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .compare-action-row {
    flex-direction: column;
    gap: 10px;
  }

  .compare-text {
    text-align: center;
  }
  .form-input-group label{
    display: none;
  }
  .diagnostic-intake-form{
    border-top: 0px solid rgba(255, 255, 255, 0.15);
    padding-top: 0px;
  }
  .mobile-break{
    display: none !important;
  }
}

.diagnostic-booking-section {
  position: relative;
  overflow: hidden;
}

.glitch-active {
  animation: glitch-skew 0.3s steps(2) infinite;
}

@keyframes glitch-skew {
  0% {
    transform: skew(0deg);
    filter: hue-rotate(0deg);
  }

  20% {
    transform: skew(3deg);
    filter: hue-rotate(90deg);
  }

  40% {
    transform: skew(-3deg);
    filter: hue-rotate(180deg);
  }

  60% {
    transform: skew(1deg);
    filter: hue-rotate(270deg);
  }

  80% {
    transform: skew(-1deg);
    filter: hue-rotate(360deg);
  }

  100% {
    transform: skew(0deg);
    filter: hue-rotate(0deg);
  }
}

.broken-models-section,
.diagnostic-booking-section {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  will-change: opacity, transform, filter;
}

 .broken-models-section,
.diagnostic-booking-section {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  max-height: 100vh;
  z-index: 9;
}

.negation-landscape-section .negation-card::after {
  background: none !important;
}

#nebula-canvas-container{
  top:0px;
  bottom:0px;
  height: 100vh;
}

#nebula-canvas-container canvas {
  display: block;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
}

@media (max-width: 1024px) {
  .main-header { padding: 0 4%; }

  .collapse-section,
  .industry-failures-section {
    flex-direction: column;
    padding: 100px 6% 40px;
    max-height: none;
    overflow-y: auto;
  }

  .industry-failures-section .container {
    flex-direction: column;
    gap: 0px;
  }

  .industry-failures-section .sidebar-col {
    min-width: unset;
    width: 100%;
    justify-content: flex-start;
    padding-bottom: 0;
  }

  .landscape-heading,
  .negation-heading,
  .negation-heading-wrapper span { font-size: 2.6rem; }

  .cards-grid { grid-template-columns: repeat(2, 1fr); }
  .negation-grid { grid-template-columns: repeat(2, 1fr); }

  .topology-content-split {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .topology-graphic-sidebar { margin: 0 auto; }

  .models-columns-grid { grid-template-columns: 1fr; }
  .diagnostic-main-heading { font-size: 3.2rem; }
  .form-grid-row { grid-template-columns: 1fr 1fr; }

  .competitive-landscape-section,
  .negation-landscape-section,
  .linguistic-architecture-section,
  .revenue-topology-section {
    overflow-y: auto;
    padding: 60px 5%;
  }
}

@media (min-width: 1025px) {
  .model-card-trigger {
    display: block;
    cursor: default;
  }
  .model-card-trigger-left {
    display: contents;
  }
  .model-card-chevron {
    display: none;
  }
  .model-card-body {
    max-height: none !important;
    opacity: 1 !important;
    overflow: visible !important;
    margin-top: 0 !important;
    transition: none !important;
  }
}

@media (max-width: 768px) {
  .main-header { height: 64px; padding: 0 4%; }
  .logo img { width: clamp(100px, 28vw, 140px); }

  #hero-layer { padding: 0 6%; gap: 14px; }
  .hero-title { font-size: clamp(.7rem, 5.5vw, 1.6rem); line-height: 1.3; }

  .orb-label { max-width: min(260px, 80vw); }

  .collapse-section { padding: 80px 5% 30px; gap: 5px; }
  .main-title { font-size: clamp(2rem, 8vw, 3rem); }
  .body-text { font-size: .8rem; }
  .orange-text { font-size: .8rem; }
  .prospect-meta{font-size: .8rem; }
  .mystery-title{font-size: 1rem; }
  .list-item{font-size: .8rem; gap: 5px}
  .prospect-quote { font-size: clamp(1.4rem, 6vw, 2rem); }
  .standards-list{gap: 0px; padding: 5px;}
  .body-text.highlight{font-size: clamp(.8rem, 2vw, 1.35rem); padding-left: 10px;}

  .industry-failures-section { padding: 80px 5% 30px; }
  .industry-failures-section .main-heading { font-size: clamp(2rem, 7vw, 2.8rem); margin-bottom: 0px; }
  .sub-heading{margin-bottom: 0px;}
  .competitive-landscape-section { padding: 80px 5% 30px;  padding-top: 30px; }
  .landscape-heading { font-size: clamp(1.9rem, 7vw, 2.4rem); margin-bottom: 16px; }
  .cards-grid { grid-template-columns: 1fr; }
  .landscape-card { padding: 28px 18px 50px 18px; }

  .negation-heading,
  .negation-heading-wrapper span { font-size: clamp(1.9rem, 7vw, 2.4rem); }
  .negation-grid { grid-template-columns: 1fr; }

  .linguistic-architecture-section { padding: 80px 5% 30px; }
  .linguistic-heading { font-size: clamp(1.5rem, 6vw, 2rem); margin-bottom: 30px; }
  .comparison-table { grid-template-columns: 1fr 30px 1fr; row-gap: 4px; }
  .arrow-column { transform: none; height: auto; }
  .table-column-header { display: block; font-size: 0.85rem; }
  .banned-footer-banner { flex-direction: column; align-items: flex-start; gap: 8px; }

  .revenue-topology-section { padding: 80px 5% 30px; }
  .topology-heading { font-size: clamp(1.5rem, 6vw, 2rem); }
  .topology-content-split { grid-template-columns: 1fr; }
  .topology-graphic-sidebar { display: none; }
  .topology-table th,
  .topology-table td { font-size: 0.82rem; padding: 4px 10px; }

  .form-grid-row { grid-template-columns: 1fr; }

  .broken-models-section,
  .diagnostic-booking-section { padding: 80px 5% 30px; }

  .diagnostic-booking-section {
    position: absolute;
    top: 0;
    left: 0;
    transform: none;
    width: 100%;
    max-height: 100vh;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    align-items: flex-start;
    padding-top: 60px;
    padding-bottom: 60px;

    scrollbar-width: thin;
    scrollbar-color: rgba(192,132,252,0.4) transparent;
  }
  .diagnostic-booking-section::-webkit-scrollbar { width: 4px; }
  .diagnostic-booking-section::-webkit-scrollbar-track { background: transparent; }
  .diagnostic-booking-section::-webkit-scrollbar-thumb {
    background: rgba(192,132,252,0.4);
    border-radius: 4px;
  }
  .diagnostic-booking-section .diagnostic-container { text-align: left; }
  .models-main-title { font-size: clamp(1.6rem, 4vw, 2.2rem); }

  .model-card {
    cursor: pointer;
    user-select: none;
  }

  .model-card-trigger {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
  }

  .model-card-trigger-left {
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex: 1;
    min-width: 0;
  }

  .model-card-chevron {
    flex-shrink: 0;
    width: 22px;
    height: 22px;
    border: 1px solid rgba(255,255,255,0.18);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.35s ease, border-color 0.25s ease;
    color: rgba(255,255,255,0.5);
  }

  .model-card-chevron svg {
    width: 12px;
    height: 12px;
    transition: transform 0.35s ease;
  }

  .model-card.is-open .model-card-chevron {
    border-color: rgba(255,255,255,0.4);
    color: #ffffff;
  }

  .model-card.is-open .model-card-chevron svg {
    transform: rotate(180deg);
  }

  .model-card-body {
    overflow: hidden;
    max-height: 0;
    opacity: 0;
    transition: max-height 0.4s ease, opacity 0.3s ease, margin-top 0.3s ease;
    margin-top: 0;
  }

  .model-card.is-open .model-card-body {
    max-height: 600px;
    opacity: 1;
    margin-top: 16px;
  }
  .diagnostic-main-heading { font-size: clamp(2rem, 6vw, 3rem); letter-spacing: -1px; }
  .financial-certainty-banner { font-size: clamp(1.2rem, 5vw, 1.6rem); }
  .form-grid-row { grid-template-columns: 1fr; gap: 5px; }
  .diagnostic-intake-form{ gap: 5px !important; }
  .footer-avant-garde { flex-direction: column; gap: 30px; padding: 5vh 5%; }
  .fg-left {
    border-right: none;
    border-bottom: 1px solid rgba(255,255,255,0.1);
    padding-right: 0;
    padding-bottom: 30px;
    min-width: unset;
    width: 100%;
  }
  .fg-right { min-width: unset; width: 100%; }
  .cyber-heading { font-size: clamp(2rem, 8vw, 3rem); letter-spacing: 1px; }
  .footer-bar { flex-direction: column; align-items: flex-start; gap: 6px; text-align: left; }

  #sound-toggle { bottom: 20px; right: 16px; width: 40px; height: 40px; }
  #scroll-indicator { bottom: 26px; }
  .text-l, .text-r { margin-left: 0 !important; margin-right: 0 !important; }
  .form-input-group input, .form-input-group select, .form-input-group textarea{
    font-size: 0.8rem;
  }
}

@media (max-width: 480px) {
  .main-header { height: 58px; padding: 0 4%; }
  .logo img { width: 110px; }

  .hero-title { font-size: clamp(1rem, 6vw, 1.35rem); }
  .main-title { font-size: clamp(1.7rem, 9vw, 2.4rem); }

  .industry-failures-section .main-heading,
  .landscape-heading,
  .negation-heading { font-size: clamp(1.6rem, 8.5vw, 2.2rem); }

  .linguistic-heading,
  .topology-heading { font-size: clamp(1.4rem, 5.5vw, 1.9rem); margin-bottom: 10px; }

  .diagnostic-main-heading { font-size: clamp(1.8rem, 6vw, 2.6rem); }
  .models-main-title { font-size: clamp(1.4rem, 4vw, 1.9rem); }

  .landscape-card { padding: 22px 14px 40px 14px; border-radius: 15px; }
  .landscape-card::after{ border-radius: 15px !important;}
  .negation-card { padding: 14px 14px; }
  .model-card { padding: 20px 16px; }
  .prospect-quote { font-size: clamp(1.2rem, 7vw, 1.0rem); }

  .cyber-heading { font-size: clamp(1.8rem, 9vw, 2.5rem); }

  .topology-table-wrapper { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .topology-table { min-width: 480px; }
  .banned-terms-list { font-size: 0.72rem; }

  .diagnostic-booking-section { padding: 70px 4% 24px; }
  .financial-certainty-banner { font-size: clamp(1rem, 6vw, 1.35rem); }

  .mobile-slide-menu { max-width: 100vw; width: 100vw; transform: translateX(100vw); }
  .mobile-slide-menu.active { transform: translateX(0); }
  #sound-toggle { bottom: 16px; right: 12px; }
}

@media (max-width: 1024px) {
.hero-sub{
  font-size: 0.9rem !important;
}
.industry-failures-section .sidebar-col{
  flex-direction: row;
  gap: 10px;
}
.image-wrapper{
  margin-bottom: 0px;
}
.image-wrapper img,
.image-wrapper video{
  width: 150px;
}
.industry-failures-section .learn-more-btn{
  font-size: 0.8rem;padding: 5px 10px;
}
.industry-failures-section .sidebar-footer{
  font-size: 0.8rem;
  letter-spacing: 0px;
}
.industry-failures-section .failures-list{
      gap: 5px;
}
.industry-failures-section .sidebar-footer{
  margin-top: 0px;
  margin-left: 10px;
}
.image-wrapper{
  width: 150px;
}
.landscape-card{
  padding: 10px;
}
.card-title{
  font-size: 1.2rem;
}
.card-description{
  font-size: 0.8rem;
  line-height:1.3;
}
.card-number{
  display: none;
}
.cards-grid{
  gap: 8px;
  margin-bottom: 8px;
}
.card-title{
  margin-bottom: 5px;
}
.footer-bar-text {
  font-size: 0.8rem;
  font-weight: 600;
}
.competitive-landscape-section{
  padding: 0px 5% 0px;
}
.negation-card-description{
  font-size:0.8rem;
  line-height: 1.3;
}
.icon-cross{
  font-size: 2.4rem !important;
}
.card-content-column{
  margin-left: 0px;
}
.card-icon-column{
  width: 30px;
}
.negation-card{
  padding: 5px;
}
.negation-grid {
  gap: 5px;
  margin-bottom: 5px;
  padding-bottom: 5px;
}
.negation-card-title{
  font-size: .9rem;
  font-weight: 700;
  margin: 0 0 3px 0;
}
.negation-heading-wrapper{
      margin-bottom: 5px;
}
.negation-heading{
    margin-bottom: 0px;
}
.negation-heading-wrapper span{
    margin-bottom: 0px;
}
.negation-footer-bar{
  padding: 5px;
  gap: 15px;
}
.negation-footer-text{
  font-size: 0.8rem !important;
}
.negation-tag{
  margin-bottom: 0px;
}
.comparison-table{
      margin-bottom: 15px;
}
.arrow-column{
  height: 5px
}
.term-box{
  padding: 0px 10px;
  font-size: .8rem;
  font-weight: 600;
}
.topology-table th, .topology-table td{
  font-size: 0.7rem;
  padding:4px 10px;
}
.topology-footnote{
    margin-top: 15px;
    font-size: 0.8rem;
}
.topology-tag{
  font-size: 0.80rem;
}
.models-title-wrap{
  gap: 5px;
}
.dying-agency-badge{
  font-size: 0.80rem;
}
.card-icon-row{
  display: none;
}
.models-main-title{

}
.card-body-text{
    font-size: 0.80rem;
}
.banned-footer-banner{
  gap: 0px;
}
.banned-footer-banner{
      padding: 5px;
}
.banned-terms-list{
  row-gap: 2px;
}
.linguistic-architecture-section{
  padding: 30px 5% 0px;
}
.models-main-title{
  font-size: clamp(1.4rem, 4vw, 1.9rem);
}
.models-header-row{
  margin-bottom: 10px;
}
.card-heading{
  font-size: 1.2rem;
  font-weight: 600;
  margin: 0 0 0px 0;
}
.models-columns-grid{
  gap:8px;
}
.card-pill-tag{
  margin-bottom: 0px;
}
  .diagnostic-main-heading { font-size: clamp(1.8rem, 6vw, 2.6rem);margin: 0 0 0px 0; }
  .diagnostic-lead-subtext {
    font-size: 0.8rem;
    line-height: 1.3;
  }
  .skeptic-title{
    font-weight: 700;
    font-size: 1.2rem;
  }
  .skeptic-desc {
    font-size: 1.2rem;
    font-weight: 600;
    margin: 0 0 5px 0;}
  .compare-text{
      font-weight: 600;
    font-size: .9rem;
    line-height: 1.2;
    }
    .go-text{
      font-weight: 700;
    font-size: 1.1rem;
    }
    .arrow-icon{
      width: 30px;
    height: 30px;
        font-size: 1.2rem;
    font-weight: 800;
    }
}

@media (min-width: 1025px) {
  .competitive-landscape-section {
    position: absolute !important;
    top: 50%;
    transform: translate(-50%, -50%);
    height: 100vh;
  }
}

.creative-footer-reveal-container {
  position: relative;
  width: 100%;
  background: #0a0315;
  z-index: 1;
  transform: translateZ(0);
  will-change: transform;
  isolation: isolate;
}

.creative-tech-footer {
  position: relative;
  width: 100%;
  padding: 80px 6% 30px 6%;

  background: radial-gradient(circle at 50% 0%, rgb(174 14 197 / 20%) 0%, rgba(0, 0, 0, 1) 40%, rgba(0, 0, 0, 1) 75%);
  overflow: hidden;
}

.footer-top-glow-line {
  position: absolute;
  top: 0;
  left: 5%;
  right: 5%;
  height: 1px;
  background: linear-gradient(90deg, transparent 0%, #4b063f 30%, #4b063f 70%, transparent 100%);
  box-shadow: 0 0 25px rgba(0, 242, 254, 0.25);
}

.footer-grid-inner {
  display: grid;
  grid-template-columns: 1.4fr 1.4fr 1.2fr;
  gap: 50px;
  padding-bottom: 20px;
  border-bottom: 1px solid rgba(63, 43, 150, 0.15);
}

.footer-brand-column {
  display: flex;
  flex-direction: column;
  gap: 22px;
}

.footer-logo-wrap {
  display: flex;
  align-items: center;
  gap: 12px;
}

.logo-dot-pulse {
  width: 7px;
  height: 7px;
  background: linear-gradient(135deg, #eba442, #3f2b96);
  border-radius: 50%;
  box-shadow: 0 0 12px rgba(0, 242, 254, 0.6);
  animation: footerGlowPulse 3s infinite ease-in-out;
}

@keyframes footerGlowPulse {
  0%, 100% { opacity: 0.4; transform: scale(0.95); box-shadow: 0 0 12px rgba(0, 242, 254, 0.4); }
  50% { opacity: 1; transform: scale(1.2); box-shadow: 0 0 20px rgba(0, 242, 254, 0.8), 0 0 30px rgba(63, 43, 150, 0.5); }
}

.footer-logo-text {
  font-size: 1.25rem;
  letter-spacing: 0.35em;
  font-weight: 800;
  color: #ffffff;
}

.footer-logo-text .tech-accent {
  background: linear-gradient(135deg, #eba442, #3f2b96);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-weight: 600;
}

.footer-brand-tagline {
  color: #a4acba;
  font-size: 0.88rem;
  line-height: 1.6;
  max-width: 320px;
}

.footer-socials-row {
  display: flex;
  gap: 10px;
  margin-top: 4px;
}

.social-icon-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.01);
  border: 1px solid rgba(255, 255, 255, 0.04);
  color: #8892b0;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  cursor: pointer;
}

.social-icon-btn:hover {
  color: #eba442;
  background: rgba(63, 43, 150, 0.1);
  border-color: #eba442;
  box-shadow: 0 0 15px rgba(0, 242, 254, 0.3);
  transform: translateY(-3px);
}

.system-status-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: rgba(0, 242, 254, 0.02);
  border: 1px solid rgba(0, 242, 254, 0.15);
  padding: 6px 14px;
  border-radius: 3px;
  width: max-content;
}

.status-indicator.online {
  width: 5px;
  height: 5px;
  background: #eba442;
  border-radius: 50%;
  box-shadow: 0 0 8px #eba442;
}

.status-label {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  color: #eba442;
}

.footer-links-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
}

.group-title {
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.22em;
  color: #5c657a;
  margin-bottom: 24px;
}

.footer-link-group {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.footer-link-item {
  color: #a4acba;
  text-decoration: none;
  font-size: 0.85rem;
  transition: all 0.25s ease;
  display: inline-flex;
  align-items: center;
}

.footer-link-item .link-num {
  font-size: 0.72rem;
  color: rgb(235 164 66 / 40%);
  margin-right: 8px;
  font-family: monospace;
  transition: color 0.25s ease;
}

.footer-link-item:hover {
  color: #ffffff;
  transform: translateX(4px);
}

.footer-link-item:hover .link-num {
  color: #eba442;
}

.footer-subscribe-wrapper {
  position: relative;
  display: flex;
  width: 100%;
  background: rgba(255, 255, 255, 0.01);
  border: 1px solid rgba(63, 43, 150, 0.2);
  border-radius: 4px;
  overflow: hidden;
  margin-bottom: 25px;
  transition: all 0.3s ease;
}

.footer-subscribe-wrapper:focus-within {
  border-color: #eba442;
  box-shadow: 0 0 12px rgba(0, 242, 254, 0.15);
}

.footer-input-field {
  flex: 1;
  background: transparent;
  border: none;
  padding: 14px 16px;
  color: #ffffff;
  font-size: 0.85rem;
  outline: none;
}

.footer-input-field::placeholder {
  color: #4e5668;
}

.footer-submit-btn {
  background: rgba(63, 43, 150, 0.15);
  border: none;
  border-left: 1px solid rgba(63, 43, 150, 0.2);
  padding: 0 18px;
  color: #a4acba;
  cursor: pointer;
  transition: all 0.2s ease;
}

.footer-submit-btn:hover {
  background: linear-gradient(135deg, #eba442, #3f2b96);
  color: #000000;
}

.footer-meta-stamps {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 15px;
}

.meta-stamp-item {
  background: rgba(63, 43, 150, 0.02);
  border: 1px solid rgba(63, 43, 150, 0.08);
  padding: 10px 14px;
  border-radius: 4px;
}

.stamp-label {
  display: block;
  font-size: 0.58rem;
  color: #5c657a;
  letter-spacing: 0.08em;
  margin-bottom: 2px;
}

.stamp-value {
  display: block;
  font-size: 0.72rem;
  font-family: monospace;
  color: #a4acba;
}

.footer-bottom-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: 30px;
}

.copyright-text {
  font-size: 0.72rem;
  color: #4e5668;
  letter-spacing: 0.05em;
}

.footer-legal-links {
  display: flex;
  align-items: center;
  gap: 12px;
}

.footer-legal-links a {
  font-size: 0.68rem;
  color: #4e5668;
  text-decoration: none;
  letter-spacing: 0.08em;
  transition: color 0.2s ease;
}

.footer-legal-links a:hover {
  color: #eba442;
}

.footer-legal-links .divider {
  font-size: 0.68rem;
  color: rgba(63, 43, 150, 0.2);
}

@media (max-width: 1024px) {
  .footer-grid-inner {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .footer-bottom-bar {
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
  }
}

/* ================================================
   About Page
   ================================================ */

:root {
  --pink:   #e63888;
  --purple: #9b5de5;
  --gold:   #f4a135;
  --white:  #ffffff;
  --dim:    rgba(255,255,255,0.6);
  --bg:     #0a0315;
}

#bg-canvas {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-color: #0a0315;
}

#pin-wrapper {
  position: sticky;
  top: 0;
  height: 100vh;
  overflow: hidden;
  z-index: 1;
}

#track {
  display: flex;
  flex-direction: row;
  align-items: center;
  height: 100vh;
  width: max-content;
  will-change: transform;
}

body.page-about #hero {
  flex-shrink: 0;
  width: 60vw;
  height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  padding: 22vh 9vw 0;
  position: relative;
  z-index: 10;
}

.origin-label {
  font-family: 'Syne', sans-serif;
  font-size: 0.85rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--purple);
  margin-bottom: 0.5rem;
  opacity: 0;
  font-weight: 700;
}

.about-hero-title {
  font-family: 'Syne', sans-serif;
  font-size: clamp(2rem, 3vw, 4rem);
  font-weight: 600;
  line-height: 1;
  letter-spacing: -0.02em;
  opacity: 0;
  transform: translateY(36px);
  position: relative;
  padding-bottom: 0.5rem;
  white-space: nowrap;
  width: fit-content;
  padding-bottom: 8px;
}

.about-hero-title::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 2px;
  background: #5a378f;
}

.hero-subtitle {
  margin-top: 1.6rem;
  max-width: 580px;
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(0.95rem, 1.4vw, 1.05rem);
  font-weight: 300;
  line-height: 1.5;
  color: rgba(255,255,255,0.72);
  opacity: 0;
}

.hero-subtitle .hl {
  color: #ffffff;
  font-weight: 400;
}

.hero-subtitle .char {
  display: inline-block;
  opacity: 0;
  transform: translateY(10px);
}

.arrow-track {
  width: 56px;
  height: 2px;
  background: rgba(255,255,255,0.12);
  border-radius: 2px;
  overflow: hidden;
  position: relative;
}

.arrow-fill {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, var(--pink), var(--purple));
  transform: translateX(-100%);
  animation: about-slide 1.9s ease-in-out infinite;
}

@keyframes about-slide {
  0%   { transform: translateX(-100%); }
  50%  { transform: translateX(0); }
  100% { transform: translateX(110%); }
}

#timeline-section {
  flex-shrink: 0;
  position: relative;
  height: 100vh;
  width: 220vw;
}

.era-card {
  position: absolute;
  width: clamp(280px, 22vw, 370px);
  opacity: 0;
  transform: translateY(30px);
  z-index: 5;
}

.era-1 { left: 10vw;  bottom: 54vh; }
.era-2 { left: 60vw;  top: 54vh; }
.era-3 { left: 110vw; bottom: 54vh; }
.era-4 { left: 160vw; top: 54vh; width: clamp(310px, 25vw, 410px); }

.era-dates {
  font-family: 'Syne', sans-serif;
  font-size: clamp(1.0rem, 1.0vw, 1rem);
  font-weight: 600;
  letter-spacing: 0.02em;
  margin-bottom: 0.1rem;
}

.era-name {
  font-family: 'Syne', sans-serif;
  font-size: clamp(1.7rem, 2.3vw, 2.5rem);
  font-weight: 700;
  line-height: 1.1;
  margin-bottom: 1rem;
  color: var(--white);
}

.era-body {
  font-size: clamp(0.85rem, 0.9vw, 1rem);
  line-height: 1.6;
  color: var(--dim);
  font-weight: 400;
}

.era-1 .era-dates { color: #ff2a4b; }
.era-2 .era-dates { color: #fbaec1; }
.era-3 .era-dates { color: #aa66ff; }
.era-4 .era-dates { color: #ffd633; }

.connector-line {
  position: absolute;
  width: 2px;
  left: 35px;
  opacity: 0;
  pointer-events: none;
}

.era-1 .connector-line,
.era-3 .connector-line {
  top: 100%;
  height: 10vh;
}

.era-2 .connector-line,
.era-4 .connector-line {
  bottom: 100%;
  height: 10vh;
}

.era-1 .connector-line { background: linear-gradient(to bottom, #ff2a4b, rgba(255,30,61,0.4)); }
.era-2 .connector-line { background: linear-gradient(to top, #fbaec1, rgba(255,255,255,0.4)); }
.era-3 .connector-line { background: linear-gradient(to bottom, #aa66ff, rgba(157,78,255,0.4)); }
.era-4 .connector-line { background: linear-gradient(to top, #ffd633, rgba(255,234,0,0.4)); }

.svg-timeline-container {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 2;
}

.electricity-back {
  fill: none;
  stroke: rgba(255,255,255,0.02);
  stroke-width: 2;
}

.electricity-wire {
  fill: none;
  stroke: url(#stream-gradient);
  stroke-width: 4;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0px 0px 4px #ffffff) drop-shadow(0px 0px 10px rgba(155,93,229,0.8));
}

.plasma-aura {
  fill: none;
  stroke: url(#stream-gradient);
  stroke-width: 1.5;
  opacity: 0.4;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0px 0px 6px rgba(230,56,136,0.4));
}

.electrical-node {
  position: absolute;
  width: 14px;
  height: 14px;
  background: #ffffff;
  border-radius: 50%;
  z-index: 10;
  transform: translate(-50%, -50%) scale(0);
  opacity: 0;
  box-shadow: 0 0 6px #ffffff, 0 0 16px currentColor;
  transition: transform 0.5s cubic-bezier(0.34,1.56,0.64,1), opacity 0.4s ease;
}

.era-1-node { color: #ff1e3d; }
.era-2-node { color: #ffffff; }
.era-3-node { color: #9d4eff; }
.era-4-node { color: #ffea00; }
.electrical-node.lit { opacity: 1; transform: translate(-50%,-50%) scale(1.3); }

.pulse-ring {
  position: absolute;
  border: 1.5px solid currentColor;
  border-radius: 50%;
  width: 14px;
  height: 14px;
  pointer-events: none;
  z-index: 9;
  transform: translate(-50%,-50%) scale(1);
  opacity: 0;
}

#outro {
  position: relative;
  z-index: 10;
  background: transparent;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: clamp(60px, 8vw, 110px) clamp(20px, 4vw, 80px);
  box-sizing: border-box;
}

.outro-inner-wrap {
  width: 100%;
  max-width: 1600px;
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
}

.outro-logo {
  width: clamp(140px, 18vw, 260px);
  height: auto;
  display: block;
  opacity: 0;
  transform: translateY(20px);
}

.outro-blocks {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: clamp(32px, 5vw, 100px);
  align-items: start;
}

.outro-block {
  opacity: 0;
  transform: translateY(24px);
}

.outro-heading {
  font-family: 'Syne', sans-serif;
  font-size: clamp(1.7rem, 2.3vw, 2.5rem);
  font-weight: 700;
  line-height: 1.2;
  color: var(--white);
  margin-bottom: 0.75rem;
}

.outro-heading--accent {
  font-weight: 600;
  font-size: 1.3rem;
  line-height: 1.3;
  letter-spacing: -0.02em;
  background: linear-gradient(90deg, #6200ee 0%, #a000d6 50%, #e000c1 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.outro-body {
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(0.8rem, 0.95vw, 0.95rem);
  line-height: 1.75;
  color: rgba(255,255,255,0.6);
  font-weight: 300;
}

.outro-body--bold {
  color: var(--white);
  font-weight: 500;
}

.stateless-banner {
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 220px;
  border-radius: 8px;
  overflow: hidden;
  opacity: 0;
  transform: translateY(24px);
}

.stateless-left {
  position: relative;
  background: #0a0315;
  padding: clamp(28px, 3.5vw, 48px) clamp(24px, 3vw, 44px);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  overflow: hidden;
}

.stateless-left::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 60% 50% at 80% 60%, rgba(168,85,247,0.18) 0%, transparent 70%),
    radial-gradient(ellipse 40% 60% at 20% 80%, rgba(230,56,136,0.10) 0%, transparent 70%);
  pointer-events: none;
  z-index: 0;
}

.stateless-left-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
  opacity: 0.45;
  pointer-events: none;
}

.stateless-left-label {
  position: relative;
  z-index: 1;
  font-family: 'DM Sans', sans-serif;
  font-size: 0.68rem;
  font-weight: 400;
  color: rgba(255,255,255,0.3);
  letter-spacing: 0.06em;
  margin-bottom: clamp(14px, 2vw, 24px);
}

.stateless-left-heading {
  color: #f5f5f7;
  font-family: 'Helvetica Neue Condensed', 'Arial Narrow', -apple-system, sans-serif;
  text-transform: uppercase;
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 2rem;
  letter-spacing: -0.03em;
  margin: 0;
  position: relative;
  z-index: 1;
}

.stateless-left-heading .hl-orange {
  background: linear-gradient(90deg, #7c22e4 0%, #e62290 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  display: inline-block;
}

.stateless-right {
  background: #0a0315;
  padding: clamp(28px, 3.5vw, 48px) clamp(28px, 3.5vw, 44px);
  display: flex;
  align-items: center;
  border-left: 1px solid rgba(255,255,255,0.06);
}

.stateless-right-text {
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(0.9rem, 1.2vw, 1.1rem);
  font-weight: 300;
  line-height: 1.75;
  color: rgba(255,255,255,0.72);
}

#manifesto-section {
  position: relative;
  z-index: 10;
  width: 100%;
  padding: clamp(80px, 10vw, 140px) clamp(20px, 4vw, 80px);
  box-sizing: border-box;
  overflow: visible;
}

#dna-canvas {
  position: absolute;
  top: 0;
  right: 0;
  width: 560px;
  height: 100%;
  pointer-events: none;
  z-index: 1;
  opacity: 0;
  transition: opacity 1.2s ease;
}

#dna-canvas.visible { opacity: 1; }

.manifesto-layout {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: clamp(32px, 5vw, 80px);
  align-items: start;
  max-width: 1600px;
  margin: 0 auto;
}

.manifesto-dna-col { display: none; }

.manifesto-right {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
}

.vm-title {
  font-family: 'Syne', sans-serif;
  font-size: clamp(1rem, 1.4vw, 1.2rem);
  font-weight: 700;
  color: #a855f7;
  margin-bottom: 0.75rem;
  opacity: 0;
  transform: translateY(16px);
}

.vm-list {
  padding-left: 1.2rem;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.vm-list li {
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(1.05rem, 1.3vw, 0.8rem);
  line-height: 1.4;
  color: rgba(255,255,255,0.92);
  font-weight: 400;
  opacity: 0;
  transform: translateY(16px);
  text-shadow: -3px -2px 0px #5e2f00;
}

.manifesto-inner {
  max-width: 900px;
}

.manifesto-title {
  font-weight: 600;
  font-size: 3rem;
  letter-spacing: -0.04em;
  text-transform: none;
  display: inline-block;
  position: relative;
  margin-bottom: 12px;
  background: linear-gradient(90deg, #6016fc 0%, #aa00f2 55%, #ff00da 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.manifesto-title::after {
  content: attr(data-text);
  position: absolute;
  left: -7px;
  top: 1px;
  z-index: -1;
  color: #5e2f00;
  -webkit-text-fill-color: #5e2f00;
}

.manifesto-body {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

.manifesto-body p {
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(1.05rem, 1.3vw, 0.8rem);
  line-height: 1.4;
  color: rgba(255,255,255,0.92);
  font-weight: 400;
  opacity: 0;
  transform: translateY(16px);
  text-shadow: -3px -2px 0px #5e2f00;
}

.manifesto-quote {
  margin-top: clamp(30px, 5vw, 30px);
  opacity: 0;
  transform: translateY(20px);
  font-weight: 700;
  font-size: 1.2rem;
  line-height: 1.2;
  letter-spacing: 0.02em;
  color: #b066ff;
  text-shadow:
    -1px -1px 7px rgba(147,51,234,0.8),
    0 0 45px rgba(147,51,234,0.8);
  border: none;
  padding: 0;
}

.manifesto-revenue {
  font-family: 'DM Sans', sans-serif;
  margin-top: clamp(28px, 3vw, 44px);
  font-size: clamp(1.05rem, 1.3vw, 0.8rem);
  line-height: 1.4;
  color: rgba(255,255,255,0.92);
  font-weight: 400;
  text-shadow: -3px -2px 0px #5e2f00;
  opacity: 0;
  transform: translateY(16px);
}

.manifesto-unfair {
  font-family: 'DM Sans', sans-serif;
  margin-top: clamp(28px, 3vw, 44px);
  font-size: clamp(1rem, 1.4vw, 1.3rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  line-height: 1.2;
  opacity: 0;
  transform: translateY(16px);
}

.manifesto-unfair .uf-gold {
  color: #f4a135;
  text-shadow: -2px -1px 0px #5e2f00;
}

.manifesto-unfair .uf-purple {
  color: #f4a135;
  text-shadow: -2px -1px 0px #5e2f00;
  font-weight: 500;
}

#methodology-section {
  position: relative;
  z-index: 10;
  width: 100%;
  padding: clamp(60px, 8vw, 100px) clamp(20px, 4vw, 80px);
  box-sizing: border-box;
}

.methodology-section {
  max-width: 1600px;
  margin: 0 auto;
  padding-top: clamp(40px, 5vw, 72px);
  border-top: 1px solid rgba(255,255,255,0.08);
  position: relative;
  z-index: 2;
}

.methodology-cols {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(40px, 6vw, 100px);
  align-items: start;
}

.methodology-label {
  font-family: 'Syne', sans-serif;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: #7834e5;
  margin-bottom: 0.4rem;
  opacity: 0;
  transform: translateY(12px);
}

.methodology-heading {
  font-family: 'Syne', sans-serif;
  font-size: clamp(2rem, 4vw, 2.5rem);
  font-weight: 700;
  color: var(--white);
  line-height: 1.05;
  margin-bottom: clamp(28px, 4vw, 30px);
  padding-bottom: 0.2em;
  border-bottom: 2px solid #7834e5;
  display: inline-block;
  opacity: 0;
  transform: translateY(20px);
}

.methodology-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.three-tier-panel {
  display: flex;
  flex-direction: column;
  opacity: 0;
  transform: translateY(24px);
}

.three-tier-label {
  font-family: 'Syne', sans-serif;
  font-size: 0.72rem;
  font-weight: 600;
  text-transform: uppercase;
  color: #e63888;
  margin-bottom: clamp(12px, 1.5vw, 10px);
  text-align: center;
}

.three-tier-heading {
  font-family: 'Syne', sans-serif;
  font-size: clamp(2rem, 4vw, 2.5rem);
  font-weight: 700;
  color: #ffffff;
  line-height: 1.0;
  letter-spacing: -0.02em;
  text-align: center;
  margin-bottom: clamp(10px, 1.2vw, 5px);
}

.three-tier-sub {
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(0.7rem, 0.95vw, 0.92rem);
  font-weight: 300;
  color: rgba(255,255,255,0.5);
  text-align: center;
  line-height: 1.6;
  margin-bottom: clamp(24px, 3.5vw, 30px);
}

.three-tier-cards {
  display: flex;
  flex-direction: column;
  gap: clamp(8px, 1.2vw, 10px);
}

.three-tier-card {
  background: rgba(10,8,26,0.92);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 6px;
  padding: clamp(10px, 2vw, 10px) clamp(10px, 2.2vw, 20px);
  position: relative;
  overflow: hidden;
}

.three-tier-card::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 3px;
  background: linear-gradient(to bottom, #a855f7, #7834e5);
}

.three-tier-card-num {
  font-family: 'Syne', sans-serif;
  font-size: 0.68rem;
  font-weight: 700;
  color: rgba(255,255,255,0.3);
  letter-spacing: 0.08em;
  margin-bottom: 8px;
}

.three-tier-card-title {
  font-family: 'Syne', sans-serif;
  font-size: clamp(0.95rem, 1.4vw, 1.2rem);
  font-weight: 800;
  color: #ffffff;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  margin-bottom: 8px;
  line-height: 1.2;
}

.three-tier-card-body {
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(0.76rem, 0.9vw, 0.88rem);
  font-weight: 300;
  color: rgba(255,255,255,0.5);
  line-height: 1.65;
}

.methodology-item {
  display: flex;
  align-items: flex-start;
  padding: 5px 5px;
  border: 1px solid rgba(255,255,255,0.08);
  border-left: 5px solid #7834e5;
  background: rgb(9 7 24 / 70%);
  gap: 5px;
  opacity: 0;
  transform: translateX(-24px);
  transition: background 0.25s ease, border-color 0.25s ease;
  border-radius: 8px;
}

.methodology-num {
  font-family: 'Syne', sans-serif;
  font-size: clamp(0.95rem, 1.2vw, 1.1rem);
  font-weight: 700;
  color: #7834e5;
  min-width: 2.2rem;
  padding-left: 10px;
  padding-top: 1px;
  flex-shrink: 0;
}

.methodology-content {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.methodology-item-title {
  font-family: 'Syne', sans-serif;
  font-size: clamp(0.95rem, 1.2vw, 1.05rem);
  font-weight: 700;
  color: var(--white);
  line-height: 1.3;
}

.methodology-item-body {
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(0.78rem, 0.9vw, 0.88rem);
  line-height: 1.65;
  color: rgba(255,255,255,0.52);
  font-weight: 300;
}

#stackless-section {
  position: relative;
  z-index: 10;
  width: 100%;
  padding: clamp(60px, 8vw, 110px) clamp(20px, 4vw, 80px);
  box-sizing: border-box;
}

.stackless-inner {
  max-width: 1600px;
  margin: 0 auto;
}

.stackless-header {
  text-align: center;
  margin-bottom: 10px;
  opacity: 0;
  transform: translateY(20px);
}

.stackless-title {
  font-family: 'Syne', sans-serif;
  font-size: clamp(1.5rem, 1.6vw, 0.8rem);
  font-weight: 600;
  color: var(--white);
  line-height: 1.1;
}

.stackless-title .hl-orange { color: #bb2a3c; }

.stackless-subtitle-row {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: clamp(20px, 4vw, 56px);
  flex-wrap: wrap;
  margin-top: 8px;
  opacity: 0;
  transform: translateY(12px);
}

.stackless-subtitle-item {
  display: flex;
  align-items: center;
  gap: 7px;
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(0.72rem, 0.9vw, 0.84rem);
  color: rgba(255,255,255,0.75);
  font-weight: 400;
}

.stackless-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex-shrink: 0;
}

.stackless-dot--white { background: #8758fc; }
.stackless-dot--red   { background: #bb2a3c; }

.stackless-subtitle-item strong {
  font-weight: 700;
  color: var(--white);
}

.stackless-bridge {
  text-align: center;
  font-family: 'Syne', sans-serif;
  font-size: clamp(0.8rem, 0.95vw, 0.9rem);
  font-weight: 700;
  font-style: italic;
  color: #7c3aed;
  margin-top: 6px;
  opacity: 0;
  transform: translateY(10px);
}

.stackless-divider {
  width: 100%;
  height: 1px;
  background: rgba(255,255,255,0.08);
  margin: clamp(24px, 3vw, 40px) 0;
}

.stackless-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  column-gap: clamp(16px, 2.5vw, 32px);
  row-gap: 0;
  position: relative;
}

.stackless-grid::before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 50%;
  width: 1px;
  background: rgba(255,255,255,0.07);
  pointer-events: none;
}

.stackless-card {
  display: flex;
  align-items: flex-start;
  gap: 0;
  padding: clamp(15px, 2vw, 10px) clamp(15px, 1.8vw, 10px);
  background: rgba(10,8,28,0.85);
  position: relative;
  opacity: 0;
  transform: translateY(20px);
  transition: background 0.25s ease, border-left-color 0.25s ease;
  box-shadow: inset 3px 0 18px rgba(100,60,220,0.12);
}

.stackless-card::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 10%;
  width: 80%;
  height: 1px;
  background-color: rgb(120 52 229 / 40%);
}

.stackless-card:last-child::after,
.stackless-card2:last-child::after { display: none; }

.stackless-card-num {
  font-family: 'Syne', sans-serif;
  font-size: clamp(1.4rem, 2vw, 1.8rem);
  font-weight: 800;
  color: #7834e5;
  line-height: 1;
  min-width: 2.4rem;
  padding-top: 2px;
  flex-shrink: 0;
}

.stackless-card-content {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.stackless-card-title {
  font-family: 'Syne', sans-serif;
  font-size: clamp(0.95rem, 1.3vw, 1.15rem);
  font-weight: 700;
  color: var(--white);
  line-height: 1.28;
}

.stackless-card-body {
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(0.76rem, 0.86vw, 0.86rem);
  line-height: 1.65;
  color: rgba(255,255,255,0.48);
  font-weight: 300;
}

#human-first-section {
  position: relative;
  z-index: 10;
  width: 100%;
  padding: clamp(60px, 8vw, 110px) clamp(20px, 4vw, 80px);
  box-sizing: border-box;
}

.hf-inner {
  max-width: 1600px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 60% 40%;
  gap: clamp(40px, 6vw, 80px);
  align-items: stretch;
}

.hf-left {
  display: flex;
  flex-direction: column;
  gap: 0;
  opacity: 0;
  transform: translateY(24px);
}

.hf-label {
  font-family: 'Syne', sans-serif;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: #7c3aed;
  margin-bottom: 1rem;
}

.hf-title {
  font-family: 'Syne', sans-serif;
  font-size: clamp(2rem, 3.8vw, 3.2rem);
  font-weight: 600;
  color: var(--white);
  line-height: 1.0;
  text-transform: uppercase;
  letter-spacing: -0.01em;
  margin-bottom: 1.6rem;
}

.hf-body {
  display: flex;
  flex-direction: column;
  gap: 1.1rem;
  margin-bottom: 1.6rem;
}

.hf-body p {
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(0.82rem, 1vw, 0.95rem);
  line-height: 1.5;
  color: rgba(255,255,255,0.72);
  font-weight: 300;
}

.hf-quote {
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(0.88rem, 1.05vw, 1rem);
  font-weight: 400;
  line-height: 1.55;
  color: #7c3aed;
  font-style: normal;
}

.hf-right {
  position: relative;
  background: rgba(8,6,24,0.95);
  border: 1px solid rgba(100,60,200,0.3);
  border-radius: 6px;
  align-self: stretch;
  min-height: 320px;
  overflow: hidden;
  opacity: 0;
  transform: translateY(24px);
  box-shadow: 0 0 40px rgba(80,40,180,0.12), inset 0 0 60px rgba(60,20,140,0.08);
  margin-right: 110px;
}

.hf-right canvas {
  width: 100%;
  height: 100%;
  display: block;
}

.veracity-title {
  font-family: 'Syne', sans-serif;
  font-size: clamp(1.6rem, 3vw, 2.0rem);
  font-weight: 600;
  color: var(--white);
  line-height: 1.15;
  margin-bottom: 1rem;
  opacity: 0;
  transform: translateY(20px);
}

.veracity-intro {
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(0.82rem, 1vw, 0.95rem);
  line-height: 1.75;
  color: rgba(255,255,255,0.55);
  max-width: 640px;
  margin-bottom: clamp(28px, 3vw, 48px);
  opacity: 0;
  transform: translateY(16px);
}

.veracity-table {
  display: flex;
  flex-direction: column;
  gap: 6px;
  max-width: 650px;
}

.veracity-row {
  display: grid;
  grid-template-columns: 130px 44px 1fr;
  align-items: center;
  padding: 10px 15px;
  border: 1px solid rgba(255,255,255,0.08);
  border-left: 5px solid #7834e5;
  background: #14141e99;
  gap: 5px;
  opacity: 0;
  transform: translateX(-24px);
  transition: background 0.25s ease, border-color 0.25s ease;
  border-radius: 8px;
}

.veracity-row:hover {
  background: rgba(255,255,255,0.05);
  border-left-color: rgba(255,255,255,0.35);
}

.vr-term {
  font-family: 'Syne', sans-serif;
  font-size: clamp(0.95rem, 1.2vw, 1.1rem);
  font-weight: 700;
  color: var(--white);
  white-space: nowrap;
}

.vr-arrow {
  font-size: 1rem;
  color: rgba(255,255,255,0.4);
  text-align: center;
}

.vr-def {
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(0.8rem, 0.95vw, 0.92rem);
  color: rgba(255,255,255,0.55);
  line-height: 1.5;
}

.veracity-row--highlight {
  background-color: rgb(15 14 21 / 80%);
  border-radius: 8px;
  border: 1px solid rgba(138,43,226,0.3);
  box-shadow:
    0 0 4px rgba(138,43,226,0.4),
    0 0 15px rgba(124,34,228,0.25),
    0 0 30px rgba(124,34,228,0.12);
}

.veracity-row--highlight:hover {
  background: rgba(30,10,55,0.85);
  box-shadow:
    0 0 28px rgba(168,85,247,0.4),
    0 0 60px rgba(168,85,247,0.2),
    inset 0 0 24px rgba(168,85,247,0.08);
}

.vr-term--highlight {
  background: #7533df;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.vr-arrow--highlight { color: #a855f7; }

.vr-def--highlight {
  color: var(--white);
  font-weight: 600;
}

.veracity-section {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(32px, 5vw, 80px);
  align-items: center;
}

.veracity-right {
  opacity: 0;
  transform: translateY(20px);
  border-left: 1px solid rgba(255,255,255,0.07);
  padding-left: clamp(24px, 4vw, 56px);
}

.vr2-headline {
  font-size: clamp(0.95rem, 1.3vw, 1.1rem);
  font-weight: 600;
  color: #be00c3;
  line-height: 1.1;
  margin-bottom: 0.3rem;
}

.vr2-subheading {
  font-size: clamp(0.88rem, 1.15vw, 1rem);
  font-weight: 600;
  color: #be00c3;
  line-height: 1.1;
  margin-bottom: 0.9rem;
}

.vr2-list {
  list-style: disc;
  padding-left: 1.2em;
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 0;
}

.vr2-list li {
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(0.78rem, 0.92vw, 0.88rem);
  color: rgba(255,255,255,0.85);
  line-height: 1.65;
}

.vr2-list li strong {
  font-weight: 700;
  color: var(--white);
}

body.menu-open #sound-toggle,
body.menu-open #scroll-indicator {
  z-index: 50;
}

html.loader-active,
body.loader-active {
  overflow: hidden;
  height: 100%;
}

@media (max-width: 768px) {
  body.page-about #hero {
    width: 100vw;
    padding-top: 0;
    align-items: center;
    justify-content: center;
  }
  .origin-label { text-align: center; width: 100%; }
  .about-hero-title { white-space: normal; width: fit-content; margin: 0 auto; text-align: center; margin-bottom: 12px !important; }
  .hero-subtitle { text-align: center; max-width: 88vw; margin: 0 auto; }
  #timeline-section { width: 430vw; }
  .era-card { width: clamp(220px, 70vw, 300px); }
  .era-1 { left: 30vw; }
  .era-2 { left: 130vw; }
  .era-3 { left: 230vw; }
  .era-4 { left: 330vw; width: clamp(220px, 70vw, 300px); }
  #outro {
    height: auto; min-height: 100vh; padding: 80px clamp(20px, 6vw, 40px);
    justify-content: center; overflow-x: hidden; max-width: 100%;
  }
  /* .footer-logo-wrap's own canvas bleeds calc(100% + 80px) past it (see
     about.html's inline style) for a decorative glow — harmless on desktop
     where there's room, but worth capping here so it can never contribute
     to the page's horizontal scroll range on a narrow phone viewport. */
  .footer-logo-wrap { max-width: 100%; overflow: visible; }
  .outro-inner-wrap { overflow-x: hidden; max-width: 100%; }
  .outro-blocks { grid-template-columns: 1fr; gap: 36px; }
  .outro-logo { width: clamp(120px, 45vw, 200px); }
  .outro-heading { font-size: clamp(1.2rem, 5vw, 1.5rem); }
  .outro-body { font-size: clamp(0.85rem, 3.5vw, 1rem); }
  .stateless-banner { grid-template-columns: 1fr; }
  .stateless-right { border-left: none; border-top: 1px solid rgba(255,255,255,0.06); }
  #manifesto-section { padding: clamp(60px, 8vw, 100px) clamp(20px, 6vw, 40px); }
  .manifesto-layout { grid-template-columns: 1fr; }
  /* #dna-canvas.visible (id+class) already outranks this plain #dna-canvas
     rule, so an opacity here never actually dims the visible state — just
     sizing it down for the narrower column. Height is capped rather than
     left at the base rule's 100% — on mobile #manifesto-section stacks
     into one tall column of wrapped paragraph text (often 1500px+), and
     stretching the canvas to match that height was warping the helix's
     rendered aspect ratio into an unrecognizable diagonal smear (the
     JS resize() now also reads the canvas's own box instead of the
     section's, but both fixes are needed together). */
  #dna-canvas { width: 340px; height: 520px; top: 40px; }
  .manifesto-quote { margin-left: 0; }
  .methodology-cols { grid-template-columns: 1fr; gap: clamp(48px, 8vw, 80px); }
  .methodology-heading { font-size: clamp(1.8rem, 6vw, 2.4rem); }
  .methodology-item { padding-left: 0; }
  #human-first-section, .hf-inner { overflow-x: hidden; max-width: 100%; }
  .hf-inner { grid-template-columns: 1fr; }
  .hf-right {
    aspect-ratio: 1 / 0.75; margin-right: 0;
    width: 100%; max-width: 100%; box-sizing: border-box;
  }
  .veracity-section { grid-template-columns: 1fr; }
  .veracity-right { border-left: none; border-top: 1px solid rgba(255,255,255,0.07); padding-left: 0; padding-top: 32px; }
  .veracity-row { grid-template-columns: 90px 28px 1fr; padding: 14px 16px; }
  .veracity-title { font-size: clamp(1.3rem, 6vw, 1.8rem); }

  /* Per request: the three-tier cards also read better as a plain vertical
     stack on mobile (one full-width card per row) rather than a horizontal
     swipe carousel — same reversal as the stackless cards below. */
  .three-tier-cards {
    flex-direction: column;
    align-items: stretch;
  }
  .three-tier-card {
    width: 100%; max-width: 100%; margin: 0; box-sizing: border-box;
  }

  /* Per request: the stackless principles read better as a plain vertical
     stack on mobile (one full-width card per row, wrapping down the page)
     rather than a horizontal swipe carousel — reverting to a single column. */
  .stackless-grid {
    display: grid; grid-template-columns: 1fr; gap: 10px;
  }
  .stackless-grid::before { display: none; }
  .stackless-card { width: 100%; }

  /* Left-align the section header (title, the two "Human Stack" /
     "Agentic Workforce" rows, and the "DKG is the bridge" line) on
     mobile instead of the desktop's centered treatment. */
  .stackless-header { text-align: left; }
  .stackless-subtitle-row { justify-content: flex-start; align-items: flex-start; }
  .stackless-bridge { text-align: left; }

  /* Each subtitle item is a flex row of [dot, strong-label, dash-text] — fine
     on a wide desktop line where nothing wraps, but on mobile the label
     ("The Agentic Workforce") wraps to two lines on its own while the
     dash-text flex item stays pinned at its original horizontal slot,
     leaving a big empty gap next to the first line. Switching to plain
     block/inline flow lets the dot sit as a leading bullet and the label +
     dash-text wrap together naturally as one line of text, no dead gap. */
  .stackless-subtitle-item {
    display: block;
  }
  .stackless-dot {
    display: inline-block;
    margin-right: 7px;
    vertical-align: middle;
  }

  /* Defensive containment — belt-and-suspenders so an intrinsically-wide
     scrollable descendant (either carousel above, or anything added later)
     can never again inflate the page's own horizontal scroll range. */
  .methodology-cols, .three-tier-panel, .stackless-inner,
  #methodology-section, #stackless-section {
    overflow-x: hidden;
    max-width: 100%;
  }
}

@media (max-width: 900px) {
  .methodology-cols { grid-template-columns: 1fr; gap: clamp(48px, 8vw, 80px); }
  .veracity-section { grid-template-columns: 1fr; }
  .veracity-right { border-left: none; border-top: 1px solid rgba(255,255,255,0.07); padding-left: 0; padding-top: 32px; }
}

@media (max-width: 640px) {
  .stackless-subtitle-row { flex-direction: column; align-items: flex-start; gap: 8px; }
  .veracity-row { grid-template-columns: 90px 28px 1fr; }
}

@media (max-width: 480px) {
  body.page-about #hero { padding-top: 0; }
  #timeline-section { width: 460vw; }
  .era-1 { left: 35vw; }
  .era-2 { left: 145vw; }
  .era-3 { left: 255vw; }
  .era-4 { left: 365vw; }
}

/* ================================================
   Services Page
   ================================================ */

.hero-headline-line {
  font-family: 'Syne', sans-serif;
  font-size: clamp(3rem, 8vw, 4rem);
  font-weight: 600;
  line-height: 1.0;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  display: block;
}

.hero-headline-line--white {
  color: #ffffff;
}

.hero-headline-line--orange {
  color: #f4a135;
}

.hero-headline-line--strikethrough {
  color: #9d8da9;
  position: relative;
  display: inline-block;
}

.hero-headline-line--strikethrough::after {
  content: '';
  position: absolute;
  left: 0; right: 0;
  top: 50%;
  height: 5px;
  background: #e02862;
  border-radius: 3px;
  transform: translateY(-50%);
}

.services-hero-sub {
  margin-top: 1.8rem;
  max-width: 480px;
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(0.85rem, 1.3vw, 1rem);
  font-weight: 300;
  line-height: 1.6;
  color: rgba(255,255,255,0.55);
}

.hero-body {
  margin-top: 2rem;
  max-width: 900px;
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(0.82rem, 1.1vw, 0.95rem);
  font-weight: 300;
  line-height: 1.75;
  color: rgba(255,255,255,0.75);
}

.hero-body p + p {
  margin-top: 0rem;
}

.hero-tagline {
  margin-top: 2.5rem;
  text-align: center;
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(1rem, 2vw, 1.4rem);
  font-weight: 300;
  color: rgba(255,255,255,0.45);
  letter-spacing: 0.01em;
}

.hero-cards {
  margin-top: 2.5rem;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 clamp(32px, 5vw, 72px);
  position: relative;
}

.hero-cards::after {
content: '';
    position: absolute;
    top: 30%;
    bottom: 0;
    left: 50%;
    transform: translateX(-30%);
    width: 4px;
    background: linear-gradient(to bottom, #6d28d9 0%, #a855f7 25%, #ec4899 50%, #f43f5e 75%, #ff0022 100%);
    box-shadow: 0px 0px 8px 0px rgba(255, 255, 255, 0.9);
    z-index: 2;
    height: 50%;
    margin: 0 auto;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hero-card {
  position: relative;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.hero-card--reaaS {
  border: 1px solid rgba(30, 0, 60, 0.70);
}

.hero-card--reaaS::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 140% 90% at 10% 90%, rgba(110,0,200,0.5) 0%, transparent 60%);
  pointer-events: none;
}

.hero-card--geaaS {
  border: 1px solid rgba(40, 10, 0, 0.70);
}

.hero-card--geaaS::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 140% 90% at 90% 90%, rgba(200,60,0,0.55) 0%, transparent 60%);
  pointer-events: none;
}

.hero-card-name {
  font-family: 'Syne', sans-serif;
  font-size: clamp(2.2rem, 4vw, 3.5rem);
  font-weight: 700;
  letter-spacing: -0.01em;
  margin-bottom: 0.25rem;
  text-align: center;
  position: relative;
  z-index: 1;
}

.hero-card--reaaS .hero-card-name { color: #9b5de5; }

.hero-card--geaaS .hero-card-name { color: #f4a135; }

.hero-card-fullname {
  font-family: 'Syne', sans-serif;
  font-size: clamp(0.8rem, 1.1vw, 0.95rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 1rem;
  text-align: center;
  position: relative;
  z-index: 1;
}

.hero-card-tagline {
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(0.78rem, 0.95vw, 0.88rem);
  font-style: italic;
  font-weight: 300;
  line-height: 1.65;
  margin-bottom: 1.2rem;
  position: relative;
  z-index: 1;
}

.hero-card--reaaS .hero-card-tagline { color: rgba(200,170,255,0.85); }

.hero-card--geaaS .hero-card-tagline { color: rgba(255,200,130,0.85); }

.hero-card-list {
  list-style: none;
  padding: 0;
  margin: 0 0 1.6rem 0;
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  position: relative;
  z-index: 1;
  flex: 1;
}

.hero-card-list li {
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(0.82rem, 1vw, 0.92rem);
  font-weight: 400;
  color: rgba(255,255,255,0.88);
  display: flex;
  align-items: center;
  gap: 0.65rem;
}

.hero-card-list li::before {
  content: '';
  width: 7px;
  height: 7px;
  border-radius: 50%;
  flex-shrink: 0;
}

.hero-card--reaaS .hero-card-list li::before { background: #9b5de5; box-shadow: 0 0 7px rgba(155,93,229,0.9); }

.hero-card--geaaS .hero-card-list li::before { background: #f4a135; box-shadow: 0 0 7px rgba(244,161,53,0.9); }

.hero-warrant {
  position: relative;
  z-index: 1;
  border-radius: 8px;
  padding: clamp(16px, 2vw, 22px) clamp(16px, 2vw, 22px);
  margin-top: auto;
}

.hero-card--reaaS .hero-warrant {
 background: #0f061e;
    border-top: 4px solid #7d42e6;
}

.hero-card--geaaS .hero-warrant {
  background: #0f061e;
  border-top: 4px solid #e05d08;
}

.hero-warrant-title {
  font-family: 'Syne', sans-serif;
  font-size: clamp(0.95rem, 1.5vw, 1.15rem);
  font-weight: 800;
  color: #ffffff;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.4rem;
}

.hero-warrant-title .warrant-icon {
  font-size: 1rem;
}

.hero-card--reaaS .hero-warrant-title { color: #c084fc; }

.hero-card--geaaS .hero-warrant-title { color: #fb923c; }

.hero-warrant-sub {
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(0.75rem, 0.9vw, 0.83rem);
  font-weight: 300;
  color: rgba(255,255,255,0.55);
  margin-bottom: 1rem;
}

.hero-warrant-label {
  font-family: 'Syne', sans-serif;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.3);
  margin-bottom: 0.5rem;
}

.hero-warrant-list {
  list-style: none;
  padding: 0;
  margin: 0 0 1rem 0;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
}

.hero-warrant-list li {
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(0.72rem, 0.88vw, 0.82rem);
  font-weight: 300;
  color: rgba(255,255,255,0.65);
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
}

.hero-warrant-list li::before {
  content: '✓';
  font-size: 0.72rem;
  flex-shrink: 0;
  margin-top: 1px;
}

.hero-card--reaaS .hero-warrant-list li::before { color: #9b5de5; }

.hero-card--geaaS .hero-warrant-list li::before { color: #f4a135; }

.hero-warrant-meta {
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(0.68rem, 0.82vw, 0.76rem);
  font-weight: 300;
  color: rgba(255,255,255,0.4);
  line-height: 1.7;
  margin-bottom: 1rem;
  border-top: 1px solid rgba(255,255,255,0.07);
  padding-top: 0.7rem;
}

.hero-warrant-meta strong {
  color: rgba(255,255,255,0.6);
  font-weight: 400;
}

.hero-warrant-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.hero-warrant-link {
  font-family: 'Syne', sans-serif;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 0.3rem;
}

.hero-card--reaaS .hero-warrant-link { color: #9b5de5; }

.hero-card--geaaS .hero-warrant-link { color: #f4a135; }

.hero-warrant-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 10px 26px;
  border-radius: 999px;
  font-family: 'Syne', sans-serif;
  font-size: clamp(0.85rem, 1.2vw, 1rem);
  font-weight: 800;
  letter-spacing: 0.04em;
  text-decoration: none;
  border: none;
  cursor: pointer;
  transition: all 0.25s ease;
}

.hero-card--reaaS .hero-warrant-btn {
  background: linear-gradient(135deg, #9b5de5, #c084fc);
  color: #ffffff;
  box-shadow: 0 0 20px rgba(155,93,229,0.55);
}

.hero-card--reaaS .hero-warrant-btn:hover {
  box-shadow: 0 0 30px rgba(155,93,229,0.85);
  transform: translateY(-2px);
}

.hero-card--geaaS .hero-warrant-btn {
  background: linear-gradient(135deg, #f4a135, #fb923c);
  color: #000000;
  box-shadow: 0 0 20px rgba(244,161,53,0.55);
}

.hero-card--geaaS .hero-warrant-btn:hover {
  box-shadow: 0 0 30px rgba(244,161,53,0.85);
  transform: translateY(-2px);
}

#diagnostic-section {
  position: relative;
  z-index: 1;
  width: 100%;
  background: #000;
  padding: clamp(60px, 8vw, 100px) clamp(20px, 6vw, 80px);
  overflow: hidden;
}

.dtd-quote {
  max-width: 1000px;
  margin: 0 auto clamp(40px, 5vw, 60px);
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(0.88rem, 1.3vw, 1rem);
  font-weight: 300;
  line-height: 1.75;
  color: rgba(255,255,255,0.72);
  text-align: center;
}

.dtd-quote p + p { margin-top: 0.6rem; }

.dtd-quote strong { font-weight: 400; color: rgba(255,255,255,0.9); }

.dtd-eyebrow {
  text-align: center;
  font-family: 'Syne', sans-serif;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: #a4773b;
  margin-bottom: 0.8rem;
}

.dtd-headline {
  text-align: center;
  font-family: 'Syne', sans-serif;
  font-size: clamp(2.4rem, 7vw, 2.8rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  color: #ffffff;
  line-height: 1;
  margin-bottom: clamp(40px, 6vw, 70px);
}

.dtd-steps {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0;
  position: relative;
  margin-bottom: clamp(50px, 7vw, 80px);
  padding: 0 1vw;
}

.dtd-steps::before {
  content: '';
  position: absolute;
  top: 10px;
  left: 10%;
  right: 10%;
  height: 1px;
  background: #322471;
  opacity: 0.5;
  z-index: 0;
}

.dtd-step {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  position: relative;
  z-index: 1;
  padding: 0 clamp(6px, 1.5vw, 16px);
}

.dtd-step-num {
  font-family: 'Syne', sans-serif;
  font-size: 0.6rem;
  font-weight: 700;
  color: rgba(255,255,255,0.35);
  margin-bottom: 6px;
  letter-spacing: 0.05em;
}

.dtd-step-dot {
  width: 14px;
  height: 14px;
  border-radius: 50%;
  margin-bottom: 14px;
  flex-shrink: 0;
}

.dtd-step:nth-child(1) .dtd-step-dot { background: #9b5de5; box-shadow: 0 0 10px rgba(155,93,229,0.8); }

.dtd-step:nth-child(2) .dtd-step-dot { background: #c026d3; box-shadow: 0 0 10px rgba(192,38,211,0.8); }

.dtd-step:nth-child(3) .dtd-step-dot { background: #db2777; box-shadow: 0 0 10px rgba(219,39,119,0.8); }

.dtd-step:nth-child(4) .dtd-step-dot { background: #f43f5e; box-shadow: 0 0 10px rgba(244,63,94,0.8); }

.dtd-step:nth-child(5) .dtd-step-dot { background: #f97316; box-shadow: 0 0 10px rgba(249,115,22,0.8); }

.dtd-step-title {
  font-family: 'Syne', sans-serif;
  font-size: clamp(0.72rem, 1.1vw, 0.88rem);
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 8px;
}

.dtd-step-desc {
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(0.62rem, 0.85vw, 0.75rem);
  font-weight: 300;
  line-height: 1.55;
  color: rgba(255,255,255,0.45);
}

.dtd-table-wrap {
  width: 100%;
  overflow-x: auto;
}

.dtd-table {
  width: 100%;
  border-collapse: collapse;
  min-width: 560px;
}

.dtd-table thead tr {
  border-bottom: 1px solid rgba(255,255,255,0.1);
}

.dtd-table thead th {
  padding: 14px 20px;
  font-family: 'Syne', sans-serif;
  font-size: clamp(0.72rem, 1vw, 0.82rem);
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.dtd-table thead th:first-child {
  color: rgba(255,255,255,0.35);
  text-align: left;
  width: 22%;
  background: rgba(80,40,160,0.25);
}

.dtd-table thead th.th-reaas {
  color: #9b5de5;
  text-align: left;
  background: rgba(155,93,229,0.08);
  border-left: 1px solid #9b5de5;
    border-right: 1px solid #f4a135;
}

.dtd-table thead th.th-geaas {
  color: #f4a135;
  text-align: left;
  background: rgba(244,161,53,0.08);
}

.dtd-table tbody tr {
  border-bottom: 1px solid rgba(255,255,255,0.06);
  transition: background 0.2s ease;
}

.dtd-table tbody tr:hover {
  background: rgba(255,255,255,0.03);
}

.dtd-table tbody td {
  padding: clamp(14px, 2vw, 12px) 20px;
  vertical-align: top;
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(0.78rem, 1.05vw, 0.9rem);
  font-weight: 300;
  line-height: 1.5;
  color: rgba(255,255,255,0.82);

}

.dtd-table tbody td:first-child {
  font-family: 'Syne', sans-serif;
  font-size: clamp(0.6rem, 0.82vw, 0.72rem);
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.35);
  background: rgba(80,40,160,0.15);
  border-right: 1px solid #9459db;
  vertical-align: middle;
}

.dtd-table tbody td.td-reaas {
  background: rgba(155,93,229,0.04);
  border-left: 1px solid #9b5de5;
  border-right: 1px solid #f4a135;
}

.dtd-table tbody td.td-geaas {
  background: rgba(244,161,53,0.04);
}

@media (max-width: 520px) {
  .dtd-steps { grid-template-columns: 1fr 1fr; }
}

#reaas-panel {
  position: fixed;
  inset: 0;
  z-index: 999;
  pointer-events: none;
  overflow: hidden;
}

#reaas-panel.active { pointer-events: all; }

.reaas-curtain {
  position: absolute;
  left: 0; right: 0;
  height: 50%;
  background: #04000a;
  z-index: 1;
  transition: transform 0.7s cubic-bezier(0.76, 0, 0.24, 1);
}

.reaas-curtain--top    { top: 0;    transform: translateY(-100%); }

.reaas-curtain--bottom { bottom: 0; transform: translateY(100%); }

#reaas-panel.active .reaas-curtain--top    { transform: translateY(0); }

#reaas-panel.active .reaas-curtain--bottom { transform: translateY(0); }

#reaas-canvas {
  position: absolute;
  inset: 0;
  z-index: 2;
  opacity: 0;
  transition: opacity 0.6s ease 0.5s;
  pointer-events: none;
}

#reaas-panel.active #reaas-canvas { opacity: 1; }

.reaas-universe {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: flex;
  flex-direction: column;
  opacity: 0;
  transition: opacity 0.4s ease 0.65s;
}

#reaas-panel.active .reaas-universe { opacity: 1; }

.reaas-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 40px;
  border-bottom: 1px solid rgba(155,93,229,0.18);
  flex-shrink: 0;
}

.reaas-topbar-brand {
  font-family: 'Syne', sans-serif;
  font-size: 1.4rem;
  font-weight: 800;
  letter-spacing: -0.01em;
  display: flex;
  align-items: center;
  gap: 12px;
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
    font-weight: 800;
    font-size: 2.5rem;
    letter-spacing: -0.01em;
    background: linear-gradient(
        to right,
        #8b5cf6 0%,
        #a855f7 40%,
        #c084fc 75%,
        #d946ef 100%
    );
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
}

.reaas-topbar-brand::before {
  content: '';
  width: 8px; height: 8px;
  border-radius: 50%;
  background: #9b5de5;
  box-shadow: 0 0 12px rgba(155,93,229,1), 0 0 24px rgba(155,93,229,0.6);
  animation: reaaPulse 1.8s ease-in-out infinite;
}

@keyframes reaaPulse {
  0%,100% { transform: scale(1); opacity: 1; }
  50%      { transform: scale(1.5); opacity: 0.6; }
}

.reaas-topbar-subtitle {
  font-family: 'DM Sans', sans-serif;
  font-size: 0.82rem;
  font-weight: 300;
  color: rgba(255,255,255,0.4);
  margin-left: 4px;
}

.reaas-x-btn {
  width: 42px; height: 42px;
  border-radius: 8px;
  border: 1px solid rgba(155,93,229,0.3);
  background: transparent;
  color: rgba(255,255,255,0.5);
  font-size: 1rem;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.2s ease;
  font-family: 'Syne', sans-serif;
  font-weight: 700;
  flex-shrink: 0;
}

.reaas-x-btn:hover {
  background: rgba(155,93,229,0.15);
  color: #9b5de5;
  border-color: #9b5de5;
}

.reaas-tabs {
  display: flex;
  gap: 0;
  padding: 0 40px;
  border-bottom: 1px solid rgba(255,255,255,0.07);
  flex-shrink: 0;
  overflow-x: auto;
  scrollbar-width: none;
}

.reaas-tabs::-webkit-scrollbar { display: none; }

.reaas-tab {
  font-family: 'Syne', sans-serif;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.3);
  padding: 14px 22px;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  transition: all 0.2s ease;
  background: none;
  border-top: none; border-left: none; border-right: none;
  white-space: nowrap;
  flex-shrink: 0;
}

.reaas-tab:hover { color: rgba(255,255,255,0.7); }

.reaas-tab.active { color: #9b5de5; border-bottom-color: #9b5de5; }

.reaas-body {
  flex: 1;
  display: grid;
  grid-template-columns: 350px 1fr;
  overflow: hidden;
}

.reaas-sidebar {
  background: rgba(155,93,229,0.04);
  border-right: 1px solid rgba(155,93,229,0.1);
  padding: 25px 28px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 14px;
  scrollbar-width: none;
}

.reaas-sidebar::-webkit-scrollbar { display: none; }

.reaas-stat-num {
  font-family: 'Syne', sans-serif;
  font-size: 2.5rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.03em;
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
    font-weight: 800;
    font-size: 2.5rem;
    letter-spacing: -0.01em;
    background: linear-gradient(
        to right,
        #8b5cf6 0%,
        #a855f7 40%,
        #c084fc 75%,
        #d946ef 100%
    );
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
}

.reaas-stat-label {
  font-family: 'DM Sans', sans-serif;
  font-size: 0.68rem;
  font-weight: 300;
  color: rgba(255,255,255,0.35);
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

.reaas-stat-desc {
  font-family: 'DM Sans', sans-serif;
  font-size: 0.78rem;
  font-weight: 300;
  color: rgba(255,255,255,0.5);
  line-height: 1.5;
  margin-top: 4px;
}

.reaas-sidebar-divider { height: 1px; background: rgba(155,93,229,0.1); }

.reaas-metrics-title {
  font-family: 'Syne', sans-serif;
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.22);
  margin-bottom: 14px;
}

.reaas-metric-item {
  padding: 10px 0;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  display: flex;
  align-items: center;
}

.reaas-metric-num {
  font-family: 'Syne', sans-serif;
  font-size: 0.58rem;
  font-weight: 700;
  color: rgba(155,93,229,0.6);
  letter-spacing: 0.08em;
  margin-bottom: 3px;
  margin-right: 5px;
}

.reaas-metric-name {
  font-family: 'Syne', sans-serif;
  font-size: 0.8rem;
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 3px;
  line-height: 22px;
}

.reaas-metric-desc {
  font-family: 'DM Sans', sans-serif;
  font-size: 0.7rem;
  font-weight: 300;
  color: rgba(255,255,255,0.38);
  line-height: 1.45;
}

.reaas-content {
  overflow-y: auto;
  padding: 36px 44px 60px;
  scrollbar-width: thin;
  scrollbar-color: rgba(155,93,229,0.2) transparent;
}

.reaas-content::-webkit-scrollbar { width: 3px; }

.reaas-content::-webkit-scrollbar-thumb { background: rgba(155,93,229,0.25); }

.reaas-panel-content { display: none; }

.reaas-panel-content.active { display: block; }

.reaas-intro-headline {
  font-family: 'Syne', sans-serif;
  font-size: clamp(1.6rem, 3.5vw, 2.5rem);
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -0.02em;
  margin-bottom: 1.4rem;
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
    font-weight: 800;
    font-size: 2.5rem;
    letter-spacing: -0.01em;
    background: linear-gradient(
        to right,
        #8b5cf6 0%,
        #a855f7 40%,
        #c084fc 75%,
        #d946ef 100%
    );
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
}

.reaas-intro-headline em { font-style: normal; font-family: 'Inter', system-ui, -apple-system, sans-serif;
    font-weight: 800;
    font-size: 2.5rem;
    letter-spacing: -0.01em;
    background: linear-gradient(
        to right,
        #8b5cf6 0%,
        #a855f7 40%,
        #c084fc 75%,
        #d946ef 100%
    );
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent; }

.reaas-prose {
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(0.84rem, 1.1vw, 0.95rem);
  font-weight: 300;
  line-height: 1.85;
  color: rgba(255,255,255,0.65);
  margin-bottom: 1.2rem;
}

.reaas-prose strong { color: #9b5de5; font-weight: 500; }

.reaas-eng-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-top: 8px;
}

.reaas-eng-card {
  background: rgba(155,93,229,0.04);
  border: 1px solid rgba(155,93,229,0.14);
  border-radius: 10px;
  padding: 13px;
  transition: all 0.25s ease;
  position: relative;
  overflow: hidden;
}

.reaas-eng-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, #9b5de5, #c084fc);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.35s ease;
}

.reaas-eng-card:hover { background: rgba(155,93,229,0.09); border-color: rgba(155,93,229,0.35); }

.reaas-eng-card:hover::before { transform: scaleX(1); }

.reaas-eng-card-icon { font-size: 1.4rem; margin-bottom: 10px; display: block; }

.reaas-eng-card-name { font-family: 'Syne', sans-serif; font-size: 0.88rem; font-weight: 700; color: #ffffff; margin-bottom: 6px; }

.reaas-eng-card-desc { font-family: 'DM Sans', sans-serif; font-size: 0.76rem; font-weight: 300; line-height: 1.6; color: rgba(255,255,255,0.42); }

.reaas-content-label {
  font-family: 'Syne', sans-serif;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(155,93,229,1);
  margin-bottom: 1rem;
  margin-top: 2rem;
  display: flex;
  align-items: center;
  gap: 10px;
}

.reaas-content-label::after { content: ''; flex: 1; height: 1px; background: rgba(155,93,229,0.12); }

.reaas-final-cta {
  margin-top: 2.5rem;
  padding: 28px 30px;
  background: rgba(155,93,229,0.06);
  border: 1px solid rgba(155,93,229,0.22);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.reaas-final-cta-text { font-family: 'Syne', sans-serif; font-size: clamp(0.9rem, 1.4vw, 1.1rem); font-weight: 700; color: #ffffff; }

.reaas-final-cta-sub  { font-family: 'DM Sans', sans-serif; font-size: 0.78rem; font-weight: 300; color: rgba(255,255,255,0.38); margin-top: 2px; }

.reaas-warrant-btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 13px 32px; border-radius: 15px;
  font-family: 'Syne', sans-serif; font-size: 0.9rem; font-weight: 600; letter-spacing: 0.04em;
  color: #ffffff;
  background: linear-gradient(
        to right,
        #8b5cf6 0%,
        #a855f7 40%,
        #c084fc 75%,
        #d946ef 100%
    );
  box-shadow: 0 0 28px rgba(155,93,229,0.5);
  border: none; cursor: pointer; text-decoration: none; white-space: nowrap;
  transition: all 0.3s ease; flex-shrink: 0;
}

.reaas-warrant-btn:hover { box-shadow: 0 0 44px rgba(155,93,229,0.85); transform: translateY(-2px) scale(1.02); }

#geaas-panel {
  position: fixed;
  inset: 0;
  z-index: 999;
  pointer-events: none;
  overflow: hidden;

}

#geaas-panel.active { pointer-events: all; }

.geaas-curtain {
  position: absolute;
  left: 0; right: 0;
  height: 50%;
  background: #060008;
  z-index: 1;
  transition: transform 0.7s cubic-bezier(0.76, 0, 0.24, 1);
}

.geaas-curtain--top    { top: 0;    transform: translateY(-100%); }

.geaas-curtain--bottom { bottom: 0; transform: translateY(100%); }

#geaas-panel.active .geaas-curtain--top    { transform: translateY(0); }

#geaas-panel.active .geaas-curtain--bottom { transform: translateY(0); }

#geaas-canvas {
  position: absolute;
  inset: 0;
  z-index: 2;
  opacity: 0;
  transition: opacity 0.6s ease 0.5s;
  pointer-events: none;
}

#geaas-panel.active #geaas-canvas { opacity: 1; }

.geaas-universe {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: flex;
  flex-direction: column;
  opacity: 0;
  transition: opacity 0.4s ease 0.65s;
}

#geaas-panel.active .geaas-universe { opacity: 1; }

.geaas-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 40px;
  border-bottom: 1px solid rgba(244,161,53,0.15);
  flex-shrink: 0;
}

.geaas-topbar-brand {
  font-family: 'Syne', sans-serif;
  font-size: 1.4rem;
  font-weight: 800;
  letter-spacing: -0.01em;
  display: flex;
  align-items: center;
  gap: 12px;
background: linear-gradient(
        to right,
        #ff3b30 0%,
        #ff7a00 50%,
        #e62e2d 100%
    );
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
}

.geaas-topbar-brand::before {
  content: '';
  width: 8px; height: 8px;
  border-radius: 50%;
  background: #f4a135;
  box-shadow: 0 0 12px rgba(244,161,53,1), 0 0 24px rgba(244,161,53,0.6);
  animation: geaasPulse 1.8s ease-in-out infinite;
}

@keyframes geaasPulse {
  0%,100% { transform: scale(1); opacity: 1; }
  50%      { transform: scale(1.5); opacity: 0.6; }
}

.geaas-topbar-subtitle {
  font-family: 'DM Sans', sans-serif;
  font-size: 0.82rem;
  font-weight: 300;
  color: rgba(255,255,255,0.4);
  margin-left: 4px;
}

.geaas-x-btn {
  width: 42px; height: 42px;
  border-radius: 8px;
  border: 1px solid rgba(244,161,53,0.25);
  background: transparent;
  color: rgba(255,255,255,0.5);
  font-size: 1rem;
  cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.2s ease;
  font-family: 'Syne', sans-serif;
  font-weight: 700;
}

.geaas-x-btn:hover {
  background: rgba(244,161,53,0.12);
  color: #f4a135;
  border-color: #f4a135;
}

.geaas-tabs {
  display: flex;
  gap: 0;
  padding: 0 40px;
  border-bottom: 1px solid rgba(255,255,255,0.07);
  flex-shrink: 0;
}

.geaas-tab {
  font-family: 'Syne', sans-serif;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.3);
  padding: 14px 22px;
  cursor: pointer;
  border-bottom: 2px solid transparent;
  transition: all 0.2s ease;
  background: none;
  border-top: none; border-left: none; border-right: none;
  white-space: nowrap;
}

.geaas-tab:hover { color: rgba(255,255,255,0.7); }

.geaas-tab.active {
  color: #f4a135;
  border-bottom-color: #f4a135;
}

.geaas-body {
  flex: 1;
  display: grid;
  grid-template-columns: 350px 1fr;
  overflow: hidden;
}

.geaas-sidebar {
  background: rgba(244,161,53,0.04);
  border-right: 1px solid rgba(244,161,53,0.1);
  padding: 25px 30px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 14px;
  scrollbar-width: none;
}

.geaas-sidebar::-webkit-scrollbar { display: none; }

.geaas-stat-block {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.geaas-stat-num {
  font-family: 'Syne', sans-serif;
  font-size: 2.5rem;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -0.03em;
  background: linear-gradient(
        to right,
        #ff3b30 0%,
        #ff7a00 50%,
        #e62e2d 100%
    );
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
}

.geaas-stat-label {
  font-family: 'DM Sans', sans-serif;
  font-size: 0.72rem;
  font-weight: 300;
  color: rgba(255,255,255,0.4);
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

.geaas-stat-desc {
  font-family: 'DM Sans', sans-serif;
  font-size: 0.8rem;
  font-weight: 300;
  color: rgba(255,255,255,0.55);
  line-height: 1.5;
  margin-top: 4px;
}

.geaas-sidebar-divider {
  height: 1px;
  background: rgba(244,161,53,0.1);
}

.geaas-signals-title {
  font-family: 'Syne', sans-serif;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.25);
  margin-bottom: 12px;
}

.geaas-signal-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 8px 0;
  border-bottom: 1px solid rgba(255,255,255,0.04);
  cursor: pointer;
  transition: all 0.2s ease;
}

.geaas-signal-item:hover .geaas-signal-text { color: rgba(255,255,255,0.9); }

.geaas-signal-dot {
  width: 6px; height: 6px;
  border-radius: 50%;
  background: #f4a135;
  box-shadow: 0 0 6px rgba(244,161,53,0.7);
  flex-shrink: 0;
  margin-top: 5px;
}

.geaas-signal-text {
  font-family: 'DM Sans', sans-serif;
  font-size: 0.78rem;
  font-weight: 300;
  color: rgba(255,255,255,0.55);
  line-height: 1.5;
  transition: color 0.2s ease;
}

.geaas-content {
  overflow-y: auto;
  padding: 36px 44px 60px;
  scrollbar-width: thin;
  scrollbar-color: rgba(244,161,53,0.2) transparent;
}

.geaas-content::-webkit-scrollbar { width: 3px; }

.geaas-content::-webkit-scrollbar-thumb { background: rgba(244,161,53,0.2); }

.geaas-panel-content { display: none; }

.geaas-panel-content.active { display: block; }

.geaas-intro-headline {
  font-family: 'Syne', sans-serif;
  font-size: clamp(1.6rem, 3.5vw, 2.5rem);
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -0.02em;
  margin-bottom: 1.4rem;
background: linear-gradient(
        to right,
        #ff3b30 0%,
        #ff7a00 50%,
        #e62e2d 100%
    );
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
}

.geaas-intro-headline em {
  font-style: normal;
  background: linear-gradient(
        to right,
        #ff3b30 0%,
        #ff7a00 50%,
        #e62e2d 100%
    );
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
}

.geaas-prose {
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(0.84rem, 1.1vw, 0.95rem);
  font-weight: 300;
  line-height: 1.85;
  color: rgba(255,255,255,0.65);
  margin-bottom: 1.2rem;
}

.geaas-prose strong {
  color: #f4a135;
  font-weight: 500;
}

.geaas-eng-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin-top: 8px;
}

.geaas-eng-card {
  background: rgba(244,161,53,0.04);
  border: 1px solid rgba(244,161,53,0.12);
  border-radius: 10px;
  padding: 13px;
  cursor: default;
  transition: all 0.25s ease;
  position: relative;
  overflow: hidden;
}

.geaas-eng-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, #f4a135, #fb923c);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.35s ease;
}

.geaas-eng-card:hover { background: rgba(244,161,53,0.08); border-color: rgba(244,161,53,0.3); }

.geaas-eng-card:hover::before { transform: scaleX(1); }

.geaas-eng-card-icon {
  font-size: 1.4rem;
  margin-bottom: 10px;
  display: block;
}

.geaas-eng-card-name {
  font-family: 'Syne', sans-serif;
  font-size: 0.88rem;
  font-weight: 700;
  color: #ffffff;
  margin-bottom: 6px;
}

.geaas-eng-card-desc {
  font-family: 'DM Sans', sans-serif;
  font-size: 0.76rem;
  font-weight: 300;
  line-height: 1.6;
  color: rgba(255,255,255,0.45);
}

.geaas-content-label {
  font-family: 'Syne', sans-serif;
  font-size: 0.6rem;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(244,161,53,1);
  margin-bottom: 1rem;
  margin-top: 2rem;
  display: flex;
  align-items: center;
  gap: 10px;
}

.geaas-content-label::after {
  content: '';
  flex: 1;
  height: 1px;
  background: rgba(244,161,53,0.12);
}

.geaas-final-cta {
  margin-top: 2.5rem;
  padding: 28px 30px;
  background: rgba(244,161,53,0.06);
  border: 1px solid rgba(244,161,53,0.2);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.geaas-final-cta-text {
  font-family: 'Syne', sans-serif;
  font-size: clamp(0.9rem, 1.4vw, 1.1rem);
  font-weight: 700;
  color: #ffffff;
}

.geaas-final-cta-sub {
  font-family: 'DM Sans', sans-serif;
  font-size: 0.78rem;
  font-weight: 300;
  color: rgba(255,255,255,0.4);
  margin-top: 2px;
}

.geaas-audit-btn {
 display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 13px 32px;
    border-radius: 15px;
    font-family: 'Syne', sans-serif;
    font-size: .9rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    color: #fff;
    background: linear-gradient(to right, #ff3b30 0%, #ff7a00 50%, #e62e2d 100%);
    box-shadow: 0 0 28px rgba(244, 161, 53, 0.5);
    border: none;
    cursor: pointer;
    text-decoration: none;
}

.geaas-audit-btn:hover {
  box-shadow: 0 0 44px rgba(244,161,53,0.8);
  transform: translateY(-2px) scale(1.02);
}

[data-reveal] {
  opacity: 0;
  transition: opacity 0.75s ease, transform 0.75s cubic-bezier(0.22, 1, 0.36, 1);
  will-change: opacity, transform;
}

[data-reveal="up"]    { transform: translateY(48px); }

[data-reveal="down"]  { transform: translateY(-48px); }

[data-reveal="left"]  { transform: translateX(-56px); }

[data-reveal="right"] { transform: translateX(56px); }

[data-reveal="fade"]  { transform: none; }

[data-reveal="scale"] { transform: scale(0.88); }

[data-reveal].is-visible {
  opacity: 1;
  transform: none !important;
}

[data-reveal-group] > *[data-reveal] { }

[data-reveal-group] > *[data-reveal]:nth-child(1)  { transition-delay: 0s; }

[data-reveal-group] > *[data-reveal]:nth-child(2)  { transition-delay: 0.1s; }

[data-reveal-group] > *[data-reveal]:nth-child(3)  { transition-delay: 0.18s; }

[data-reveal-group] > *[data-reveal]:nth-child(4)  { transition-delay: 0.26s; }

[data-reveal-group] > *[data-reveal]:nth-child(5)  { transition-delay: 0.34s; }

[data-reveal-group] > *[data-reveal]:nth-child(6)  { transition-delay: 0.42s; }

[data-reveal-group] > *[data-reveal]:nth-child(7)  { transition-delay: 0.50s; }

[data-reveal-group] > *[data-reveal]:nth-child(8)  { transition-delay: 0.58s; }

[data-delay="100"] { transition-delay: 0.1s !important; }

[data-delay="200"] { transition-delay: 0.2s !important; }

[data-delay="300"] { transition-delay: 0.3s !important; }

[data-delay="400"] { transition-delay: 0.4s !important; }

[data-delay="500"] { transition-delay: 0.5s !important; }

[data-delay="600"] { transition-delay: 0.6s !important; }

@media (prefers-reduced-motion: reduce) {
  [data-reveal] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* ================================================
   Start a Warrent Page
   ================================================ */

body.page-warrant #hero {
  width: 100vw;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 120px 6vw 60px;
  position: relative;
  z-index: 1;
}

body.page-warrant .origin-label {
  font-family: 'Syne', sans-serif;
  font-size: 0.85rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--purple);
  margin-bottom: 0.5rem;
  font-weight: 700;
}

body.page-warrant .hero-title {
  font-family: 'Syne', sans-serif;
  font-size: 3rem;
  font-weight: 600;
  letter-spacing: -0.03em;
  color: #fff;
}

body.page-warrant .hero-title span {
  background-image: linear-gradient(to right, #f4a135 0%, #f0554a 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  display: inline-block;
}

body.page-warrant .hero-title::after {
  content: '';
  position: absolute;
  bottom: 0; left: 0;
  width: 100%; height: 2px;
  background: #5a378f;
}

body.page-warrant .hero-subtitle {
  margin-top: 1.6rem;
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(0.95rem, 1.4vw, 1.05rem);
  font-weight: 300;
  line-height: 1.5;
  color: rgb(174 174 174);
  opacity: 1 !important;
  max-width: 900px;
}

body.page-warrant .hero-subtitle .char {
  opacity: 1 !important;
  transform: none !important;
}

body.page-warrant .hero-title::after { display: none; }

body.page-warrant .hero-list {
  margin-top: 1rem;
  padding-left: 1.4rem;
  display: flex;
  flex-direction: column;
  gap: .5rem;
  max-width: 900px;
  list-style: disc;
}

body.page-warrant .hero-list > li {
  font-family: 'DM Sans', sans-serif;
  font-size: clamp(0.95rem, 1.4vw, 1.1rem);
  font-weight: 400;
  line-height: 1.55;
  color: rgba(255,255,255,0.88);
}

body.page-warrant .hero-list ol {
  margin-top: 0.5rem;
  padding-left: 1.2rem;
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  list-style: decimal;
}

body.page-warrant .hero-list ol li {
  font-size: clamp(0.88rem, 1.2vw, 1rem);
  color: rgba(255,255,255,0.7);
  font-weight: 300;
}

@media (max-width: 768px) {
  .nav-center { display: none; }
  .hamburger  { display: flex; }
  .header-buttons { display: none; }
  .main-header { height: 64px; padding: 0 4%; }
  .logo img { width: clamp(100px, 28vw, 140px); }
}

@media (max-width: 480px) {
  .main-header { height: 58px; padding: 0 4%; }
  .logo img { width: 110px; }
  .mobile-slide-menu { max-width: 100%; }
}

@media (max-width: 768px) {
  body.page-start-audit #hero { padding: 100px 6vw 60px; }
}

@media (max-width: 1024px) {
  .footer-grid-inner { grid-template-columns: 1fr; gap: 40px; }
  .footer-bottom-bar { flex-direction: column; align-items: flex-start; gap: 15px; }
}

#warrants-vs {
  width: 100%;
  padding: 60px 6vw;
  position: relative;
  z-index: 1;
}

.wvc-inner {
  display: grid;
  grid-template-columns: 1fr 510px;
  gap: 60px;
  align-items: start;
}

.wvc-title {
  font-family: 'Syne', sans-serif;
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 600;
  color: var(--white);
  margin-bottom: 3rem;
  letter-spacing: -0.02em;
}

.wvc-table {
  width: 100%;
  border-collapse: collapse;
}

.wvc-table thead tr {
  border-bottom: 1px solid rgba(255,255,255,0.15);
}

.wvc-table thead th {
  padding: 0 0 1rem;
  font-family: 'Syne', sans-serif;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  text-align: left;
}

.wvc-table thead th.col-warrant {
  color: var(--purple);
  width: 50%;
}

.wvc-table thead th.col-contract {
  color: rgba(255,255,255,0.3);
  width: 50%;
}

.wvc-table tbody tr {
  border-bottom: 1px solid rgba(255,255,255,0.07);
}

.wvc-table tbody td {
  padding: .6rem 0;
  font-size: clamp(0.88rem, 1.3vw, 1rem);
  line-height: 1.5;
  vertical-align: middle;
}

.wvc-table tbody td.col-warrant {
  color: rgba(255,255,255,0.92);
  font-weight: 400;
  padding-right: 3rem;
}

.wvc-table tbody td.col-contract {
  color: rgba(255,255,255,0.28);
  font-weight: 300;
  text-decoration: line-through;
  text-decoration-color: rgba(255,255,255,0.15);
}

#qualification-gate {
  width: 100%;
  position: relative;
  z-index: 1;
}

#how-it-works {
  width: 100%;
  padding: 60px 6vw;
  position: relative;
  z-index: 1;
}

.section-eyebrow {
  font-family: 'Syne', sans-serif;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: #784ce1;
  margin-bottom: 0.75rem;
}

.section-title {
  font-family: 'Syne', sans-serif;
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 600;
  color: var(--white);
  letter-spacing: 0em;
  margin-bottom: 2.5rem;
}

.section-title span {
  position: relative;
  display: inline-block;
}

.section-title span::after {
  content: '';
  position: absolute;
  bottom: -4px; left: 0;
  width: 100%; height: 2px;
  background: var(--purple);
}

.steps-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  overflow: hidden;
  gap:10px;
}

.step-card {
  padding: 1.6rem 1.5rem;
  border: 1px solid rgba(155, 93, 229, 0.25);
  border-radius: 4px;
  background: rgba(155, 93, 229, 0.04);
}

.step-num {
  font-family: 'Syne', sans-serif;
    font-size: 1.5rem;
    font-weight: 600;
  color: rgba(155, 93, 229, 0.6);
  margin-bottom: 1rem;
  letter-spacing: 0.04em;
}

.step-label {
  font-family: 'Syne', sans-serif;
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--white);
  margin-bottom: 0.55rem;
}

.step-desc {
  font-size: 0.85rem;
  font-weight: 300;
  color: rgba(255,255,255,0.55);
  line-height: 1.55;
}

#who-we-serve {
  width: 100%;
  padding: 60px 6vw;
  position: relative;
  z-index: 1;
}

.wws-inner {
  max-width: 780px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.wws-row {
  display: grid;
  grid-template-columns: 240px 1fr;
  border-radius: 10px;
  overflow: hidden;
}

.wws-label {
  padding: 1.35rem 1.4rem;
  background: rgb(16 10 33);
  border-left: 3px solid var(--purple);
  display: flex;
  align-items: center;
  margin-right: 10px;
}

.wws-label span {
    font-family: 'Syne', sans-serif;
    font-size: 0.9rem;
    font-weight: 500;
    
    text-transform: uppercase;
    color: rgb(120 76 225);
}

.wws-value {
  padding: .6rem 1.3rem;
  background: rgb(16 10 33);
  display: flex;
  align-items: center;
}

.wws-value p {
  font-size: clamp(0.88rem, 1.2vw, 0.95rem);
  font-weight: 400;
  color: rgba(255,255,255,0.88);
  line-height: 1.5;
}

.wws-value p em {
  display: block;
  font-style: italic;
  font-weight: 300;
  color: rgba(255,255,255,0.42);
  margin-top: 0.2rem;
}

.tiers-row {
  display: flex;
  gap: 8px;
 flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
}

.tier-badge {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 0.5rem 1rem;
  border-radius: 3px;
  min-width: 90px;
  text-align: center;
  border-top: 3px solid transparent;
}

.tier-badge.tier-a { background: rgba(255,255,255,0.06); border-top-color: #9b5de5; }

.tier-badge.tier-b { background: rgba(255,255,255,0.06); border-top-color: #7c3aed; }

.tier-badge.tier-c { background: rgba(255,255,255,0.06); border-top-color: #06b6d4; }

.tier-badge.tier-d { background: rgba(255,255,255,0.06); border-top-color: #4b5563; }

.tier-name {
  font-size: 0.62rem;
  font-weight: 500;
  letter-spacing: 0.08em;
  color: rgba(255,255,255,0.45);
  margin-bottom: 0.3rem;
}

.tier-amount {
  font-family: 'Syne', sans-serif;
  font-size: 0.95rem;
  font-weight: 800;
  color: var(--white);
}

@media (max-width: 768px) {
  #how-it-works, #who-we-serve { padding-left: 6vw; padding-right: 6vw; }
  .wws-row { grid-template-columns: 130px 1fr; }
  .wws-label { padding: 1rem; margin-right: 0px; }
}

@media (max-width: 500px) {
  .steps-grid { grid-template-columns: 1fr; }
  .step-card { border-bottom: 1px solid rgba(155,93,229,0.25); }
  .step-card:last-child { border-bottom: none; }
  .wws-row { grid-template-columns: 1fr; }
  .wws-label { border-left: 3px solid #9b5de5; border-bottom: none; }
}

#where-we-operate {
    width: 100%; 
    padding: 0px;
  position: relative;
  z-index: 1;
}

.wwo-inner {
  margin: 0 auto;
  /* background: rgba(18, 12, 35, 0.85);
  border: 1px solid rgba(155, 93, 229, 0.18);
  border-radius: 10px; */
  padding: 60px 6vw;
}

.wwo-header {
  text-align: center;
  margin-bottom: 50px;
}

.wwo-eyebrow {
  font-family: 'Syne', sans-serif;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: #e63888;
  margin-bottom: 1rem;
}

.wwo-title {
  font-family: 'Syne', sans-serif;
  font-size: clamp(2rem, 4vw, 2.5rem);
  font-weight: 600;
  letter-spacing: 0em;
  color: var(--white);
  line-height: 1.05;
  margin-bottom: 1.4rem;
}

.wwo-desc {
  font-size: clamp(0.9rem, 1.3vw, 1rem);
  font-weight: 300;
  color: rgba(255,255,255,0.55);
  line-height: 1.65;
  max-width: 560px;
  margin: 0 auto;
}

.wwo-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
}

.wwo-card {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(155, 93, 229, 0.18);
  border-radius: 8px;
  padding: 2rem 2rem 1.8rem;
}

.wwo-card-title {
  font-family: 'Syne', sans-serif;
  font-size: clamp(1.1rem, 1.8vw, 1.35rem);
  font-weight: 700;
  color: var(--white);
  margin-bottom: 1.4rem;
}

.wwo-item {
  display: flex;
  gap: 0;
  margin-bottom: 1rem;
}

.wwo-item2 .wwo-item-label{
color: #ef7418;
}

.wwo-item2 .wwo-item-bar{
background: #ef7418;
}

.wwo-item:last-child { margin-bottom: 0; }

.wwo-item-bar {
  width: 3px;
  min-height: 100%;
  background: var(--purple);
  border-radius: 2px;
  flex-shrink: 0;
  margin-right: 14px;
}

.wwo-item-content {}

.wwo-item-label {
  font-family: 'Syne', sans-serif;
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--purple);
  margin-bottom: 0.3rem;
}

.wwo-item-label span {

}

.wwo-item-text {
  font-size: clamp(0.82rem, 1.1vw, 0.9rem);
  font-weight: 300;
  color: rgba(255,255,255,0.75);
  line-height: 1.5;
}

@media (max-width: 768px) {
  .wwo-inner { padding: 40px 24px 36px; }
  .wwo-grid  { grid-template-columns: 1fr; }
}

#solutions {
  width: 100%;
  padding: 60px 6vw;
  position: relative;
  z-index: 1;
}

.solutions-eyebrow {
  font-family: 'Syne', sans-serif;
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: rgba(255,255,255,0.35);
  margin-bottom: 2rem;
}

.solutions-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.solution-card {
  background: rgba(18, 12, 38, 0.7);
  border: 1px solid rgba(155, 93, 229, 0.15);
  border-radius: 8px;
  padding: 1.8rem 1.8rem 2rem;
}

.solution-num {
  font-family: 'Syne', sans-serif;
  font-size: 0.78rem;
  font-weight: 600;
  color: rgba(255,255,255,0.25);
  margin-bottom: 0.9rem;
  letter-spacing: 0.04em;
}

.solution-title {
  font-family: 'Syne', sans-serif;
  font-size: clamp(1rem, 1.6vw, 1.2rem);
  font-weight: 700;
  color: var(--white);
  margin-bottom: 0.7rem;
  line-height: 1.25;
}

.solution-desc {
  font-size: clamp(0.8rem, 1.1vw, 0.88rem);
  font-weight: 300;
  color: rgba(255,255,255,0.45);
  line-height: 1.6;
}

@media (max-width: 900px) {
  .solutions-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 580px) {
  .solutions-grid { grid-template-columns: 1fr; }
  #solutions { padding: 60px 6vw; }
}

#qualification-gate {
  width: 100%;
  position: relative;
  z-index: 1;
}

.qgate-title {
  font-family: 'Syne', sans-serif;
  font-size: clamp(2rem, 4.5vw, 2.5rem);
  font-weight: 600;
  letter-spacing: 0em;
  line-height: 1.15;
  margin-bottom: 1.2rem;
}

.qgate-title .line-white {
  color: var(--white);
  display: block;
}

.qgate-title .line-purple {
  

  background-image: linear-gradient(to right, #9b5de5  0%, #f0554a 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
  display: inline-block;
}

.qgate-subtitle {
  max-width: 620px;
  font-size: clamp(0.85rem, 1.3vw, 0.95rem);
  font-weight: 300;
  line-height: 1.65;
  color: rgba(255,255,255,0.5);
}

@media (max-width: 768px) {
  #qualification-gate { padding: 0px vw 0px vw; }
}

/* ================================================
   Start Audit Page
   ================================================ */


/* Hero */
body.page-start-audit #hero{width:100vw;min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding:120px 9vw 60px;position:relative;z-index:1}
.hero-eyebrow{font-family:'Syne',sans-serif;font-size:0.72rem;letter-spacing:0.22em;text-transform:uppercase;color:#e64565;margin-bottom:0.4rem;font-weight:500}
.hero-headline{font-family:'Syne',sans-serif;font-size:clamp(2rem,5.5vw,3rem);font-weight:600;line-height:1.12;letter-spacing:0em;color:#ffffff;margin-bottom:2rem}
.hero-headline .hl-purple{background-image:linear-gradient(to right,#c084fc 0%,#e64565 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;display:inline-block}
.hero-subhead-block{margin-bottom:2rem;max-width:640px}
.hero-subhead{font-family:'Syne',sans-serif;font-size:clamp(1.3rem,2.8vw,1.9rem);font-weight:700;line-height:1.25;color:#ffffff;margin-bottom:0}
.hero-subhead .hl-dim{color:rgba(255,255,255,0.35)}
body.page-start-audit .hero-body{max-width:800px;font-family:'DM Sans',sans-serif;font-size:clamp(0.88rem,1.3vw,1rem);font-weight:300;line-height:1.65;color:rgba(255,255,255,0.52)}

/* Process */
#process{width:100%;padding:50px 9vw 100px;position:relative;z-index:1}
.process-eyebrow{font-family:'Syne',sans-serif;font-size:0.72rem;letter-spacing:0.2em;text-transform:uppercase;color:rgba(255,255,255,0.35);margin-bottom:.4rem;font-weight:500}
.process-title{font-family:'Syne',sans-serif;font-size:clamp(2rem,4vw,3rem);font-weight:600;color:#ffffff;letter-spacing:0em;margin-bottom:2rem}
.process-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:20px}
.process-card{background:rgba(255,255,255,0.025);border:1px solid rgba(255,255,255,0.07);border-radius:8px;padding:32px 28px;transition:border-color 0.3s ease}
.process-card:hover{border-color:rgba(192,132,252,0.3)}
.process-card-num{font-family:'Syne',sans-serif;font-size:1.6rem;font-weight:600;color:rgba(155,93,229,0.35);margin-bottom:0.4rem;letter-spacing:-0.01em}
.process-card-title{font-family:'Syne',sans-serif;font-size:1.2rem;font-weight:600;color:#ffffff;margin-bottom:0.4rem}
.process-card-body{font-family:'DM Sans',sans-serif;font-size:0.88rem;font-weight:300;line-height:1.6;color:rgba(255,255,255,0.48)}

/* Audit Types */
#audit-types{width: 100%;
    padding: 80px 9vw 80px;
    background: rgba(255, 255, 255, 0.025);
    position: relative;
    z-index: 1;
    border-top: 1px solid rgba(255, 255, 255, 0.07);
    border-bottom: 1px solid rgba(255, 255, 255, 0.07);}
.audit-types-title{font-family:'Syne',sans-serif;font-size:clamp(1.5rem,3vw,3rem);font-weight:600;color:#ffffff;letter-spacing:0em;margin-bottom:2rem}
.audit-row{display:grid;grid-template-columns:2fr 1fr;gap:12px 15px;padding:20px;margin-bottom:10px;position:relative;background-color:#0e0819}
.audit-row::before{content:'';position:absolute;left:0;top:0;width:4px;height:100%;background:var(--row-accent,#9b5de5);border-radius:5px;margin-left:-5px}
.audit-row:last-child{border-bottom:1px solid rgba(255,255,255,0.07)}
.audit-question{font-family:'Syne',sans-serif;font-size:0.62rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--row-accent,#9b5de5);margin-bottom:0.6rem;font-weight:600}
.audit-name{font-family:'Syne',sans-serif;font-size:clamp(1.3rem,2.2vw,1.8rem);font-weight:500;color:#ffffff;letter-spacing:-0.02em;margin-bottom:0.9rem}
.audit-desc{font-family:'DM Sans',sans-serif;font-size:clamp(0.82rem,1.1vw,0.92rem);font-weight:300;line-height:1.65;color:rgba(255,255,255,0.45)}
.audit-deliverables-label{font-family:'Syne',sans-serif;font-size:0.62rem;letter-spacing:0.2em;text-transform:uppercase;color:rgba(255,255,255,0.3);margin-bottom:0.9rem;font-weight:600}
.audit-deliverables-list{list-style:none;display:flex;flex-direction:column;gap:0.45rem}
.audit-deliverables-list li{font-family:'DM Sans',sans-serif;font-size:clamp(0.8rem,1vw,0.88rem);font-weight:300;color:rgba(255,255,255,0.6);display:flex;align-items:flex-start;gap:8px}
.audit-deliverables-list li::before{content:'•';color:var(--row-accent,#9b5de5);flex-shrink:0;margin-top:0.05em}

/* Closing CTA */
#closing-cta{width:100%;padding:100px 9vw 100px;position:relative;z-index:1}
.closing-title{font-family:'Syne',sans-serif;font-size:clamp(1.6rem,3.2vw,2.4rem);font-weight:800;color:#ffffff;letter-spacing:-0.02em;margin-bottom:1.8rem}
.closing-body{font-family:'DM Sans',sans-serif;font-size:clamp(0.85rem,1.2vw,0.95rem);font-weight:300;line-height:1.7;color:rgba(255,255,255,0.5);margin-bottom:1.2rem}
.closing-body+.closing-body{margin-bottom:1.6rem}
.closing-statement{font-family:'DM Sans',sans-serif;font-size:clamp(0.88rem,1.2vw,0.98rem);font-weight:700;line-height:1.6;color:#ffffff;max-width:520px;margin-bottom:5rem}
.closing-book-label{font-family:'Syne',sans-serif;font-size:clamp(1.6rem,3.2vw,2.5rem);font-weight:600;color:rgba(255,255,255,0.6);letter-spacing:-0.02em;margin-bottom:2rem;line-height:1.2}
.closing-book-label strong{color:#ffffff;font-weight:600}
.btn-diagnostic{display:inline-flex;align-items:center;gap:10px;padding:14px 28px;border:1px solid rgba(255,255,255,0.25);border-radius:4px;background:transparent;color:#ffffff;font-family:'DM Sans',sans-serif;font-size:0.9rem;font-weight:400;letter-spacing:0.01em;text-decoration:none;cursor:pointer;transition:all 0.3s ease}
.btn-diagnostic:hover{border-color:rgba(255,255,255,0.6);background:rgba(255,255,255,0.04)}
.btn-diagnostic svg{transition:transform 0.3s ease}
.btn-diagnostic:hover svg{transform:translateX(4px)}

/* Footer — page-specific additions not in style.css */
.footer-actions-column{display:flex;flex-direction:column;gap:16px}

/* Responsive */
@media(max-width:768px){
  body.page-start-audit #hero{padding:100px 6vw 60px}
  .hero-headline{font-size:clamp(2rem,7vw,2.8rem)}
  #process{padding:70px 6vw 70px}
  .process-grid{grid-template-columns:1fr}
  #audit-types{padding:60px 6vw 60px}
  .audit-row{grid-template-columns:1fr;gap:24px}
  .audit-row::before{margin-left:-5px}
  #closing-cta{padding:70px 6vw 70px}
  .closing-book-label{font-size:clamp(1.3rem,5vw,1.8rem)}
}
/* ================================================
   Before Judging Us Page
   ================================================ */

/* Hero */
#hero-bju{width:100%;background:#000;position:relative;z-index:1;padding-top:80px}
.dlg-wrap{width:100%;max-width:1140px;margin:0 auto;padding:0 1%;height:685px}
.dlg-canvas{position:relative;width:100%;padding-bottom:85%;background:#000;overflow:hidden}
.dlg-face{position:absolute;height:auto;mix-blend-mode:screen;z-index:2;height:180px}
.dlg-face1{width:184px;height:227px}
.dlg-face2{width:182px;height:227px}
.dlg-face3{width:288px;height:328px}
.dlg-face4{width:288px;height:376px}
.dlg-face5{width:288px;height:340px}
.dlg-face6{width:288px;height:257px}
#df1{top:1.2%;left:35%}
#df2{top:12.4%;left:45%}
#df3{top:19.5%;left:33%}
#df4{top:30.3%;left:45%}
#df5{top:37%;left:36%}
#df6{top:49%;left:41%}
.dlg-item{position:absolute;width:26%;display:flex;flex-direction:column;gap:12px;z-index:3;opacity:0;transition:opacity 0.6s ease,transform 0.6s ease}
.dlg-item.visible{opacity:1 !important;transform:translate(0,0) !important}
.di-r1{top:2%;left:8.5%;transform:translateX(-30px);align-items:flex-end;text-align:right}
.di-r2{top:5.4%;right:15.5%;text-align:left;transform:translateX(30px)}
.di-r3{top:22%;left:6%;transform:translateX(-30px);align-items:flex-end;text-align:right}
.di-r4{top:30%;right:13%;align-items:flex-start;transform:translateX(30px);text-align:left}
.di-r5{top:44%;left:7%;align-items:flex-end;transform:translateX(-30px);text-align:right}
.di-r6{top:52%;right:11%;align-items:flex-start;transform:translateX(30px);text-align:left}
.dlg-bubble{position:relative;border-radius:20px;padding:clamp(10px,1.1vw,15px) clamp(13px,1.4vw,15px);font-family:'Syne',sans-serif;font-weight:700;font-size:clamp(0.8rem,1.25vw,0.95rem);line-height:1.25;display:inline-block;max-width:fit-content;border:3px solid #f4d020;box-shadow:0 0 16px rgba(244,208,32,0.22),0 4px 22px rgba(0,0,0,0.58);margin-bottom:6px}
.dlg-bubble::before{content:'';position:absolute;bottom:-11px;width:18px;height:18px;border-right:3px solid #f4d020;border-bottom:3px solid #f4d020;transform:rotate(45deg);z-index:3}
.dlg-bubble::after{content:'';position:absolute;bottom:-2px;width:24px;height:8px;z-index:4}
.bbl-R::before{right:26px}
.bbl-R::after{right:23px}
.bbl-L::before{left:26px}
.bbl-L::after{left:23px}
.bbl-orange{background:#fa8500;color:#fff}
.bbl-orange::before,.bbl-orange::after{background:#fa8500}
.bbl-cyan{background:#00ccee;color:#fff;left:-25%}
.bbl-cyan::before,.bbl-cyan::after{background:#00ccee}
.bbl-magenta{background:#e800ee;color:#fff;left:21px}
.bbl-magenta::before,.bbl-magenta::after{background:#e800ee}
.bbl-red{background:#e63030;color:#fff;left:-32px}
.bbl-red::before,.bbl-red::after{background:#e63030}
.bbl-yellow{background:#2658fe;color:#fff;left:25px}
.bbl-yellow::before,.bbl-yellow::after{background:#2658fe}
.bbl-green{background:#ff914d;color:#fff;left:-20px}
.bbl-green::before,.bbl-green::after{background:#ff914d}
.dlg-resp{font-family:'DM Sans',sans-serif;font-size:clamp(0.65rem,0.95vw,0.82rem);color:rgba(255,255,255,0.82);line-height:1.3;font-weight:300}

/* Judging Section */
.judging-section{background-color:#0e0819;padding:0px 4% 100px;font-family:'DM Sans',sans-serif;position:relative;z-index:2}
.judging-header{text-align:center;margin-bottom:60px}
.scroll-indicator{display:inline-flex;align-items:center;justify-content:center;width:38px;height:58px;border:2.5px solid #ff7300;border-radius:999px;margin-bottom:25px;color:#ff7300;text-decoration:none;position:relative;overflow:hidden;box-shadow:0 0 12px rgba(255,115,0,0.25);transition:box-shadow 0.3s ease}
.scroll-indicator:hover{box-shadow:0 0 22px rgba(255,115,0,0.5)}
.scroll-indicator svg{width:16px;height:16px;animation:scrollBounce 1.8s ease-in-out infinite}
@keyframes scrollBounce{0%{transform:translateY(-6px);opacity:0}30%{opacity:1}70%{opacity:1}100%{transform:translateY(6px);opacity:0}}
.judging-main-title{font-family:'Cooper Black','Recoleta','Bookman Old Style',serif;font-weight:900;font-size:clamp(2.2rem,5.5vw,4.2rem);color:#f1b80d;text-shadow:3px 3px 0px #702619,4px 4px 0px #702619;letter-spacing:-0.01em;line-height:1.2}
.judging-container{max-width:1300px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:5%;position:relative}
.judging-container2{max-width:1300px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr;gap:5%;position:relative}
.judging-col{position:relative}
.column-heading{font-family:'Syne','Impact','Arial Black',sans-serif;font-weight:100;font-size:clamp(2rem,5vw,3.8rem);text-transform:uppercase;letter-spacing:0.03em;line-height:1.1;color:#8247e5;text-shadow:-1px -1px 0 #00f0ff,1px -1px 0 #00f0ff,-1px 1px 0 #00f0ff,1px 1px 0 #00f0ff,2px 2px 0px #00f0ff,3px 3px 0px #ff00b8,4px 4px 0px #ff00b8,5px 5px 0px #ff00b8}
.col-right-title-exact{font-family:"Arial Black",Impact,sans-serif;font-size:3.5rem;font-weight:200;text-transform:uppercase;color:#f500f5;letter-spacing:1px;text-shadow:1px 0px 0px #858500,2px 1px 0px #858500,3px 2px 0px #858500,4px 3px 0px #858500,5px 4px 0px #858500,6px 5px 0px #858500,7px 6px 0px #858500;margin:0}
.fact-block{margin-bottom:15px;line-height:1.3}
.fact-headline{font-size:clamp(0.95rem,1.2vw,1.0rem);font-weight:700;margin-bottom:3px}
.fact-desc{font-size:clamp(0.82rem,1vw,0.85rem);color:rgba(255,255,255,0.85);font-weight:400;line-height:18px}
.txt-purple{color:#c084fc}
.txt-coral{color:#f43f5e}
.txt-blue{color:#38bdf8}
.txt-green{color:#4ade80}
.brain-graphic{position:absolute;left:-120px;top:150px;width:240px;height:auto;opacity:0.85;mix-blend-mode:lighten;pointer-events:none;z-index:1}
.monkey-graphic-exact{position:absolute;right:-80px;top:40px;width:clamp(220px,15vw,350px);height:auto;mix-blend-mode:lighten;pointer-events:none;z-index:2}
.frog-graphic{position:absolute;bottom:10px;left:-100px;width:280px;height:auto;mix-blend-mode:screen;pointer-events:none}
.frog-section{padding-left:170px;position:relative}

/* Purpose & Principles */
.purpose-section{background-color:rgb(11 0 31 / 50%);padding:0px;font-family:'DM Sans',sans-serif;color:#ffffff}
.purpose-container{max-width:1200px;margin:0 auto;display:flex;flex-direction:column;gap:60px}
.purpose-intro{display:flex;flex-direction:column;gap:16px;max-width:1000px}
.purpose-blue-title{font-family:'Syne',sans-serif;color:#38bdf8;letter-spacing:-0.01em;font-size:clamp(0.95rem,1.2vw,1.0rem);font-weight:700}
.purpose-lead{font-size:clamp(1.05rem,1.4vw,1.35rem);font-weight:500;line-height:1.4;color:#ffffff}
.purpose-text{font-size:clamp(0.82rem,1vw,0.85rem);line-height:1.5;color:rgba(255,255,255,0.9);font-weight:400}
.principles-wrapper{display:flex;flex-direction:column;gap:4px;max-width:1100px}
.principle-item{display:flex;flex-direction:column;gap:8px}
.principle-heading{font-size:clamp(1rem,1.2vw,1.0rem);font-weight:700;color:#ffffff;line-height:1.4}
.principle-list{list-style:none;padding-left:20px}
.principle-list li{position:relative;font-size:clamp(0.82rem,1vw,0.85rem);line-height:1.5;color:rgba(255,255,255,0.8);font-weight:400}
.principle-list li::before{content:"•";position:absolute;left:-16px;color:#ffffff;font-size:1.2rem;top:-2px}

/* Skeptical CTA */
.skeptical-section{background-color:transparent;padding:25px 4% 25px 0%;font-family:'DM Sans',sans-serif;display:flex;justify-content:flex-start}
.skeptical-container{display:flex;flex-direction:column;align-items:flex-start;text-align:left}
.skeptical-title{font-family:'Syne',sans-serif;font-size:clamp(1.8rem,3vw,1.8rem);font-weight:700;background:linear-gradient(90deg,#e63030 0%,#ff6a00 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;margin-bottom:12px;letter-spacing:-0.01em}
.skeptical-subtitle{font-size:clamp(1.1rem,1.6vw,1.1rem);color:#ffffff;font-weight:500;margin-bottom:10px;letter-spacing:-0.01em}
.skeptical-link-block{display:inline-flex;align-items:center;gap:20px;text-decoration:none;cursor:pointer}
.skeptical-link-text{display:flex;flex-direction:column;font-size:clamp(1.1rem,1.8vw,1.1rem);font-weight:600;line-height:1.25;color:#c000df}
.skeptical-go-btn{display:inline-flex;align-items:center;background:#db00db;padding:3px 6px 3px 12px; border-radius: 20px; height:clamp(42px,5vw,54px);box-shadow:0 3px 15px rgba(219,0,219,0.3);transition:transform 0.15s ease,box-shadow 0.3s ease,background 0.3s ease}
.skeptical-link-block:hover .skeptical-go-btn,
.skeptical-link-block.is-hovered .skeptical-go-btn{transform:translateX(4px) scale(1.05);box-shadow:0 4px 22px rgba(219,0,219,0.5);background:#f000f0}
.skeptical-link-block:active .skeptical-go-btn,
.skeptical-link-block.is-clicked .skeptical-go-btn{transform:translateX(2px) scale(0.94);box-shadow:0 2px 10px rgba(219,0,219,0.6);background:#af00af}
/* go-text scoped to avoid conflict with global .go-text in style.css */
.skeptical-go-btn .go-text{color:#ffffff;font-family:'Syne',sans-serif;font-size:clamp(1.1rem,1.6vw,1.2rem);font-weight:700;margin-right:12px;letter-spacing:0.02em;padding:0}
.go-arrow-circle{width:clamp(34px,4vw,38px);height:clamp(34px,4vw,38px);background:#ffffff;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.go-arrow-circle svg{width:50%;height:50%}

/* Responsive */
@media(max-width:1440px){.dlg-face{height:185px;width:auto !important}}
@media(max-width:1100px){.brain-graphic{opacity:0.5}.monkey-graphic-exact{opacity:0.5}.frog-graphic{opacity:0.5}.frog-section{padding-left:0px}}
@media(max-width:820px){
  .dlg-canvas{padding-bottom:0;min-height:900px}
  .dlg-bubble{font-size:0.72rem;padding:9px 12px;min-width: 100px;text-align: center;}
  .dlg-resp{font-size:0.62rem}
  .dlg-face{height:140px}
  .dlg-item{width:35%}
  #df1{top:7%;left:36%}
  #df2{left:46%}
  .di-r2{top:14.4%;right:0.5%}
  .di-r1{left:0.5%;top:7%}
  #df3{top:22.5%;left:34%}
  .di-r4{right:0.5%;top:30%}
  #df4{top:27.3%;left:49%}
  #df5{top:37%;left:37%}
  .di-r3,.di-r5{left:0.5%}
  .di-r6{top:48%;right:0.5%}
  #df6{top:43%;left:40%}
  .dlg-bubble{padding:6px 5px}
  .bbl-cyan{left:-17%}
  .judging-container{grid-template-columns:1fr;gap:50px}
  .judging-container2{grid-template-columns:1fr;gap:30px}
  .judging-section{padding-bottom:0px}
  .brain-graphic{display:none}
  .monkey-graphic-exact{display:none}
  .frog-graphic{display:none}
  .col-right-title-exact{font-size:clamp(2rem,8vw,3rem);text-shadow:1px 0px 0px #858500,2px 1px 0px #858500,3px 2px 0px #858500,4px 3px 0px #858500}
  .frog-section{padding-left:0}
  .purpose-container{gap:20px}
}
@media(max-width:500px){
  #df4{top:38.3%;left:42%}
  #df5{top:50.6%;left:40%}
  #df6{top:62%;left:35%}
  #df2{left:46%;top:17.4%}
}
/* ================================================
   100K Challenge Page
   ================================================ */

/* Hero layout */
body.page-100k #hero{width:100vw;min-height:100vh;display:grid;grid-template-columns:1.1fr 1.1fr;gap:5vw;padding:140px 6vw 60px;position:relative;z-index:1}

/* Left column */
.hero-left{display:flex;flex-direction:column;justify-content:flex-start}
.challenge-badge-row{display:flex;align-items:center;gap:12px;margin-bottom:0px}
.challenge-title{font-family:'Syne',sans-serif;font-size:clamp(1.8rem,2.5vw,3.1rem);font-weight:700;color:#00ff66;text-shadow:1px 2px 0px #d4af37;letter-spacing:-0.02em}
.challenge-img{width:clamp(55px,9vw,120px);height:auto;object-fit:contain;margin-left:-4px}
.challenge-sub{font-family:'Syne',sans-serif;font-size:clamp(1.5rem,2.3vw,2.2rem);font-weight:600;letter-spacing:-0.01em;margin-bottom:12px;background:linear-gradient(90deg,#a855f7 0%,#ec4899 25%,#f43f5e 50%,#f97316 75%,#eab308 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.challenge-action{display:flex;align-items:center;gap:15px;margin-bottom:40px}
.challenge-action p{font-size:clamp(0.95rem,1.2vw,1.1rem);font-weight:600;color:#ffffff}
.btn-challenge{padding:18px 15px;background:linear-gradient(90deg,#ec4899,#f97316);color:#fff;font-size:0.75rem;font-weight:700;text-decoration:none;border-radius:999px;text-transform:uppercase}
.call-us-title{font-family:'Syne',sans-serif;font-size:clamp(2.2rem,2.8vw,3.5rem);font-weight:600;color:#ffffff;letter-spacing:-0.03em;line-height:1.1;margin-bottom:15px}
.call-us-title .grad-call-us{background:linear-gradient(90deg,#6366f1 0%,#3b82f6 40%,#06b6d4 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;display:inline-block}
.call-us-desc{font-size:0.9rem;line-height:1.6;color:#94a3b8;max-width:460px;margin-bottom:25px}
.call-us-desc span.highlight{color:#f97316}
.btn-how-it-works{align-self:flex-start;padding:10px 24px;border:1px solid rgba(147,51,234,0.4);background:rgba(147,51,234,0.1);color:#ffffff;font-size:0.85rem;border-radius:35px;text-decoration:none;margin-bottom:25px}
.audit-box{background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.06);padding:20px;border-radius:6px;max-width:480px;font-size:0.9rem;line-height:1.6;color:#cbd5e1;margin-top:30px;margin-bottom:30px;position:relative;z-index:1}
.why-do-this h4{font-family:'Syne',sans-serif;font-size:clamp(1.2rem,1.8vw,1.5rem);font-weight:700;letter-spacing:-0.02em;margin-bottom:8px;background:linear-gradient(90deg,#00b4d8 0%,#90e0ef 35%,#b5e2a9 65%,#e9d8a6 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;display:inline-block}
.why-do-this p{font-size:0.9rem;line-height:1.5;color:#cbd5e1;margin-bottom:35px}
.why-do-this p span{color:#ef4444;font-weight:700}
.hero-form{display:flex;gap:15px;max-width:480px;margin-bottom:20px}
.form-group{flex:1}
.form-group label{display:block;font-size:0.65rem;text-transform:uppercase;color:#64748b;margin-bottom:5px;letter-spacing:0.05em}
.form-group input{width:100%;background:transparent;border:1px solid rgba(255,255,255,0.15);padding:10px 12px;color:#fff;font-size:0.85rem;border-radius:4px}
.form-footer-notice-block{display:flex;justify-content:space-between;align-items:flex-start;max-width:480px;gap:20px}
.form-notice-list{list-style:none}
.form-notice-list li{font-size:0.85rem;font-weight:500;color:#ffffff;line-height:1.5;margin-bottom:6px;position:relative;padding-left:15px}
.form-notice-list li::before{content:"•";position:absolute;left:0;color:#ffffff}
.badge-circle-wrap{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;margin-left:15px}
.conditions-badge{width:clamp(55px,5vw,75px);height:auto;display:block;object-fit:contain}
.badge-circle-wrap span{font-size:0.52rem;font-weight:800;color:#ffffff;text-transform:uppercase;line-height:1.1}

/* Right column */
.hero-right{display:flex;flex-direction:column}
.tab-headers{display:flex;justify-content:space-between;gap:20px;margin-bottom:25px}
.tab-left{text-align:center;font-family:'Syne',sans-serif;margin-bottom:25px}
.tab-left h3{font-size:clamp(1.1rem,1.8vw,1.0rem);font-weight:700;letter-spacing:-0.01em;margin-bottom:4px;background:linear-gradient(90deg,#ff03c4 0%,#fae60a 40%,#7616f1 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-transform:uppercase}
.tab-left .but-accent{font-size:clamp(0.9rem,1.3vw,1.1rem);font-weight:700;color:#eab308;letter-spacing:0.05em;margin:2px 0}
.tab-left p{font-family:'Syne',sans-serif;font-size:clamp(1rem,1.5vw,1.2rem);font-weight:500;letter-spacing:-0.01em;line-height:1.3;text-align:center;background:linear-gradient(90deg,#ff3399 0%,#f19726 80%,#ff3399 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.tab-left p span{color:#f4a135}
.tab-right{background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.08);padding:8px 16px;text-align:center;width:255px}
.tab-right h3{font-size:1.2rem;color:#ffffff}
.tab-right p{font-size:1.2rem;margin-top:15px;background:linear-gradient(90deg,#ff03c4 0%,#fae60a 40%,#7616f1 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-transform:uppercase}
.agency-card{background:#0e0819;border-radius:8px;padding:15px;margin-bottom:20px}
.agency-card.purple-border{border-left:4px solid #a855f7}
.agency-card.orange-border{border-left:4px solid #f97316}
.agency-card.pink-border{border-left:4px solid #ec4899}
.card-label{font-size:0.65rem;text-transform:uppercase;color:#ec4899;margin-bottom:6px;font-weight:700}
.agency-card.orange-border .card-label{color:#f97316}
.agency-card.pink-border .card-label{color:#d946ef}

/* card-title, compare-action-row, skeptical-container, skeptical-title conflict — scoped */
body.page-100k .card-title{font-size:1.15rem;font-weight:700;color:#ffffff;margin-bottom:12px}
.card-desc{font-size:0.88rem;line-height:1.55;color:#94a3b8}
body.page-100k .skeptical-container{margin-top:15px;padding-left:10px;display:block;text-align:left;align-items:unset}
body.page-100k .skeptical-title{font-family:'Syne',sans-serif;font-size:clamp(1.4rem,2.5vw,1.5rem);font-weight:700;letter-spacing:-0.02em;margin-bottom:6px;background:linear-gradient(90deg,#fd302d 0%,#ff8702 30%,#fd3629 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;display:inline-block}
.skeptical-text{font-size:clamp(1rem,1.4vw,1.3rem);font-weight:500;color:#ffffff;margin-bottom:5px}
body.page-100k .compare-action-row{display:flex;align-items:center;gap:25px}
.compare-label-text{font-family:'Syne',sans-serif;font-size:clamp(1.1rem,1.8vw,1.1rem);font-weight:600;line-height:1.1;letter-spacing:-0.01em;background:linear-gradient(90deg,#5f05ff 0%,#b602ec 50%,#ee45f2 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;display:inline-block}
.btn-go-purple{display:inline-flex;align-items:center;justify-content:center;background:#db00ff;color:#ffffff;padding:5px 20px;border-radius:999px;text-decoration:none;font-family:'Syne',sans-serif;font-weight:600;font-size:1.1rem;gap:8px;box-shadow:0 0 15px rgba(219,0,255,0.4)}
.btn-go-purple::after{content:"»";font-size:1.3rem}

/* Responsive */
@media(max-width:968px){body.page-100k #hero{grid-template-columns:1fr;padding-top:110px;gap:60px}}

/* ================================================
   The Agent Page
   ================================================ */

.main-agent-section{position:relative;width:100%;min-height:100vh;display:flex;flex-direction:column;align-items:center;overflow:hidden; background-color: #090312;}
.bg-video{position:absolute;inset:0;width:100%;object-fit:cover;z-index:0}
.main-agent-section::after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(0,0,0,0.10) 0%,rgba(0,0,0,0.72) 100%);z-index:1;pointer-events:none}

.agent-label{position:relative;z-index:20;margin-top:clamp(120px,8vh,100px);font-size:clamp(0.75rem,2vw,2.5rem);color:#fff;font-weight:700;opacity:0;white-space:nowrap;text-align:center;left:-80px}
.agent-selection-title{position:relative;z-index:20;margin-top:clamp(195px,14vh,180px);font-size:clamp(1.1rem,2.8vw,1.5rem);font-weight:600;opacity:0;white-space:nowrap;text-align:center;letter-spacing:-2px;margin-bottom:0;background:linear-gradient(90deg,#a855f7 0%,#ec4899 25%,#f43f5e 50%,#f97316 75%,#eab308 100%);background-size:200% auto;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:agentGradientShift 4s linear infinite;left:-70px}
@keyframes agentGradientShift{0%{background-position:0% center}100%{background-position:200% center}}

.scatter-canvas{position:relative;z-index:10;width:100%;max-width:100%;margin-top:10px;flex-shrink:0}

.agent-text-block{position:absolute;font-size:clamp(0.7rem,0.8vw,0.84rem);font-weight:500;line-height:1.4;cursor:pointer;user-select:none;letter-spacing:0px;opacity:0;transform:scale(0);transform-origin:center center;will-change:transform,opacity;transition:filter 0.25s}
.agent-text-block.w{background:linear-gradient(90deg,#a855f7 0%,#ec4899 25%,#f43f5e 50%,#eab308 75%,#6205fe 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.agent-text-block.m{background:linear-gradient(90deg,#c026d3 0%,#ec4899 40%,#f97316 80%,#eab308 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.agent-text-block:hover{background:none !important;-webkit-background-clip:unset !important;background-clip:unset !important;-webkit-text-fill-color:#ffd023 !important;filter:drop-shadow(0 0 10px rgba(255,208,35,0.7));transform:translateX(-50%) scale(1.05) !important}

.chat-bar-wrapper{position:relative;z-index:30;width:min(800px,95vw);margin:0px auto 36px;opacity:0;flex-shrink:0;background:#7a007a;border-radius:60px;padding:15px 20px;display:flex;flex-direction:column;gap:6px;box-shadow:0 10px 30px rgba(0,0,0,0.4)}
.chat-bar{display:flex;align-items:center;gap:15px;width:100%}
.chat-bar input{flex:1;background:#0f0014;border:none;outline:none;color:#e8c8ff;font-family:"Google Sans Code",monospace;font-size:0.85rem;padding:14px 22px;border-radius:30px}
.chat-bar input::placeholder{color:#a385b0;opacity:0.85}
.chat-send-btn{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,#22d3ee 0%,#06b6d4 40%,#0e7490 100%);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;color:#fff;font-size:1.1rem;flex-shrink:0;box-shadow:0 0 18px rgba(6,182,212,0.55),0 0 6px rgba(6,182,212,0.3);transition:transform 0.2s,box-shadow 0.2s}
.chat-send-btn:hover{transform:scale(1.1);box-shadow:0 0 28px rgba(6,182,212,0.8),0 0 10px rgba(6,182,212,0.5)}
.chat-pills{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-start;padding-left:5px}
.pill{background:#5a005e;border:1px solid #c026d3;border-radius:20px;padding:6px 14px;font-size:0.65rem;color:#ffebff;font-family:"Google Sans Code",monospace;font-weight:600;cursor:pointer;white-space:nowrap;letter-spacing:0.5px;transition:background 0.2s,color 0.2s}
.pill:hover{background:#8a008f;color:#fff}

.need-help-container{position:relative;z-index:30;width:min(800px,95vw);margin:-20px auto 40px;display:flex;padding-left:30px;opacity:0;animation:fadeInHelp 0.5s ease 1.5s forwards}
.need-help-link{display:flex;align-items:center;gap:6px;color:#fff;font-family:"Google Sans Code",monospace;font-size:0.9rem;font-weight:600;text-decoration:underline;cursor:pointer}
.need-help-icon{display:flex;align-items:center;justify-content:center;width:18px;height:18px;border:2px solid #fff;border-radius:50%;font-size:0.75rem;font-weight:bold;text-decoration:none}
@keyframes fadeInHelp{to{opacity:1}}

@media(max-width:1024px){
  .scatter-canvas{display:none}
  .mobile-list{display:flex !important}
  .agent-selection-title{left:0px;margin-top:clamp(35px,6vh,35px)}
  .agent-label{left:-15px;margin-top:clamp(80px,8vh,100px); font-size: clamp(1.5rem, 2vw, 2.5rem);}
}

.mobile-list{display:none;flex-direction:column;gap:14px;width:92%;z-index:10;position:relative;margin-top:20px;margin-bottom:40px}
.mobile-list .agent-text-block{position:static;max-width:100%;opacity:1;transform:none;text-align:center}
.mobile-list .agent-text-block:hover,
.mobile-list .agent-text-block:active{transform:scale(1.05) !important}

.agent-form-container{position:fixed;inset:0;width:100vw;height:100vh;display:flex;justify-content:center;align-items:flex-start;z-index:100;opacity:0;pointer-events:none;padding:clamp(30px,6vh,60px) clamp(20px,5vw,40px);background:rgba(0,0,0,0.95);overflow-y:auto;-webkit-overflow-scrolling:touch}
.agent-form-inner{position:relative;width:min(940px,92vw);color:#fff;display:flex;flex-direction:column;margin:auto 0}
.form-heading{font-family:'Space Grotesk','Inter',sans-serif;font-size:clamp(1.1rem,2.2vw,1.65rem);font-weight:500;margin-bottom:clamp(25px,5vh,45px);letter-spacing:-0.2px;line-height:1.4;padding-right:45px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;column-gap:40px;row-gap:clamp(20px,4vh,35px)}
/* .form-group scoped in HTML to avoid conflict with style.css */
.submit-wrap{display:flex;align-items:flex-end;justify-content:flex-end}
.form-submit-btn{position:relative;overflow:hidden;background:linear-gradient(135deg, #d946ef 0%, #a21caf 50%, #e11d9e 100%);color:#fff;border:none;padding:16px 48px;border-radius:999px;font-family:'Space Grotesk','Inter',sans-serif;font-size:1rem;font-weight:700;cursor:pointer;letter-spacing:1px;box-shadow:0 0 18px rgba(217,70,239,0.55), 0 0 6px rgba(217,70,239,0.3) inset;transition:all 0.3s ease}
.form-submit-btn::before{content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg, transparent, rgba(255,255,255,0.25), transparent);transition:left 0.5s ease;z-index:1}
.form-submit-btn:hover{background:linear-gradient(135deg, #e879f9 0%, #c026d3 50%, #f43f9e 100%);box-shadow:0 0 28px rgba(217,70,239,0.8), 0 0 10px rgba(217,70,239,0.4) inset;transform:translateY(-2px)}
.form-submit-btn:hover::before{left:100%}
.form-back-btn{background:transparent;border:1px solid #333;color:#888;padding:6px 14px;border-radius:20px;font-family:'DM Sans',sans-serif;font-size:0.68rem;cursor:pointer;margin-bottom:clamp(15px,3vh,25px);transition:all 0.2s;display:inline-flex;align-items:center;gap:5px;align-self:flex-start}
.form-back-btn:hover{border-color:#666;color:#fff}
.form-close-btn{position:absolute;top:-15px;right:-10px;background:transparent;border:none;color:#555;font-size:2.3rem;line-height:1;cursor:pointer;transition:color 0.2s,transform 0.2s;display:flex;align-items:center;justify-content:center;width:44px;height:44px;z-index:110}
.form-close-btn:hover{color:#fff;transform:scale(1.1)}

@media(max-width:1024px){
  .form-grid{grid-template-columns:1fr;row-gap:20px}
  .form-heading{margin-bottom:25px}
  .submit-wrap{justify-content:flex-start;margin-top:5px}
  .form-close-btn{top:-25px;right:-10px}
}

/* ================================================
   Compare Page
   ================================================ */

/* Hero */
body.page-compare #hero{width:100vw;min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding:120px 9vw 80px;position:relative;z-index:1;overflow:hidden}
body.page-compare #hero::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 55% 70% at 30% 55%,rgba(0,200,255,0.07) 0%,transparent 65%),radial-gradient(ellipse 40% 60% at 10% 80%,rgba(155,93,229,0.10) 0%,transparent 60%),radial-gradient(ellipse 30% 50% at 75% 30%,rgba(230,56,136,0.05) 0%,transparent 60%);pointer-events:none}
body.page-compare #hero::after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent,transparent 3px,rgba(0,210,255,0.012) 3px,rgba(0,210,255,0.012) 4px);pointer-events:none}
.hero-content{position:relative;z-index:2;max-width:660px}
body.page-compare .hero-title{font-family:'Syne',sans-serif;font-size:clamp(2.4rem,6vw,4rem);font-weight:700;line-height:1.1;letter-spacing:-0.04em;margin-bottom:1.6rem;background:linear-gradient(90deg,#00d4ff 0%,#00b8e6 40%,#a78bfa 75%,#e879f9 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;filter:drop-shadow(0 0 30px rgba(0,210,255,0.25))}
body.page-compare .hero-subtitle{font-family:'DM Sans',sans-serif;font-size:clamp(0.9rem,1.4vw,1rem);font-weight:300;line-height:1.65;color:rgba(255,255,255,0.6);max-width:480px;margin-bottom:1rem;opacity:1;transform:none}
.hero-sub2{font-family:'DM Sans',sans-serif;font-size:clamp(0.88rem,1.3vw,0.98rem);font-weight:300;color:rgba(255,255,255,0.5);margin-bottom:2.8rem;padding-left:1.2rem;border-left:2px solid rgba(0,210,255,0.35)}
.hero-cta-row{display:flex;flex-wrap:wrap;gap:20px;align-items:center}
.cta-btn{position:relative;display:inline-flex;align-items:center;gap:8px;padding:14px 28px;font-family:'Syne',sans-serif;font-size:clamp(0.85rem,1.4vw,1rem);font-weight:700;letter-spacing:0.04em;text-decoration:none;cursor:pointer;border:none;background:transparent;transition:all 0.3s ease}
.cta-btn--cyan{color:#00e5ff;border:2px solid #00e5ff;box-shadow:0 0 12px rgba(0,229,255,0.5),inset 0 0 12px rgba(0,229,255,0.06)}
.cta-btn--cyan:hover{background:rgba(0,229,255,0.08);box-shadow:0 0 28px rgba(0,229,255,0.85),inset 0 0 20px rgba(0,229,255,0.12);transform:translateY(-2px)}
.cta-btn--gold{color:#f4a135;border:2px solid #f4a135;box-shadow:0 0 12px rgba(244,161,53,0.5),inset 0 0 12px rgba(244,161,53,0.06)}
.cta-btn--gold:hover{background:rgba(244,161,53,0.08);box-shadow:0 0 28px rgba(244,161,53,0.85),inset 0 0 20px rgba(244,161,53,0.12);transform:translateY(-2px)}
.cta-btn--purple{color:#fff;background:linear-gradient(135deg,#7c3aed,#c026d3);border:2px solid transparent;border-radius:999px;box-shadow:0 0 18px rgba(192,38,211,0.55),0 0 40px rgba(124,58,237,0.3)}
.cta-btn--purple:hover{background:linear-gradient(135deg,#8b5cf6,#d946ef);box-shadow:0 0 32px rgba(192,38,211,0.85),0 0 60px rgba(124,58,237,0.5);transform:translateY(-2px)}
.cta-btn--purple .btn-plus{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;background:rgba(255,255,255,0.2);border-radius:50%;font-size:1rem;font-weight:900;line-height:1}
.hero-orb{position:absolute;border-radius:50%;pointer-events:none;filter:blur(60px);animation:heroFloat 8s ease-in-out infinite}
.hero-orb-1{width:340px;height:340px;background:radial-gradient(circle,rgba(0,210,255,0.12),transparent 70%);right:12%;top:15%;animation-delay:0s}
.hero-orb-2{width:260px;height:260px;background:radial-gradient(circle,rgba(155,93,229,0.14),transparent 70%);right:30%;bottom:18%;animation-delay:-3s}
.hero-orb-3{width:180px;height:180px;background:radial-gradient(circle,rgba(230,56,136,0.12),transparent 70%);right:8%;bottom:25%;animation-delay:-5.5s}
@keyframes heroFloat{0%,100%{transform:translateY(0px) scale(1)}50%{transform:translateY(-22px) scale(1.04)}}
.hero-grid{display:none}
.hero-curtain{position:absolute;right:0;top:0;bottom:0;width:clamp(340px,48%,620px);pointer-events:none;overflow:hidden;-webkit-mask-image:linear-gradient(to right,transparent 0%,black 28%,black 100%);mask-image:linear-gradient(to right,transparent 0%,black 28%,black 100%)}
.hero-curtain::before{content:'';position:absolute;inset:0;background:linear-gradient(to right,transparent 0%,rgba(0,0,0,0.08) 100%);z-index:1}
.hero-curtain video{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;object-position:center top;display:block}
@media(max-width:768px){body.page-compare #hero{padding:100px 6vw 60px}.hero-orb-1{width:200px;height:200px;right:0}.hero-orb-2{display:none}.hero-curtain{width:240px}}

/* Warrant Experience */
#w-stage{display:none;position:fixed;inset:0;z-index:3000;overflow:hidden}
#w-stage.active{display:flex;align-items:center;justify-content:center}
.w-curtain{position:absolute;top:0;bottom:0;width:50%;background:repeating-linear-gradient(90deg,rgba(0,0,0,0.55) 0px,rgba(80,8,8,0.0) 6px,rgba(120,14,14,0.22) 14px,rgba(0,0,0,0.45) 20px,rgba(100,10,10,0.12) 26px,rgba(0,0,0,0.5) 34px,rgba(90,9,9,0.08) 40px,rgba(0,0,0,0.4) 48px),linear-gradient(to bottom,#3f0302 0%,#320201 10%,#280201 22%,#1e0101 36%,#140101 50%,#0c0000 64%,#070000 76%,#030000 88%,#000000 100%);transition:transform 0.75s cubic-bezier(0.76,0,0.24,1);will-change:transform;z-index:1}
.w-curtain--left{left:0;transform:translateX(-100%);box-shadow:12px 0 60px rgba(0,0,0,0.95),4px 0 20px rgba(0,0,0,0.8),inset -12px 0 40px rgba(0,0,0,0.7),inset -2px 0 8px rgba(0,0,0,0.9)}
.w-curtain--right{right:0;transform:translateX(100%);box-shadow:-12px 0 60px rgba(0,0,0,0.95),-4px 0 20px rgba(0,0,0,0.8),inset 12px 0 40px rgba(0,0,0,0.7),inset 2px 0 8px rgba(0,0,0,0.9)}
.w-curtain--left::after{content:'';position:absolute;top:0;right:0;bottom:0;width:3px;background:linear-gradient(to bottom,transparent 0%,#000 15%,#000 50%,#000 85%,transparent 100%);box-shadow:0 0 18px rgba(212,175,55,0.8)}
.w-curtain--right::after{content:'';position:absolute;top:0;left:0;bottom:0;width:3px;background:linear-gradient(to bottom,transparent 0%,#000 15%,#000 50%,#000 85%,transparent 100%);box-shadow:0 0 18px rgba(212,175,55,0.8)}
#w-stage.pulling .w-curtain--left{transform:translateX(0)}
#w-stage.pulling .w-curtain--right{transform:translateX(0)}
#w-stage.open .w-curtain--left{transform:translateX(-60%)}
#w-stage.open .w-curtain--right{transform:translateX(60%)}
#w-backdrop{position:absolute;inset:0;background:rgba(4,3,10,0.92);backdrop-filter:blur(4px);opacity:0;transition:opacity 0.4s ease}
#w-stage.open #w-backdrop{opacity:1}
#w-content{position:relative;z-index:2;width:min(700px,56vw);max-height:88vh;overflow-y:auto;background:#07060e;border:7px double #f4e1ad;opacity:0;transform:translateY(28px) scale(0.97);transition:opacity 0.45s ease 0.5s,transform 0.45s cubic-bezier(0.22,1,0.36,1) 0.5s;scrollbar-width:thin;scrollbar-color:rgba(212,175,55,0.3) transparent;border-radius:50px}
#w-stage.open #w-content{opacity:1;transform:none}
.wc-close{position:absolute;top:14px;right:14px;z-index:10;width:32px;height:32px;background:rgba(0,0,0,0.6);border:1px solid rgba(212,175,55,0.4);border-radius:50%;color:rgba(255,255,255,0.5);font-size:1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all 0.2s}
.wc-close:hover{color:#ffc700;border-color:#ffc700;box-shadow:0 0 16px rgba(212,175,55,0.4)}
.wc-banner{position:relative;padding:20px 15px 0px 15px}
.wc-h1{font-family:'Syne',sans-serif;font-size:clamp(1.45rem,3vw,1rem);font-weight:600;line-height:1.1;text-transform:uppercase;position:relative;z-index:1}
.wc-h1 .line1{color:#fff;display:block}
.wc-h1 .line2{display:block;background:linear-gradient(90deg,#ffc700 0%,#ffc700 40%,#ff900b 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.wc-stamp{position:absolute;top:10px;right:15px}
@keyframes wStampSpin{to{transform:rotate(360deg)}}
.wc-stamp-inner{text-align:center;animation:wStampCounter 20s linear infinite}
@keyframes wStampCounter{to{transform:rotate(-360deg)}}
.wc-stamp-inner span{font-size:.28rem;letter-spacing:.15em;color:#ffc700;text-transform:uppercase;display:block;line-height:2}
.wc-stamp-inner em{font-size:1rem;color:#ffc700;font-style:normal}
.wc-2col{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid rgba(212,175,55,0.2)}
.wc-cell{padding:8px;border-right:1px solid rgba(212,175,55,0.15);opacity:0;transform:translateY(18px);transition:opacity .45s ease,transform .45s ease}
.wc-cell:last-child{border-right:none}
.wc-cell.visible{opacity:1;transform:none}
.wc-cell-label{font-size:.8rem;margin-top:10px;font-weight:600;letter-spacing:-.01em;margin-bottom:0px;font-family:'Syne',sans-serif;text-align:center;background:linear-gradient(90deg,#fd2f2d 0%,#ff8403 40%,#f37905 75%,#fd302d 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.wc-cell-body{font-size:.76rem;color:#fff;line-height:1.3;font-family:'DM Sans',sans-serif;margin-top:5px}
.wc-question{padding:10px 15px;text-align:center;background:#0a0a0a;border-bottom:1px solid rgba(212,175,55,0.15);opacity:0;transform:translateY(12px);transition:opacity .4s ease,transform .4s ease}
.wc-question.visible{opacity:1;transform:none}
.wc-question .q1{font-size:.85rem;font-weight:700;color:#ffc700;margin-bottom:4px;font-family:'Syne',sans-serif}
.wc-question .q2{font-size:.8rem;font-family:'DM Sans',sans-serif;background:linear-gradient(90deg,#5e05ff 0%,#a302df 40%,#d001e8 75%,#ed00d0 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.wc-compare{display:grid;grid-template-columns:1fr 1fr;border-bottom:1px solid rgba(212,175,55,0.2)}
.wc-compare-col{padding:10px 20px;opacity:0;transition:opacity .5s ease,transform .5s ease}
.wc-compare-col--left{transform:translateX(-20px);background:#111;border-right:1px solid rgba(212,175,55,0.15)}
.wc-compare-col--right{transform:translateX(20px);background:#0a0a0a}
.wc-compare-col.visible{opacity:1;transform:none}
.wc-col-head{display:flex;align-items:flex-start;gap:10px;margin-bottom:10px;padding-bottom:10px;border-bottom:1px solid rgba(255,255,255,0.06)}
.wc-col-title{font-family:'Syne',sans-serif;font-size:.8rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.wc-col-sub{font-size:.6rem;color:#7a81ad;font-family:'DM Sans',sans-serif;margin-top:2px}
.wc-row{margin-bottom:8px}
.wc-row-lbl{font-size:.52rem;letter-spacing:.6em;text-transform:uppercase;margin-bottom:2px}
.wc-row-val{font-size:.75rem;font-family:'DM Sans',sans-serif;line-height:1.3}
.wc-milestone{display:grid;grid-template-columns:1fr 1fr}
.wc-ms{padding:10px 15px;opacity:0;transform:translateY(16px);transition:opacity .45s ease,transform .45s ease;text-align:center}
.wc-ms--left{background:#111;border-right:1px solid rgba(212,175,55,0.15)}
.wc-ms--right{background:#0a0a0a}
.wc-ms.visible{opacity:1;transform:none}
.wc-tag{display:inline-block;font-size:.62rem;letter-spacing:.2em;color:#ef8cd1;border-bottom:2px solid #862c6f;padding:3px 0px;text-transform:uppercase;margin-bottom:12px;font-family:'Syne',sans-serif;text-align:center}
.wc-ms-h{font-family:'Syne',sans-serif;font-size:clamp(1rem,2.2vw,1.6rem);font-weight:600;color:#fff;text-transform:uppercase;line-height:1.3;margin-bottom:10px;text-align:center}
.wc-ms-bold{font-size:.65rem;font-weight:500;color:#fff;margin-bottom:8px;font-family:'DM Sans',sans-serif;text-align:center}
.wc-ms-body{font-size:.75rem;color:rgba(255,255,255,0.7);line-height:1.3;font-family:'DM Sans',sans-serif;margin-bottom:8px;text-align:center}
.wc-how-lbl{font-size:.56rem;letter-spacing:.22em;color:#ede6d8;text-transform:uppercase;margin-bottom:12px;font-family:'Syne',sans-serif;border-bottom:2px solid #987e03;display:inline-block;padding-bottom:4px}
.wc-integrity{display:flex;background:rgba(212,175,55,0.02);flex-direction:column;justify-content:center}
.wc-integrity-icon{font-size:1.4rem;color:#ffc700;flex-shrink:0;line-height:1}
.wc-integrity-text{font-size:.74rem;color:#fff;line-height:1.6;font-family:'DM Sans',sans-serif;text-align:center}
.wc-integrity-text strong{font-weight:400}
.wc-cta{padding:20px 28px;text-align:center;background:#0a0a0a;border-top:1px solid rgba(212,175,55,0.2);opacity:0;transform:translateY(10px);transition:opacity .4s ease,transform .4s ease}
.wc-cta.visible{opacity:1;transform:none}
.wc-cta a{display:inline-block;padding:13px 36px;background:#ffc700;color:#000;font-family:'Syne',sans-serif;font-weight:800;font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;border-radius:2px;box-shadow:0 0 32px rgba(212,175,55,0.35);transition:all .22s ease}
.wc-cta a:hover{background:#f5d98a;box-shadow:0 0 50px rgba(212,175,55,0.6);transform:translateY(-2px)}
@media(max-width:640px){#w-content{width:90vw}.wc-2col,.wc-compare,.wc-milestone{grid-template-columns:1fr}.w-curtain{width:12%}}

/* Challenge Experience */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;700;800&display=swap');
#c-stage{display:none;position:fixed;inset:0;z-index:3000;overflow:visible}
#c-stage.active{display:flex;align-items:center;justify-content:center;overflow:visible}
.c-curtain{position:fixed;top:0;bottom:0;width:50%;background:repeating-linear-gradient(90deg,rgba(0,0,0,0.45) 0px,rgba(80,8,8,0.0) 6px,rgba(120,14,14,0.25) 14px,rgba(0,0,0,0.35) 20px,rgba(100,10,10,0.15) 26px,rgba(0,0,0,0.4) 34px,rgba(90,9,9,0.1) 40px,rgba(0,0,0,0.3) 48px),linear-gradient(to bottom,#3f0302 0%,#320201 10%,#280201 22%,#1e0101 36%,#140101 50%,#0c0000 64%,#070000 76%,#030000 88%,#000000 100%);transition:transform 0.75s cubic-bezier(0.76,0,0.24,1);will-change:transform;z-index:1}
.c-curtain--left{left:0;transform:translateX(-100%);box-shadow:8px 0 50px rgba(0,0,0,0.9),inset -6px 0 30px rgba(0,0,0,0.5)}
.c-curtain--right{right:0;transform:translateX(100%);box-shadow:-8px 0 50px rgba(0,0,0,0.9),inset 6px 0 30px rgba(0,0,0,0.5)}
.c-curtain--left::after{content:'';position:absolute;top:0;right:0;bottom:0;width:3px;background:linear-gradient(to bottom,transparent 0%,#000 15%,#000 50%,#000 85%,transparent 100%);box-shadow:0 0 18px rgba(0,0,0,0.8)}
.c-curtain--right::after{content:'';position:absolute;top:0;left:0;bottom:0;width:3px;background:linear-gradient(to bottom,transparent 0%,#000 15%,#000 50%,#000 85%,transparent 100%);box-shadow:0 0 18px rgba(0,0,0,0.8)}
#c-stage.pulling .c-curtain--left{transform:translateX(0)}
#c-stage.pulling .c-curtain--right{transform:translateX(0)}
#c-stage.open .c-curtain--left{transform:translateX(-60%)}
#c-stage.open .c-curtain--right{transform:translateX(60%)}
#c-backdrop{position:fixed;inset:0;background:rgba(4,3,10,0.92);backdrop-filter:blur(4px);opacity:0;transition:opacity 0.4s ease;z-index:0}
#c-stage.open #c-backdrop{opacity:1}
/* max-height + overflow-y here is what makes tall content scrollable
   instead of being cut off below the fold (see #c-content history) — but
   overflow other-than-visible always clips at this box's own edge, even
   when nothing is currently scrolled, which was chopping off the ring
   glow (.cc-gold-ring/.cc-pink-ring box-shadows bleed up to ~80px). The
   padding below just gives that glow room to fade out inside the box
   before hitting the clip line, instead of being cut mid-glow. */
#c-content{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;width:min(820px,calc(94vw - 40px));max-height:90vh;padding:60px 60px 30px;box-sizing:border-box;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none;opacity:0;transform:translateY(28px) scale(0.97);transition:opacity 0.45s ease 0.5s,transform 0.45s cubic-bezier(0.22,1,0.36,1) 0.5s;background:transparent;border:none;box-shadow:none}
/* Scroll still works (content stays reachable if it's ever taller than
   the viewport) — just hiding the track/thumb so it doesn't compete
   visually with the neon ring for attention when it's not needed. */
#c-content::-webkit-scrollbar{width:0;height:0;display:none}
.cc-card-wrapper{position:relative;width:100%;margin-bottom:28px}
#c-stage.open #c-content{opacity:1;transform:none}
.cc-shadow-layer{position:absolute;top:22px;left:40px;right:-30px;bottom:-20px;border-radius:64px;z-index:0;pointer-events:none}
.cc-gold-ring{position:relative;z-index:1;border-radius:64px;padding:4px;border:3px solid rgba(240,175,40,1);box-shadow:0 0 12px rgba(240,175,40,0.6),0 0 28px rgba(240,175,40,0.35),0 0 55px rgba(240,175,40,0.15),inset 0 0 10px rgba(240,175,40,0.15)}
.cc-pink-ring{position:relative;border-radius:58px;padding:6px;border:7px solid #ff1493;box-shadow:0 0 22px #ff1493,0 0 50px rgba(255,20,147,0.5),0 0 80px rgba(255,20,147,0.2),inset 0 0 16px rgba(255,20,147,0.45)}
.cc-pink-ring::before{content:'';position:absolute;inset:0;border-radius:50px;border:1.5px solid rgba(255,228,160,0.65);box-shadow:0 0 8px rgba(255,228,160,0.4);pointer-events:none;z-index:5}
.cc-pink-ring::after{content:'';position:absolute;top:16px;right:-1px;width:4px;height:calc(100% - 32px);background:linear-gradient(to bottom,transparent 0%,rgba(255,160,220,0.6) 15%,#ff1493 45%,#ff69b4 55%,rgba(255,160,220,0.6) 85%,transparent 100%);box-shadow:0 0 10px #ff1493,0 0 20px rgba(255,20,147,0.7);border-radius:3px;z-index:6;pointer-events:none}
.cc-card-core{position:relative;border-radius:46px;overflow:hidden;background:linear-gradient(to right,#881827 0%,#881827 40%,#81043f 70%,#710562 100%);padding:clamp(28px,4vh,44px) clamp(28px,4vw,52px);color:#fff;font-family:'Inter','DM Sans',sans-serif}
.cc-card-core::before{content:'';position:absolute;top:0;left:0;width:7px;height:100%;background:linear-gradient(to bottom,transparent 2%,#9a6023 18%,#9a6023 82%,transparent 98%);box-shadow:3px 0 14px #9a6023;z-index:2}
.cc-close{position:absolute;top:16px;right:16px;z-index:20;width:34px;height:34px;background:rgba(0,0,0,0.5);border:1.5px solid rgba(255,20,147,0.5);border-radius:50%;color:rgba(255,255,255,0.6);font-size:1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all 0.2s}
.cc-close:hover{color:#ff1493;border-color:#ff1493;box-shadow:0 0 16px rgba(255,20,147,0.5)}
.cc-title{font-family:'Inter','Syne',sans-serif;font-size:clamp(1.1rem,2.5vw,2.1rem);font-weight:800;margin-bottom:clamp(16px,2.5vh,28px);padding:0 12px;text-align:center;color:#ffffff;line-height:1.1;white-space:normal;text-shadow:0 0 2px #fff,0 0 5px #ffbb00,0 0 15px rgba(255,170,0,0.75),0 0 10px rgba(255,130,0,0.45)}
.cc-step{margin-bottom:clamp(10px,1.8vh,20px);font-size:clamp(1.1rem,1.3vw,1.1rem);line-height:1.4;text-align:center;opacity:0;transform:translateY(16px);transition:opacity .45s ease,transform .45s ease}
.cc-step.visible{opacity:1;transform:none}
.cc-step:last-child{margin-bottom:0}
.cc-step.intro{margin-bottom:clamp(14px,2.2vh,28px)}
.cc-step-label{font-weight:700;color:#ffffff;display:block;margin-bottom:0}
.cc-step-body{font-weight:500;color:#f0f0f0;display:block}
.cc-closing-block{background:transparent;border-top:none;border-radius:0;text-align:center;opacity:0;transform:translateY(14px);transition:opacity .4s ease,transform .4s ease}
.cc-closing-block.visible{opacity:1;transform:none}
.cc-closing-headline{font-family:'Syne',sans-serif;font-size:clamp(0.95rem,2vw,0.95rem);font-weight:600;color:#ffffff;text-align:center;line-height:1.2;margin-bottom:3px;margin-top:10px;text-shadow:0 0 12px rgba(255,20,147,0.3)}
.cc-closing-sub{font-family:'DM Sans',sans-serif;font-size:clamp(0.7rem,0.9vw,0.8rem);font-weight:300;color:rgba(255,255,255,0.6);text-align:center;line-height:1.3}
@media(max-height:700px){.cc-card-core{padding:45px 10px 25px}.cc-title{margin-bottom:12px}.cc-step{margin-bottom:8px;font-size:1.08rem}.cc-step.intro{margin-bottom:12px}}
@media(max-width:640px){#c-content{width:calc(90vw - 28px);max-height:94vh;padding:0px;margin-bottom:18px}.c-curtain{width:12%}.cc-shadow-layer{top:14px;left:26px;border-radius:44px;right:-30px;bottom:-18px}.cc-gold-ring{border-radius:44px}.cc-pink-ring{border-radius:38px;border-width:5px}.cc-card-core{border-radius:30px;padding:48px 22px 28px}.cc-title{font-size:1.35rem;margin-bottom:14px}.cc-step{font-size:0.88rem;margin-bottom:10px}}

/* Agency Experience */
#a-stage{display:none;position:fixed;inset:0;z-index:3000;overflow:hidden}
#a-stage.active{display:flex;align-items:center;justify-content:center}
.a-curtain{position:absolute;top:0;bottom:0;width:50%;background:repeating-linear-gradient(90deg,rgba(0,0,0,0.45) 0px,rgba(80,8,8,0.0) 6px,rgba(120,14,14,0.25) 14px,rgba(0,0,0,0.35) 20px,rgba(100,10,10,0.15) 26px,rgba(0,0,0,0.4) 34px,rgba(90,9,9,0.1) 40px,rgba(0,0,0,0.3) 48px),linear-gradient(to bottom,#3f0302 0%,#320201 10%,#280201 22%,#1e0101 36%,#140101 50%,#0c0000 64%,#070000 76%,#030000 88%,#000000 100%);transition:transform 0.75s cubic-bezier(0.76,0,0.24,1);will-change:transform;z-index:1}
.a-curtain--left{left:0;transform:translateX(-100%);box-shadow:8px 0 50px rgba(0,0,0,0.9),inset -6px 0 30px rgba(0,0,0,0.5)}
.a-curtain--right{right:0;transform:translateX(100%);box-shadow:-8px 0 50px rgba(0,0,0,0.9),inset 6px 0 30px rgba(0,0,0,0.5)}
.a-curtain--left::after{content:'';position:absolute;top:0;right:0;bottom:0;width:3px;background:linear-gradient(to bottom,transparent 0%,#000 15%,#000 50%,#000 85%,transparent 100%);box-shadow:0 0 18px rgba(212,175,55,0.8)}
.a-curtain--right::after{content:'';position:absolute;top:0;left:0;bottom:0;width:3px;background:linear-gradient(to bottom,transparent 0%,#000 15%,#000 50%,#000 85%,transparent 100%);box-shadow:0 0 18px rgba(212,175,55,0.8)}
#a-stage.pulling .a-curtain--left{transform:translateX(0)}
#a-stage.pulling .a-curtain--right{transform:translateX(0)}
#a-stage.open .a-curtain--left{transform:translateX(-60%)}
#a-stage.open .a-curtain--right{transform:translateX(60%)}
#a-backdrop{position:absolute;inset:0;background:rgba(4,3,10,0.92);backdrop-filter:blur(4px);opacity:0;transition:opacity 0.4s ease;z-index:0}
#a-stage.open #a-backdrop{opacity:1}
#a-card-wrap{position:relative;z-index:2;width:min(620px,88vw);border-radius:24px;padding:8px;overflow:hidden;opacity:0;transform:translateY(28px) scale(0.97);transition:opacity 0.45s ease 0.5s,transform 0.45s cubic-bezier(0.22,1,0.36,1) 0.5s;box-shadow:0 0 20px rgba(225,0,255,0.7),0 0 50px rgba(127,0,255,0.4);animation:aGlowPulse 3s ease-in-out infinite alternate}
#a-stage.open #a-card-wrap{opacity:1;transform:none}
#a-card-wrap::before{content:'';position:absolute;top:50%;left:50%;width:250%;height:250%;transform:translate(-50%,-50%);background:conic-gradient(from 0deg,#7f00ff,#e100ff,#00f0ff,#e100ff,#7f00ff);animation:aSpinNeon 6s linear infinite;z-index:0}
@keyframes aSpinNeon{to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes aGlowPulse{from{box-shadow:0 0 14px rgba(225,0,255,0.6),0 0 35px rgba(127,0,255,0.35)}to{box-shadow:0 0 30px rgba(225,0,255,0.95),0 0 70px rgba(0,240,255,0.55)}}
#a-content{position:relative;z-index:1;max-height:calc(88vh - 16px);overflow-y:auto;display:flex;flex-direction:column;padding:clamp(28px,4vw,44px) clamp(22px,3vw,38px) clamp(22px,3vh,34px);font-family:'Poppins','DM Sans',sans-serif;color:#fff;background:#050505;border-radius:18px;scrollbar-width:thin;scrollbar-color:rgba(225,0,255,0.3) transparent}
.ac-close{position:absolute;top:14px;right:14px;z-index:20;width:34px;height:34px;background:rgba(0,0,0,0.7);border:1px solid rgba(225,0,255,0.5);border-radius:50%;color:rgba(255,255,255,0.6);font-size:1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all 0.2s}
.ac-close:hover{color:#e100ff;border-color:#e100ff;box-shadow:0 0 16px rgba(225,0,255,0.6)}
.ac-title{font-size:clamp(1.6rem,4vw,2.4rem);font-weight:800;color:#e100ff;margin-bottom:clamp(14px,2.5vh,22px);padding-right:40px;text-shadow:0 0 10px rgba(225,0,255,0.45),0 0 24px rgba(225,0,255,0.2);line-height:1.1}
.ac-list{list-style:none;padding:0;margin-bottom:clamp(6px,1.2vh,12px)}
.ac-list li{position:relative;padding-left:26px;margin-bottom:clamp(8px,1.4vh,14px);font-size:clamp(0.88rem,1.8vw,1.05rem);font-weight:400;line-height:1.45;color:#f0f0f0;opacity:0;transform:translateY(14px);transition:opacity .4s ease,transform .4s ease}
.ac-list li.visible{opacity:1;transform:none}
.ac-list li::before{content:'•';position:absolute;left:6px;top:0;color:#fff;font-size:1.2rem;line-height:1.45}
.ac-accent{font-weight:700;text-align:center;font-size:clamp(0.85rem,1.8vw,1.05rem);margin:clamp(8px,1.4vh,16px) 0;opacity:0;transform:translateY(12px);transition:opacity .4s ease,transform .4s ease}
.ac-accent.visible{opacity:1;transform:none}
.ac-accent--bright{color:#e100ff;text-shadow:0 0 10px rgba(225,0,255,0.4)}
.ac-accent--dim{color:#b030d0}
.ac-gradient-headline{text-align:center;font-size:clamp(1.1rem,2.8vw,1.6rem);font-weight:800;line-height:1.3;margin:clamp(6px,1vh,12px) 0 clamp(4px,0.6vh,8px);opacity:0;transform:translateY(12px);transition:opacity .4s ease,transform .4s ease}
.ac-gradient-headline.visible{opacity:1;transform:none}
.g-pink{color:#ff3df2}
.g-orange{color:#ff8c3a}
.g-yellow{color:#ffd23d}
.g-purple{color:#b16eff}
.ac-accent-sub{font-weight:600;text-align:center;font-size:clamp(0.82rem,1.6vw,1rem);color:#e100ff;margin-bottom:clamp(10px,1.8vh,20px);text-shadow:0 0 8px rgba(225,0,255,0.35);opacity:0;transform:translateY(10px);transition:opacity .4s ease,transform .4s ease}
.ac-accent-sub.visible{opacity:1;transform:none}
.ac-footer{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:clamp(16px,2.5vh,28px);opacity:0;transform:translateY(10px);transition:opacity .4s ease,transform .4s ease}
.ac-footer.visible{opacity:1;transform:none}
.ac-btn-try{background:transparent;border:2px solid #7f00ff;color:#fff;padding:11px 26px;border-radius:25px;font-family:inherit;font-weight:600;font-size:clamp(0.85rem,1.8vw,1rem);cursor:pointer;text-decoration:none;box-shadow:0 0 12px rgba(127,0,255,0.45),inset 0 0 6px rgba(127,0,255,0.1);transition:all 0.3s ease}
.ac-btn-try:hover{background:rgba(127,0,255,0.18);box-shadow:0 0 24px rgba(127,0,255,0.85);transform:scale(1.03)}
.ac-btn-go{background:linear-gradient(135deg,#ff007b,#e100ff);border:none;color:#fff;padding:13px 36px;border-radius:25px;font-family:inherit;font-weight:800;font-size:clamp(0.9rem,2vw,1.1rem);letter-spacing:0.06em;cursor:pointer;text-decoration:none;box-shadow:0 4px 18px rgba(225,0,255,0.5),inset 0 0 10px rgba(255,255,255,0.3);transition:all 0.3s ease}
.ac-btn-go:hover{box-shadow:0 6px 32px rgba(225,0,255,0.85),inset 0 0 14px rgba(255,255,255,0.5);transform:scale(1.05)}
.ac-btn-go:active,.ac-btn-try:active{transform:scale(0.97)}
@media(max-width:480px){.ac-btn-try,.ac-btn-go{padding:10px 18px;font-size:0.85rem}}

/* ================================================
   Glossary Page
   ================================================ */

.glossary-page{padding-top:80px;min-height:100vh}

/* Hero band */
.glossary-hero{display:grid;grid-template-columns:360px 1fr;gap:40px;align-items:center;padding:48px 5% 36px;border-bottom:1px solid rgba(255,255,255,0.06);background:radial-gradient(ellipse 60% 80% at 0% 50%,rgba(155,93,229,0.12) 0%,transparent 70%)}

/* Badge */
.glossary-badge-wrap{position:relative;width:340px;height:300px;display:flex;align-items:center;justify-content:center}
.glossary-badge-wrap::before{content:'';position:absolute;inset:-30px;background:radial-gradient(ellipse at 40% 55%,rgba(80,0,255,0.3) 0%,rgba(30,0,200,0.18) 45%,transparent 75%);filter:blur(18px);animation:blobGlowPulse 4s ease-in-out infinite alternate;z-index:0}
@keyframes blobGlowPulse{from{opacity:0.7;transform:scale(0.95)}to{opacity:1;transform:scale(1.08)}}
.glossary-badge-circle{width:320px;height:270px;position:relative;z-index:1;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#0a00c8 0%,#1a00ff 15%,#3d00ff 30%,#6600ff 45%,#9b1fff 58%,#c800e8 72%,#e000b0 85%,#f0006a 100%);background-size:250% 250%;border-radius:62% 38% 55% 45% / 55% 48% 52% 45%;animation:blobMorph 7s ease-in-out infinite alternate,gradShift 6s ease-in-out infinite alternate;box-shadow:0 0 45px rgba(60,0,255,0.7),0 0 90px rgba(100,0,255,0.35),inset 0 0 30px rgba(255,255,255,0.08)}
@keyframes blobMorph{0%{border-radius:62% 38% 55% 45% / 55% 48% 52% 45%}20%{border-radius:50% 50% 38% 62% / 48% 60% 40% 52%}40%{border-radius:70% 30% 60% 40% / 44% 56% 44% 56%}60%{border-radius:45% 55% 50% 50% / 60% 40% 60% 40%}80%{border-radius:58% 42% 44% 56% / 50% 54% 46% 50%}100%{border-radius:38% 62% 42% 58% / 52% 44% 56% 48%}}
@keyframes gradShift{0%{background-position:0% 50%}50%{background-position:100% 50%}100%{background-position:0% 50%}}
.glossary-badge-circle::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 35% 25%,rgba(255,255,255,0.22) 0%,rgba(255,255,255,0.06) 40%,transparent 70%);border-radius:inherit;pointer-events:none}
.glossary-badge-circle::after{content:'';position:absolute;inset:0;background:radial-gradient(circle at 20% 75%,rgba(255,255,255,0.35) 1.5px,transparent 2px),radial-gradient(circle at 80% 20%,rgba(255,255,255,0.28) 1px,transparent 1.5px),radial-gradient(circle at 65% 80%,rgba(255,255,255,0.2) 1px,transparent 1.5px),radial-gradient(circle at 10% 35%,rgba(255,255,255,0.18) 1px,transparent 1.5px);border-radius:inherit;animation:sparkleDrift 5s ease-in-out infinite alternate;pointer-events:none}
@keyframes sparkleDrift{from{opacity:0.5;transform:translateY(0px)}to{opacity:1;transform:translateY(-4px)}}
.badge-title{font-family:'Syne',sans-serif;font-size:2.5rem;font-weight:800;letter-spacing:-0.02em;position:absolute;inset:0;z-index:2;text-align:center;line-height:1;background:linear-gradient(135deg,#ffffff 0%,#e0d0ff 30%,#c0aaff 55%,#ffffff 80%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;filter:drop-shadow(0 2px 8px rgba(0,0,80,0.5));animation:textFloat 5s ease-in-out infinite alternate;display:flex;align-items:center;justify-content:center;width:100%;height:100%}
@keyframes textFloat{from{transform:translateY(0px)}to{transform:translateY(-3px)}}
.badge-tagline{margin-top:14px;font-size:1.1rem;font-weight:400;color:#ee5300;letter-spacing:0.02em;text-align:center}

/* Intro */
.glossary-intro{padding-top:8px}
.glossary-intro-title{font-size:clamp(0.9rem,1.4vw,1.4rem);font-weight:700;color:#fff;margin-bottom:10px;display:block}
.glossary-intro-title span{font-weight:400;color:rgba(255,255,255,0.8)}
.glossary-intro ol{padding-left:18px;margin-bottom:10px}
.glossary-intro ol li,.glossary-intro ul li{font-size:clamp(0.82rem,1.3vw,0.9rem);color:rgba(255,255,255,0.82);line-height:1.6;margin-bottom:4px}
.glossary-intro ul{margin-top:4px}
.glossary-intro ul li{list-style:disc}

@media(max-width:768px){.glossary-hero{grid-template-columns:1fr}.glossary-badge-wrap{margin:0 auto}}
@media(max-width:400px){.glossary-badge-wrap{width:88vw;height:78vw;max-width:340px;max-height:300px}.glossary-badge-circle{width:80vw;height:68vw;max-width:320px;max-height:270px}}

/* Filter bar */
.glossary-filters{padding:28px 5% 20px;display:grid;grid-template-columns:160px 1fr;gap:20px;align-items:start;border-bottom:1px solid rgba(255,255,255,0.05)}
.filter-by-label{font-size:1.05rem;font-weight:700;color:#fff;margin-bottom:6px}
.filter-tag-label{font-size:0.95rem;font-weight:700;color:#fff;margin-bottom:14px;margin-top:4px}
.filter-alpha-label{font-size:0.95rem;font-weight:700;color:#fff}
.filter-tag-pills{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:18px}
.tag-pill{padding:9px 28px;border-radius:999px;font-weight:700;font-size:clamp(0.85rem,1.2vw,1.5rem);cursor:pointer;border:none;color:#fff;transition:transform 0.2s,box-shadow 0.2s;letter-spacing:0.02em}
.tag-pill:hover{transform:translateY(-2px);filter:brightness(1.15)}
.tag-pill.active{box-shadow:0 0 0 3px rgba(255,255,255,0.5)}
.tp-ai{background:#5a30e0}
.tp-agents{background:#8b1fd6}
.tp-marketing{background:linear-gradient(135deg,#e100ff,#ff0088)}
.tp-revenue{background:linear-gradient(135deg,#ff6b00,#ff3800)}
.tp-growth{background:linear-gradient(135deg,#d4b800,#f5a623);color:#000}
.tp-campaign{background:linear-gradient(135deg,#c02020,#e63030)}
.tp-2026{background:linear-gradient(135deg,#00b8c8,#0088aa)}
.alpha-strip{display:flex;flex-wrap:wrap;gap:2px;margin-top:6px}
.alpha-btn{font-family:'Syne',sans-serif;font-weight:700;font-size:clamp(1rem,1.8vw,1.3rem);color:rgba(255,255,255,0.75);background:none;border:none;cursor:pointer;padding:2px 5px;transition:color 0.2s;letter-spacing:-0.02em}
.alpha-btn:hover,.alpha-btn.active{color:#fff}

@media(max-width:768px){.glossary-filters{grid-template-columns:1fr}}

/* Search */
.glossary-search-bar{display:flex;align-items:center;gap:12px;padding:16px 5% 12px}
.glossary-search-input{flex:1;max-width:380px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.1);border-radius:8px;padding:10px 16px;color:#fff;font-family:'DM Sans',sans-serif;font-size:0.88rem;outline:none;transition:border-color 0.2s}
.glossary-search-input:focus{border-color:#9b5de5;box-shadow:0 0 12px rgba(155,93,229,0.3)}
.glossary-search-input::placeholder{color:rgba(255,255,255,0.3)}
.glossary-count{font-size:0.78rem;color:rgba(255,255,255,0.4);font-family:'Syne',sans-serif;letter-spacing:0.05em}

/* Terms grid */
.glossary-body{padding:24px 5% 60px;display:grid;grid-template-columns:repeat(4,1fr);gap:0 20px}
.glossary-col{display:flex;flex-direction:column}
.term-item{font-size:clamp(0.75rem,1.1vw,0.88rem);color:rgba(255,255,255,0.82);line-height:1.55;padding:2px 0;cursor:pointer;transition:color 0.15s}
.term-item:hover{color:#e63888}
.term-item.col2{color:#f4a135}
.term-item.col2:hover{color:#ffcc66}

@media(max-width:1100px){.glossary-body{grid-template-columns:repeat(3,1fr)}}
@media(max-width:768px){.glossary-body{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.glossary-body{grid-template-columns:1fr}}

/* Detail section */
.glossary-detail-section{display:grid;grid-template-columns:1fr 260px;gap:48px;padding:48px 5% 64px;border-top:1px solid rgba(255,255,255,0.06);background:radial-gradient(ellipse 70% 60% at 80% 40%,rgba(155,93,229,0.07) 0%,transparent 70%)}
.glossary-detail-main{min-width:0}
.glossary-detail-term-title{font-size:clamp(1.1rem,2vw,1.4rem);font-weight:800;color:#fff;margin-bottom:10px}
.glossary-detail-lead{font-size:clamp(0.82rem,1.2vw,0.9rem);color:rgba(255,255,255,0.78);line-height:1.7;margin-bottom:28px}
.glossary-detail-block{margin-bottom:26px}
.glossary-detail-block-title{font-family:'Syne',sans-serif;font-size:clamp(0.88rem,1.3vw,1rem);font-weight:700;color:#fff;margin-bottom:8px}
.glossary-detail-block-subtitle{font-size:clamp(0.82rem,1.2vw,0.9rem);font-weight:600;color:rgba(255,255,255,0.85);margin-bottom:4px}
.glossary-detail-block p{font-size:clamp(0.8rem,1.15vw,0.87rem);color:rgba(255,255,255,0.72);line-height:1.7;margin-bottom:6px}
.glossary-detail-table{width:100%;border-collapse:collapse;margin-top:20px;font-size:clamp(0.77rem,1.1vw,0.84rem)}
.glossary-detail-table th{text-align:left;font-family:'Syne',sans-serif;font-size:0.72rem;font-weight:700;letter-spacing:0.1em;color:rgba(255,255,255,0.45);padding:6px 10px 8px;border-bottom:1px solid rgba(255,255,255,0.08)}
.glossary-detail-table td{padding:7px 10px;color:rgba(255,255,255,0.75);border-bottom:1px solid rgba(255,255,255,0.04);vertical-align:top;line-height:1.5}
.glossary-detail-table tr:hover td{background:rgba(255,255,255,0.02)}
.glossary-detail-table td:first-child{color:#e63888;font-weight:600;white-space:nowrap}

/* Sidebar */
.glossary-detail-sidebar{display:flex;flex-direction:column;gap:32px}
.sidebar-section-title{font-size:1.6rem;font-weight:800;margin-bottom:14px}
.sidebar-section-title.latest{color:#e63888}
.sidebar-section-title.related{color:#9b5de5}
.sidebar-link-list{list-style:none;display:flex;flex-direction:column;gap:6px}
.sidebar-link-list li a{font-size:clamp(0.8rem,1.1vw,0.86rem);color:rgba(255,255,255,0.72);text-decoration:underline;text-decoration-color:rgba(255,255,255,0.2);transition:color 0.2s,text-decoration-color 0.2s;line-height:1.5}
.sidebar-link-list li a:hover{color:#fff;text-decoration-color:rgba(255,255,255,0.6)}

@media(max-width:900px){.glossary-detail-section{grid-template-columns:1fr}.glossary-detail-sidebar{flex-direction:row;flex-wrap:wrap;gap:24px}.glossary-detail-sidebar>div{flex:1;min-width:200px}}
@media(max-width:480px){.glossary-detail-sidebar{flex-direction:column}}

@media(max-width:700px){
  .glossary-detail-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 -5%;padding:0 5%}
  .glossary-detail-table{min-width:560px}
  .glossary-detail-table td:first-child{white-space:normal}
}

/* ================================================
   Our Architecture Page
   ================================================ */

#bg-canvas{position:fixed;inset:0;z-index:0;pointer-events:none}

/* Hero — scoped to avoid conflicts with style.css #hero, .hero-title, .hero-subtitle, .origin-label */
body.page-architecture #hero{width:100vw;min-height:100vh;display:flex;flex-direction:column;justify-content:center;padding:120px 9vw 60px;position:relative;z-index:1}
body.page-architecture .origin-label{font-family:'Syne',sans-serif;font-size:0.85rem;letter-spacing:0.28em;text-transform:uppercase;color:var(--purple);margin-bottom:0.5rem;font-weight:700}
body.page-architecture .hero-title{font-family:'Syne',sans-serif;font-size:clamp(2rem,4vw,4rem);font-weight:600;line-height:1;letter-spacing:-0.02em;position:relative;padding-bottom:0.5rem;width:fit-content;background:linear-gradient(90deg,#e63888 0%,#9b5de5 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
body.page-architecture .hero-title::after{display:none}
body.page-architecture .hero-subtitle{margin-top:1.6rem;max-width:580px;font-family:'DM Sans',sans-serif;font-size:clamp(0.95rem,1.4vw,1.05rem);font-weight:300;line-height:1.5;color:rgba(255,255,255,0.72);opacity:1;transform:none}
.hero-list{margin-top:2rem;padding-left:1.4rem;display:flex;flex-direction:column;gap:0.6rem;max-width:900px;list-style:disc}
.hero-list>li{font-family:'DM Sans',sans-serif;font-size:clamp(0.95rem,1.4vw,1.1rem);font-weight:400;line-height:1.55;color:rgba(255,255,255,0.88)}
.hero-list ol{margin-top:0.5rem;padding-left:1.2rem;display:flex;flex-direction:column;gap:0.3rem;list-style:decimal}
.hero-list ol li{font-size:clamp(0.88rem,1.2vw,1rem);color:rgba(255,255,255,0.7);font-weight:300}
@media(max-width:768px){body.page-architecture #hero{padding:100px 5vw 60px}}

/* Agent Stack Section */
#agent-stack{position:relative;z-index:1;width:100%;padding:clamp(70px,9vw,110px) clamp(20px,5vw,72px) clamp(50px,7vw,90px);background:#030208;overflow:hidden}
#agent-stack::before{content:'';position:absolute;inset:0;background:radial-gradient(ellipse 90% 55% at 50% 65%,rgba(90,10,160,0.50) 0%,rgba(40,0,80,0.20) 45%,transparent 75%);pointer-events:none;z-index:0}
.agent-stack-inner{max-width:1380px;margin:0 auto;display:flex;flex-direction:column;gap:clamp(26px,3.5vw,44px);position:relative;z-index:1}
.agent-stack-label{font-family:'Syne',sans-serif;font-size:0.68rem;font-weight:700;letter-spacing:0.35em;text-transform:uppercase;color:rgba(168,100,255,0.6);margin-bottom:0.3rem}
.agent-stack-title{font-family:'Syne',sans-serif;font-size:clamp(2rem,5vw,3.5rem);font-weight:700;color:#ffffff;line-height:1.05;letter-spacing:-0.025em}
.agent-stack-title .title-arrow{color:#ffffff;font-weight:400;margin:0 0.12em;opacity:0.85}
.agent-cards-wrap{display:flex;align-items:stretch;gap:0;position:relative}
.agent-arrow{flex-shrink:0;width:clamp(50px,6vw,80px);display:flex;align-items:center;justify-content:center;position:relative;z-index:2}
.bolt-canvas{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);width:100%;height:60px;pointer-events:none;display:block;z-index:1}
.agent-arrow::after{content:'';position:absolute;top:50%;left:0;right:0;height:1px;background:repeating-linear-gradient(90deg,rgba(168,85,247,0.25) 0px,rgba(168,85,247,0.25) 3px,transparent 3px,transparent 7px);z-index:0}
.agent-card{flex:1;position:relative;background:rgba(7,4,18,0.97);border:1px solid rgba(255,255,255,0.09);border-radius:10px;padding:clamp(20px,2.6vw,32px) clamp(16px,2vw,24px) clamp(22px,2.8vw,34px);display:flex;flex-direction:column;gap:0.4rem;overflow:hidden;cursor:default;min-width:0;transition:transform 0.3s ease,box-shadow 0.3s ease}
.agent-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;border-radius:10px 10px 0 0;z-index:2}
.agent-card::after{content:'';position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;opacity:0.07;border-radius:10px}
.agent-card--red{box-shadow:var(--shadow-red)}
.agent-card--red::before{background:linear-gradient(90deg,#ff2a4b 0%,rgba(255,42,75,0.08) 100%)}
.agent-card--red::after{background:radial-gradient(ellipse 140% 100% at 0% 0%,#ff2a4b,transparent 65%)}
.agent-card--purple{box-shadow:var(--shadow-purple)}
.agent-card--purple::before{background:linear-gradient(90deg,#9b5de5 0%,rgba(155,93,229,0.08) 100%)}
.agent-card--purple::after{background:radial-gradient(ellipse 140% 100% at 0% 0%,#9b5de5,transparent 65%)}
.agent-card--blue{box-shadow:var(--shadow-blue)}
.agent-card--blue::before{background:linear-gradient(90deg,#3b82f6 0%,rgba(59,130,246,0.08) 100%)}
.agent-card--blue::after{background:radial-gradient(ellipse 140% 100% at 0% 0%,#3b82f6,transparent 65%)}
.agent-card--green{box-shadow:var(--shadow-green)}
.agent-card--green::before{background:linear-gradient(90deg,#22c55e 0%,rgba(34,197,94,0.08) 100%)}
.agent-card--green::after{background:radial-gradient(ellipse 140% 100% at 0% 0%,#22c55e,transparent 65%)}
.agent-card-num{font-family:'Syne',sans-serif;font-size:clamp(2.2rem,3.8vw,3.2rem);font-weight:800;line-height:1;letter-spacing:-0.02em;margin-bottom:0.1rem}
.agent-card--red .agent-card-num{color:#ff2a4b;text-shadow:0 0 28px rgba(255,42,75,0.5)}
.agent-card--purple .agent-card-num{color:#9b5de5;text-shadow:0 0 28px rgba(155,93,229,0.5)}
.agent-card--blue .agent-card-num{color:#3b82f6;text-shadow:0 0 28px rgba(59,130,246,0.5)}
.agent-card--green .agent-card-num{color:#22c55e;text-shadow:0 0 28px rgba(34,197,94,0.5)}
.agent-card-title{font-family:'Syne',sans-serif;font-size:clamp(0.95rem,1.35vw,1.18rem);font-weight:700;color:#ffffff;line-height:1.25;margin-bottom:0.05rem}
.agent-card-role{font-family:'DM Sans',sans-serif;font-size:clamp(0.68rem,0.82vw,0.78rem);font-style:italic;font-weight:300;margin-bottom:0.55rem}
.agent-card--red .agent-card-role{color:rgba(255,110,130,0.80)}
.agent-card--purple .agent-card-role{color:rgba(185,145,255,0.80)}
.agent-card--blue .agent-card-role{color:rgba(110,175,255,0.80)}
.agent-card--green .agent-card-role{color:rgba(80,220,140,0.80)}
.agent-card-body{font-family:'DM Sans',sans-serif;font-size:clamp(0.74rem,0.88vw,0.86rem);line-height:1.72;color:rgba(255,255,255,0.52);font-weight:300;flex:1}
#feedback-loop-canvas{display:block;width:100%;height:48px;pointer-events:none;margin-top:-2px}
.agent-tags{display:flex;flex-wrap:wrap;align-items:center;padding:11px 0;border-top:1px solid rgba(255,255,255,0.07);border-bottom:1px solid rgba(255,255,255,0.07)}
.agent-tags span{font-family:'Syne',sans-serif;font-size:clamp(0.56rem,0.75vw,0.68rem);font-weight:600;letter-spacing:0.14em;text-transform:uppercase;color:rgba(255,255,255,0.35);padding:3px 10px;white-space:nowrap;transition:color 0.2s ease;cursor:default}
.agent-tags span:not(.sep):hover{color:rgba(255,255,255,0.72)}
.agent-tags .sep{color:rgba(255,255,255,0.12);padding:0;letter-spacing:0;pointer-events:none}
@media(max-width:900px){.agent-cards-wrap{flex-wrap:wrap;gap:14px}.agent-card{flex:1 1 calc(50% - 7px);min-width:200px}.agent-arrow{display:none}}
@media(max-width:520px){.agent-card{flex:1 1 100%}.agent-tags{justify-content:center}}

/* Cognitive Infrastructure Section */
#cognitive-infra{position:relative;z-index:1;width:100%;padding:clamp(60px,6vw,90px) clamp(20px,5vw,72px);overflow:hidden}
.ci-inner{max-width:1380px;margin:0 auto;display:flex;flex-direction:column;position:relative;z-index:1}
.ci-label{font-family:'Syne',sans-serif;font-size:0.72rem;font-weight:700;letter-spacing:0.25em;text-transform:uppercase;color:#a855f7;margin-bottom:0.4rem}
.ci-heading{font-family:'Syne',sans-serif;font-size:clamp(2rem,4.5vw,3.6rem);font-weight:800;color:#ffffff;line-height:1.1;letter-spacing:-0.02em;margin-bottom:1.8rem;border-bottom:2px solid #9b5de5;padding-bottom:0.6rem;width:fit-content}
.ci-sublayers-title{font-family:'DM Sans',sans-serif;font-style:italic;font-size:clamp(1rem,1.4vw,1.2rem);font-weight:300;color:rgba(255,255,255,0.65);margin-bottom:2.2rem}
.ci-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;width:100%;margin-bottom:24px}
.ci-card{background:rgba(18,18,18,0.85);border:1.5px solid transparent;border-radius:12px;padding:24px 20px;display:flex;flex-direction:column;gap:8px;transition:transform 0.3s cubic-bezier(0.2,0.8,0.2,1),box-shadow 0.3s cubic-bezier(0.2,0.8,0.2,1)}
.ci-card:hover{transform:translateY(-4px)}
.ci-card-num{font-family:'Syne',sans-serif;font-size:2rem;font-weight:800;line-height:1}
.ci-card-title{font-family:'Syne',sans-serif;font-size:1.25rem;font-weight:700;color:#ffffff}
.ci-card-body{font-family:'DM Sans',sans-serif;font-size:0.88rem;line-height:1.5;color:rgba(255,255,255,0.5);font-weight:300}
.ci-card--purple{border-color:rgba(147,51,234,0.6);box-shadow:var(--shadow-purple)}
.ci-card--purple .ci-card-num{color:#a855f7}
.ci-card--red{border-color:rgba(239,68,68,0.6);box-shadow:var(--shadow-red)}
.ci-card--red .ci-card-num{color:#ef4444}
.ci-card--blue{border-color:rgba(59,130,246,0.6);box-shadow:var(--shadow-blue)}
.ci-card--blue .ci-card-num{color:#3b82f6}
.ci-card--orange{border-color:rgba(245,158,11,0.6);box-shadow:var(--shadow-orange)}
.ci-card--orange .ci-card-num{color:#f59e0b}
.ci-card--green{border-color:rgba(16,185,129,0.6);box-shadow:var(--shadow-green)}
.ci-card--green .ci-card-num{color:#10b981}
.ci-card--teal{border-color:rgba(20,184,166,0.6);box-shadow:var(--shadow-teal)}
.ci-card--teal .ci-card-num{color:#14b8a6}
.ci-card--pink{border-color:rgba(236,72,153,0.6);box-shadow:var(--shadow-pink)}
.ci-card--pink .ci-card-num{color:#ec7299}
.ci-banner{background:rgba(15,15,15,0.9);border:1px solid rgba(255,255,255,0.08);border-left:5px solid #a855f7;border-radius:8px;padding:18px 24px;width:100%}
.ci-banner-text{font-family:'DM Sans',sans-serif;font-size:clamp(0.9rem,1.2vw,1.05rem);line-height:1.5;color:rgba(255,255,255,0.85);font-weight:400}
.ci-banner-text span{color:#a855f7;font-weight:600}
@media(max-width:1024px){.ci-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:640px){.ci-grid{grid-template-columns:1fr}.ci-heading{width:100%}}

/* ================================================
   Blog Page — Intelligence Newspaper Terminal
   ================================================ */

/* Reset within scope */
.blog-page *{box-sizing:border-box}

/* Page shell */
.blog-page{
  background:#030208;
  min-height:100vh;
  padding-top:80px;
  font-family:'DM Sans',sans-serif;
  color:#fff;
}

/* ─── LAYOUT ─── */
.bp-layout{
  display:grid;
  grid-template-columns:350px 1fr;
  min-height:calc(100vh - 80px);
  max-width:1600px;
  margin:0 auto;
  padding:0 clamp(20px,6vw,80px);
}

/* ─── SIDEBAR ─── */
.bp-sidebar{
  position:sticky;
  top:80px;
  height:calc(100vh - 80px);
  overflow:hidden;
  border-right:1px solid rgba(255,255,255,0.08);
  display:flex;
  flex-direction:column;
  background:#030208;
}

.bp-sidebar-top{
  padding:32px 32px 24px;
  border-bottom:1px solid rgba(255,255,255,0.06);
  flex-shrink:0;
}
.bp-dispatch-label{
  font-size:0.58rem;
  letter-spacing:0.32em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.4);
  margin-bottom:6px;
}
.bp-dispatch-title{
  font-size:1.05rem;
  font-weight:800;
  color:#fff;
  line-height:1.2;
  letter-spacing:-0.01em;
}
.bp-dispatch-title span{
  background:linear-gradient(90deg,#e63888,#9b5de5);
  -webkit-background-clip:text;
  -webkit-text-fill-color:transparent;
  background-clip:text;
}

/* Section nav items */
.bp-nav-sections{
  flex:1;
  overflow-y:auto;
  scrollbar-width:none;
  padding:12px 0 20px;
}
.bp-nav-sections::-webkit-scrollbar{display:none}

.bp-sec-item{
  padding:0;
  cursor:pointer;
  border-left:3px solid transparent;
  transition:border-color 0.2s;
  position:relative;
}
.bp-sec-item.active{border-left-color:var(--bp-sec-color,#e63888)}
.bp-sec-item:not(.active):hover{border-left-color:rgba(255,255,255,0.15)}

.bp-sec-head{
  display:flex;
  align-items:flex-start;
  gap:14px;
  padding:18px 24px 14px;
}
.bp-sec-letter{
  font-family:'Syne',sans-serif;
  font-size:2.4rem;
  font-weight:800;
  line-height:1;
  letter-spacing:-0.05em;
  color:var(--bp-sec-color,#e63888);
  opacity:0.18;
  transition:opacity 0.25s;
  flex-shrink:0;
  width:50px;
}
.bp-sec-item.active .bp-sec-letter,
.bp-sec-item:hover .bp-sec-letter{opacity:1}

.bp-sec-info{padding-top:2px}
.bp-sec-name{
  font-size:0.95rem;
  font-weight:800;
  color:#fff;
  letter-spacing:-0.01em;
  line-height:1.2;
  margin-bottom:3px;
  display:flex;
  align-items:center;
  gap:8px;
}
.bp-sec-desc{
  font-size:0.7rem;
  color:rgba(255,255,255,0.32);
  line-height:1.45;
  max-width:200px;
}
.bp-sec-count{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:2px 7px;
  font-size:0.52rem;
  font-family:'Syne',sans-serif;
  letter-spacing:0.08em;
  font-weight:700;
  border:1px solid var(--bp-sec-color,#e63888);
  color:var(--bp-sec-color,#e63888);
  border-radius:20px;
  opacity:0.65;
  transition:opacity 0.2s;
  flex-shrink:0;
}
.bp-sec-item.active .bp-sec-count,
.bp-sec-item:hover .bp-sec-count{opacity:1}

/* Sub links */
.bp-sub-links{
  display:none;
  flex-direction:column;
  padding:0 24px 16px 24px;
  gap:2px;
}
.bp-sec-item.active .bp-sub-links{display:none}
.bp-sub-link{
  font-size:0.75rem;
  color:rgba(255,255,255,0.38);
  padding:5px 0;
  cursor:pointer;
  border-bottom:1px solid rgba(255,255,255,0.05);
  display:flex;
  align-items:center;
  gap:8px;
  transition:color 0.2s;
  font-family:'DM Sans',sans-serif;
}
.bp-sub-link:last-child{border-bottom:none}
.bp-sub-link:hover,.bp-sub-link.active{color:#fff}
.bp-sub-link::before{
  content:'';
  width:4px;height:4px;
  border-radius:50%;
  background:var(--bp-sec-color,#e63888);
  opacity:0;
  transition:opacity 0.2s;
  flex-shrink:0;
}
.bp-sub-link:hover::before,.bp-sub-link.active::before{opacity:1}

/* Sidebar bottom */
.bp-sidebar-foot{
  padding:16px 24px;
  border-top:1px solid rgba(255,255,255,0.06);
  flex-shrink:0;
}
.bp-agent-status{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:0.65rem;
  color:rgba(255,255,255,0.3);
  font-family:'Syne',sans-serif;
  letter-spacing:0.1em;
  text-transform:uppercase;
}
.bp-agent-dot{
  width:6px;height:6px;
  border-radius:50%;
  background:#22c55e;
  box-shadow:0 0 8px #22c55e;
  animation:bpPulse 2.2s ease-in-out infinite;
  flex-shrink:0;
}
@keyframes bpPulse{
  0%,100%{opacity:1;transform:scale(1)}
  50%{opacity:0.45;transform:scale(0.7)}
}

/* ─── MAIN CONTENT ─── */
.bp-main{
  display:flex;
  flex-direction:column;
  min-height:calc(100vh - 80px);
}

/* Content header bar */
.bp-content-bar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px 32px;
  border-bottom:1px solid rgba(255,255,255,0.06);
  flex-shrink:0;
  gap:16px;
}
.bp-active-crumb{
  font-family:'Syne',sans-serif;
  font-size:0.62rem;
  letter-spacing:0.2em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.3);
  display:flex;
  align-items:center;
  gap:8px;
}
.bp-crumb-sep{color:rgba(255,255,255,0.12)}
.bp-crumb-current{color:rgba(255,255,255,0.6)}
.bp-count-badge{
  font-family:'Syne',sans-serif;
  font-size:0.6rem;
  letter-spacing:0.12em;
  color:rgba(255,255,255,0.25);
  padding:4px 12px;
  border:1px solid rgba(255,255,255,0.08);
}
.bp-view-toggle{
  display:flex;
  gap:6px;
}
.bp-view-btn{
  width:28px;height:28px;
  border:1px solid rgba(255,255,255,0.1);
  background:transparent;
  cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:all 0.2s;
  color:rgba(255,255,255,0.3);
}
.bp-view-btn.active,.bp-view-btn:hover{
  border-color:rgba(255,255,255,0.35);
  color:#fff;
}

/* ─── ARTICLE GRID ─── */
.bp-grid{
  flex:1;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  align-content:start;
  border-top:none;
  gap:24px;
  background:rgba(255,255,255,0.06);
  padding:28px 0px 64px;
}

/* hide/show filtered articles */
.bp-article[data-section]{transition:opacity 0.25s,transform 0.25s}
.bp-article.hidden{display:none}

/* Article card — editorial style */
.bp-article{
  border-right:none;
  border-bottom:none;
  background:#030208;
  cursor:pointer;
  position:relative;
  overflow:hidden;
  transition:background 0.2s;
}
.bp-article:hover{background:rgba(255,255,255,0.018)}
.bp-article:nth-child(3n){border-right:none}

/* Color accent on hover per section */
.bp-article[data-section="shift"]:hover .bp-card-rule{background:#e63888}
.bp-article[data-section="battle"]:hover .bp-card-rule{background:#9b5de5}
.bp-article[data-section="version"]:hover .bp-card-rule{background:#f4a135}

/* Image container */
.bp-card-img{
  width:100%;
  aspect-ratio:3/2;
  overflow:hidden;
  position:relative;
  background:#0d001a;
}
.bp-card-img img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  filter:brightness(0.75) saturate(0.85);
  transition:filter 0.4s ease,transform 0.5s ease;
}
.bp-article:hover .bp-card-img img{
  filter:brightness(0.9) saturate(1.05);
  transform:scale(1.03);
}

/* Section color overlay strip on image */
.bp-card-img-overlay{
  position:absolute;
  bottom:0;left:0;right:0;
  height:3px;
  opacity:0.7;
  transition:height 0.3s,opacity 0.3s;
}
.bp-article:hover .bp-card-img-overlay{height:4px;opacity:1}
.bp-article[data-section="shift"] .bp-card-img-overlay{background:#e63888}
.bp-article[data-section="battle"] .bp-card-img-overlay{background:#9b5de5}
.bp-article[data-section="version"] .bp-card-img-overlay{background:#f4a135}

/* Card body */
.bp-card-body{
  padding:14px 18px 18px;
}
.bp-card-rule{
  height:1px;
  background:rgba(255,255,255,0.06);
  margin-bottom:12px;
  transition:background 0.3s;
}
.bp-card-meta{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:9px;
}
.bp-card-section-tag{
  font-family:'Syne',sans-serif;
  font-size:0.55rem;
  font-weight:700;
  letter-spacing:0.18em;
  text-transform:uppercase;
  padding:2px 7px;
  border-radius:1px;
}
.bp-article[data-section="shift"] .bp-card-section-tag{
  background:rgba(230,56,136,0.12);
  color:#e63888;
}
.bp-article[data-section="battle"] .bp-card-section-tag{
  background:rgba(155,93,229,0.12);
  color:#9b5de5;
}
.bp-article[data-section="version"] .bp-card-section-tag{
  background:rgba(244,161,53,0.12);
  color:#f4a135;
}
.bp-card-sub-tag{
  font-size:0.6rem;
  color:rgba(255,255,255,0.22);
  font-family:'DM Sans',sans-serif;
}
.bp-card-title{
  /* font-family:'Syne',sans-serif; */
  font-size:0.88rem;
  font-weight:700;
  line-height:1.38;
  color:rgba(255,255,255,0.9);
  margin-bottom:9px;
  letter-spacing:-0.01em;
}
.bp-card-lead{
  font-size:0.73rem;
  line-height:1.6;
  color:rgba(255,255,255,0.70);
  margin-bottom:12px;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.bp-card-footer{
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.bp-card-read{
  font-family:'Syne',sans-serif;
  font-size:0.6rem;
  font-weight:700;
  letter-spacing:0.12em;
  text-transform:uppercase;
  display:flex;
  align-items:center;
  gap:5px;
  transition:gap 0.2s;
}
.bp-article:hover .bp-card-read{gap:8px}
.bp-article[data-section="shift"] .bp-card-read{color:#e63888}
.bp-article[data-section="battle"] .bp-card-read{color:#9b5de5}
.bp-article[data-section="version"] .bp-card-read{color:#f4a135}
.bp-card-date{
  font-size:0.6rem;
  color:rgba(255,255,255,0.2);
  letter-spacing:0.05em;
}

/* ─── EMPTY STATE ─── */
.bp-empty{
  display:none;
  grid-column:1/-1;
  padding:80px 32px;
  text-align:center;
}
.bp-empty.visible{display:block}
.bp-empty-title{
  font-family:'Syne',sans-serif;
  font-size:1.1rem;
  color:rgba(255,255,255,0.25);
  margin-bottom:8px;
}
.bp-empty-sub{font-size:0.8rem;color:rgba(255,255,255,0.15)}

/* ─── ARTICLE READER ─── */
.bp-reader{
  position:fixed;
  inset:0;
  z-index:300;
  background:#030208;
  overflow-y:auto;
  transform:translateX(100%);
  transition:transform 0.45s cubic-bezier(0.16,1,0.3,1);
  pointer-events:none;
}
.bp-reader.open{
  transform:translateX(0);
  pointer-events:auto;
}
.bp-reader-topbar{
  position:sticky;
  top:0;
  z-index:10;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px 40px;
  background:rgba(14,8,25,0.92);
  backdrop-filter:blur(16px);
  border-bottom:1px solid rgba(255,255,255,0.07);
}
.bp-reader-back{
  display:flex;
  align-items:center;
  gap:8px;
  font-family:'Syne',sans-serif;
  font-size:0.62rem;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.45);
  cursor:pointer;
  border:1px solid rgba(255,255,255,0.1);
  padding:7px 16px;
  transition:all 0.2s;
  background:transparent;
}
.bp-reader-back:hover{border-color:rgba(255,255,255,0.3);color:#fff}
.bp-reader-section-tag{
  font-family:'Syne',sans-serif;
  font-size:0.58rem;
  font-weight:700;
  letter-spacing:0.16em;
  text-transform:uppercase;
  padding:4px 12px;
  border:1px solid;
}

.bp-reader-body-wrap{
  max-width:760px;
  margin:0 auto;
  padding:56px 40px 100px;
}
.bp-reader-hero-img{
  width:100%;
  aspect-ratio:16/7;
  object-fit:cover;
  display:block;
  margin-bottom:40px;
  filter:brightness(0.8) saturate(0.9);
}
.bp-reader-eyebrow{
  font-family:'Syne',sans-serif;
  font-size:0.6rem;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:rgba(255,255,255,0.28);
  margin-bottom:14px;
  display:flex;
  align-items:center;
  gap:10px;
}
.bp-reader-eyebrow::after{
  content:'';flex:1;max-width:60px;
  height:1px;background:rgba(255,255,255,0.12);
}
.bp-reader-title{
  font-size:clamp(1.7rem,3.5vw,2.8rem);
  font-weight:800;
  line-height:1.28;
  letter-spacing:-0.025em;
  color:#fff;
  margin-bottom:24px;
}
.bp-reader-meta{
  display:flex;
  align-items:center;
  gap:14px;
  padding:16px 0;
  border-top:1px solid rgba(255,255,255,0.07);
  border-bottom:1px solid rgba(255,255,255,0.07);
  margin-bottom:36px;
}
.bp-reader-vibe{
  font-size:0.75rem;
  color:rgba(255,255,255,0.35);
  font-style:italic;
}
.bp-reader-date{font-size:0.7rem;color:rgba(255,255,255,0.2);letter-spacing:0.05em}
.bp-reader-content{
  font-size:0.92rem;
  line-height:1.85;
  color:rgba(255,255,255,0.7);
}
.bp-reader-content p{margin-bottom:18px}
.bp-reader-content h3{
  font-family:'Syne',sans-serif;
  font-size:1.05rem;
  font-weight:700;
  color:#fff;
  margin:32px 0 12px;
  letter-spacing:-0.01em;
}
.bp-reader-content ul,.bp-reader-content ol{
  padding-left:22px;margin-bottom:18px;
}
.bp-reader-content li{margin-bottom:8px;line-height:1.72}
.bp-reader-content strong{color:rgba(255,255,255,0.9)}
.bp-reader-pull{
  padding:20px 24px;
  margin:28px 0;
  border-left:3px solid;
  font-size:1rem;
  font-family:'Syne',sans-serif;
  font-weight:600;
  line-height:1.5;
  letter-spacing:-0.01em;
  background:rgba(255,255,255,0.02);
}
.bp-reader-seo{
  display:flex;flex-wrap:wrap;gap:8px;
  margin-top:48px;padding-top:24px;
  border-top:1px solid rgba(255,255,255,0.06);
}
.bp-seo-tag{
  font-size:0.6rem;
  font-family:'Syne',sans-serif;
  letter-spacing:0.1em;
  text-transform:uppercase;
  padding:4px 10px;
  border:1px solid rgba(255,255,255,0.08);
  color:rgba(255,255,255,0.25);
}

/* ─── RESPONSIVE ─── */
@media(max-width:1100px){
  .bp-layout{grid-template-columns:260px 1fr}
  .bp-grid{grid-template-columns:repeat(2,1fr)}
  .bp-article:nth-child(3n){border-right:none}
  .bp-article:nth-child(2n){border-right:none}
}
@media(max-width:768px){
  .bp-layout{grid-template-columns:1fr}
  .bp-sidebar{
    position:relative;top:0;height:auto;
    border-right:none;border-bottom:1px solid rgba(255,255,255,0.08);
  }
  .bp-nav-sections{
    display:flex;flex-direction:row;gap:0;
    overflow-x:auto;padding:8px 0 4px;
  }
  .bp-sec-item{border-left:none;border-bottom:3px solid transparent}
  .bp-sec-item.active{border-left-color:transparent;border-bottom-color:var(--bp-sec-color,#e63888)}
  .bp-sec-head{padding:10px 20px 8px}
  .bp-sec-letter{font-size:1.6rem;width:22px}
  .bp-sec-name{font-size:0.82rem}
  .bp-sec-desc,.bp-sec-count,.bp-sub-links{display:none}
  .bp-grid{grid-template-columns:1fr}
  .bp-article:nth-child(n){border-right:none}
  .bp-reader-body-wrap{padding:32px 20px 60px}
  .bp-reader-topbar{padding:12px 20px}
}