/* 麦尚食品 · PC 端公共样式（原 pc-cn/css/common.css，只搬不改） */
/* PC 布局：≥1200px */
@media (min-width: 1200px) {
  /* ============================================================
     麦尚食品 · PC端中文版 公共样式
     基础重置 / 页头 / 页尾 全站共用
     ============================================================ */

  /* ---------- 基础 ----------
     两套稿子一致的重置（* / body / img / a / ul,ol,li）都在 base.css，
     这里只留 PC 独有的：flex-shrink:0、横向不滚动。 */

  * {
    flex-shrink: 0;
  }

  body {
    overflow-x: hidden;
  }

  button:active {
    opacity: 0.6;
  }

  /* ---------- 页头 ---------- */

  .header-spacer {
    display: none;
    width: 100vw;
    height: 8.3333vw;
  }

  .site-header {
    box-shadow: 0 -0.0694vw 0 0 rgba(230, 230, 230, 1);
    background-color: rgba(255, 255, 255, 1);
    height: 8.3333vw;
    width: 100vw;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    transition: box-shadow 0.4s ease;
  }

  .site-header.is-fixed {
    position: fixed;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1000;
    box-shadow: 0 0.5556vw 1.6667vw 0 rgba(0, 0, 0, 0.12);
  }

  .header-inner {
    width: 83.3333vw;
    height: 8.3333vw;
    margin: 0 auto;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
  }

  .header-logo img {
    width: 20.8333vw;
    height: 4.8611vw;
  }

  .main-nav {
    height: 8.3333vw;
    overflow-wrap: break-word;
    color: rgba(51, 51, 51, 1);
    font-size: 1.3889vw;
    /* 设计稿里导航只写这一个族（没有回退列表），照抄 */
    font-family: PingFangSC-Regular;
    text-align: right;
    white-space: nowrap;
    line-height: 8.3333vw;
    margin-left: 5.5556vw;
  }

  .nav-link {
    height: 8.3333vw;
    color: rgba(51, 51, 51, 1);
    position: relative;
    display: inline-block;
    transition: color 0.3s ease;
    margin: 0 1.3889vw;
  }

  .nav-link::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 0.2778vw;
    background: rgba(230, 0, 18, 1);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
  }

  .nav-link:hover {
    color: rgba(230, 0, 18, 1);
  }

  .nav-link:hover::after {
    transform: scaleX(1);
  }

  .nav-link.is-current {
    color: rgba(230, 0, 18, 1);
  }

  .nav-link.is-current::after {
    transform: scaleX(1);
  }

  .lang-btn {
    background-color: rgba(230, 0, 18, 1);
    border-radius: 50%;
    height: 2.5vw;
    width: 2.5vw;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transition:
      transform 0.3s ease,
      box-shadow 0.3s ease;
  }

  .lang-btn:hover {
    transform: translateY(-0.1389vw);
    box-shadow: 0 0.4167vw 0.9722vw 0 rgba(230, 0, 18, 0.35);
  }

  .lang-btn span {
    color: rgba(255, 255, 255, 1);
    font-size: 1.1111vw;
    text-align: center;
    white-space: nowrap;
  }

  /* ---------- 页尾 ---------- */

  .site-footer {
    background-color: rgba(255, 255, 255, 1);
    height: 44.4444vw;
    margin-bottom: 0.0694vw;
    width: 100vw;
    display: flex;
    flex-direction: column;
  }

  .footer-logo {
    width: 23.2639vw;
    height: 7.2222vw;
    margin: 4.4444vw auto 0;
  }

  .footer-logo img {
    width: 23.2639vw;
    height: 7.2222vw;
  }

  .footer-cols {
    width: 83.3333vw;
    margin: 4.4444vw auto 0;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
  }

  .footer-nav {
    width: 6.6667vw;
    margin-top: 0.4167vw;
    display: flex;
    flex-direction: column;
  }

  .footer-col-title {    color: rgba(51, 51, 51, 1);
    font-size: 1.6667vw;
    font-family: PingFangSC-Semibold;
    font-weight: 600;
    text-align: left;
    white-space: nowrap;
    line-height: 2.7778vw;
  }

  .footer-nav-links {
    width: 4.4444vw;
    color: rgba(102, 102, 102, 1);
    font-size: 1.1111vw;
    text-align: left;
    line-height: 2.7778vw;
    margin-top: 2.4306vw;
  }

  .footer-nav-links a {
    display: block;
    color: rgba(102, 102, 102, 1);
    transition:
      color 0.3s ease,
      transform 0.3s ease;
  }

  .footer-nav-links a:hover {
    color: rgba(230, 0, 18, 1);
    transform: translateX(0.2778vw);
  }

  .footer-contact {
    width: 23.6111vw;
    margin: 0.4167vw 0 0 6.9444vw;
    display: flex;
    flex-direction: column;
  }

  .footer-contact-info {
    margin: 2.4306vw 0 0 0.0694vw;
    font-size: 1.1111vw;
    text-align: left;
    line-height: 2.7778vw;
  }

  .fc-label,
  .fc-detail {
    color: rgba(102, 102, 102, 1);
    font-size: 1.1111vw;
    text-align: left;
    line-height: 2.7778vw;
  }

  .footer-qr {
    width: 12.5vw;
    display: flex;
    flex-direction: column;
  }

  .footer-qr-1 {
    margin-left: 5.1389vw;
  }

  .footer-qr-2 {
    margin-left: 1.5278vw;
  }

  .footer-qr-3 {
    margin-left: 1.5278vw;
  }

  .qr-box {
    box-shadow: 0 0 1.6667vw 0 rgba(0, 0, 0, 0.08);
    background-color: rgba(255, 255, 255, 1);
    height: 12.5vw;
    width: 12.5vw;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .qr-1 {
    width: 10.6944vw;
    height: 10.6944vw;
  }

  .qr-2 {
    width: 10.4167vw;
    height: 10.4167vw;
  }

  .qr-3 {
    width: 12.0139vw;
    height: 12.0139vw;
  }

  .qr-label {
    color: rgba(51, 51, 51, 1);
    font-size: 0.9722vw;
    text-align: center;
    white-space: nowrap;
    line-height: 2.7778vw;
    margin: 0.9028vw 0 0;
  }

  .footer-badges {
    width: 40.3472vw;
    height: 2.9167vw;
    margin: 4.3056vw 0 4.375vw 29.7917vw;
  }

  .footer-badges img {
    width: 40.3472vw;
    height: 2.9167vw;
  }

  .copyright {
    box-shadow: 0 0.0694vw 0 0 rgba(230, 230, 230, 1);
    background-color: rgba(255, 255, 255, 1);
    height: 4.4444vw;
    width: 100vw;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-top: 1px solid #e6e6e6;
  }

  .copyright span {
    color: rgba(102, 102, 102, 1);
    font-size: 0.9722vw;
    text-align: center;
    white-space: nowrap;
  }

  /* ============================================================
     英文站字号与中文站不同
     ------------------------------------------------------------
     两套设计稿（pc-cn / pc-en）逐属性比过，PC 端只有下面 6 个值不一样：
     英文稿导航字号更小、页脚几列更宽。主题是按中文稿做的，
     所以这里按站点语言把英文那套补上。

     用 html[lang] 区分、而不是让英文主题单独一份 pc.css：
     两份主题的代码要能逐字 diff，拆开就再也比不出来了。
     lang 来自后台「网站设置 → 语言码」（英文站填 en），
     用 ^= 是为了 en / en-US / en-GB 都能命中。
     ============================================================ */
  html[lang^="en"] .main-nav {
    font-size: 1.1111vw;            /* 中文稿 1.3889vw（20px → 16px @1440） */
  }

  html[lang^="en"] .nav-link {
    margin: 0 1.1111vw;             /* 中文稿 0 1.3889vw */
  }

  html[lang^="en"] .footer-nav {
    width: auto;                    /* 中文稿 6.6667vw */
  }

  html[lang^="en"] .footer-nav-links {
    width: auto;                    /* 中文稿 4.4444vw */
  }

  html[lang^="en"] .footer-contact {
    margin: 0.4167vw 0 0 4.7222vw;  /* 中文稿 0.4167vw 0 0 6.9444vw */
  }

  html[lang^="en"] .footer-qr-1 {
    margin-left: 2.5694vw;          /* 中文稿 5.1389vw */
  }

  /*
   * 页脚总高：英文稿是 auto（高度由内容撑开，实测 720px），中文稿写死 44.4444vw。
   * 写死的话内容装不下 —— 认证标识与版权行会互相压住。
   */
  html[lang^="en"] .site-footer {
    height: auto;
  }
}
