/* TheTekCoffee — Retail Premium Related 2.0 */
.ttc-related {
  --ttc-green:#18794e;
  --ttc-green-dark:#11653f;
  --ttc-border:#e5ece8;
  --ttc-border-hover:#c9ded2;
  --ttc-text:#17221d;
  --ttc-muted:#718078;
  --ttc-gap:16px;
  width:100%;
  margin:44px 0 18px;
}
.ttc-related *, .ttc-related *::before, .ttc-related *::after { box-sizing:border-box; }

.ttc-related__inner {
  width:min(1180px, calc(100% - 32px));
  margin:0 auto;
}

.ttc-related__head {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:24px;
  margin-bottom:18px;
}

.ttc-related__title {
  margin:0 0 4px;
  color:var(--ttc-text);
  font-size:clamp(22px,2vw,30px);
  line-height:1.2;
  font-weight:700;
  letter-spacing:-.02em;
}
.ttc-related__subtitle {
  margin:0;
  color:var(--ttc-muted);
  font-size:14px;
  line-height:1.5;
}

.ttc-related__nav { display:flex; gap:8px; flex:0 0 auto; }
.ttc-related__nav-btn {
  appearance:none;
  width:40px;
  height:40px;
  min-height:40px;
  padding:0;
  display:inline-grid;
  place-items:center;
  border:1px solid #dbe6e0;
  border-radius:8px;
  background:#fff;
  color:var(--ttc-green);
  box-shadow:none;
  cursor:pointer;
  transition:.18s ease;
}
.ttc-related__nav-btn span { font-size:28px; line-height:1; margin-top:-2px; }
.ttc-related__nav-btn:hover {
  border-color:var(--ttc-border-hover);
  background:#f8fbf9;
  color:var(--ttc-green-dark);
  transform:translateY(-1px);
}
.ttc-related__nav-btn:disabled { opacity:.35; cursor:default; transform:none; }
.ttc-related__nav-btn:focus-visible { outline:2px solid rgba(24,121,78,.28); outline-offset:2px; }

.ttc-related__viewport { overflow:hidden; }
.ttc-related__track {
  display:flex;
  gap:var(--ttc-gap);
  overflow-x:auto;
  overflow-y:hidden;
  width:100%;
  padding:1px 1px 8px;
  scroll-snap-type:x mandatory;
  scroll-behavior:smooth;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
}
.ttc-related__track::-webkit-scrollbar { display:none; }

