/* ==========================================================================
   Events: 40th Anniversary and Future Events
   ========================================================================== */

/* 40th Anniversary */
.an-stats { grid-template-columns: repeat(4, 1fr); }
.an-timeline .ip-tl-body p { margin: 0; color: var(--ip-muted); line-height: 1.65; }
.an-timeline .ip-tl-body .an-who { color: var(--ip-coral); font-weight: 700; font-size: 14px; margin: 2px 0 6px; }
.an-step { font-size: 18px; font-weight: 700; color: var(--ip-navy); margin: 0; }
.an-timeline .ip-year { font-size: 15px; }
.an-watch {
  display: flex; flex-direction: column; justify-content: center; gap: 8px;
  border-radius: var(--ip-radius); padding: 28px; min-height: 100%;
  background: linear-gradient(135deg, var(--ip-coral), #d9573a); color: #fff; text-decoration: none;
  box-shadow: var(--ip-shadow); transition: transform .2s;
}
.an-watch:hover { color: #fff; transform: translateY(-3px); }
.an-watch .fa { font-size: 44px; }
.an-watch-title { font-size: 22px; font-weight: 700; }
.ip-panel p { color: rgba(255, 255, 255, .88); line-height: 1.7; }

/* Future Events */
.fe-recap { margin: 18px auto 0; display: inline-flex; flex-wrap: wrap; gap: 6px; align-items: center; justify-content: center; background: var(--ip-sky-light); border-radius: 999px; padding: 10px 20px; color: var(--ip-navy); }
.fe-recap .fa { color: var(--ip-coral); font-size: 20px; }
.fe-list { display: flex; flex-direction: column; gap: 36px; }
.fe-card {
  display: grid; grid-template-columns: 42% 1fr;
  background: #fff; border-radius: var(--ip-radius); overflow: hidden;
  box-shadow: var(--ip-shadow); border: 1px solid var(--ip-line);
}
.fe-card--reverse { grid-template-columns: 1fr 42%; }
.fe-card--reverse .fe-media { order: 2; }
.fe-media { position: relative; min-height: 320px; background: var(--ip-navy); }
.fe-media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.fe-media--contain { background: linear-gradient(180deg, #103221 0 50%, #2a693a 50% 100%); }
.fe-media--contain img { object-fit: contain; }
.fe-date {
  position: absolute; left: 20px; top: 20px;
  background: var(--ip-amber); color: #1a2332; border-radius: 12px;
  padding: 10px 14px; font-weight: 700; font-size: 13px; text-transform: uppercase; letter-spacing: .05em;
  box-shadow: 0 6px 18px rgba(0, 0, 0, .18); line-height: 1.2; text-align: center;
}
.fe-date b { display: block; font-size: 22px; letter-spacing: 0; }
.fe-body { padding: 34px 36px; }
.fe-title { font-size: 28px; font-weight: 700; color: var(--ip-sky); line-height: 1.3; margin: 0 0 12px; }
.fe-body > p { line-height: 1.75; color: var(--ip-text); margin: 18px 0; }
.fe-body .fe-note { font-size: 15px; color: var(--ip-muted); background: var(--ip-grey); border-radius: 10px; padding: 12px 16px; }
.fe-note a { color: var(--ip-sky); font-weight: 600; }
.fe-soon { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; color: var(--ip-navy); background: var(--ip-sky-light); border-radius: 999px; padding: 10px 18px; }
.fe-card:nth-child(2) .fe-date { background: var(--ip-sky); color: #fff; }
.fe-card:nth-child(3) .fe-date { background: var(--ip-coral); color: #fff; }
.fe-card:nth-child(4) .fe-date { background: var(--ip-deep); color: #fff; }
.fe-more { display: flex; gap: 20px; align-items: flex-start; background: var(--ip-grey); border-radius: var(--ip-radius); padding: 26px 30px; border-left: 5px solid var(--ip-teal); }
.fe-more .ip-icon { flex-shrink: 0; margin: 0; }
.fe-more p { margin: 0; line-height: 1.7; }

@media (max-width: 1199px) {
  .an-stats { grid-template-columns: repeat(2, 1fr); }
  .an-stats .ip-stat:nth-child(2) { border-right: 0; }
  .an-stats .ip-stat:nth-child(-n+2) { border-bottom: 1px solid rgba(255, 255, 255, .12); }
  .an-stats .ip-stat:nth-child(3) { border-right: 1px solid rgba(255, 255, 255, .12); border-bottom: 0; }
}
@media (max-width: 991px) {
  .fe-card, .fe-card--reverse { grid-template-columns: 1fr; }
  .fe-card--reverse .fe-media { order: 0; }
  .fe-media { min-height: 260px; }
}
@media (max-width: 767px) {
  .fe-body { padding: 24px 20px; }
  .fe-title { font-size: 23px; }
  .fe-recap { border-radius: 14px; }
  .fe-more { flex-direction: column; padding: 22px 20px; }
}