/*
|--------------------------------------------------------------------------
| Restaurant Branch Events
|--------------------------------------------------------------------------
*/

:root {
  --rbe-background: #0d2831;

  --rbe-text: #f6f3ec;

  --rbe-muted: #a7b0b4;

  --rbe-transition: 0.35s ease;

  --rbe-padding: 64px;
}

/*
|--------------------------------------------------------------------------
| RESTART
|--------------------------------------------------------------------------
*/
.rbe-events,
.rbe-events * {
  box-sizing: border-box;
}

.rbe-events img {
  display: block;

  max-width: 100%;
}

.rbe-events a {
  text-decoration: none;

  color: inherit;
}

.rbe-events h1,
.rbe-events h2,
.rbe-events h3,
.rbe-events h4,
.rbe-events h5,
.rbe-events h6,
.rbe-events p {
  margin: 0;
}

/*
|--------------------------------------------------------------------------
| Wrapper
|--------------------------------------------------------------------------
*/
.rbe-events {
  width: 100%;
}

.rbe-events-list {
  display: flex;

  flex-direction: column;
}

/*
|--------------------------------------------------------------------------
| Card
|--------------------------------------------------------------------------
*/
.rbe-card {
  position: relative;

  width: 100%;

  background: var(--rbe-background);

  border: 2px solid var(--event-color);

  overflow: hidden;

  transition: var(--rbe-transition);
}

.rbe-card:hover {
  transform: translateY(-8px);

  box-shadow: 0 25px 70px rgba(0, 0, 0, 0.3);
}

.rbe-card__frame {
  display: flex;

  flex-direction: column;

  padding: var(--rbe-padding);
}
.rbe-card__accent {
  width: 90px;

  height: 4px;

  background: var(--event-color);

  margin-bottom: 32px;
}

.rbe-card__badge {
  display: inline-flex;

  align-items: center;

  justify-content: center;

  align-self: flex-start;

  height: 42px;

  padding: 0 24px;

  background: var(--event-color);

  color: #fff;

  font-size: 12px;

  font-weight: 700;

  letter-spacing: 2px;

  text-transform: uppercase;
}
.rbe-card__content {
  display: flex;

  flex-direction: column;

  flex: 1;

  padding-top: 72px;
}
.rbe-card__title {
  color: var(--rbe-text);

  font-size: clamp(44px, 4vw, 76px);

  font-weight: 700;

  line-height: 0.95;

  letter-spacing: -2px;
}
