@tailwind base;@tailwind components;@tailwind utilities;@layer components{.nav-container{@apply flex justify-between items-center p-6 bg-gray-900 text-white shadow-md;}.hero-content{@apply text-center py-20 bg-gray-50;}.cta-button{@apply inline-block mt-6 px-6 py-3 bg-blue-600 text-white font-semibold rounded-lg hover:bg-blue-700 transition;}}:root{--color-primary: #2563eb;--color-primary-dark: #1d4ed8;--color-secondary: #64748b;--color-accent: #f59e0b;--color-success: #10b981;--color-danger: #ef4444;--color-warning: #f59e0b;--color-white: #ffffff;--color-black: #000000;--color-gray-50: #f9fafb;--color-gray-100: #f3f4f6;--color-gray-900: #111827;--spacing-xs: .25rem;--spacing-sm: .5rem;--spacing-md: 1rem;--spacing-lg: 1.5rem;--spacing-xl: 2rem;--spacing-2xl: 3rem}@layer base{::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--color-gray-100)}::-webkit-scrollbar-thumb{background:var(--color-gray-50);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--color-secondary)}:root{--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05) , 0 1px 3px -1px rgb(0 0 0 / .1) ;--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1) ;--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1)}@layer components{@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes slide-up{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.fade-in{animation:fade-in .5s ease-out forwards}.slide-up{animation:slide-up .6s ease-out forwards}.header{@apply bg-white shadow-md border-b border-gray-200 px-6 py-4;}.hero{@apply relative bg-gradient-to-r from-primary to-primary-dark text-white py-20 px-6 overflow-hidden;background-image:linear-gradient(to right,var(--color-primary),var(--color-primary-dark))}.hero:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><defs><pattern id="grain" width="100" height="100" patternUnits="userSpaceOnUse"><circle cx="25" cy="25" r="1" fill="%23ffffff" opacity="0.1"/><circle cx="75" cy="75" r="1" fill="%23ffffff" opacity="0.1"/></pattern></defs><rect width="100" height="100" fill="url(%23grain)"/></svg>')}.card{@apply bg-white rounded-lg shadow-md p-6 border border-gray-200 hover:shadow-lg transition-shadow duration-300;}.btn-primary{@apply bg-primary text-white px-6 py-3 rounded-lg font-semibold hover:bg-primary-dark transition-all duration-200 shadow-md hover:shadow-lg focus:outline-none focus:ring-4 focus:ring-primary/25;background-color:var(--color-primary)}.btn-secondary{@apply bg-secondary text-white px-6 py-3 rounded-lg font-semibold hover:bg-gray-700 transition-all duration-200 shadow-md hover:shadow-lg focus:outline-none focus:ring-4 focus:ring-secondary/25;background-color:var(--color-secondary)}.btn-accent{@apply bg-accent text-white px-6 py-3 rounded-lg font-semibold hover:bg-yellow-500 transition-all duration-200 shadow-md hover:shadow-lg focus:outline-none focus:ring-4 focus:ring-accent/25;background-color:var(--color-accent)}}@layer utilities{.text-primary{color:var(--color-primary)}.bg-primary{background-color:var(--color-primary)}.spacing-xs{margin:var(--spacing-xs);padding:var(--spacing-xs)}}}