.lv-categories { background: #000; padding: 96px 24px 0; }

.lv-cat-mosaic {
  display: grid;
  grid-template-columns: 7fr 5fr;
  grid-template-rows: repeat(2, 1fr);
  gap: 4px;
  max-width: 1400px;
  height: 720px;
  margin: 0 auto;
}

.lv-cat-tile {
  position: relative;
  display: block;
  background-size: cover;
  background-position: center;
  overflow: hidden;
  text-decoration: none;
}
.lv-cat-tile::before {
  content: "";
  position: absolute; inset: 0;
  background-size: cover;
  background-position: center;
  transition: transform .7s ease;
}
.lv-cat-tile img { display: none; }
.lv-cat-tile:hover { }
.lv-cat-tile:hover::after { transform: scaleX(1); }

.lv-cat-a { grid-column: 1; grid-row: 1 / span 2; }
.lv-cat-b { grid-column: 2; grid-row: 1; }
.lv-cat-split { grid-column: 2; grid-row: 2; display: grid; grid-template-columns: 1fr 1fr; gap: 4px; }
.lv-cat-c1, .lv-cat-c2 { grid-column: auto; grid-row: auto; }

.lv-cat-scrim {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,.85), transparent 60%);
}

.lv-cat-label {
  position: absolute;
  left: 28px; bottom: 26px;
  right: 28px;
}
.lv-cat-rule {
  display: block;
  height: 1px;
  width: 0%;
  background: var(--lv-gold);
  margin-bottom: 12px;
  transition: width .5s ease;
}
.lv-cat-tile:hover .lv-cat-rule { width: 60px; }
.lv-cat-tile:hover { transform: scale(1); }
.lv-cat-tile { transition: none; }
.lv-cat-tile:hover .lv-cat-label ~ * { }

.lv-cat-label h3 {
  font: 400 clamp(22px, 2.4vw, 32px)/1.1 var(--lv-font-display);
  color: var(--lv-cream);
  margin: 0 0 4px;
}
.lv-cat-label p {
  font: 600 11px/1 var(--lv-font-sans);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--lv-gold);
  margin: 0;
}

.lv-cat-tile { background-size: cover; background-position: center; transition: background-size .7s ease; }
.lv-cat-tile:hover { background-size: 112%; }

.lv-cat-band {
  position: relative;
  display: flex;
  align-items: center;
  height: 200px;
  max-width: 1400px;
  margin: 4px auto 0;
  background-size: cover;
  background-position: center;
  text-decoration: none;
}
.lv-cat-band-scrim {
  position: absolute; inset: 0;
  background: linear-gradient(to right, rgba(0,0,0,.75) 0%, rgba(0,0,0,.35) 60%, rgba(0,0,0,.1) 100%);
}
.lv-cat-band-text {
  position: relative;
  padding: 0 40px;
  font: 400 20px/1.4 var(--lv-font-display);
  color: var(--lv-cream);
  margin: 0;
}
.lv-cat-band-cta {
  display: inline-block;
  margin-left: 12px;
  font: 600 12px/1 var(--lv-font-sans);
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--lv-gold);
}

@media (max-width: 1024px) {
  .lv-cat-mosaic { grid-template-columns: 1fr; grid-template-rows: repeat(3, 260px); height: auto; }
  .lv-cat-a, .lv-cat-b, .lv-cat-split { grid-column: 1; }
  .lv-cat-a { grid-row: 1; } .lv-cat-b { grid-row: 2; } .lv-cat-split { grid-row: 3; }
}
@media (max-width: 700px) {
  .lv-categories { padding: 64px 16px 0; }
  .lv-cat-band { height: 160px; flex-wrap: wrap; }
  .lv-cat-band-text { font-size: 16px; }
}