/*
Theme Name: GlobalMente V1.99
Theme URI: https://globalmente.it
Author: GlobalMente
Author URI: https://globalmente.it
Description: A high-performance Industrial Cyber-Minimalist framework
 engineered for B2B Revenue Infrastructure and Digital Transformation ecosystems.
 Built for scalability and technical SEO dominance. Features AI chat integration
 powered by Gemini API with streaming responses and lead capture, multi-language
 support (IT/EN), business segmentation, GDPR-compliant data collection,
 certified partner carousel with 26 technology partners, interactive Strategy
 section with 10 interconnected pillars, bento-grid service modals, mobile
 performance optimisations (particle/Lottie disabled on mobile, deferred carousel,
 prefers-reduced-motion support), and admin leads dashboard.
 Designed for executive-level clarity and institutional-grade reliability.
 Typography: Monospaced fonts for data/technical elements paired with heavy
 Neo-Grotesque headers (Inter, Helvetica Now, Akzidenz-Grotesk).
 Palette: Deep blacks (#0A0A0A), surgical whites, and Cyber Blue (#33a9db)
 accent colours to mimic industrial interfaces.
 Motion: High-precision micro-interactions with zero "fluff" —
 transitions feel mechanical and intentional.
Version: 1.99 | Released: 16 April 2026
Version: 1.99
Domain Path: /languages
*/

html {
  overflow-x: hidden;
}

body {
  background-color: #000000;
  color: #fff;
  font-family: 'Inter', sans-serif;
  overflow-x: hidden;
  cursor: none;
}

.material-symbols-outlined {
  font-size: inherit;
  display: inline-block;
  vertical-align: middle;
  overflow: hidden;
  max-width: 1em;
  max-height: 1em;
  visibility: hidden;
}

.fonts-loaded .material-symbols-outlined {
  visibility: visible;
}

::selection {
  background-color: rgba(51, 169, 219, 0.3);
}

.crt-overlay {
  background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%), linear-gradient(90deg, rgba(255, 0, 0, 0.06), rgba(0, 255, 0, 0.02), rgba(0, 0, 255, 0.06));
  background-size: 100% 2px, 3px 100%;
  pointer-events: none;
}

.glass-container {
  background: rgba(18, 28, 33, 0.7);
  backdrop-filter: blur(12px);
  border: 1px solid rgba(51, 169, 219, 0.3);
  box-shadow: 0 0 40px rgba(51, 169, 219, 0.1);
}

.glow-border {
  box-shadow: 0 0 15px rgba(51, 169, 219, 0.4);
  border-color: rgba(51, 169, 219, 0.8);
}

.cyber-cell {
  position: relative;
  border: 1px solid rgba(51, 169, 219, 0.25);
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.06), rgba(255, 255, 255, 0.02));
  backdrop-filter: blur(4px);
  transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.cyber-cell:hover {
  border-color: rgba(51, 169, 219, 0.7);
  background: linear-gradient(135deg, rgba(51, 169, 219, 0.08), rgba(255, 255, 255, 0.06));
  transform: translateY(-0.35rem);
  box-shadow: 0 0 25px rgba(51, 169, 219, 0.25), 0 8px 30px rgba(0, 0, 0, 0.3), inset 0 0 20px rgba(51, 169, 219, 0.03);
}

.cyber-cell::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(51, 169, 219, 0.3), transparent);
  opacity: 0;
  transition: opacity 0.4s;
}

.cyber-cell:hover::before {
  opacity: 1;
}

.heritage-scroll {
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.heritage-scroll::-webkit-scrollbar {
  display: none;
}

/* =====================================================
   SECTION: CERTIFIED PARTNERS – scrolling beam strip
   ===================================================== */

.gm-partner-stream {
  position: relative;
  width: 100%;
  height: 150px;
  overflow: visible;
  display: flex;
  align-items: center;
}

.gm-partner-line {
  display: flex;
  align-items: center;
  gap: 20px;
  white-space: nowrap;
  cursor: grab;
  user-select: none;
  will-change: transform;
  flex-shrink: 0;
  min-width: max-content;
}

.gm-partner-line.dragging,
.gm-partner-line:active {
  cursor: grabbing;
}

/* --- Wrapper: owns the flex slot --- */
.gm-partner-card-wrapper {
  position: relative;
  width: 180px;
  height: 110px;
  flex-shrink: 0;
}

/* --- Shared card layer base --- */
.gm-partner-card {
  position: absolute;
  top: 0;
  left: 0;
  width: 180px;
  height: 110px;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.1);
}

