/* Custom Variable Definitions */
:root {
    --sapphire-blue: #0F52BA;
    --gold-leaf: #D4AF37;
    --pure-white: #FFFFFF;
    --soft-gray: #F8FAFC;
}

/* Base Layout Tweaks */
body {
    background-color: var(--soft-gray);
    color: #1e293b;
    scroll-behavior: smooth;
}

/* Custom Color Classes for Brand Consistency */
.bg-sapphire { background-color: var(--sapphire-blue); }
.text-sapphire { color: var(--sapphire-blue); }
.bg-gold { background-color: var(--gold-leaf); }
.text-gold { color: var(--gold-leaf); }
.border-gold { border-color: var(--gold-leaf); }

/* Pillar Card Hover Effects */
.pillar-card {
    background: var(--pure-white);
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    border: 1px solid rgba(15, 82, 186, 0.1);
}

.pillar-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 25px -5px rgba(15, 82, 186, 0.1), 0 10px 10px -5px rgba(15, 82, 186, 0.04);
    border-color: var(--gold-leaf);
}

/* Golden Glow for Icons */
.icon-glow {
    text-shadow: 0 0 15px rgba(212, 175, 55, 0.3);
}

/* Custom Scrollbar */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: var(--soft-gray); }
::-webkit-scrollbar-thumb { background: var(--sapphire-blue); border-radius: 10px; }