@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700&family=Open+Sans:wght@300;400;500;600&display=swap');

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

@layer utilities {
  .font-rockwell {
    font-family: 'Rockwell Extra Bold', Rockwell !important;
  }
	.font-tnr {
    font-family: 'Times New Roman', Times New Roman !important;
  }
}

/* Base styles */
@layer base {
  body {
    font-family: 'Open Sans', sans-serif;
    color: #495057;
  }
nav{color:#fff;}

  h1, h2, h3, h4, h5, h6 {
    font-family: 'Outfit', sans-serif;
    color: #0052A3;
  }
}

/* Custom components */
@layer components {

  /* Header */
  .header {
    @apply bg-white text-white;
  }

  .header-nav {
    @apply text-white;
  }

  .logo-text {
    @apply text-white font-semibold;
  }



  /* CTA Button */
  .btn-cta {
    background-color: #FC9900;
    color: #00264D;
    @apply px-6 py-3 rounded-lg font-semibold transition duration-300;
  }

  .btn-cta:hover {
    @apply opacity-90;
  }

  /* Caption */
  .caption {
    color: #FC9900;
    @apply text-sm;
  }
}