/* --- Normal card (logo + name): visible to the RIGHT of the beam --- */
.gm-card-normal {
  z-index: 2;
  background: rgba(255, 255, 255, 0.04);
  clip-path: inset(0 0 0 var(--gm-clip, 0%));
  display: flex;
  align-items: center;
  justify-content: center;
  transition: border-color 0.3s ease;
}

.gm-card-normal::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.03) 0%, transparent 60%);
  pointer-events: none;
}

/* --- Code card (ASCII/code view): visible to the LEFT of the beam --- */
.gm-card-code {
  z-index: 1;
  background: rgba(0, 0, 0, 0.85);
  clip-path: inset(0 calc(100% - var(--gm-clip, 0%)) 0 0);
  border-color: rgba(51, 169, 219, 0.15);
}

/* Inner content of normal card */
.gm-partner-card-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 9px;
  padding: 14px 16px;
  width: 100%;
}

.gm-partner-logo-area {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 46px;
}

.gm-partner-logo-img {
  max-width: 110px;
  max-height: 42px;
  object-fit: contain;
  filter: brightness(0) invert(1) opacity(0.65);
}

.gm-partner-logo-placeholder {
  width: 46px;
  height: 46px;
  border-radius: 10px;
  background: rgba(51, 169, 219, 0.08);
  border: 1px solid rgba(51, 169, 219, 0.2);
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'JetBrains Mono', monospace;
  font-size: 12px;
  font-weight: 700;
  color: rgba(51, 169, 219, 0.65);
  letter-spacing: 0.05em;
}

.gm-partner-name {
  font-family: 'JetBrains Mono', monospace;
  font-size: 9.5px;
  font-weight: 500;
  color: rgba(255, 255, 255, 0.35);
  text-transform: uppercase;
  letter-spacing: 0.09em;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 148px;
}

/* --- Sector profile tooltip overlay --- */
.gm-partner-sector {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 6px 10px;
  background: rgba(0, 0, 0, 0.82);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  font-family: 'JetBrains Mono', monospace;
  font-size: 8.5px;
  font-weight: 500;
  color: rgba(51, 169, 219, 0.9);
  text-align: center;
  letter-spacing: 0.04em;
  line-height: 1.3;
  border-top: 1px solid rgba(51, 169, 219, 0.18);
  border-radius: 0 0 14px 14px;
  opacity: 0;
  transform: translateY(4px);
  transition: opacity 0.25s ease, transform 0.25s ease;
  pointer-events: none;
  z-index: 3;
  white-space: normal;
  word-break: break-word;
}

.gm-partner-card-wrapper:hover .gm-partner-sector {
  opacity: 1;
  transform: translateY(0);
}

/* --- Code content (ASCII / code text layer) --- */
.gm-code-content {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 8px 7px;
  font-family: 'JetBrains Mono', 'Courier New', monospace;
  font-size: 9px;
  line-height: 1.45;
  color: rgba(51, 169, 219, 0.55);
  white-space: pre;
  overflow: hidden;
  -webkit-mask-image: linear-gradient(
    to right,
    rgba(0, 0, 0, 1) 0%,
    rgba(0, 0, 0, 0.85) 40%,
    rgba(0, 0, 0, 0.5) 70%,
    rgba(0, 0, 0, 0.15) 90%,
    transparent 100%
  );
  mask-image: linear-gradient(
    to right,
    rgba(0, 0, 0, 1) 0%,
    rgba(0, 0, 0, 0.85) 40%,
    rgba(0, 0, 0, 0.5) 70%,
    rgba(0, 0, 0, 0.15) 90%,
    transparent 100%
  );
  animation: gm-code-glitch 0.12s infinite linear alternate-reverse;
}

@keyframes gm-code-glitch {
  0%   { opacity: 1; }
  14%  { opacity: 0.9; }
  15%  { opacity: 1; }
  48%  { opacity: 0.85; }
  50%  { opacity: 1; }
  98%  { opacity: 0.92; }
  100% { opacity: 1; }
}


@media (max-width: 768px) {
  .gm-partner-card-wrapper,
  .gm-partner-card {
    width: 148px;
    height: 94px;
  }
  .gm-partner-logo-placeholder {
    width: 38px;
    height: 38px;
    font-size: 10px;
  }
  .gm-partner-logo-img {
    max-width: 88px;
    max-height: 34px;
  }
  .gm-code-content {
    font-size: 8px;
  }
}

