/* style.css */

/* ADDED: Pre-animation states to prevent FOUC on hero elements */
.hero-text h2, 
.hero-text h1, 
.hero-subtitle, 
.hero-text a, 
.hero-image {
    opacity: 0;
    transform: translateY(20px);
}

/* General Body & Background */
body {
  background-color: #000000;
  color: #FFFFFF;
  font-family: 'General Sans', sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background-image: 
    linear-gradient(to right, rgba(139, 92, 246, 0.1) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(139, 92, 246, 0.1) 1px, transparent 1px);
  background-size: 40px 40px;
  animation: background-pan 20s linear infinite;
}

/* ADDED: Hide scrollbar */
body::-webkit-scrollbar {
    display: none;
}

body {
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}

/* Enhanced Button Styles */
.btn-primary {
  background-color: #8B5CF6;
  color: #ffffff;
  border: 2px solid #8B5CF6;
  transition: background-color 0.3s ease, color 0.3s ease, transform 0.2s ease, box-shadow 0.2s ease;
}
.btn-primary:hover {
  background-color: #FFFFFF;
  color: #000000;
  border-color: #FFFFFF;
  transform: translateY(-2px);
  box-shadow: 0 10px 20px rgba(139, 92, 246, 0.3);
}
.btn-secondary {
  background-color: #FFFFFF;
  color: #000000;
  transition: background-color 0.3s ease, color 0.3s ease, transform 0.2s ease;
}
.btn-secondary:hover {
  background-color: #000000;
  color: #FFFFFF;
  transform: translateY(-2px);
}

/* Logo Animation Styles */
.site-logo-char {
  display: inline-block;
  opacity: 0;
  transform: translateY(-20px) rotateX(90deg);
  transform-origin: bottom;
}

/* Header Dropdown Menu */
/* UPDATED: Changed to a solid gloss black background */
.dropdown-menu {
  display: none;
  opacity: 0;
  transform: translateY(-10px) scale(0.95);
  transform-origin: top right;
  background-color: #111111; /* Gloss black */
  border: 1px solid #333333; /* Slightly lighter border for definition */
  box-shadow: 0 8px 32px 0 rgba(0, 0, 0, 0.37);
}
.dropdown-menu a {
  position: relative;
  transition: color 0.3s ease, background-color 0.3s ease;
  opacity: 0;
  transform: translateX(15px);
  border-radius: 6px;
}
.dropdown-menu a:hover {
  color: #FFFFFF;
  background-color: rgba(139, 92, 246, 0.2);
}

/* 3D Gloss Tiles */
.tile-3d {
  background-color: rgba(0,0,0,0.5);
  border: 1px solid #2a2a2a;
  box-shadow: 0 10px 30px rgba(0,0,0,0.3), inset 0 1px 1px rgba(255,255,255,0.05);
  transition: box-shadow 0.3s ease, transform 0.3s ease;
  transform-style: preserve-3d;
  border-radius: 1rem;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}
.tile-3d::after {
  content: ''; position: absolute; top: 0; left: 0;
  width: 100%; height: 100%;
  background: radial-gradient(circle at var(--mouse-x) var(--mouse-y), rgba(139, 92, 246, 0.25), transparent 40%);
  opacity: 0; transition: opacity 0.4s ease;
}
.tile-3d:hover::after { opacity: 1; }

/* Interactive Feature Highlight (Index Page) */
.feature-highlight { transition: all 0.3s ease-in-out; }
.feature-highlight.active {
  color: #FFFFFF; border-color: #8B5CF6;
  background-color: rgba(139, 92, 246, 0.1);
}

/* CTA Section Animated Background */
.cta-animated-bg {
  background: linear-gradient(135deg, #4f46e5, #8B5CF6, #2c25a0);
  background-size: 400% 400%;
  animation: gradient-animation 10s ease infinite;
}

/* FAQ Accordion (Index Page) */
.faq-answer-panel { display: none; }
.faq-answer-panel.active { display: block; }
.faq-tab-button.active { color: #8B5CF6; }

/* Demo Modal (Index Page) */
.modal-overlay {
  position: fixed; top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0, 0, 0, 0.7); display: none;
  align-items: center; justify-content: center; z-index: 1000;
  opacity: 0; transition: opacity 0.3s ease;
}
.modal-overlay.active { opacity: 1; }
.modal-content {
  background: #1a1a1a; padding: 1rem; border-radius: 12px;
  width: 90%; max-width: 900px; height: 80%; position: relative;
  transform: scale(0.95); transition: transform 0.3s ease;
}
.modal-overlay.active .modal-content { transform: scale(1); }
.modal-close-btn {
  position: absolute; top: -15px; right: -15px; background: white;
  color: black; border: none; border-radius: 50%; width: 30px;
  height: 30px; font-size: 20px; cursor: pointer;
}
.modal-body { width: 100%; height: 100%; }
.modal-body iframe { width: 100%; height: 100%; border-radius: 8px; }

/* Job Listing (Careers Page) */
.job-listing ul {
  list-style-position: inside;
  padding-left: 0.5rem;
}
.job-listing ul li {
  position: relative;
  padding-left: 1.5rem;
  margin-bottom: 0.5rem;
}
.job-listing ul li::before {
  content: '›';
  position: absolute;
  left: 0;
  color: #8B5CF6;
  font-weight: bold;
  font-size: 1.25rem;
  line-height: 1;
}

/* Legal Pages (Terms & Privacy) */
.legal-content h2 {
  font-size: 1.5rem;
  font-weight: 700;
  color: #8B5CF6;
  margin-top: 2rem;
  margin-bottom: 0.75rem;
}
.legal-content p, .legal-content ul {
  color: #b3b3b3;
  line-height: 1.75;
  margin-bottom: 1rem;
}
.legal-content ul {
  list-style-position: inside;
}
.legal-content ul li {
  margin-left: 1rem;
  position: relative;
}
.legal-content ul li::before {
  content: '•';
  position: absolute;
  left: -1rem;
  color: #8B5CF6;
}

/* Styling for static content containers on legal pages */
.legal-container {
  background-color: rgba(10, 10, 10, 0.5); /* Subtle dark background */
  border: 1px solid #2a2a2a; /* Same border as other tiles */
  border-radius: 1rem;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

/* Fix for demo modal iframe visibility */
.modal-body iframe {
  width: 100%;
  height: 100%;
  border-radius: 8px;
  background-color: #FFFFFF; /* Ensures the iframe is visible before its content loads */
}


/* ADDED: Hide scrollbar for all browsers */
body::-webkit-scrollbar {
    display: none; /* Chrome, Safari, Opera */
}
body {
    -ms-overflow-style: none;  /* IE and Edge */
    scrollbar-width: none;  /* Firefox */
}