@charset "UTF-8";

/* Shared product navigation, independent of the legacy image tab styles. */
.product-tabs { padding: 88px 20px 0; background: #23232d; }
.product-tabs-inner { display: flex; justify-content: center; max-width: 1120px; margin: 0 auto; gap: 12px; }
.product-tabs a { display: flex; align-items: center; justify-content: center; min-height: 58px; padding: 14px 28px; color: #d8d8e0; font-size: 16px; text-decoration: none; border-bottom: 3px solid transparent; text-align: center; line-height: 1.4; }
.product-tabs a:hover, .product-tabs a[aria-current="page"] { color: #ffb260; border-bottom-color: #f7941d; }
.product-tabs a:focus-visible { outline: 2px solid #ffb260; outline-offset: -4px; }
@media (min-width: 1024px) {
  .legacy-product-page .product-tabs { padding-bottom: 48px; }
}

/* Three home-page cards must wrap rather than clip in the old fixed-height row. */
.wrap .content-3 .product-card-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; height: auto; overflow: visible; margin: 0; padding: 24px 0 48px; }
.wrap .content-3 .product-card-list .card { float: none; width: auto; min-width: 0; margin: 0; margin-right: 0 !important; display: flex; flex-direction: column; }
.wrap .content-3 .product-card-list .card .title { min-height: 76px; display: flex; align-items: center; justify-content: center; padding: 18px 12px; font-size: 22px; }
.wrap .content-3 .product-card-list .card .title .img-ezmon,
.wrap .content-3 .product-card-list .card .title .img-ezwork { width: auto; height: 40px; padding-left: 48px; background-size: 36px; font-size: 24px; line-height: 40px; white-space: nowrap; }
.wrap .content-3 .product-card-list .card .body { flex: 1; display: flex; flex-direction: column; padding: 5px 18px 24px; }
.wrap .content-3 .product-card-list .card .body p { margin: 16px 0 24px; width: auto; line-height: 1.65; }
.wrap .content-3 .product-card-list .card .readmore-btn { margin: auto auto 0; }
.wrap .content-3 .card.datalogger .title { background: #a94c00; color: white; }
.wrap .content-3 .card.datalogger .readmore-btn { border-color: #a94c00; color: #a94c00; }
.wrap .content-3 .card.datalogger .readmore-btn:hover { background: #a94c00; color: white; }
@media (max-width: 767px) {
  .product-tabs { padding: 72px 12px 0; }
  .product-tabs-inner { gap: 0; }
  .product-tabs a { padding: 12px 10px; font-size: 14px; flex: 1; }
  .product-tabs a:last-child { flex: 1.6; }
  .wrap .content-3 .product-card-list { grid-template-columns: 1fr; max-width: 420px; margin: 0 auto; }
}