/**
 * 营销静态页通用响应式（在 marketing-layout.css 之后引入）
 * 覆盖：顶栏导航、页脚、价格页、文档页移动目录
 */

/* —— 顶栏（与 layout 叠加） —— */
@media (max-width: 1024px) {
  .mkt-page .header .nav {
    flex: 1 1 100%;
    justify-content: flex-end;
  }
}

@media (max-width: 640px) {
  .mkt-page .hero {
    padding-left: max(var(--mkt-gutter, 4%), env(safe-area-inset-left, 0px)) !important;
    padding-right: max(var(--mkt-gutter, 4%), env(safe-area-inset-right, 0px)) !important;
  }

  .mkt-page .footer {
    padding-left: max(var(--mkt-gutter, 1.25rem), env(safe-area-inset-left, 0px));
    padding-right: max(var(--mkt-gutter, 1.25rem), env(safe-area-inset-right, 0px));
  }
}

@media (max-width: 480px) {
  .mkt-page .header .nav a:not(.cta) {
    padding: 0.2rem 0;
  }
}

/* —— 价格页栅格 —— */
@media (max-width: 900px) {
  .pricing {
    grid-template-columns: 1fr !important;
    padding-left: var(--mkt-gutter, 4%) !important;
    padding-right: var(--mkt-gutter, 4%) !important;
    gap: 1.5rem !important;
  }

  .mkt-price-adv__grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 1024px) and (min-width: 601px) {
  .mkt-price-adv__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .mkt-price-adv__card:last-child {
    grid-column: 1 / -1;
    max-width: 28rem;
    margin-inline: auto;
    width: 100%;
  }
}

@media (max-width: 480px) {
  .mkt-price-badges {
    flex-direction: column;
    align-items: stretch;
  }

  .mkt-price-badge {
    justify-content: center;
  }

  .mkt-page .hero__price-hook {
    font-size: 0.84rem;
    padding: 0.55rem 0.75rem;
  }
}

/* —— 超大屏内容区留白 —— */
@media (min-width: 1600px) {
  .mkt-page .header,
  .mkt-page .footer,
  .docs-container .main-content {
    padding-left: max(4%, 2rem) !important;
    padding-right: max(4%, 2rem) !important;
  }
}
