/* RCBO Grid Blocks — static shared styles */

.rcbo-grid-blocks .grid {
  display: grid;
  grid-template-columns: repeat(var(--cols-desktop), minmax(0,1fr));
  gap: var(--img-gap);
}

@media (max-width: 979.98px) {
  .rcbo-grid-blocks .grid {
    grid-template-columns: repeat(var(--cols-tablet), minmax(0,1fr));
  }
}
@media (max-width: 767.98px) {
  .rcbo-grid-blocks .grid {
    grid-template-columns: repeat(var(--cols-mobile), minmax(0,1fr));
  }
}

/* Tile base */
.rcbo-grid-blocks .tile {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: var(--aspect);
  overflow: hidden;
  text-decoration: none;
  color: #fff;
  background: #e9e9e9;
}

.rcbo-grid-blocks .tile img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transform: scale(1);
  transition: transform .35s ease;
}

.rcbo-grid-blocks .tile:hover img {
  transform: scale(1.03);
}

/* Overlay + label */
.rcbo-grid-blocks .tile::after {
  content: "";
  position: absolute;
  inset: 0;
  background: var(--overlay);
  transition: background-color .25s ease;
}
.rcbo-grid-blocks .tile:hover::after {
  background: var(--overlay-hover);
}

.rcbo-grid-blocks .tile__label {
  position: absolute;
  inset: 0;
  display: grid;
  padding: 1.25rem;
  font-size: var(--label-size);
  font-weight: var(--label-weight);
  line-height: var(--label-line);
  letter-spacing: .2px;
  text-shadow: 0 2px 10px rgba(0,0,0,.55);
  z-index: 2;
  align-items: var(--text-postition-h);
  justify-items: var(--text-postition-v);
  text-align: var(--text-align);
  color: #FFF; 
}

.rcbo-grid-blocks .tile__label span {
  display: inline-block;
  max-width: 18ch;
}