/* --- GLOBAL VARIABLES & BASICS --- */
:root { --primary: #2c3e50; } 

body > header { 
    padding-bottom: 1rem; 
    border-bottom: 1px solid #e5e5e5; 
    margin-bottom: 2rem; 
}

/* --- NAVIGATION & HEADER (Unified for all pages) --- */

/* 1. Mobile Default: Stack elements vertically */
nav.container {
    display: flex;
    flex-direction: column; 
    align-items: center;    
    padding-top: 1rem;      
}

/* 2. Brand Section Styling */
.nav-brand-container { 
    display: flex; 
    align-items: center; 
    margin-bottom: 1rem; 
}

.nav-logo { 
    height: 50px; /* Readable size for mobile */
    width: auto; 
    margin-right: 10px; 
}

.nav-brand { 
    font-weight: 800; 
    font-size: 1.1rem; 
    text-transform: uppercase; 
    letter-spacing: 0.5px;
    white-space: nowrap; 
    
    /* Font Smoothing Fix (Ensures consistent thickness across pages) */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* 3. Button Fixes */
nav ul {
    padding: 0;
    margin: 0;
    display: flex;       
    justify-content: center;
}

nav ul li {
    padding: 0 5px;      
    list-style: none;
}

nav a[role="button"] {
    padding: 0.5rem 1.2rem; 
    font-size: 0.9rem;      
    white-space: nowrap;    
    height: auto;           
}

/* --- HOME PAGE SPECIFIC STYLES --- */
.profile-img { 
    border-radius: 4px; 
    box-shadow: 0 4px 6px rgba(0,0,0,0.1); 
    width: 100%; 
    max-width: 350px; 
    height: auto; 
    object-fit: cover;
    display: block; 
    margin: 0 auto 1.5rem auto; 
}

.practice-areas li { margin-bottom: 0.5rem; }

/* Credentials Card */
.credentials-card {
    padding: 0 !important; 
    overflow: hidden; 
    border: 1px solid #e5e5e5; 
    border-radius: 8px; 
}

.credentials-card header {
    background-color: var(--primary); 
    color: white;
    padding: 1rem 1.5rem; 
    margin: 0 !important; 
    font-size: 1.25rem; 
}

.credentials-card-body {
    padding: 1.5rem; 
    font-size: 1.1rem; 
    line-height: 1.6;
    background-color: #f9f9f9; 
}

.credentials-card-body ul {
    padding-left: 1rem;
    margin-bottom: 0;
}

/* --- CONTACT PAGE SPECIFIC STYLES --- */
.disclaimer { 
    font-size: 0.8rem; 
    color: #666; 
    margin-top: 1.5rem; 
    line-height: 1.4; 
}

/* Status Message */
#status {
    margin-bottom: 1rem;
    font-weight: bold;
    border-radius: 4px;
}
.status-success { color: #2e7d32; } 
.status-error { color: #c62828; }  

/* --- FOOTER --- */
footer { 
    border-top: 1px solid #e5e5e5; 
    margin-top: 3rem; 
    padding-top: 2rem; 
    color: #666; 
}

/* --- MEDIA QUERIES (Desktop Overrides) --- */

/* Tablet/Desktop Nav Restoration (Screens wider than 768px) */
@media (min-width: 768px) {
    nav.container {
        flex-direction: row; 
        justify-content: space-between;
        padding-top: 0;
    }
    
    .nav-brand-container { margin-bottom: 0; } 
    
    .nav-logo { height: 100px; margin-right: 15px; }
    .nav-brand { font-size: 1.25rem; }
    
    nav a[role="button"] {
        padding: 0.5rem 1.5rem; 
        font-size: 1rem;
    }
}

/* Home Page Grid (Screens wider than 992px) */
@media (min-width: 992px) {
    .bio-grid {
        grid-template-columns: 1fr 2.5fr; 
        column-gap: 4rem; 
    }
}

/* --- DARK MODE ADJUSTMENTS --- */
@media (prefers-color-scheme: dark) {
    body > header, footer { border-color: #333; }
    footer { color: #888; }
    
    /* Credentials Card Dark Mode */
    .credentials-card { border-color: #333; }
    .credentials-card-body {
        background-color: #161f27; 
        color: #e0e0e0; 
    }

    /* Contact Status Dark Mode */
    .status-success { color: #66bb6a; }
    .status-error { color: #ef5350; }
}