/* ── EVENTS SECTION ── */
.events-section { 
  background: var(--cream); 
}

.events-header { 
  display: flex; 
  align-items: flex-end; 
  justify-content: space-between; 
  margin-bottom: 28px; 
  flex-wrap: wrap; 
  gap: 12px; 
}

.view-all { 
  font-size: 13px; 
  font-weight: 600; 
  color: var(--teal); 
  transition: color .18s; 
}

.view-all:hover { 
  color: var(--teal2); 
}

.events-grid { 
  display: grid; 
  grid-template-columns: repeat(3, 1fr); 
  gap: 20px; 
}

.ev-card { 
  background: var(--white); 
  border-radius: var(--radius); 
  border: 1px solid var(--line); 
  overflow: hidden; 
  transition: transform .22s, box-shadow .22s; 
}

.ev-card:hover { 
  transform: translateY(-4px); 
  box-shadow: var(--shadow2); 
}

.ev-img-wrap { 
  position: relative; 
  height: 160px; 
  overflow: hidden; 
}

.ev-img-wrap .img-ph { 
  height: 100%; 
  border-radius: 0; 
}

.ev-badges { 
  position: absolute; 
  top: 10px; 
  left: 10px; 
  display: flex; 
  gap: 6px; 
}

.ev-badge { 
  font-size: 10px; 
  font-weight: 700; 
  padding: 4px 10px; 
  border-radius: 20px; 
}

.ev-badge.hot { 
  background: #e84040; 
  color: #fff; 
}

.ev-badge.warn { 
  background: #f0b030; 
  color: #3a2000; 
}

.ev-badge.open { 
  background: #34c47c; 
  color: #fff; 
}

.ev-badge.blue {
  background: #3b82f6;
  color: #fff;
}

.ev-badge.purple {
  background: #8b5cf6;
  color: #fff;
}

.ev-body { 
  padding: 16px 18px 18px; 
}

.ev-title { 
  font-family: var(--serif); 
  font-size: 17px; 
  color: var(--navy); 
  font-weight: 600; 
  margin-bottom: 8px; 
  line-height: 1.3; 
}

/* Date / Time / Location Metadata Block */
.ev-meta { 
  margin-bottom: 10px; 
  display: flex; 
  flex-direction: column; 
  gap: 4px; 
}

.ev-meta-row { 
  display: flex; 
  align-items: center; 
  gap: 7px; 
  font-size: 12.5px; 
  color: var(--ink3); 
  line-height: 1.3; 
}

.ev-ic { 
  width: 14px; 
  height: 14px; 
  flex: 0 0 14px; 
  display: inline-block; 
  background-color: var(--teal); 
  opacity: .75; 
  -webkit-mask-repeat: no-repeat; 
  mask-repeat: no-repeat; 
  -webkit-mask-position: center; 
  mask-position: center; 
  -webkit-mask-size: contain; 
  mask-size: contain; 
}

.ev-ic-date { 
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cline x1='16' y1='2' x2='16' y2='6'/%3E%3Cline x1='8' y1='2' x2='8' y2='6'/%3E%3Cline x1='3' y1='10' x2='21' y2='10'/%3E%3C/svg%3E"); 
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Crect x='3' y='4' width='18' height='18' rx='2'/%3E%3Cline x1='16' y1='2' x2='16' y2='6'/%3E%3Cline x1='8' y1='2' x2='8' y2='6'/%3E%3Cline x1='3' y1='10' x2='21' y2='10'/%3E%3C/svg%3E"); 
}

.ev-ic-time { 
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpolyline points='12 7 12 12 15.5 14'/%3E%3C/svg%3E"); 
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpolyline points='12 7 12 12 15.5 14'/%3E%3C/svg%3E"); 
}

.ev-ic-loc { 
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Cpath d='M12 21s-7-6.1-7-11a7 7 0 0 1 14 0c0 4.9-7 11-7 11z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E"); 
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2'%3E%3Cpath d='M12 21s-7-6.1-7-11a7 7 0 0 1 14 0c0 4.9-7 11-7 11z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E"); 
}

.ev-trainer { 
  font-size: 12px; 
  color: var(--ink3); 
  margin-bottom: 12px; 
  font-style: italic; 
}

.ev-actions { 
  display: flex; 
  gap: 6px; 
  flex-wrap: wrap; 
}

/* No events message */
.llem-no-events {
  grid-column: 1 / -1;
  text-align: center;
  padding: 40px 20px;
  color: var(--ink3);
  font-size: 15px;
}

/* ── RESPONSIVE (EVENTS) ── */
@media (max-width: 900px) {
  .events-grid { 
    grid-template-columns: repeat(2, 1fr); 
  }
}

@media (max-width: 600px) {
  .events-grid { 
    grid-template-columns: 1fr; 
  }
}