/* Truth in the Truth — Cosmic Elevation Design System
 * Scoped under .tit-root so it never leaks into your theme.
 */

.tit-root {
  --background: 256 45% 6%;
  --foreground: 45 30% 96%;
  --card: 256 40% 9%;
  --card-foreground: 45 30% 96%;
  --primary: 268 85% 65%;
  --primary-foreground: 256 45% 6%;
  --primary-glow: 280 95% 75%;
  --secondary: 42 85% 60%;
  --gold: 42 90% 62%;
  --gold-glow: 48 95% 72%;
  --muted: 256 30% 14%;
  --muted-foreground: 250 15% 70%;
  --accent: 195 90% 60%;
  --border: 260 30% 18%;
  --radius: 1rem;

  --gradient-cosmos: linear-gradient(180deg, hsl(256 60% 4%) 0%, hsl(268 55% 12%) 50%, hsl(280 50% 8%) 100%);
  --gradient-aurora: linear-gradient(135deg, hsl(268 85% 65%) 0%, hsl(195 90% 60%) 50%, hsl(42 90% 62%) 100%);
  --gradient-gold: linear-gradient(135deg, hsl(42 90% 62%) 0%, hsl(48 95% 72%) 100%);
  --gradient-violet: linear-gradient(135deg, hsl(268 85% 65%) 0%, hsl(290 80% 55%) 100%);
  --gradient-radial-glow: radial-gradient(circle at 50% 0%, hsl(268 85% 65% / 0.35), transparent 60%);

  --shadow-elevate: 0 30px 80px -20px hsl(268 85% 65% / 0.5);
  --shadow-glow: 0 0 60px hsl(280 95% 75% / 0.4);

  font-family: 'Inter', sans-serif;
  background: var(--gradient-cosmos);
  background-attachment: fixed;
  color: hsl(var(--foreground));
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
}

.tit-root * { box-sizing: border-box; }
.tit-root h1, .tit-root h2, .tit-root h3, .tit-root .display {
  font-family: 'Cormorant Garamond', serif;
  letter-spacing: -0.02em;
}

/* Utility classes */
.tit-root .text-gradient-aurora {
  background: var(--gradient-aurora);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}
.tit-root .text-gradient-gold {
  background: var(--gradient-gold);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}
.tit-root .text-gradient-violet {
  background: var(--gradient-violet);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}
.tit-root .bg-gradient-aurora { background: var(--gradient-aurora); }
.tit-root .bg-gradient-gold { background: var(--gradient-gold); }
.tit-root .bg-radial-glow { background: var(--gradient-radial-glow); }
.tit-root .shadow-elevate { box-shadow: var(--shadow-elevate); }
.tit-root .shadow-glow { box-shadow: var(--shadow-glow); }

.tit-root .glass {
  background: hsl(256 40% 12% / 0.5);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid hsl(268 50% 35% / 0.25);
}
.tit-root .glass-gold {
  background: hsl(42 30% 14% / 0.4);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border: 1px solid hsl(42 70% 50% / 0.3);
}

/* Buttons */
.tit-root .tit-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
  font-weight: 600; font-size: 1rem; border-radius: 9999px;
  padding: 0.95rem 1.75rem; transition: all 0.5s cubic-bezier(0.22, 1, 0.36, 1);
  cursor: pointer; text-decoration: none; border: none; line-height: 1;
}
.tit-root .tit-btn-elevate {
  background: var(--gradient-violet); color: hsl(var(--primary-foreground));
  box-shadow: var(--shadow-elevate);
}
.tit-root .tit-btn-elevate:hover { transform: translateY(-2px); box-shadow: var(--shadow-glow); }
.tit-root .tit-btn-gold {
  background: var(--gradient-gold); color: hsl(var(--primary-foreground));
}
.tit-root .tit-btn-gold:hover { transform: translateY(-2px); filter: brightness(1.1); }
.tit-root .tit-btn-glass {
  background: hsl(256 40% 12% / 0.5); color: hsl(var(--foreground));
  backdrop-filter: blur(20px); border: 1px solid hsl(268 50% 35% / 0.4);
}
.tit-root .tit-btn-glass:hover { background: hsl(256 40% 18% / 0.7); }
.tit-root .tit-btn-sm { padding: 0.55rem 1.1rem; font-size: 0.875rem; }
.tit-root .tit-btn-xl { padding: 1.15rem 2.25rem; font-size: 1.125rem; }

/* Animations */
.tit-root .float-slow { animation: tit-float-slow 8s ease-in-out infinite; }
.tit-root .float-med { animation: tit-float-med 6s ease-in-out infinite; }
.tit-root .pulse-glow { animation: tit-pulse-glow 4s ease-in-out infinite; }
.tit-root .ascend { animation: tit-ascend 1.2s cubic-bezier(0.22, 1, 0.36, 1) both; }

@keyframes tit-float-slow {
  0%,100% { transform: translateY(0) rotate(0deg); }
  50% { transform: translateY(-18px) rotate(2deg); }
}
@keyframes tit-float-med {
  0%,100% { transform: translateY(0); } 50% { transform: translateY(-10px); }
}
@keyframes tit-pulse-glow {
  0%,100% { box-shadow: 0 0 30px hsl(268 85% 65% / 0.3); }
  50% { box-shadow: 0 0 70px hsl(280 95% 75% / 0.6); }
}
@keyframes tit-ascend {
  from { opacity: 0; transform: translateY(40px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes tit-marquee {
  from { transform: translateX(0); } to { transform: translateX(-50%); }
}
.tit-root .marquee-track {
  display: flex; gap: 3rem; white-space: nowrap;
  animation: tit-marquee 30s linear infinite;
}

.tit-root .container-tit { max-width: 1200px; margin: 0 auto; padding: 0 1rem; }

/* Smooth scroll */
html:has(.tit-root) { scroll-behavior: smooth; }