.page-content--education {
  width: min(100%, 68rem);
  padding: 2rem 1rem 7rem;
}

.education-platform a:focus-visible,
.education-platform button:focus-visible {
  outline: 3px solid #1b7fa7;
  outline-offset: 2px;
}

.education-platform {
  display: grid;
  gap: 1.5rem;
}

.education-platform__header {
  display: grid;
  gap: 0.625rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid #d9e2ea;
}

.education-platform__eyebrow,
.education-project__source {
  margin: 0;
  color: #087d83;
  font-size: 0.8125rem;
  font-weight: 700;
  line-height: 1.3;
}

.education-platform__description {
  max-width: 47rem;
  margin-top: 0;
}

.education-tabs {
  display: flex;
  gap: 0.5rem;
  overflow-x: auto;
  padding: 0.125rem 0.125rem 0.5rem;
  scrollbar-width: thin;
}

.education-tab {
  min-width: 7.625rem;
  min-height: 2.875rem;
  padding: 0.625rem 0.875rem;
  border: 1px solid #cbd8e0;
  border-radius: 6px;
  background: #ffffff;
  color: #314452;
  cursor: pointer;
  font-size: 0.9375rem;
  font-weight: 700;
  line-height: 1.25;
}

.education-tab[aria-selected="true"],
.education-project__action {
  border-color: #087d83;
  background: #087d83;
  color: #ffffff;
}

.education-project {
  display: grid;
  min-width: 0;
  overflow: hidden;
  border: 1px solid #cfdde4;
  border-radius: 8px;
  background: #ffffff;
  grid-template-columns: minmax(16rem, 0.92fr) minmax(0, 1.28fr);
}

.education-project__visual {
  position: relative;
  display: grid;
  min-height: 20rem;
  overflow: hidden;
  place-items: center;
  padding: 2rem;
}

.education-project[data-tone="teal"] .education-project__visual { background: #d7f0ed; }
.education-project[data-tone="coral"] .education-project__visual { background: #fce1d7; }
.education-project[data-tone="gold"] .education-project__visual { background: #fff0c9; }

.education-project__image {
  display: block;
  width: min(12.5rem, 68%);
  max-height: 12.5rem;
  object-fit: contain;
}

.education-project[data-tone="coral"] .education-project__image {
  width: min(16rem, 86%);
  max-height: 14rem;
}

.education-project[data-tone="gold"] .education-project__image { width: min(9rem, 60%); }

.education-project__badge {
  position: absolute;
  right: 1rem;
  bottom: 1rem;
  margin: 0;
  padding: 0.375rem 0.5rem;
  border: 1px solid rgba(29, 53, 66, 0.2);
  border-radius: 4px;
  background: rgba(255, 255, 255, 0.82);
  color: #294654;
  font-size: 0.75rem;
  font-weight: 700;
}

.education-project__content {
  display: grid;
  align-content: start;
  gap: 0.875rem;
  padding: clamp(1.25rem, 3vw, 2.25rem);
}

.education-project__title {
  margin: -0.25rem 0 0;
  color: #172033;
  font-size: clamp(1.5rem, 2.6vw, 2rem);
  font-weight: 700;
  line-height: 1.2;
}

.education-project__summary,
.education-project__description {
  margin: 0;
  color: #455767;
  font-size: 1rem;
  line-height: 1.65;
}

.education-project__summary {
  color: #253b47;
  font-size: 1.0625rem;
  font-weight: 600;
}

.education-project__details {
  display: grid;
  gap: 0.625rem;
  margin: 0.125rem 0 0;
  padding: 0.875rem 0;
  border-top: 1px solid #e4eaee;
  border-bottom: 1px solid #e4eaee;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.education-project__detail { min-width: 0; }

.education-project__detail-label,
.education-project__detail-value { margin: 0; }

.education-project__detail-label {
  color: #718090;
  font-size: 0.75rem;
  font-weight: 700;
}

.education-project__detail-value {
  margin-top: 0.1875rem;
  color: #263d49;
  font-size: 0.875rem;
  font-weight: 600;
  overflow-wrap: anywhere;
}

.education-project__features {
  display: grid;
  gap: 0.5rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.education-project__feature {
  position: relative;
  padding-left: 1.25rem;
  color: #425665;
  font-size: 0.9375rem;
  line-height: 1.45;
}

.education-project__feature::before {
  position: absolute;
  top: 0.44rem;
  left: 0;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background: #087d83;
  content: "";
}

.education-project__action {
  display: inline-flex;
  width: fit-content;
  min-height: 2.875rem;
  align-items: center;
  gap: 0.625rem;
  margin-top: 0.25rem;
  padding: 0.625rem 0.875rem;
  border: 1px solid #087d83;
  border-radius: 6px;
  font-size: 0.9375rem;
  font-weight: 700;
  line-height: 1.25;
  text-decoration: none;
}

.education-project__action:hover { background: #05666c; border-color: #05666c; }
.education-project__action-arrow { font-size: 1.125rem; line-height: 1; }

@media (max-width: 47.99rem) {
  .page-content--education { padding: 1.5rem 1rem 6.5rem; }
  .education-platform { gap: 1.25rem; }
  .education-platform__header { padding-bottom: 1.25rem; }
  .education-project { grid-template-columns: minmax(0, 1fr); }
  .education-project__visual { min-height: 13.5rem; padding: 1.5rem; }
  .education-project__image { width: min(10.5rem, 58%); max-height: 10.5rem; }
  .education-project[data-tone="coral"] .education-project__image { width: min(14rem, 72%); max-height: 11.5rem; }
}

@media (max-width: 23rem) {
  .education-tabs { margin-inline: -0.125rem; }
  .education-project__details { grid-template-columns: minmax(0, 1fr); }
}