/* VTO homepage photo sliders and category buttons across all screen sizes. */
#sidebar .vto-venue-card-image { display: none; }
#sidebar .vto-venue-card-media { display: none; }
#content .vto-home-specials {
  width: 100%;
  min-width: 0;
  margin: 26px 0 34px;
  font-family: Boston, Arial, Helvetica, sans-serif;
}
#content .vto-specials-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 14px;
}
#content .vto-specials-header h2,
#content .vto-specials-header h4 {
  margin: 0;
  padding: 0;
  border: 0;
  color: #0f1b2d;
  font: normal normal 800 22px/1.25 Boston, Arial, Helvetica, sans-serif;
  text-transform: none;
}
#content .vto-specials-controls { display: flex; gap: 8px; }
#content .vto-specials-controls[hidden] { display: none; }
.vto-home-category-group .vto-specials-header[hidden] { display: none; }
#content .vto-specials-controls button {
  width: 36px;
  height: 36px;
  padding: 0;
  border: 1px solid #dce1e7;
  border-radius: 50%;
  background: #fff;
  color: #242833;
  font: 26px/1 Arial, sans-serif;
  cursor: pointer;
}
#content .vto-specials-controls button:disabled { opacity: .35; cursor: default; }
#content .vto-home-specials ul {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 184px;
  gap: 18px;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  margin: 0;
  padding: 6px 3px 14px;
  list-style: none;
}
#content .vto-home-specials li { margin: 0; padding: 0; scroll-snap-align: start; }
@media (min-width: 821px) {
  #content .vto-home-specials ul { scrollbar-width: none; }
  #content .vto-home-specials ul::-webkit-scrollbar { display: none; }
}
#content .vto-home-specials li::before { display: none; }
#content .vto-home-specials a {
  display: block;
  color: #242833;
  font: normal normal 700 16px/1.2 Boston, Arial, Helvetica, sans-serif;
  text-decoration: none;
}
#content .vto-home-specials img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 11;
  object-fit: cover;
  border-radius: 18px;
  margin-bottom: 10px;
  box-shadow: 0 4px 12px rgba(15, 23, 42, .14);
}
#content .vto-home-specials a:hover { color: #db0028; }
#content .vto-home-specials :focus-visible { outline: 2px solid #db0028; outline-offset: 2px; }
@media (max-width: 820px) {
  #content .vto-home-specials ul {
    grid-auto-columns: 156px;
    gap: 14px;
    padding-right: 0;
    padding-left: 0;
  }
}
#content .vto-home-category-group {
  float: none;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
#content .vto-home-category-group li {
  width: auto;
  border: 0;
  background: transparent;
}
#content .vto-home-category-group a {
  padding: 0;
  border: 0;
  background: transparent;
  white-space: normal;
}
#content .vto-home-category-group:not(.vto-home-venues) img { display: none; }
#content .vto-home-category-group:not(.vto-home-venues) ul {
  display: grid;
  grid-auto-flow: row;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  overflow: visible;
  scroll-snap-type: none;
  padding: 0;
}
#content .vto-home-category-group:not(.vto-home-venues) li {
  min-width: 0;
}
#content .vto-home-category-group:not(.vto-home-venues) .vto-specials-controls { display: none; }
#content .vto-home-category-group:not(.vto-home-venues) a {
  display: flex;
  align-items: center;
  gap: 10px;
  box-sizing: border-box;
  min-height: 48px;
  height: 100%;
  padding: 10px 12px;
  border: 1px solid #e7e9ee;
  border-radius: 12px;
  background: #fff;
  font-size: 14px;
  line-height: 1.3;
  overflow-wrap: anywhere;
}
#content .vto-home-category-group:not(.vto-home-venues) a:hover,
#content .vto-home-category-group:not(.vto-home-venues) a:focus-visible {
  background: #fff0f2;
  border-color: var(--main, #db0028);
}
#content .vto-home-category-group:not(.vto-home-venues) a::before {
  content: '';
  display: block;
  position: static;
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  background: var(--main, #db0028);
  -webkit-mask: var(--vto-category-icon) center / contain no-repeat;
  mask: var(--vto-category-icon) center / contain no-repeat;
  pointer-events: none;
}
#content .vto-home-category-group:not(.vto-home-venues) a::after { display: none; }
#content .vto-home-venues a::after,
#content .vto-home-venues .vto-venue-image-link::before { display: none; }
#content .vto-venue-card-media {
  position: relative;
  display: block;
  isolation: isolate;
  margin-bottom: 10px;
}
#content .vto-home-venues ul { grid-auto-columns: max-content; }
#content .vto-home-venues li {
  width: 234px;
  box-sizing: border-box;
  padding-left: 50px;
}
#content .vto-home-venues li:nth-child(-n+9) .vto-venue-card-number {
  left: auto;
  right: calc(100% + 4px);
  letter-spacing: 0;
}
#content .vto-home-venues li:nth-child(n+10) {
  width: 254px;
  padding-left: 70px;
}
#content .vto-home-venues li:nth-child(n+10) .vto-venue-card-number { left: -70px; }
#content .vto-venue-card-number {
  position: absolute;
  left: -30px;
  top: 50%;
  z-index: 0;
  transform: translateY(-50%);
  display: block;
  color: var(--main, #db0028);
  filter: drop-shadow(0 2px 2px rgba(104, 0, 23, .2));
  font: normal normal 800 76px/1 Boston, Arial, Helvetica, sans-serif;
  letter-spacing: -4px;
  pointer-events: none;
}
@supports ((background-clip: text) or (-webkit-background-clip: text)) {
  #content .vto-venue-card-number {
    background: linear-gradient(160deg, #f45067 0%, var(--main, #db0028) 48%, #940020 100%);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
  }
}
#content .vto-venue-card-media img {
  position: relative;
  z-index: 1;
  margin-bottom: 0;
}
@media (max-width: 820px) {
  #content .vto-home-venues li { width: 206px; }
  #content .vto-home-venues li:nth-child(n+10) { width: 226px; }
  #content .vto-home-category-group:not(.vto-home-venues) ul {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }
}
/* Match the recommended-event content gutters on phones. */
@media (max-width: 600px) {
  #content .vto-home-specials {
    box-sizing: border-box;
    padding-right: 12px;
    padding-left: 12px;
  }
}
