/* Responsive adjustments */
@media (max-width: 768px) {
    header h1 {
        font-size: 2.2rem;
        margin-top: 1rem;
    }
    
    header h2 {
        font-size: 1.3rem;
    }
    
    .content {
        padding: 1rem 0.5rem;
    }
    
    main {
        padding: 1rem 0.5rem;
        width: 95%;
    }
    
    .site-nav a {
        padding: 0.75rem 1rem;
    }
    
    .menuname {
        display: none;
    }
    
    button {
        padding: 0.6rem 1.2rem;
    }
    
    /* Mobile spacing for content sections */
    .content section, 
    .content div > h1,
    .content div > h2 {
        margin-top: 1.5rem;
        margin-bottom: 1rem;
    }
    
    /* Mobile spacing for content navigation */
    .content a[href*="essays"],
    .content a[href*="software"],
    .content a[href*="personal"],
    .content a[href*="tutorials"],
    .content a[href*="blog"],
    .content a[href*="archive"] {
        margin: 0.5rem 0;
        font-size: 1.4rem;
        padding: 0.3rem 0;
    }
    
    /* Mobile spacing for horizontal rules */
    .content hr {
        margin: 1.5rem auto;
    }
    
    /* Mobile spacing for recent posts */
    .content a[href*="post/"] {
        margin: 1rem 0;
        font-size: 1.1rem;
        padding: 0.5rem;
    }

    /* Mobile adjustments for content grid */
    .content-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem;
        margin: 1.5rem 0;
    }
    
    .content-item {
        padding: 1rem;
    }
    
    .content-icon {
        font-size: 1.75rem;
        margin-bottom: 0.5rem;
    }
    
    .content-link {
        font-size: 1rem;
    }
}

@media (max-width: 480px) {
    .content-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}