/* ==========================================================
   Event Date
========================================================== */

.eventdate {
  display: block;
  width: 100%;
  box-sizing: border-box;
  background: #5387ce;
  color: #ffffff;
  padding: 15px 25px;
  border-radius: 12px;
  font-size: 2rem;
  font-weight: 700;
  margin-bottom: 15px;
}

/* ==========================================================
   Section One
   Description Left | Image Right
========================================================== */

.eventsectionone {
  display: flex;
  gap: 35px;
  align-items: flex-start;
  margin-bottom: 40px;
}

.eventdescription {
  flex: 1;
  background: #f8f9fb;
  border-left: 6px solid #5387ce;
  border-radius: 12px;
  padding: 25px;
  font-size: 1.5rem;
  line-height: 1.8;
}

.eventdescription .field__label {
  display: block;
  font-size: 1.8rem;
  font-weight: 700;
  color: #222;
  margin-bottom: 15px;
}

.eventimage {
  flex: 0 0 350px;
}

.eventimage img {
  width: 100%;
  height: auto;
  border-radius: 16px;
  display: block;
  box-shadow: 0 6px 18px rgba(0,0,0,.15);
}


/* ==========================================================
   Section Two
========================================================== */

.eventsectiontwo {
  display: flex;
  gap: 35px;
  align-items: stretch;
  margin-bottom: 40px;
}

.eventlocation {
  flex: 1;
  background: #f8f9fb;
  border-left: 6px solid #dd821d;
  border-radius: 12px;
  padding: 25px;
  font-size: 1.45rem;
  line-height: 1.7;
}

.eventlocation .field__label {
  display: block;
  font-size: 1.75rem;
  font-weight: 700;
  margin-bottom: 12px;
  color: #222;
}


/* Contact Information */

.eventcontactinfo {
  flex: 1;
  background: #f8f9fb;
  border-left: 6px solid #5387ce;
  border-radius: 12px;
  padding: 25px;
}

.eventcontactname .field__label,
.eventcontactnumber .field__label,
.eventcontactemail .field__label {
  display: inline;
  font-size: 1.55rem;
  font-weight: 700;
  color: #5387ce;
  margin-right: 8px;
}

.eventcontactname .field__item,
.eventcontactnumber .field__item,
.eventcontactemail .field__item {
  display: inline;
  font-size: 1.4rem;
  line-height: 1.5;
}


/* ==========================================================
   Event Attachments
========================================================== */

.eventattachments {
  background: #f8f9fb;
  border-left: 6px solid #5387ce;
  border-radius: 12px;
  padding: 25px;
  margin-bottom: 35px;
}

.eventattachments .field__label {
  display: block;
  font-size: 1.7rem;
  font-weight: 700;
  color: #222;
  margin-bottom: 15px;
}

.eventattachments .field__item {
  display: block;
  font-size: 1.35rem;
  margin-bottom: 10px;
}


/* ==========================================================
   Event Links
========================================================== */

.eventlinks {
  background: #f8f9fb;
  border-left: 6px solid #dd821d;
  border-radius: 12px;
  padding: 25px;
}

.eventlinks .field__label {
  display: block;
  font-size: 1.7rem;
  font-weight: 700;
  color: #222;
  margin-bottom: 15px;
}

.eventlinks .field__item {
  display: block;
  font-size: 1.35rem;
  margin-bottom: 10px;
}

.eventlinks a {
  color: #5387ce;
  font-weight: 600;
  text-decoration: none;
}

.eventlinks a:hover {
  text-decoration: underline;
}


/* ==========================================================
   Mobile
========================================================== */

@media (max-width: 768px) {
  .eventsectionone,
  .eventsectiontwo {
    flex-direction: column;
  }

  .eventimage {
    width: 100%;
    flex: none;
  }

  .eventdate {
    font-size: 1.6rem;
  }

  .eventdescription {
    font-size: 1.25rem;
  }

  .eventdescription .field__label,
  .eventlocation .field__label,
  .eventattachments .field__label,
  .eventlinks .field__label {
    font-size: 1.5rem;
  }

  .eventlocation,
  .eventattachments,
  .eventlinks {
    font-size: 1.2rem;
  }

  .eventcontactname .field__label,
  .eventcontactnumber .field__label,
  .eventcontactemail .field__label {
    font-size: 1.35rem;
  }

  .eventcontactname .field__item,
  .eventcontactnumber .field__item,
  .eventcontactemail .field__item {
    font-size: 1.2rem;
  }
}