@media screen and (max-width: 1024px) {
            .content-grid {
                grid-template-columns: 1fr;
            }

            .sidebar {
                position: relative;
                top: 0;
            }

            .header-content {
                grid-template-columns: 1fr;
                text-align: center;
                gap: 1rem;
            }

            .logo-section {
                justify-content: center;
            }

            .header-actions {
                justify-content: center;
            }
            
            .age-chart-box {
                flex-direction: column;
                text-align: center;
            }
        }

        @media screen and (max-width: 768px) {
            .site-title h1 {
                font-size: 1.75rem;
            }

            #logoholder {
                height: 60px;
            }

            .main-container {
                padding: 0 1rem;
            }

            .card {
                padding: 1.5rem;
            }

            .carousel-inner img {
                height: 250px;
            }

            .nav-link {
                padding: 0.75rem 1rem !important;
            }
            
            .contact-card {
                padding: 1.5rem;
            }
            
            .table {
                font-size: 0.875rem;
            }

            .table thead th,
            .table tbody td {
                padding: 0.75rem 0.5rem;
            }
            
            .content-card ol > li {
                padding-left: 3.5rem;
            }

            .content-card ol > li::before {
                left: 0.75rem;
                width: 1.75rem;
                height: 1.75rem;
                font-size: 1rem;
            }
            
            .division-card {
                padding: 1.5rem;
            }
        }

        @media screen and (max-width: 480px) {
            .site-title h1 {
                font-size: 1.25rem;
            }

            .btn-header {
                padding: 0.5rem 1rem;
                font-size: 0.875rem;
            }

            .card-header h2 {
                font-size: 1.25rem;
            }

            #goTopBtn {
                width: 50px;
                height: 50px;
                bottom: 1rem;
                right: 1rem;
            }
            
            .table {
                font-size: 0.75rem;
            }

            .table thead th,
            .table tbody td {
                padding: 0.5rem 0.25rem;
            }
            
            .division-card {
                padding: 1rem;
            }

            .division-card h6 {
                font-size: 1.2rem;
            }
        }