/* 响应式设计 */

/* 平板电脑布局 */
@media (max-width: 992px) {
    .hero h1 {
        font-size: 2rem;
    }
    
    .hero p {
        font-size: 1rem;
    }
    
    .footer-sections {
        grid-template-columns: 1fr;
        gap: 30px;
    }
}

/* 手机布局 */
@media (max-width: 768px) {
    .mobile-menu-btn {
        display: block;
        position: absolute;
        top: -50px;
        right: 20px;
    }
    
    .main-nav {
        flex-direction: column;
        align-items: stretch;
        display: none;
    }
    
    .main-nav.active {
        display: flex;
    }
    
    .main-nav > li > a {
        text-align: left;
        padding: 15px;
    }
    
    .dropdown {
        position: static;
        width: 100%;
        box-shadow: none;
        display: none;
    }
    
    .has-dropdown.active .dropdown {
        display: block;
    }
    
    .has-dropdown > a {
        position: relative;
    }
    
    .has-dropdown > a::after {
        content: '+';
        position: absolute;
        right: 15px;
        top: 50%;
        transform: translateY(-50%);
    }
    
    .has-dropdown.active > a::after {
        content: '-';
    }
    
    .dropdown li a {
        padding-left: 30px;
    }
    
    .quick-links .container {
        grid-template-columns: 1fr;
    }
    
    .mobile-only {
        display: block;
        margin: 20px 0;
    }
    
    .diagram-image img {
        display: none;
    }
    
    #cookie-notice .container {
        flex-direction: column;
        text-align: center;
    }
    
    .cookie-buttons {
        margin-top: 15px;
        justify-content: center;
    }
}

/* 小屏手机布局 */
@media (max-width: 480px) {
    .hero {
        padding: 30px 0;
    }
    
    .hero h1 {
        font-size: 1.5rem;
    }
    
    .link-card {
        padding: 20px;
    }
    
    .link-card h2 {
        font-size: 1.2rem;
    }
    
    .about h2 {
        font-size: 1.5rem;
    }
    
    .btn {
        padding: 8px 16px;
        font-size: 0.9rem;
    }
    
    .btn-large {
        padding: 10px 20px;
        font-size: 1rem;
    }
}

/* 打印样式 */
@media print {
    header, footer, #cookie-notice, #cookie-settings-panel, .mobile-menu-btn, .btn {
        display: none !important;
    }
    
    body {
        background-color: #fff;
        color: #000;
        font-size: 12pt;
    }
    
    main {
        width: 100%;
    }
    
    a {
        color: #000;
        text-decoration: underline;
    }
    
    a::after {
        content: " (" attr(href) ")";
        font-size: 10pt;
    }
    
    .diagram-image img {
        max-width: 100%;
        height: auto;
    }
}

/* 访问性增强 */
@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* 深色模式支持 */
@media (prefers-color-scheme: dark) {
    :root {
        --text-color: #f5f5f5;
        --light-text: #fff;
        --light-bg: #2a2a2a;
        --border-color: #444;
    }
    
    body {
        background-color: #1a1a1a;
    }
    
    header, .quick-links, .network-diagram {
        background-color: #222;
    }
    
    .link-card {
        background-color: #333;
    }
    
    .dropdown {
        background-color: #333;
    }
    
    .dropdown li a:hover {
        background-color: #444;
    }
}