.bento-card .bento-icon {
  transition: all 0.5s ease;
}

.bento-card:hover .bento-icon {
  transform: scale(1.2) rotate(5deg);
}

#service-modal {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
}

#modal-panel {
  transform: translateX(100%);
  transition: transform 0.5s ease-out;
}

#modal-body .modal-section-title {
  color: #33a8db;
  font-size: 0.7rem;
  font-family: 'JetBrains Mono', monospace;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  margin-bottom: 0.75rem;
}

#modal-body .modal-list {
  list-style: none;
  padding: 0;
  margin: 0 0 1.5rem 0;
}

#modal-body .modal-list li {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  color: rgba(255, 255, 255, 0.7);
  font-size: 0.875rem;
  margin-bottom: 0.5rem;
  line-height: 1.5;
}

#modal-body .modal-list li::before {
  content: "›";
  color: #33a8db;
  font-weight: bold;
  flex-shrink: 0;
}

#modal-body .modal-outcome {
  padding: 1rem;
  border: 1px solid rgba(51, 169, 219, 0.2);
  background: rgba(51, 169, 219, 0.05);
  border-radius: 0.5rem;
  color: rgba(255, 255, 255, 0.8);
  font-size: 0.875rem;
  line-height: 1.6;
  margin-bottom: 1.5rem;
}

.cyber-menu-item {
  position: relative;
  color: rgba(255, 255, 255, 0.7);
  font-size: 0.75rem;
  font-family: 'JetBrains Mono', monospace;
  text-transform: uppercase;
  letter-spacing: 0.1em;
  transition: all 0.3s;
  padding: 0.25rem 0.75rem;
  border-radius: 0.25rem;
}

.cyber-menu-item:hover {
  color: #33a9db;
  background-color: rgba(51, 169, 219, 0.1);
  text-shadow: 0 0 8px rgba(51, 169, 219, 0.6);
}

.isometric-container {
  transform: perspective(1000px) rotateX(0deg) rotateY(0deg);
  transition: transform 0.1s ease-out;
  transform-style: preserve-3d;
}

#background-canvas {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  pointer-events: none;
  opacity: 0.85;
}

.kinetic-text {
  color: #fff;
  transition: color 0.7s ease-out;
}

.kinetic-text.active {
  color: #33a9db;
  letter-spacing: normal;
}

.chat-message-content {
  font-size: 0.9rem;
  line-height: 1.8;
  font-family: 'Inter', sans-serif;
  color: rgba(255, 255, 255, 0.9);
  letter-spacing: 0.01em;
}

.chat-message-content p {
  margin-bottom: 0.5rem;
}

.chat-message-content p:last-child {
  margin-bottom: 0;
}

.chat-message-content strong {
  font-weight: 700;
  color: #fff;
  text-shadow: 0 0 6px rgba(51, 169, 219, 0.15);
}

.chat-message-content em {
  color: rgba(51, 169, 219, 0.9);
  font-style: italic;
}

.chat-message-content h1,
.chat-message-content h2,
.chat-message-content h3 {
  color: #fff;
  font-family: 'Space Grotesk', sans-serif;
  font-weight: 700;
  margin-top: 0.75rem;
  margin-bottom: 0.3rem;
  border-bottom: 1px solid rgba(51, 169, 219, 0.15);
  padding-bottom: 0.25rem;
}

.chat-message-content h1 { font-size: 1.15rem; }
.chat-message-content h2 { font-size: 1.05rem; }
.chat-message-content h3 { font-size: 0.95rem; border-bottom: none; }

.chat-message-content ul,
.chat-message-content ol {
  margin-bottom: 0.5rem;
  margin-top: 0.2rem;
  padding-left: 1.25rem;
  list-style-position: outside;
}

.chat-message-content ul {
  list-style-type: none;
}

.chat-message-content ol {
  list-style-type: decimal;
}

.chat-message-content ul > li {
  position: relative;
  padding-left: 1rem;
  margin-bottom: 0.2rem;
  color: rgba(255, 255, 255, 0.85);
  line-height: 1.6;
}

