/**
 * 大雄Ai主题响应式样式
 */

/* 平板电脑 (小于1024px) */
@media (max-width: 1024px) {
    /* 通用样式调整 */
    h1 {
        font-size: 2.2rem;
    }
    
    h2 {
        font-size: 1.8rem;
    }
    
    /* 英雄区域 */
    .hero-section {
        padding: 4rem 0;
    }
    
    .hero-section h1 {
        font-size: 2.5rem;
    }
    
    .hero-section .sub-headline {
        font-size: 1.1rem;
    }
    
    /* 网格布局调整 */
    .advantages-grid,
    .services-grid,
    .offers-grid,
    .testimonials-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* 中型平板 (小于900px) */
@media (max-width: 900px) {
    /* 博客布局 */
    .blog-container {
        grid-template-columns: 1fr;
    }
    
    /* 单篇文章布局 */
    .blog-container .row {
        flex-direction: column;
    }
    
    .blog-container .col-lg-8,
    .blog-container .col-lg-4 {
        max-width: 100%;
        flex: 0 0 100%;
    }
    
    .blog-sidebar {
        margin-top: 2rem;
        padding-left: 0;
    }
    
    /* 相关文章网格 */
    .related-posts-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.5rem;
    }
    
    /* 页脚调整 */
    .site-info .container {
        flex-direction: column;
        text-align: center;
    }
    
    .footer-menu {
        margin-top: 1rem;
        justify-content: center;
    }
    
    .footer-menu li:first-child {
        margin-left: 0;
    }
}

/* 小型平板和大型手机 (小于768px) */
@media (max-width: 768px) {
    /* Logo样式 - 移动端 */
    .custom-logo-link {
        max-height: 50px;
    }
    
    .custom-logo {
        max-height: 50px;
    }
    
    /* 导航菜单 - 移动端优化 */
    .menu-toggle {
        display: none !important; /* 隐藏汉堡菜单按钮 */
    }
    
    .primary-menu-container {
        position: static; /* 取消绝对定位 */
        top: auto;
        left: auto;
        right: auto;
        background-color: transparent;
        box-shadow: none;
        max-height: none; /* 允许显示完整高度 */
        overflow: visible;
        transition: none;
        z-index: auto;
        margin-right: 0;
        width: 100%;
    }
    
    .primary-menu {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        align-items: center;
        padding: 0.5rem 0;
        gap: 0.5rem;
        margin: 0;
    }
    
    .primary-menu li {
        margin: 0 0.25rem;
        text-align: center;
        width: auto;
    }
    
    .primary-menu a {
        padding: 0.5rem;
        font-size: 0.9rem;
        display: block;
        white-space: nowrap;
    }
    
    .primary-menu a::after {
        bottom: 0; /* 调整下划线位置 */
    }
    
    .main-navigation {
        width: 100%;
        justify-content: center;
        padding: 0.5rem 0;
    }
    
    .nav-buttons {
        width: 100%;
        display: flex;
        justify-content: center;
        margin-top: 0.5rem;
        order: 2; /* 将按钮移到菜单后面 */
    }
    
    .nav-cta-button {
        padding: 0.625rem 1rem;
        font-size: 0.9rem;
        border-radius: 8px;
        width: 100%;
        max-width: 250px;
        justify-content: center;
    }
    
    /* 英雄区域 */
    .hero-section {
        padding: 6rem 0 3rem;
    }
    
    .hero-section h1 {
        font-size: 1.8rem;
        margin-bottom: 1rem;
    }
    
    .hero-section .hero-subtitle {
        font-size: 1rem;
        margin-bottom: 1.5rem;
    }
    
    .cta-buttons {
        flex-direction: column;
        gap: 0.75rem;
    }
    
    /* 网格布局调整 */
    .advantages-grid,
    .services-grid,
    .offers-grid,
    .testimonials-grid {
        grid-template-columns: 1fr;
    }
    
    /* 各区域间距调整 */
    .advantages-section,
    .services-section,
    .offers-section,
    .testimonials-section,
    .final-cta-section {
        padding: 3rem 0;
    }
    
    /* 最终CTA区域 */
    .final-cta-buttons {
        flex-direction: column;
        gap: 0.75rem;
    }
}

/* 手机 (小于576px) */
@media (max-width: 576px) {
    /* 通用样式调整 */
    h1 {
        font-size: 1.8rem;
    }
    
    h2 {
        font-size: 1.5rem;
    }
    
    h3 {
        font-size: 1.3rem;
    }
    
    /* 头部样式 */
    .site-header .container {
        height: 70px;
    }
    
    .site-title {
        font-size: 1.2rem;
    }
    
    .site-description {
        display: none;
    }
    
    /* 导航按钮 */
    .nav-cta-button {
        padding: 0.4rem 0.8rem;
        font-size: 0.8rem;
    }
    
    /* 英雄区域 */
    .hero-section {
        padding: 3rem 0;
    }
    
    .hero-section h1 {
        font-size: 1.6rem;
    }
    
    .hero-section .hero-subtitle {
        font-size: 0.9rem;
    }
    
    /* 卡片样式调整 */
    .advantage-item,
    .service-card,
    .offer-card,
    .testimonial-card {
        padding: 1.5rem;
    }
    
    .advantage-icon img {
        width: 50px;
        height: 50px;
    }
    
    /* 页脚调整 */
    .footer-widgets-wrap {
        grid-template-columns: 1fr;
    }
    
    /* 博客布局 */
    .post-meta {
        flex-wrap: wrap;
    }
    
    .post-meta > * {
        margin-bottom: 0.5rem;
    }
    
    /* 博客文章卡片 */
    .blog-post {
        margin-bottom: 2rem;
    }
    
    .post-title {
        font-size: 1.4rem;
    }
    
    .post-excerpt {
        margin-bottom: 1rem;
    }
    
    /* 单篇文章页 */
    .entry-title {
        font-size: 1.6rem;
    }
    
    .entry-content {
        font-size: 1rem;
    }
    
    /* 评论区 */
    .comment-list .children {
        padding-left: 1rem;
    }
    
    .comment-body {
        padding: 1rem;
    }
    
    /* 相关文章 */
    .related-posts-grid {
        grid-template-columns: 1fr;
    }
    
    /* 分页 */
    .pagination .page-numbers {
        padding: 0.4rem 0.8rem;
        margin: 0 0.1rem;
    }
}

/* 小型手机 (小于375px) */
@media (max-width: 375px) {
    .container {
        padding-left: 0.75rem;
        padding-right: 0.75rem;
    }
    
    .btn {
        padding: 0.6rem 1.2rem;
        font-size: 0.9rem;
    }
    
    .hero-section h1 {
        font-size: 1.6rem;
    }
    
    .nav-cta-button {
        padding: 0.35rem 0.7rem;
        font-size: 0.75rem;
    }
} 