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

body {
    font-family: 'Inter', sans-serif;
    color: #4b5563; /* text-gray-600 equivalent */
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 700;
    color: #111827; /* text-gray-900 equivalent */
    letter-spacing: -0.02em;
}

/* Custom Overrides for Bootstrap to match the Tailwind vibe */
.text-danger {
    color: #e11d48 !important; /* Rose-600 */
}
.bg-danger {
    background-color: #e11d48 !important;
}
.btn-danger {
    background-color: #e11d48;
    border-color: #e11d48;
}
.btn-danger:hover {
    background-color: #be123c; /* Rose-700 */
    border-color: #be123c;
}
.bg-danger-subtle {
    background-color: #ffe4e6 !important; /* Rose-100 */
}

.tracking-widest {
    letter-spacing: 0.1em;
}

.hover-card {
    transition: all 0.3s ease;
    border: 1px solid transparent;
}

.hover-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04) !important;
    border-color: #ffe4e6;
}

.hover-card:hover .icon-box {
    background-color: #e11d48 !important;
    color: white !important;
}

.backdrop-blur {
    backdrop-filter: blur(8px);
}