.chat-message-content ul > li::before {
  content: ">";
  position: absolute;
  left: 0;
  color: #33a9db;
  font-family: 'JetBrains Mono', monospace;
  font-weight: 700;
  font-size: 0.8rem;
}

.chat-message-content ol > li {
  margin-bottom: 0.2rem;
  color: rgba(255, 255, 255, 0.85);
  line-height: 1.6;
}

.chat-message-content ol > li::marker {
  color: #33a9db;
  font-family: 'JetBrains Mono', monospace;
  font-weight: 700;
}

.chat-message-content code {
  background-color: rgba(51, 169, 219, 0.08);
  border: 1px solid rgba(51, 169, 219, 0.15);
  padding: 0.15rem 0.4rem;
  border-radius: 0.25rem;
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.8rem;
  color: #33a9db;
}

.chat-message-content blockquote {
  border-left: 3px solid #33a9db;
  padding: 0.5rem 1rem;
  margin: 0.75rem 0;
  background-color: rgba(51, 169, 219, 0.05);
  border-radius: 0 0.25rem 0.25rem 0;
  color: rgba(255, 255, 255, 0.8);
  font-style: italic;
}

.chat-message-content hr {
  border: none;
  border-top: 1px solid rgba(51, 169, 219, 0.2);
  margin: 1rem 0;
}

/* --- Intro Header Section (Scoped) --- */
#intro-header {
  align-items: center;
  display: flex;
  height: 60vh;
  min-height: 350px;
  justify-content: center;
  overflow: hidden;
  position: relative;
  width: 100%;
}

@media (min-width: 768px) {
  #intro-header {
    height: 80vh;
  }
}

#intro-header::before {
  animation: fade-slide-down 2s 500ms cubic-bezier(0, 0.5, 0, 1) forwards;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, .8)),
    url('https://images.unsplash.com/photo-1487525219605-eadb39ae229c?ixlib=rb-0.3.5&auto=format&fit=crop&w=1280&q=60') no-repeat bottom;
  background-size: cover;
  bottom: 0;
  content: "";
  left: -5%;
  opacity: 0;
  position: absolute;
  right: -5%;
  top: 0;
  z-index: -1;
}

#intro-header::after {
  animation: rotate-up 500ms 500ms cubic-bezier(0, 0.5, 0, 1) forwards;
  background: #000;
  content: "";
  height: 40rem;
  left: -5%;
  position: absolute;
  right: -5%;
  top: 90%;
  transform-origin: 0 0;
  z-index: 0;
}

#intro-header-content {
  margin-top: -10%;
  overflow: visible;
  text-align: center;
  width: 100%;
  position: relative;
  z-index: 10;
}

#intro-header h1 {
  color: #33a8db;
  margin: 0;
  opacity: 0;
  animation: fade-slide-down-rotate 2s 2s cubic-bezier(0, 0.5, 0, 1) forwards, glow-loop 3s infinite alternate;
  animation-delay: 800ms, 3s;
  font-family: 'Space Grotesk', sans-serif;
  font-size: clamp(2.5rem, 8vw + 1vmin, 8rem);
  font-weight: 700;
  margin-bottom: 2.5%;
  letter-spacing: -0.05em;
}

#intro-header h3 {
  color: #fff;
  margin: 0;
  opacity: 0;
  animation: fade-slide-up 3s 3s cubic-bezier(0, 0.5, 0, 1) forwards;
  animation-delay: 100ms;
  font-size: clamp(0.6rem, 1.25vw + 0.8vmin, 1.5rem);
  font-weight: 200;
  letter-spacing: 0.3em;
  text-transform: uppercase;
}

@media (min-width: 768px) {
  #intro-header h3 {
    letter-spacing: 0.5em;
  }
}

#intro-header h3 span,
.intelligence-hub-glow {
  color: #33a8db;
  font-family: 'Space Grotesk', sans-serif;
  font-size: 2em;
  letter-spacing: 0;
  opacity: 0.8;
  padding: 0 0.25em;
  text-transform: none;
  animation: glow-loop-sub 3s infinite alternate;
  animation-delay: 4s;
}

#intro-header h4 {
  color: rgba(255, 255, 255, 0.6);
  font-family: 'Inter', sans-serif;
  font-size: 0.9rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  margin-top: 2rem;
  opacity: 0;
  animation: fade-slide-up 3s 3.5s cubic-bezier(0, 0.5, 0, 1) forwards;
}

