@import "tailwindcss";

/* :root {
  --background: #ffffff;
  --foreground: #171717;
}

@theme inline {
  --color-background: var(--background);
  --color-foreground: var(--foreground);
  --font-sans: var(--font-geist-sans);
  --font-mono: var(--font-geist-mono);
}

@media (prefers-color-scheme: dark) {
  :root {
    --background: #0a0a0a;
    --foreground: #ededed;
  }
}

body {
  background: var(--background);
  color: var(--foreground);
  font-family: Arial, Helvetica, sans-serif;
} */
@tailwind utilities;

@layer base {
  @font-face {
    font-family: "zentry";
    src: url("/fonts/zentry-regular.woff2") format("woff2");
    font-weight: normal;
    font-style: normal;
  }
}

@layer utilities {
  .special-font b {
    font-family: "Zentry";
    font-feature-settings: "ss01" on;
  }
}

/* === Animated Background Helpers === */

/* very small animation for soft breathing glow */
@keyframes soft-breath {
  0% {
    opacity: 0.34;
    transform: scale(1);
  }

  50% {
    opacity: 0.46;
    transform: scale(1.02);
  }

  100% {
    opacity: 0.34;
    transform: scale(1);
  }
}

.pointer-events-none {
  pointer-events: none;
}

/* ensure large blur utility for older Tailwind setups */
.blur-3xl {
  filter: blur(36px);
}

/* apply gentle breathing to radial lights */
.pointer-events-none>.breath {
  animation: soft-breath 5.5s ease-in-out infinite;
}

/* Border Animation */
@property --angle {
  syntax: "<angle>";
  initial-value: 0deg;
  inherits: false;
}

@keyframes spin {
  from {
    --angle: 0deg;
  }

  to {
    --angle: 360deg;
  }
}

.animate-border::after,
.animate-border::before {
  content: '';
  position: absolute;
  inset: -5px;
  /* Extends beyond the container */
  background-image: conic-gradient(from var(--angle), #ff4545, #00ff99, #006aff, #ff0095, #ff4545);
  top: 50%;
  left: 50%;
  translate: -50% -50%;
  z-index: -1;
  border-radius: inherit;
  /* Inherits rounded-3xl from parent */
  animation: 3s spin linear infinite;
}

.animate-border::before {
  filter: blur(1.5rem);
  opacity: 0.5;
}
html{
  scroll-behavior: smooth;
}