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

html { scroll-behavior: smooth; }

@layer utilities {
    .bg-pol-navy { background-color: #0033A0; }
    .bg-pol-red { background-color: #DA291C; }
    .bg-pol-light { background-color: #F8F9FA; }
    
    .text-pol-navy { color: #0033A0; }
    .text-pol-red { color: #DA291C; }
    .text-pol-dark { color: #212529; }
    
    .border-pol-navy { border-color: #0033A0; }
    .border-pol-red { border-color: #DA291C; }
    
    .btn-navy {
        @apply inline-flex items-center justify-center bg-[#0033A0] hover:bg-[#002266] text-white font-sans font-bold uppercase tracking-wide py-4 px-8 rounded shadow-md hover:shadow-lg transition-all duration-300;
    }
    
    .btn-red {
        @apply inline-flex items-center justify-center bg-[#DA291C] hover:bg-[#b01f14] text-white font-sans font-bold uppercase tracking-wide py-4 px-8 rounded shadow-md hover:shadow-lg transition-all duration-300;
    }

    .btn-outline-navy {
        @apply inline-flex items-center justify-center border-2 border-[#0033A0] text-[#0033A0] hover:bg-[#0033A0] hover:text-white font-sans font-bold uppercase tracking-wide py-3 px-8 rounded transition-all duration-300;
    }
    
    .pol-heading {
        @apply font-serif font-bold text-[#0033A0];
    }
    
    .pol-card {
        @apply bg-white rounded shadow-sm hover:shadow-xl transition-shadow duration-300 overflow-hidden border-t-4 border-[#DA291C];
    }
    
    .nav-link {
        @apply text-[#212529] hover:text-[#DA291C] font-sans font-medium uppercase tracking-wide text-sm transition-colors duration-300;
    }
    
    .nav-link.active {
        @apply text-[#0033A0] font-bold;
    }
}