/* Animations */
@keyframes fade-slide-down {
  0% {
    opacity: 0;
    transform: translateY(-4rem);
  }

  100% {
    opacity: 1;
    transform: none;
  }
}

@keyframes fade-slide-down-rotate {
  0% {
    opacity: 0;
    transform: translateY(-4rem);
  }

  100% {
    opacity: 1;
    transform: rotate(-4deg);
  }
}

@keyframes fade-slide-up {
  0% {
    opacity: 0;
    transform: translateY(4rem);
  }

  100% {
    opacity: 1;
    transform: none;
  }
}

@keyframes rotate-up {
  100% {
    transform: rotateZ(-4deg);
  }
}

@keyframes glow-loop {
  from {
    text-shadow: 0 0 15px rgba(51, 169, 219, 0.3), 0 0 30px rgba(51, 169, 219, 0.1);
  }

  to {
    text-shadow: 0 0 40px rgba(51, 169, 219, 1), 0 0 80px rgba(51, 169, 219, 0.6), 0 0 120px rgba(51, 169, 219, 0.3);
  }
}

@keyframes glow-loop-sub {
  from {
    text-shadow: 0 0 8px rgba(51, 169, 219, 0.1);
    filter: brightness(1);
  }

  to {
    text-shadow: 0 0 20px rgba(51, 169, 219, 0.6), 0 0 40px rgba(51, 169, 219, 0.3);
    filter: brightness(1.2);
  }
}

/* Cursor Styles */
#cursor-dot,
#cursor-outline {
  position: fixed;
  top: 0;
  left: 0;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  z-index: 9999;
  pointer-events: none;
}

#cursor-dot {
  width: 8px;
  height: 8px;
  background-color: white;
}

#cursor-outline {
  width: 40px;
  height: 40px;
  border: 1px solid rgba(51, 169, 219, 0.5);
  transition: width 0.2s, height 0.2s, background-color 0.2s;
}

body.hovering #cursor-outline {
  width: 60px;
  height: 60px;
  background-color: rgba(51, 169, 219, 0.1);
  border-color: #33a9db;
}

/* Catchphrase Rotator */
.catchphrase-line {
  transition: opacity 0.6s ease, transform 0.6s ease;
  opacity: 0;
  transform: translateY(10px);
}

.catchphrase-line.visible {
  opacity: 1;
  transform: translateY(0);
}

.catchphrase-line.exit {
  opacity: 0;
  transform: translateY(-10px);
}

#catchphrase-sub .hub-glow {
  color: #33a9db;
  font-weight: 600;
  text-shadow: 0 0 12px rgba(51, 169, 219, 0.4);
}

/* Segment Cards */
.segment-card {
  min-height: 140px;
}

.segment-card.segment-selected {
  border-color: #33a9db;
  background: linear-gradient(135deg, rgba(51, 169, 219, 0.15), rgba(51, 169, 219, 0.05));
  box-shadow: 0 0 30px rgba(51, 169, 219, 0.3), inset 0 0 20px rgba(51, 169, 219, 0.05);
  transform: scale(1.03);
}

.segment-card.segment-dimmed {
  opacity: 0.25;
  pointer-events: none;
  transform: scale(0.97);
}

.lang-btn {
  font-family: 'JetBrains Mono', monospace;
  cursor: pointer;
  color: rgba(255, 255, 255, 0.5);
  background: transparent;
}

.lang-btn.lang-active {
  background-color: #33a9db;
  color: #000;
  font-weight: 700;
}

.intelligence-phase-offset {
  top: 40px;
}

.lottie-fullsize {
  width: 100%;
  height: 100%;
}

.catchphrase-rotator-height {
  min-height: 130px;
}

.chat-greeting-delay {
  animation-delay: 0.2s;
}

