/* ==== area pages: near cards ==== */
.yh-grid3 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 1.5rem;
}
.yh-card {
  display: block;
  background: #fff;
  border: 1px solid #e0e0e0;
  border-radius: 12px;
  padding: 1.2rem 1rem;
  text-decoration: none;
  color: inherit;
  box-shadow: 0 1px 3px rgba(0,0,0,.05);
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.yh-card:hover {
  box-shadow: 0 4px 14px rgba(0,0,0,.12);
  transform: translateY(-2px);
  border-color: #238cdd;
}
.yh-card h3 {
  font-size: 1.1rem;
  color: #238cdd;
  margin: 0 0 .3rem;
}
.yh-card p {
  font-size: .9rem;
  color: #555;
  margin: 0;
  line-height: 1.5;
}

/* キーボード操作の可視化 */
.yh-card:focus-visible {
  outline: 2px solid #238cdd;
  outline-offset: 3px;
  border-color: #238cdd;
}

/* 小画面の余白最適化 */
@media (max-width: 480px) {
  .yh-grid3 { gap: 1.1rem; }
  .yh-card { border-radius: 10px; padding: 1rem .9rem; }
}