.ttc-related-card {
  position:relative;
  display:flex;
  flex:0 0 calc((100% - (var(--ttc-gap) * 3)) / 4);
  min-width:0;
  flex-direction:column;
  scroll-snap-align:start;
  background:#fff;
  border:1px solid var(--ttc-border);
  border-radius:14px;
  overflow:hidden;
  cursor:pointer;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.ttc-related-card:hover {
  transform:translateY(-2px);
  border-color:var(--ttc-border-hover);
  box-shadow:0 6px 20px rgba(29,56,43,.045);
}
.ttc-related-card:focus-visible { outline:2px solid rgba(24,121,78,.28); outline-offset:2px; }

.ttc-related-card__media {
  position:relative;
  display:grid;
  place-items:center;
  height:200px;
  padding:18px 18px 6px;
  background:#fff;
  overflow:hidden;
}
.ttc-related-card__image-link {
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
}
.ttc-related-card__img,
.ttc-related-card .woocommerce-placeholder {
  display:block;
  width:100%;
  height:100%;
  max-width:100%;
  max-height:100%;
  object-fit:contain;
  object-position:center;
  margin:0;
  transform:scale(1);
  transition:transform .22s ease;
}
.ttc-related-card:hover .ttc-related-card__img,
.ttc-related-card:hover .woocommerce-placeholder { transform:scale(1.02); }

.ttc-related-card__badges {
  position:absolute;
  z-index:2;
  top:14px;
  left:14px;
  right:14px;
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  pointer-events:none;
}
.ttc-related-card__badge {
  display:inline-flex;
  align-items:center;
  min-height:25px;
  padding:4px 9px;
  border-radius:7px;
  font-size:11px;
  line-height:1.15;
  font-weight:650;
  white-space:nowrap;
}
.ttc-related-card__badge.is-official { color:#fff; background:var(--ttc-green); }
.ttc-related-card__badge.is-new { color:#0f5e9b; background:#e7f4ff; }
.ttc-related-card__badge.is-sale { color:#9a2c2c; background:#ffe8e6; }
.ttc-related-card__badge.is-like-new { color:#6f4e00; background:#fff4d8; }
.ttc-related-card__badge.is-accessory { color:#6c4b13; background:#fff0d2; }

.ttc-related-card__body {
  display:flex;
  flex:1 1 auto;
  flex-direction:column;
  min-width:0;
  padding:14px 18px 17px;
}
.ttc-related-card__category {
  margin-bottom:6px;
  color:#78867f;
  font-size:10px;
  line-height:1.25;
  font-weight:650;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.ttc-related-card__title {
  min-height:38px;
  margin:0 0 9px;
  color:var(--ttc-text);
  font-size:14px;
  line-height:1.35;
  font-weight:650;
  letter-spacing:-.01em;
}
.ttc-related-card__title a {
  display:-webkit-box;
  overflow:hidden;
  color:inherit;
  text-decoration:none;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}
.ttc-related-card__title a:hover { color:var(--ttc-green); }

.ttc-related-card__pricing { min-height:45px; margin-bottom:15px; }
.ttc-related-card__price {
  color:var(--ttc-green);
  font-size:16px;
  line-height:1.25;
  font-weight:750;
}
.ttc-related-card__price .price,
.ttc-related-card__price .amount,
.ttc-related-card__price ins {
  color:var(--ttc-green);
  font-size:16px;
  font-weight:750;
  text-decoration:none;
}
.ttc-related-card__price del,
.ttc-related-card__price del .amount {
  display:block;
  margin-top:3px;
  color:#8b9791;
  font-size:11px;
  line-height:1.3;
  font-weight:400;
}
.ttc-related-card__contact {
  color:#2b7d59;
  font-size:11.5px;
  line-height:1.35;
  font-weight:650;
  letter-spacing:.005em;
}
.ttc-related-card__footer { margin-top:auto; }
.ttc-related-card__cta {
  display:inline-flex;
  align-items:center;
  gap:7px;
  color:var(--ttc-green);
  font-size:12px;
  line-height:1.35;
  font-weight:650;
  text-decoration:none;
}
.ttc-related-card__cta span { transition:transform .18s ease; }
.ttc-related-card__cta:hover { color:var(--ttc-green-dark); }
.ttc-related-card__cta:hover span { transform:translateX(2px); }

.ttc-related__mobile-progress { display:none; }

@media (max-width:1023px) {
  .ttc-related { margin-top:36px; }
  .ttc-related__inner { width:min(100% - 28px,1180px); }
  .ttc-related-card { flex-basis:calc((100% - (var(--ttc-gap) * 2)) / 3); }
  .ttc-related-card__media { height:190px; }
}

@media (max-width:767px) {
  .ttc-related { --ttc-gap:12px; margin:30px 0 10px; }
  .ttc-related__inner { width:100%; }
  .ttc-related__head {
    align-items:center;
    gap:12px;
    padding:0 16px;
    margin-bottom:14px;
  }
  .ttc-related__title { margin-bottom:3px; font-size:22px; }
  .ttc-related__subtitle { max-width:270px; font-size:12px; line-height:1.45; }
  .ttc-related__nav { gap:6px; }
  .ttc-related__nav-btn { width:36px; height:36px; min-height:36px; }
  .ttc-related__viewport { overflow:visible; }
  .ttc-related__track { scroll-padding-left:16px; padding:1px 16px 8px; }
  .ttc-related-card { flex-basis:min(74.1vw,286px); }
  .ttc-related-card__media { height:180px; padding:15px 14px 4px; }
  .ttc-related-card__badges { top:12px; left:12px; right:12px; }
  .ttc-related-card__badge { min-height:23px; padding:4px 8px; font-size:10px; }
  .ttc-related-card__body { padding:12px 14px 15px; }
  .ttc-related-card__category { margin-bottom:5px; font-size:9px; }
  .ttc-related-card__title { min-height:36px; margin-bottom:8px; font-size:13px; }
  .ttc-related-card__pricing { min-height:42px; margin-bottom:12px; }
  .ttc-related-card__price,
  .ttc-related-card__price .price,
  .ttc-related-card__price .amount,
  .ttc-related-card__price ins { font-size:15px; }
  .ttc-related-card__contact { font-size:11px; }
  .ttc-related__mobile-progress {
    display:flex;
    justify-content:center;
    gap:8px;
    padding-top:6px;
  }
  .ttc-related__mobile-progress span {
    width:6px;
    height:6px;
    border-radius:50%;
    background:#cfd8d3;
  }
  .ttc-related__mobile-progress span.is-active { background:var(--ttc-green); }
}

@media (prefers-reduced-motion:reduce) {
  .ttc-related *,
  .ttc-related *::before,
  .ttc-related *::after {
    scroll-behavior:auto !important;
    transition:none !important;
    animation:none !important;
  }
}