/* HIRAKOU HP: プログレス株式会社 紹介まわりの追加スタイル。
   既存の css/inner.css / css/global.css は変更せず、この新規ファイルのみで完結させる。 */

.footer-credit {
  display: inline-block;
  margin-top: 6px;
  font-size: 10px;
  color: var(--silver);
  letter-spacing: .08em;
}

.footer-credit a {
  color: var(--silver);
  text-decoration: underline;
  text-underline-offset: 2px;
}

.footer-credit a:hover {
  color: var(--white);
}

/* 会社案内ページ「ホームページ制作について」セクション。
   スマホ(既定, 768px以下)ではHTML順序通り 本文 → ロゴ → ボタン の縦積みになる。
   PC(769px以上)のみ2カラム化し、右側の余白にロゴを控えめに配置する。 */
.partner-text { max-width: 560px; }
.partner-cta  { max-width: 560px; margin-top: 24px; }

.partner-logo {
  margin-top: 32px;
  text-align: center;
}

.partner-logo-img {
  width: 80px;
  height: auto;
  /* 正式ロゴ(金/青+黒文字)はHIRAKOUのダークテーマと配色が衝突し目立ちすぎるため、
     画像自体は無加工のまま、表示のみ白一色のシルエットに変換して馴染ませる。 */
  filter: grayscale(1) brightness(0) invert(1);
  opacity: 0.6;
}

@media (min-width: 769px) {
  .partner-block {
    display: grid;
    grid-template-columns: 1fr 180px;
    grid-template-areas:
      "text logo"
      "cta  logo";
    column-gap: 64px;
    align-items: center;
  }
  .partner-text { grid-area: text; }
  .partner-cta  { grid-area: cta; margin-top: 24px; }
  .partner-logo {
    grid-area: logo;
    margin-top: 0;
    text-align: right;
    align-self: center;
  }
  .partner-logo-img {
    width: 108px;
    opacity: 0.65;
  }
}