.dot-grid-bg {
  background-image: radial-gradient(#33a9db 1px, transparent 1px);
  background-size: 40px 40px;
}

.lon-accent {
  color: #e8564a;
}

.iubenda-hidden-link {
  position: absolute;
  left: -9999px;
  opacity: 0;
  pointer-events: none;
}

.blueprint-panel-closed {
  transform: translateX(100%);
}

.gdpr-gate-highlight {
  animation: gdpr-soft-pulse 2.5s ease-in-out infinite;
}

@keyframes gdpr-soft-pulse {
  0%, 100% { border-color: rgba(51, 169, 219, 0.2); background-color: rgba(51, 169, 219, 0.03); }
  50% { border-color: rgba(51, 169, 219, 0.45); background-color: rgba(51, 169, 219, 0.08); }
}

.gdpr-gate-highlight.gdpr-checked {
  animation: none;
  border-color: rgba(34, 197, 94, 0.3);
  background-color: rgba(34, 197, 94, 0.05);
}

.gdpr-gate-flash {
  animation: gdpr-flash 0.6s ease-in-out 2;
}

@keyframes gdpr-flash {
  0%, 100% { border-color: rgba(51, 169, 219, 0.3); background-color: rgba(51, 169, 219, 0.05); }
  50% { border-color: rgba(51, 169, 219, 0.7); background-color: rgba(51, 169, 219, 0.15); box-shadow: 0 0 12px rgba(51, 169, 219, 0.2); }
}

#voice-btn.voice-active {
  color: #ef4444;
  animation: voice-pulse 1s ease-in-out infinite;
}

@keyframes voice-pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.4; }
}

/* Strategy Section: Orbital Container */
.strategy-orbital {
  background: radial-gradient(ellipse at center, rgba(51, 169, 219, 0.04) 0%, transparent 70%);
  cursor: crosshair;
}

.strategy-chip {
  font-family: 'JetBrains Mono', monospace;
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: 0.07em;
  color: rgba(255, 255, 255, 1);
  border: 1px solid rgba(255, 255, 255, 0.1);
  border-radius: 8px;
  background: rgba(8, 8, 12, 0.92);
  cursor: pointer;
  transition: color 0.3s, border-color 0.3s, background 0.3s, box-shadow 0.3s;
  user-select: none;
  white-space: nowrap;
  padding: 11px 20px;
  text-align: center;
}

.strategy-chip:hover {
  color: #33a8db;
  border-color: rgba(51, 169, 219, 0.5);
  background: rgba(51, 169, 219, 0.08);
  box-shadow: 0 0 20px rgba(51, 169, 219, 0.25), 0 0 40px rgba(51, 169, 219, 0.08);
  z-index: 15;
}

.strategy-chip-active {
  color: #33a8db;
  border-color: rgba(51, 169, 219, 0.6);
  background: rgba(51, 169, 219, 0.12);
  box-shadow: 0 0 24px rgba(51, 169, 219, 0.3), 0 0 48px rgba(51, 169, 219, 0.1);
  z-index: 15;
}

@media (min-width: 768px) {
  .strategy-chips-container {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 440px;
  }

  .strategy-chip-abs {
    position: absolute;
    will-change: transform;
  }
}

@media (max-width: 767px) {
  .strategy-chips-container {
    display: grid;
    grid-template-columns: 1fr;
    gap: 7px;
    width: 100%;
    box-sizing: border-box;
  }

  .strategy-chip {
    text-align: center;
    font-size: 11px;
    padding: 10px 12px;
    white-space: normal;
    word-break: break-word;
    width: 100%;
    box-sizing: border-box;
  }

  .strategy-orbital {
    cursor: default;
  }

  /* Prevent strategy section from causing horizontal scroll */
  section:has(.strategy-chips-container),
  div:has(> .strategy-chips-container) {
    overflow-x: hidden;
    max-width: 100vw;
  }
}

.strategy-panel-open {
  animation: panelFadeIn 0.3s ease-out;
}

@keyframes panelFadeIn {
  from { opacity: 0; transform: scale(0.95); }
  to { opacity: 1; transform: scale(1); }
}

/* ========================================
   Static Page Template (page.php)
   ======================================== */

.gm-page-body h2 {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 1.75rem;
  font-weight: 700;
  color: #fff;
  margin-top: 2.5rem;
  margin-bottom: 1rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid rgba(255,255,255,0.08);
}

.gm-page-body h3 {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 1.35rem;
  font-weight: 600;
  color: rgba(255,255,255,0.9);
  margin-top: 2rem;
  margin-bottom: 0.75rem;
}

.gm-page-body h4 {
  font-family: 'Space Grotesk', sans-serif;
  font-size: 1.1rem;
  font-weight: 600;
  color: #33a9db;
  margin-top: 1.5rem;
  margin-bottom: 0.5rem;
}

.gm-page-body p {
  color: rgba(255,255,255,0.7);
  font-size: 0.95rem;
  line-height: 1.85;
  margin-bottom: 1.25rem;
}

.gm-page-body a {
  color: #33a9db;
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color 0.2s;
}

