/* ============================================
   响应式样式补丁 - 小旋风CMS模板 v3.0
   ============================================ */

/* ===== 超大屏幕 (1400px+) ===== */
@media (min-width: 1400px) {
  .container {
    max-width: 1320px;
  }
}

/* ===== 桌面 (1025px ~ 1399px) ===== */
@media (max-width: 1399px) {
  .hero {
    height: 550px;
  }
}

/* ===== 小桌面 / 大平板 (993px ~ 1024px) ===== */
@media (max-width: 1024px) {
  .hero-content h1 {
    font-size: 42px;
  }

  .feature-card {
    padding: 30px 20px;
  }
}

/* ===== 平板 (769px ~ 992px) ===== */
@media (max-width: 992px) {
  .hero {
    height: 480px;
  }

  .hero-content h1 {
    font-size: 36px;
  }

  .card-img {
    height: 200px;
  }

  .product-card .card-img {
    height: 240px;
  }
}

/* ===== 手机 (≤768px) ===== */
@media (max-width: 768px) {
  .header-inner {
    height: 64px;
  }

  .logo {
    font-size: 22px;
  }

  .hero {
    height: 400px;
  }

  .hero-content {
    width: 95%;
  }

  .hero-content h1 {
    font-size: 28px;
    margin-bottom: 15px;
  }

  .hero-content p {
    font-size: 15px;
    margin-bottom: 25px;
  }

  .btn-group {
    gap: 12px;
  }

  .btn {
    padding: 11px 24px;
    font-size: 14px;
  }

  .section-title {
    margin-bottom: 35px;
  }

  .section-title h2 {
    font-size: 24px;
  }

  .section-title p {
    font-size: 15px;
  }

  .card-body {
    padding: 18px;
  }

  .card-body h3 {
    font-size: 17px;
  }

  .card-img {
    height: 180px;
  }

  .product-card .card-img {
    height: 200px;
  }

  .about-content h2 {
    font-size: 28px;
  }

  .feature-card {
    padding: 28px 20px;
  }

  .feature-icon {
    width: 56px;
    height: 56px;
    font-size: 22px;
  }

  .footer {
    padding: 50px 0 0;
  }

  .footer-grid {
    padding-bottom: 40px;
  }

  .footer-col h3 {
    font-size: 18px;
    margin-bottom: 18px;
  }

  .detail-header h1 {
    font-size: 22px;
  }

  .detail-meta {
    gap: 16px;
    font-size: 13px;
  }

  .page-banner {
    padding: 50px 0 35px;
  }

  .page-banner h1 {
    font-size: 24px;
  }
}

/* ===== 小屏手机 (≤480px) ===== */
@media (max-width: 480px) {
  .hero {
    height: 340px;
  }

  .hero-content h1 {
    font-size: 22px;
  }

  .card-img {
    height: 200px;
  }

  .container {
    padding: 0 14px;
  }

  .pagination a,
  .pagination span {
    width: 38px;
    height: 38px;
    font-size: 14px;
  }

  .tags-cloud a {
    padding: 5px 14px;
    font-size: 13px;
  }
}

/* ===== 横屏手机 (481px ~ 768px, landscape) ===== */
@media (max-width: 768px) and (orientation: landscape) {
  .hero {
    height: 350px;
  }

  .hero-content h1 {
    font-size: 24px;
  }
}