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

@layer base {
  html {
    scroll-behavior: smooth;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }

  body {
    @apply bg-aegean-white text-deep-nazar;
  }

  ::selection {
    @apply bg-bosphorus/20 text-deep-nazar;
  }
}

@layer components {
  .glass-card {
    @apply bg-white/70 backdrop-blur-md border border-bosphorus/10 rounded-3xl;
  }

  .section-padding {
    @apply px-5 sm:px-8 md:px-12 lg:px-20 xl:px-32;
  }

  .container-wide {
    @apply max-w-7xl mx-auto w-full;
  }
}

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