/* === base & root (professional palette) === */
    :root {
      --primary-navy: #13294b;
      --primary-navy-light: #1f3a60;
      --accent-slate: #4f6f8f;
      --grey-soft: #f8fafd;
      --grey-border: #e2e8f0;
      --text-dark: #1e2b37;
      --text-medium: #43505e;
      --text-light-bl:#1e3a5f;
      --dark-grey:#2d3748;
      --off-white:#fafcff;
      --light-navy:#1e3f64;

      /* Newly Added */
      --bg-color:#ffffff;
      --bg-color-sepration:#f8fafd;
      --border-color:#eef2f6;
      --white-color:white;
      --bg-blue-soft: #f5f9ff;
      --of-white:#f0f5fc;
      --of-lg-grey:#888;
      --yellow:#ffb400;
      --grey:#43505e;
      --light-off-white:#fff;
      --sky-grey:#d0ddee;
      --pure-white:#f9fbfd;
      --off-white-color:#f0f5fb;
      --light-cream:#eaedf2;
      --cream:#f8fbfe;
      --sky:#e2eaf3;
      --white-cream:#f7fafd;
      --darkest-navy:rgba(19,41,75,0.15);
      --little-brown:rgba(255,255,255,0.15);
      --primary-navy-soft: rgba(19,41,75,0.05);
      --primary-navy-05: rgba(19,41,75,0.05);
      --border-white-10: rgba(255,255,255,0.1);
      --primary-navy-10: rgba(19,41,75,0.1);
      --white-20: rgba(255,255,255,0.2);
      --light-brown:rgba(19,41,75,0.3);
      --black:rgba(0, 20, 40, 0.15);
      --lg-black:rgba(0,20,40,0.08);
      --light-black-color:rgba(0,0,0,0.2);
      --black-dark-color:rgba(0, 20, 40, 0.05);
      --dark-color-black:rgba(0, 20, 40, 0.08);
      --dark-brown:rgba(19, 41, 75, 0.05);
      --blackish-brown:rgba(19, 41, 75, 0.02);
      --navbar-black:rgba(0,0,0,0.1);
      --card-black:rgba(0, 0, 0, 0.08);
      --lg-brown-grey:rgba(255, 255, 255, 0.1);
      



      /* New Shadows */
        --shadow-soft: 0 30px 50px -30px rgba(19,41,75,0.2);
        --shadow-card: 0 25px 45px -25px rgba(19,41,75,0.25);
        --shadow-light: 0 25px 45px -25px rgba(19,41,75,0.15);
        --shadow-button: 0 20px 30px -10px rgba(0,0,0,0.3);
        --shadow-sm: 0 10px 20px -10px rgba(19,41,75,0.3);
        --shadow-softs: 0 20px 40px -20px rgba(19,41,75,0.1);
        --shadow-subtle: 0 10px 30px -20px rgba(19,41,75,0.1);
        --shadow-neutral-md: 0 20px 30px -10px rgba(0,0,0,0.2);
        --shadow-xs: 0 5px 15px rgba(19,41,75,0.1);
        --shadow-xl: 0 30px 60px -30px rgba(19,41,75,0.2);
        --shadow-ss: 0 15px 30px -15px rgba(19,41,75,0.1);
        --shadow-cards: 0 25px 50px -25px rgba(19,41,75,0.2);
        --shadow-md: 0 20px 40px -20px rgba(19,41,75,0.15);
        --shadow-xld: 0 30px 60px -30px rgba(19,41,75,0.3);
        --shadow-lg: 0 20px 40px -20px rgba(19,41,75,0.2);
        --navy:rgba(19,41,75,0.2);
        --d-black:rgba(0,0,0,0.3);
        --bg-black:rgba(19,41,75,0.02);
        --background-black:rgba(0, 0, 0, 0.05);
        --dark-black-brown:rgba(0, 0, 0, 0.03);
        --normal-navy:#10233c;
        --light-sky-grey:#bdc9db;
        
      
    }
    * { font-family: 'Inter', sans-serif; }
    body { background-color: var(--bg-color); color: var(--text-dark); }
/* ========== SOCIAL MEDIA ICONS ========== */

.footer-social {
    display: flex;
    gap: 1rem;
    margin-top: 1.5rem;
    flex-wrap: wrap;
}

.social-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: var(--grey-soft);
    border: 1px solid var(--grey-border);
    border-radius: 50%;
    color: var(--primary-navy);
    font-size: 1rem;
    transition: all 0.3s ease;
    text-decoration: none;
}

.social-icon:hover {
    background: var(--primary-navy);
    color: var(--white-color);
    transform: translateY(-3px);
    border-color: var(--primary-navy);
}

/* Mobile responsive */
@media (max-width: 768px) {
    .footer-social {
        justify-content: flex-start;
    }
}