/* 基础样式 - 移动端优先 */
.container {
  width: 100%;
  padding: 0 15px;
  margin: 0 auto;
}

.nav {
  display: flex;
  flex-direction: column; /* 移动端垂直排列 */
}

.content {
  font-size: 16px;
}

/* 图片自适应 */
img {
  max-width: 100%;
  height: auto;
}

/* 平板设备适配 (768px以上) */
@media (min-width: 768px) {
  .container {
    max-width: 720px;
  }
  .nav {
    flex-direction: row; /* 横向排列 */
  }
  .content {
    font-size: 18px;
  }
}

/* 桌面设备适配 (1200px以上) */
@media (min-width: 1200px) {
  .container {
    max-width: 1140px;
  }
}