/*
 * footer sizing
 */
.site-footer {
  font-size: var(--wp--preset--font-size--sm);
  background-color: #b4b4b4;
}
.site-footer .footer__site-name { font-size: clamp(16px, 1.6vw, 22px); }
.site-footer .footer__heading   { font-size: clamp(12px, 1.2vw, 16px); }
.site-footer .footer__menu a    { font-size: clamp(10px, 1.0vw, 15px); }
.site-footer .footer__breadcrumbs { font-size: var(--wp--preset--font-size--sm); }

.site-footer{ border-top:1px solid #dcdfe5; margin-top:48px; padding:48px 0 24px; }
.footer__inner{ max-width:1200px; margin:0 auto; padding:0 24px; }

/* 4カラムのグリッド（左列を広めに） */
.footer__grid{
  display: grid; /* ←必須 */
  grid-template-columns: minmax(420px, 2fr) repeat(3, minmax(180px, 1fr));
  gap: 24px 32px;
  align-items: start;
}

/* 左列の明示的な左寄せ */
.footer__col--brand{ justify-self: start; }

/* サイト名＋アイコンを横並びに */
.footer__site-name{
  display:flex;
  align-items:center;
  gap:.5rem;
  line-height:1.2;
  margin:0 0 .5rem;
}
.footer__site-name a{ text-decoration:none; color:inherit; }

/* サイトアイコンのサイズ統一 */
.footer__site-icon{
  width:28px; height:28px;
  border-radius:6px; /* お好みで */
  object-fit:cover;
}

/* レスポンシブ */
@media (max-width: 960px){
  .footer__grid{ grid-template-columns: 1fr 1fr; }
  .footer__col--brand{ grid-column: 1 / -1; }
}
@media (max-width: 600px){
  .footer__grid{ grid-template-columns: 1fr; }
}

/* footer bottom layout and copyright */
.footer__bottom{ display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:8px; margin-top:8px; }
.footer__breadcrumbs{ margin:0; }
.footer__copyright{ margin:0; font-size: var(--wp--preset--font-size--sm); }