/* Transcending Personal Training
   Services and Service Areas hub pages. */

.page-hub .hub-hero .svc-desc a {
  color:var(--red-dark);
  font-weight:700;
}

.hub-list {
  padding:72px 5vw 96px;
  background-color:#fff;
  background-image:radial-gradient(rgba(23,23,26,.07) 1.2px,transparent 1.5px);
  background-size:24px 24px;
  border-top:4px solid var(--red);
}

.hub-grid {
  list-style:none;
  max-width:1180px;
  margin:0 auto;
  padding:0;
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(270px,1fr));
  gap:22px;
}

.hub-card a {
  display:flex;
  flex-direction:column;
  height:100%;
  background:#fff;
  border:1px solid var(--border);
  border-top:3px solid var(--red);
  border-radius:6px;
  overflow:hidden;
  color:var(--ink);
  text-decoration:none;
  box-shadow:0 10px 30px rgba(23,23,26,.08);
  transition:transform .2s,box-shadow .2s;
}

.hub-card a:hover {
  transform:translateY(-4px);
  box-shadow:0 18px 40px rgba(23,23,26,.14);
}

.hub-img {
  display:block;
  aspect-ratio:16/10;
  background:#17171a;
  overflow:hidden;
}

.hub-img img {
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.hub-body {
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:20px 20px 22px;
  flex:1;
}

.hub-name {
  font-family:'Bebas Neue','Bebas Fallback',sans-serif;
  font-size:1.6rem;
  letter-spacing:.02em;
  line-height:1;
}

.hub-desc {
  font-size:.9rem;
  line-height:1.6;
  color:var(--mid);
}

.hub-go {
  margin-top:auto;
  padding-top:6px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:.82rem;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--red-dark);
}

@media (max-width:640px) {
  .hub-list {
    padding:52px 16px 72px;
  }
}

@media (prefers-reduced-motion:reduce) {
  .hub-card a {
    transition:none;
  }
}