
/* WorkshopUpdate canonical frontend */
.product-workshop { margin-top: 2rem; }
.product-workshop-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.product-workshop-card { border:1px solid var(--line,#e7e1d6); border-radius:20px; overflow:hidden; background:var(--card,#fff); }
.product-workshop-card img { width:100%; aspect-ratio:16/9; object-fit:cover; display:block; }
.product-workshop-card > div { padding:1.1rem; }
.product-workshop-card h3 { margin:.25rem 0 .5rem; }
.product-workshop-card a { color:var(--accent-dark,#516f18); font-weight:700; }
@media (max-width:800px){.product-workshop-grid{grid-template-columns:1fr}.product-workshop-card{display:grid;grid-template-columns:110px 1fr}.product-workshop-card img{height:100%;aspect-ratio:auto}.product-workshop-card>div{padding:.9rem}}


/* R3.2: WorkshopUpdate type-aware product cards */
.product-workshop-media {
  position: relative;
  display: block;
  color: inherit;
  text-decoration: none;
  background: var(--soft, #f3f0e8);
}
.product-workshop-media img {
  width: 100%;
  aspect-ratio: 16/9;
  object-fit: cover;
  display: block;
}
.product-workshop-play {
  position: absolute;
  inset: 50% auto auto 50%;
  transform: translate(-50%, -50%);
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: rgba(35, 32, 24, .78);
  color: #fff;
  font-size: 18px;
  line-height: 1;
  pointer-events: none;
}
.product-workshop-content .kicker {
  margin: 0 0 .35rem;
}
.product-workshop-link {
  display: inline-block;
  margin-top: .45rem;
}

@media (max-width:800px) {
  .product-workshop-media img {
    height: 100%;
    aspect-ratio: auto;
  }
}


/* R4.1: WorkshopUpdate cards always navigate through the canonical detail page */
.home-news-title-link,
.guide-card-title-link,
.product-workshop-title-link {
  color: inherit;
  text-decoration: none;
}

.home-news-title-link:hover,
.guide-card-title-link:hover,
.product-workshop-title-link:hover {
  text-decoration: underline;
  text-decoration-thickness: .08em;
  text-underline-offset: .12em;
}
