/* ===========================================================
   99-footer — 全ページ共通フッター（partials/footer.html）

   実測済み（Figma `Group 395` / 2026-08-05）:
     セクション   X=0 Y=6628 W=1366 H=345
     ロゴ         X=43.5 Y=6697 146.5 × 35.7（白一色ベクター）
     SNS行        X=42 Y=6759 W=117 H=24 / アイコン24 / 間隔7
   → padding-top = 6697 - 6628 = 69
   → ロゴ〜SNS   = 6759 - (6697 + 35.7) = 26.3

   実測済み: 背景は Figma パレットの #222222
   PROVISIONAL: カラム幅・字送り・コピーライト位置は未実測。
   =========================================================== */

.site-footer {
  /* .sec-careers と同じ理由の保険。地の色を持つので static のままだと
     背景だけが上の層のオーバーレイに塗り潰されうる。詳細は 07-careers.css。 */
  position: relative;
  background: var(--footer-bg);       /* #222222 */
  color: var(--text-invert);
  padding-block: 69px 40px;           /* 上=実測 / 下=PROVISIONAL */
}

.site-footer__inner {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 48px 80px;                     /* PROVISIONAL */
}

/* --- ブランド列 --------------------------------------------- */

.site-footer__brand {
  display: flex;
  flex-direction: column;
  gap: 26.3px;                        /* 実測: ロゴ下端 6732.7 → SNS上端 6759 */
  align-items: flex-start;
}

.site-footer__logo {
  width: 146.5px;                     /* 実測 */
  height: auto;                       /* width/height属性のヒントを打ち消す（AGENTS.md の既知の罠） */
}

.site-footer__sns {
  display: flex;
  gap: 7px;                           /* 実測: Frame 277 の Auto Layout 間隔 */
}

/* カンプのアイコン間隔が 7px しかないため、44×44 のタップ領域を横に取ると
   隣のリンクと重なってしまう。横はアイコン実寸(24px)のままにして、
   縦方向だけ 44px に広げてタップしやすさを稼ぐ。 */
.site-footer__sns a {
  display: grid;
  place-items: center;
  inline-size: 24px;
  block-size: 44px;
  margin-block: -10px;                /* 見た目の行の高さは 24px に戻す */
  transition: opacity var(--dur) var(--ease);
}


.site-footer__sns img {
  width: 24px;                        /* 実測 */
  height: auto;
}

/* --- リンク列 ----------------------------------------------- */

.site-footer__nav {
  display: grid;
  grid-template-columns: repeat(3, auto);
  gap: 40px;                          /* PROVISIONAL */
  font-size: var(--fs-xs);            /* PROVISIONAL */
}

.site-footer__col {
  display: flex;
  flex-direction: column;
  gap: 14px;                          /* PROVISIONAL */
}

.site-footer__col a {
  transition: opacity var(--dur) var(--ease);
}


.site-footer__copy {
  grid-column: 1 / -1;
  margin-top: 40px;                   /* PROVISIONAL */
  font-size: 11px;                    /* PROVISIONAL */
  color: rgba(255, 255, 255, 0.72);
}

/* ===========================================================
   TB / SP — 2カラム（ブランド｜リンク3列）→ 縦積み。
   リンクは3列のままだと窮屈なので2列に落とす。
   =========================================================== */

@media (max-width: 1099px) {
  .site-footer__inner {
    grid-template-columns: minmax(0, 1fr);
  }

  .site-footer__nav {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 767px) {
  /* ✅ SPカンプ実測（SPフレーム 375×10067）
       フッター背景 `Rectangle 132`  X=0  Y=9583  375×484  #1F1F1F
       ロゴ         `Group 390`      X=88.62 Y=9616  195.25×47.57（中央）
       リンク塊     `Frame 303`      X=18 Y=9740  339×256  間隔14

     PCの3カラムをやめ、**ロゴ大・中央 → SNS中央 → リンク1列（左揃え）→
     コピーライト** の縦積みにする。区切り線はブロック間に入る。

     ⚠️ カンプのフッターには note アイコンがあるが、先方指示（2026-08-09）で
        未開設のため非表示。SNSは3つ。
     ⚠️ カンプのSPフッターには「提供サービス／私たちについて／ビジョン／採用情報」
        の列が**無い**。ハンバーガーメニュー（menu_sp）側が担う想定と判断して
        SPでは畳んでいる。 */
  .site-footer {
    /* 上33 = 9616 − 9583（実測）。
       下22 は下記の逆算:
         カンプはリンク塊の下端9996からフッター下端10067まで**71px**しかない。
         内訳 = 区切り線の上余白14 + 線下の余白14 + コピー文字21 + 下余白22 = 71 */
    padding-block: 33px 22px;
  }

  /* ⚠️ PCの `.site-footer__inner { gap: 48px 80px }`（PROVISIONAL）がSPにも
     効いていて、リンク塊とコピーライトの間に**48pxの余分な隙間**が出ていた。
     SPは縦積みで、ブロック間の余白は下の margin-top / padding-top が持つので
     gap は要らない。 */
  .site-footer__inner {
    gap: 0;
  }

  /* 事業紹介・私たちについてと同じく、カンプの左右は18px（既定の20pxではない）。 */
  .site-footer > .container {
    width: 100%;
    padding-inline: 20px;
  }

  .site-footer__brand {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .site-footer__logo {
    width: 195px;                     /* 実測 195.25 */
    height: auto;
  }

  .site-footer__sns {
    justify-content: center;
    margin-top: 22px;                 /* PROVISIONAL */
  }

  /* 3カラムをやめて1列に。 */
  .site-footer__nav {
    grid-template-columns: minmax(0, 1fr);
    gap: 0;
    margin-top: 54px;                 /* 実測 ロゴ下端9663.6 → Frame 303 の 9740 */
  }

  .site-footer__col {
    display: flex;
    flex-direction: column;
    gap: 14px;                        /* 実測 Frame 303 の間隔 */
  }

  /* 2列目（提供サービス／私たちについて／ビジョン／採用情報）はカンプに無い。 */
  .site-footer__col:nth-child(2) {
    display: none;
  }

  /* ブロックの境目に区切り線。 */
  .site-footer__col + .site-footer__col:not([hidden]) {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid rgb(255 255 255 / 0.2);
  }

  .site-footer__copy {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid rgb(255 255 255 / 0.2);
  }
}