/* "Recently added" section injected into product pages by
   scripts/inject-product-updates.js. Uses flagship.css tokens only. */
.product-updates { padding: clamp(56px, 7vw, 96px) 0; background: var(--soft); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.product-updates-head { display: grid; align-items: end; gap: 20px 40px; margin-bottom: 36px; grid-template-columns: minmax(0, 1fr) minmax(0, 0.85fr); }
.product-updates-head h2 { max-width: 16ch; margin: 10px 0 0; font-size: clamp(34px, 4.4vw, 58px); letter-spacing: -0.055em; line-height: 1; }
.product-updates-head p { margin: 0; color: var(--muted); font-size: 17px; line-height: 1.5; }
.product-updates-grid { display: grid; gap: 14px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.product-update-card { display: flex; flex-direction: column; padding: 26px; border: 1px solid var(--line); border-radius: var(--radius-md); background: #fff; }
.product-update-card small { align-self: flex-start; padding: 5px 10px; border-radius: 999px; background: var(--lime); font-family: "Geist Mono", monospace; font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; }
.product-update-card small.product-update-tag--max { background: var(--ink); color: #fff; }
.product-update-card h3 { margin: 18px 0 10px; font-size: 22px; letter-spacing: -0.035em; line-height: 1.12; }
.product-update-card p { margin: 0; color: #54564f; font-size: 15px; line-height: 1.5; }
.product-update-card a { margin-top: auto; padding-top: 16px; font-size: 14px; font-weight: 620; }

@media (max-width: 960px) {
  .product-updates-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .product-updates-head { grid-template-columns: 1fr; }
}

@media (max-width: 620px) {
  .product-updates-grid { grid-template-columns: 1fr; }
  .product-update-card { padding: 22px; }
}
