/* Match categoryinfo product banners and productSpu/3 cards. */
.product.pitch-page { padding-bottom: 40px; }
.pitch-banner {
  position: relative;
  min-height: 300px;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  background: var(--ys-color-background-100, #eee);
  color: var(--ys-color-text-000, #333);
}
.pitch-banner > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.pitch-banner__content,
.product.pitch-page .pitch-section { width: min(calc(100% - 80px), 1300px); margin: 0 auto; }
.pitch-banner__content { position: relative; min-width: 0; align-self: center; padding: 40px 0; }
.pitch-banner h1 { margin: 0; font-size: 40px; line-height: 1.4; }
.pitch-banner p { width: 600px; max-width: 100%; margin: 20px 0 0; font-size: 16px; line-height: 30px; }
.product.pitch-page .pitch-section { padding: 36px 0 0; }
.pitch-page .pitch-section .product-subtitle {
  margin: 0 0 20px;
  padding: 0;
  border: 0;
  color: var(--ys-color-text-000, #333);
  font-size: 24px;
  font-weight: 500;
}
.pitch-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 30px; padding: 10px; margin: 0; list-style: none; }
.pitch-grid > li { min-width: 0; }
.pitch-card { display: flex; flex-direction: column; height: 100%; color: var(--ys-color-text-000, #333); text-decoration: none; }
.pitch-card__image {
  position: relative;
  aspect-ratio: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: url(/asset/img/index/product-bg.png) center / cover no-repeat;
}
.pitch-card__image img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: darken; transition: transform .2s; }
.pitch-card:hover img { transform: scale(1.05); }
.pitch-card__placeholder { padding: 24px; text-align: center; color: #666; }
.pitch-card__overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(17, 52, 98, .7);
  opacity: 0;
  transition: opacity .2s;
}
.pitch-card__button { padding: 8px 30px; border: 1px solid #fff; color: #fff; font-size: 14px; line-height: 18px; }
.pitch-card__title { flex: 1; margin: 0; padding: 15px 14px; border: 1px solid transparent; font-size: 16px; line-height: 26px; font-weight: 600; }
.pitch-card:hover .pitch-card__overlay,
.pitch-card:focus-visible .pitch-card__overlay { opacity: 1; }
.pitch-card:hover .pitch-card__title,
.pitch-card:focus-visible .pitch-card__title { background: #fff; border-color: var(--ys-color-primary, #1d58b5); color: var(--ys-color-primary, #1d58b5); }
.pitch-card:focus-visible { outline: 2px solid var(--ys-color-primary, #1d58b5); outline-offset: 3px; }
.pitch-empty { padding: 20px 0; color: #666; }
@media (max-width: 900px) {
  .pitch-banner { min-height: 220px; }
  .pitch-banner__content,
  .product.pitch-page .pitch-section { width: calc(100% - 32px); }
  .pitch-banner__content { padding: 28px 0; }
  .pitch-banner h1 { font-size: 28px; }
  .pitch-banner p { margin-top: 12px; font-size: 14px; line-height: 1.8; }
  .product.pitch-page .pitch-section { padding-top: 28px; }
  .pitch-page .pitch-section .product-subtitle { margin-bottom: 14px; font-size: 22px; }
  .pitch-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; padding: 0; }
  .pitch-card__title { padding: 12px 10px; font-size: 14px; line-height: 24px; }
}
@media (max-width: 900px), (hover: none) {
  .pitch-card__overlay { opacity: 1; top: auto; padding: 8px; }
  .pitch-card__button { padding: 6px 12px; font-size: 12px; }
}
@media (max-width: 320px) {
  .pitch-grid { grid-template-columns: 1fr; }
}