@tailwind base;
@tailwind components;
@tailwind utilities;

body {
  font-family: var(--font-sans), -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif,
    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  @apply bg-background text-foreground;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@layer utilities {
  .text-balance {
    text-wrap: balance;
  }

  .text-gradient-primary {
    @apply bg-gradient-to-r from-primary to-blue-400 bg-clip-text text-transparent;
  }

  .noise-texture::before {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
    opacity: 0.02;
    /* Reduzido para ser mais sutil */
    pointer-events: none;
    z-index: -1;
  }

  .dark .noise-texture::before {
    opacity: 0.04;
    /* Pode ser um pouco mais visível no escuro */
    filter: invert(1);
  }

  .hero-glow {
    position: absolute;
    inset: -10px;
    /* Expandir um pouco para o brilho ser mais difuso */
    border-radius: inherit;
    box-shadow: 0 0 70px 25px var(--tw-shadow-color, theme("colors.primary.DEFAULT")), 0 0 140px 50px var(--tw-shadow-color, theme("colors.primary.DEFAULT"));
    opacity: 0.12;
    z-index: -1;
    animation: pulse-glow 5s infinite alternate ease-in-out;
  }

  .dark .hero-glow {
    opacity: 0.18;
    /* Brilho um pouco mais intenso no escuro */
  }

  @keyframes pulse-glow {
    0% {
      opacity: 0.1;
      transform: scale(0.95);
    }

    100% {
      opacity: 0.15;
      /* Ajustado para dark mode no .dark .hero-glow */
      transform: scale(1.05);
    }
  }

  \
 .dark @keyframes pulse-glow {
    0% {
      opacity: 0.12;
      transform: scale(0.95);
    }

    100% {
      opacity:
        0.20;
      transform: scale(1.05);
    }
  }

  .perspective-container {
    perspective: 1200px;
    /* Aumentado para um efeito 3D mais sutil */
  }
}

@layer base {
  :root {
    --background: 0 0% 100%;
    /* #FFFFFF */
    --foreground: 240 10% 3.9%;
    /* #1E1E1E */
    --card: 0 0% 100%;
    --card-foreground: 240 10% 3.9%;
    --popover: 0 0% 100%;
    --popover-foreground: 240 10% 3.9%;
    --primary: 206 58% 52%;
    /* #4D94BF */
    --primary-foreground: 0 0% 98%;
    /* #FFFFFF */
    --secondary: 215 28% 97%;
    /* #F5F7FA */
    --secondary-foreground: 240 10% 3.9%;
    --muted: 215 28% 97%;
    --muted-foreground: 240 4% 46%;
    /* #6B6B6B */
    --accent: 206 100% 87%;
    /* #BFDFFF */
    --accent-foreground: 240 10% 3.9%;
    --destructive: 0 84% 60%;
    --destructive-foreground: 0 0% 98%;
    --border: 215 20% 90%;
    /* #e2e8f0 */
    --input: 215 20% 90%;
    --ring: 206 58% 52%;
    --radius: 1rem;

    /* Cores específicas para o footer no modo claro (se necessário, mas Tailwind já lida bem) */
    --footer-background-light: var(--foreground);
    /* bg-foreground */
    --footer-text-light: theme("colors.neutral.400");
    /* text-neutral-400 */
    --footer-heading-light: theme("colors.white");
    /* text-white */
    --footer-link-hover-light: var(--primary);
    /* hover:text-primary */
    --footer-border-light: theme("colors.neutral.700");
    /* border-neutral-700 */
  }

  .dark {
    --background: 240 10% 3.9%;
    /* Cinza bem escuro, quase preto */
    --foreground: 0 0% 95%;
    /* Branco/Cinza claro */
    --card: 240 6% 10%;
    /* Cinza um pouco mais claro que o fundo */
    --card-foreground: 0 0% 95%;
    --popover: 240 6% 10%;
    --popover-foreground: 0 0% 95%;
    --primary: 206 65% 60%;
    /* Azul um pouco mais vibrante no escuro */
    --primary-foreground: 0 0% 98%;
    --secondary: 240 5% 15%;
    /* Cinza escuro para fundos secundários */
    --secondary-foreground: 0 0% 95%;
    --muted: 240 5% 15%;
    --muted-foreground: 240 4% 60%;
    /* Cinza mais claro para texto muted */
    --accent: 206 65% 60%;
    /* Pode ser o mesmo que o primário ou uma variação */
    --accent-foreground: 0 0% 98%;
    --destructive: 0 70% 50%;
    --destructive-foreground: 0 0% 98%;
    --border: 240 4% 18%;
    /* Bordas escuras */
    --input: 240 4% 18%;
    --ring: 206 65% 60%;

    /* Cores específicas para o footer no modo escuro */
    --footer-background-dark: theme("colors.neutral.900");
    /* bg-neutral-900 */
    --footer-text-dark: theme("colors.neutral.400");
    /* text-neutral-400 */
    --footer-heading-dark: var(--primary-foreground);
    /* text-primary-foreground (branco) */
    --footer-link-hover-dark: var(--primary);
    /* hover:text-primary */
    --footer-border-dark: theme("colors.neutral.800");
    /* border-neutral-800 */
  }
}

@layer base {
  * {
    @apply border-border;
  }

  body {
    @apply bg-background text-foreground;
  }

  html {
    scroll-behavior: smooth;
  }
}

/* Garantir que nada sobreponha a navbar */
.header-fixed {
  z-index: 9999 !important;
}

/* Melhorar o backdrop blur no Safari */
@supports (-webkit-backdrop-filter: blur(20px)) {
  .backdrop-blur-2xl {
    -webkit-backdrop-filter: blur(40px);
  }
}