/* Custom styles to apply the Inter font */
body {
    font-family: 'Inter', sans-serif;
}
/* Custom color palette */
:root {
    --brand-red: #C0392B;
    --brand-red-dark: #A93226; /* Darker red for hover states */
    --brand-yellow: #F1C40F;
    --brand-green: #27AE60;
    --text-dark: #2C3E50;
    --bg-light: #FDFEFE;
    --bg-subtle: #F4F6F7;
}
.bg-brand-red { background-color: var(--brand-red); }
.text-brand-red { color: var(--brand-red); }
.border-brand-red { border-color: var(--brand-red); }
.hover\:bg-brand-red-dark:hover { background-color: var(--brand-red-dark); } /* Custom hover class */

.bg-brand-yellow { background-color: var(--brand-yellow); }
.text-brand-yellow { color: var(--brand-yellow); }

.bg-brand-green { background-color: var(--brand-green); }
.text-brand-green { color: var(--brand-green); }

.text-dark { color: var(--text-dark); }
.bg-light { background-color: var(--bg-light); }
.bg-subtle { background-color: var(--bg-subtle); }

/* Smooth scroll behavior */
html {
    scroll-behavior: smooth;
}

/* --- Eye-catching Logo Style --- */
#logo-text {
    /* Gradient Text Effect */
    background: linear-gradient(45deg, #C0392B, #E67E22);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    
    /* Transition for hover effects */
    transition: letter-spacing 0.3s ease-in-out;
}

#logo-text:hover {
    /* Letter spacing effect on hover */
    letter-spacing: 1px;
}