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

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

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

/* ========== Contact ========== */
#contact {
  font-family: "Inter Medium", "Raleway", sans-serif; /* Contact 文字显式使用本地 Inter_24pt-Medium.ttf */
  color: #000000;
  background-color: #ffffff;
  height: 100vh;      /* 固定为正好一屏 */
  min-height: 100vh;
  overflow: hidden;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  /* 联系内容按整个视口高度垂直居中，页脚使用 absolute 定位，不参与此布局。 */
  padding: 0;
}

/* 联系信息与首页左上角文案使用相同的字号，并将三项作为一个整体置于视口中心。 */
#contact .tm-container-contact {
  width: 100%;
  font-size: 1.125rem;
}

#contact .tm-container-contact > .row {
  justify-content: center;
}

#contact .tm-container-contact > .row > .col-12 {
  flex: 0 0 auto;
  width: auto;
}

/* 仅上移 Contact 顶部 "BIGFISH大鱼文化" 文案，下方联系方式保持不动 */
#contact .tm-container-contact .text-center p {
  transform: translateY(-50px);
}

.contact-item {
  margin-left: 0;
  margin-bottom: 50px;
}

.item-link {
  display: flex;
  align-items: center;
}

.item-link i,
.item-link span {
  color: #000000;
}

.item-link span {
  font-variant-numeric: lining-nums;
  font-feature-settings: "lnum" 1;
}

/* 图标列固定宽度并左对齐，使三个图标左边缘对齐 */
.contact-item .item-link > i {
  width: 48px;
  text-align: left;
  margin-right: 8px;
}

/* 标签列固定宽度并右对齐，使三个冒号落在同一条竖线上 */
.contact-item .item-link .contact-label {
  width: 90px;
  text-align: right;
  margin-right: 16px;
}

.item-link:hover i,
.item-link:hover span {
  color: #000000;
}

.tm-footer {
  position: absolute;
  bottom: 80px;
  left: 0;
  right: 0;
  padding: 0 15px;
  font-variant-numeric: lining-nums;
  font-feature-settings: "lnum" 1;
}

.tm-footer a {
  color: #000000;
}

.tm-footer a:hover {
  color: #3496d8;
}

.tm-footer-link {
  color: #000000;
}

.tm-footer-link:hover,
.tm-footer-link:focus {
  color: #3496d8;
  text-decoration: none;
}

/* ========== 响应式 / Responsive ========== */
@media (min-width: 1200px) {
  .tm-container-contact {
    max-width: 1063px;
  }
}