/*
Tooplate 2117 Infinite Loop
https://www.tooplate.com/view/2117-infinite-loop

About 页面专属样式（about.html）
公共部分（字体 / 基础 / 导航栏 / 公共响应式）见 css/common.css
*/

/* ========== 布局工具 ========== */
.tm-section-pad-top {
  padding-top: 80px;
  padding-bottom: 40px;
}

.tm-content-box {
  padding-top: 20px;
  padding-bottom: 40px;
}

/* ========== About ========== */
#testimonials {
  color: #000000;
  background-color: #ffffff;
  position: relative;
  height: 100vh;      /* 固定为正好一屏 */
  min-height: 100vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}

/* About 文案整体上移、贴近顶部固定导航栏的下沿（导航 fixed，高约 56px）。
   原顶部留白 = 80px（section 的 .tm-section-pad-top）+ 20px（.tm-content-box）= 100px，
   现压缩到 60px；用 #testimonials 限定作用域，避免影响 Contact 页同名的 .tm-section-pad-top。
   图片行用 margin-top: auto 贴底，位置不受影响，只是文案上移。 */
#testimonials.tm-section-pad-top {
  padding-top: 40px;
}

.tm-testimonials-content {
  position: relative;
  z-index: 100;
  flex: 1;
  display: flex;
  flex-direction: column;
}

/* 图片行推到内容区底部，位于文案正下方 */
.tm-about-img-row {
  margin-top: auto;
}

.tm-about-img-wrap {
  justify-content: flex-end;
  padding-top: 40px;
}

.tm-about-img {
  max-width: 800px;
  width: 100%;
  max-height: calc(100vh - 340px); /* 保证 About 图片 + 文案在一屏内 */
  object-fit: contain;             /* 高度受限时按比例缩放，不裁切 */
}

.tm-about-text {
  font-size: 0.875rem; /* About 文案字号 */
  line-height: 1.5;
  margin-bottom: 0;
}

/* ========== 响应式 / Responsive ========== */
@media (min-width: 1200px) {
  /* About 内容与主页文案同宽，左缘对齐主页左上角文案 */
  .tm-testimonials-content {
    max-width: calc(100% - 130px);
  }
}
