.n13-links.equipment-tiles {
  padding-block: clamp(24px, 4vw, 48px);
}
.equipment-tiles #n13-popular {
  margin: 0 0 clamp(18px, 2vw, 26px);
  color: var(--deep);
}
.n13-links.equipment-tiles ul {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  grid-auto-rows: 1fr;
  gap: 14px;
  padding: 0;
  margin: 0;
}
.n13-links.equipment-tiles li {
  display: flex;
  min-width: 0;
  margin: 0;
}
.n13-links.equipment-tiles li > a {
  position: relative;
  isolation: isolate;
  display: flex;
  flex-flow: column nowrap;
  align-items: flex-start;
  justify-content: flex-start;
  width: 100%;
  min-width: 0;
  min-height: 160px;
  gap: 0;
  padding: 14px 16px 16px;
  border: 1px solid #c3dbe4;
  border-radius: var(--radius);
  background: linear-gradient(146deg, var(--white) 30%, var(--pale) 100%);
  color: var(--deep);
  text-align: left;
  text-decoration: none;
  box-shadow: 0 2px 5px rgb(21 59 80 / 6%);
  transition: background-color .16s, box-shadow .16s, border-color .16s, transform .16s;
}
.equipment-tiles .tile-photo {
  display: block;
  width: 98px;
  height: 58px;
  margin: 0 0 12px;
  object-fit: contain;
  mix-blend-mode: multiply;
}
.equipment-tiles .tile-copy {display: block; min-width: 0}
.equipment-tiles .tile-verb {
  display: block;
  margin: 0 0 3px;
  color: var(--blue);
  font-family: inherit;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.equipment-tiles .tile-name {
  display: block;
  color: var(--deep);
  font-size: clamp(16px, 1.25vw, 18px);
  font-weight: 750;
  line-height: 1.24;
  letter-spacing: -.015em;
}
.equipment-tiles .tile-go {
  position: absolute;
  inset: 14px 14px auto auto;
  display: grid;
  place-items: center;
  width: 27px;
  height: 27px;
  border-radius: 50%;
  background: #eaf6fb;
  color: var(--blue);
  font: 700 16px/1 system-ui,sans-serif;
  transition: background-color .16s, color .16s;
}
.n13-links.equipment-tiles a:focus-visible {
  outline: 3px solid var(--orange);
  outline-offset: 2px;
  border-color: var(--blue);
}
@media (hover:hover) {
  .n13-links.equipment-tiles li > a:hover {
    transform: translateY(-2px);
    border-color: var(--blue);
    background: linear-gradient(146deg,white 15%,#eaf6fb 100%);
    box-shadow: 0 6px 16px rgb(17 127 171 / 17%);
    text-decoration: none;
  }
  .equipment-tiles a:hover .tile-go {background: var(--blue); color: var(--white)}
}
.equipment-tiles a:focus-visible .tile-go {background: var(--blue); color: var(--white)}
.n13-links.equipment-tiles li > a:active {border-color: var(--blue); background: #eaf6fb; transform: none}
@media (max-width: 1100px) {
  .n13-links.equipment-tiles ul {grid-template-columns: repeat(2, minmax(0, 1fr))}
  .n13-links.equipment-tiles li > a {min-height: 96px; flex-direction: row; align-items: center; gap: 13px; padding: 14px 42px 14px 14px}
  .equipment-tiles .tile-photo {width: 76px; height: 57px; margin: 0; flex: 0 0 76px}
  .equipment-tiles .tile-go {top: 50%; right: 9px; transform: translateY(-50%)}
}
@media (max-width: 620px) {
  .n13-links.equipment-tiles ul {gap: 10px}
  .n13-links.equipment-tiles li > a {min-height: 143px; flex-direction: column; align-items: flex-start; gap: 0; padding: 12px}
  .equipment-tiles .tile-photo {width: 78px; height: 48px; flex: none; margin-bottom: 10px}
  .equipment-tiles .tile-name {font-size: 16px}
  .equipment-tiles .tile-go {top: 10px; right: 10px; width: 23px; height: 23px; transform: none}
}
@media (max-width: 359px) {
  .n13-links.equipment-tiles ul {grid-template-columns: 1fr}
  .n13-links.equipment-tiles li > a {flex-direction: row; align-items: center; gap: 12px; min-height: 76px; padding-right: 42px}
  .equipment-tiles .tile-photo {width: 58px; height: 45px; margin: 0; flex: 0 0 58px}
  .equipment-tiles .tile-go {top: 50%; transform: translateY(-50%)}
}
@media (prefers-reduced-motion: reduce) {
  .n13-links.equipment-tiles li > a, .equipment-tiles .tile-go {transition: none}
  .n13-links.equipment-tiles li > a:hover {transform: none}
}