.gm-page-body a:hover {
  color: #fff;
}

.gm-page-body ul,
.gm-page-body ol {
  color: rgba(255,255,255,0.7);
  font-size: 0.95rem;
  line-height: 1.85;
  margin-bottom: 1.25rem;
  padding-left: 1.5rem;
}

.gm-page-body ul {
  list-style-type: disc;
}

.gm-page-body ol {
  list-style-type: decimal;
}

.gm-page-body li {
  margin-bottom: 0.5rem;
}

.gm-page-body li::marker {
  color: #33a9db;
}

.gm-page-body blockquote {
  border-left: 3px solid #33a9db;
  padding: 1rem 1.5rem;
  margin: 1.5rem 0;
  background: rgba(51,169,219,0.05);
  border-radius: 0 8px 8px 0;
  color: rgba(255,255,255,0.8);
  font-style: italic;
}

.gm-page-body img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  border: 1px solid rgba(255,255,255,0.08);
  margin: 1.5rem 0;
}

.gm-page-body pre {
  background: rgba(255,255,255,0.03);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 8px;
  padding: 1.25rem;
  overflow-x: auto;
  margin: 1.5rem 0;
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.85rem;
  color: rgba(255,255,255,0.8);
}

.gm-page-body code {
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.85em;
  background: rgba(255,255,255,0.06);
  padding: 0.15em 0.4em;
  border-radius: 4px;
  color: #33a9db;
}

.gm-page-body pre code {
  background: none;
  padding: 0;
  color: inherit;
}

.gm-page-body table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.5rem 0;
  font-size: 0.9rem;
}

.gm-page-body th {
  text-align: left;
  font-weight: 600;
  color: #33a9db;
  border-bottom: 2px solid rgba(51,169,219,0.3);
  padding: 0.75rem 1rem;
  font-family: 'Space Grotesk', sans-serif;
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.gm-page-body td {
  color: rgba(255,255,255,0.7);
  border-bottom: 1px solid rgba(255,255,255,0.06);
  padding: 0.75rem 1rem;
}

.gm-page-body tr:hover td {
  background: rgba(51,169,219,0.03);
}

.gm-page-body hr {
  border: none;
  border-top: 1px solid rgba(255,255,255,0.08);
  margin: 2.5rem 0;
}

.gm-page-body strong {
  color: rgba(255,255,255,0.95);
  font-weight: 600;
}

.gm-page-body em {
  color: rgba(255,255,255,0.8);
}

.gm-page-body .wp-block-image {
  margin: 2rem 0;
}

.gm-page-body .wp-block-buttons {
  margin: 2rem 0;
}

.gm-page-body .wp-block-button__link {
  display: inline-block;
  padding: 0.75rem 2rem;
  background: rgba(51,169,219,0.15);
  border: 1px solid rgba(51,169,219,0.4);
  color: #33a9db;
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  border-radius: 8px;
  text-decoration: none;
  transition: all 0.2s;
}

.gm-page-body .wp-block-button__link:hover {
  background: rgba(51,169,219,0.25);
  border-color: rgba(51,169,219,0.7);
  color: #fff;
}

/* --- Hide background canvas on mobile (particle system not running) --- */
@media (max-width: 767px) {
  #background-canvas {
    display: none;
  }
}

/* --- Mobile: static AI icon replacing Lottie --- */
.gm-ai-mobile-icon {
  align-items: center;
  justify-content: center;
  width: 80px;
  height: 80px;
  border-radius: 50%;
  border: 1.5px solid rgba(51, 169, 219, 0.35);
  background: radial-gradient(circle at 50% 50%, rgba(51, 169, 219, 0.08) 0%, transparent 70%);
  animation: gm-icon-pulse 3s ease-in-out infinite;
}

.gm-ai-mobile-icon .material-symbols-outlined {
  font-size: 36px;
  color: rgba(51, 169, 219, 0.75);
}

@keyframes gm-icon-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(51, 169, 219, 0.15); }
  50%       { box-shadow: 0 0 0 10px rgba(51, 169, 219, 0); }
}

/* ============================================================
   prefers-reduced-motion — disable all non-essential motion
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }

  .gm-ai-mobile-icon {
    animation: none;
  }

  .gm-partner-sector {
    transition: none;
  }

  .catchphrase-line {
    transition: none;
  }

  lottie-player {
    display: none;
  }
}