/* Slide three (Achievements): black borders and slightly larger text. */
#achievements .education-card,
#achievements .diploma-preview,
#achievements .school-mark{border-color:#000}

/* Every achievement card: black card, black frame and black offset edge. */
#achievements .education-card{background:#000;border:3px solid #000;box-shadow:5px 5px 0 #000}
#achievements .diploma-preview{background:#000}
#achievements .education-in-progress{border-style:dashed}

/* Remaining green accents replaced: black fills, neutral (non-green) light text so it stays readable on black. */
#achievements .education-card{color:#f5f5f2}
#achievements .education-heading h3,
#achievements .school-mark,
#achievements .certificate-caption strong{color:#fff}
#achievements .school-meta,
#achievements .certificate-caption{color:#c9c9c9}
#achievements .unlock-label:not(.progress-label),
#achievements .image-count{background:#000;color:#fff;outline:1px solid #fff}
#achievements .preview-hint{background:#000000e8;color:#f5f5f2}
#achievements .education-card :focus-visible{outline-color:#fff}
.certificate-dialog::backdrop{background:#000000db}

#achievements .lede{font-size:1.15em}
#achievements .education-heading h3{font-size:1.55rem}
#achievements .school-name{font-size:1.08rem}
#achievements .school-meta{font-size:.92rem}
#achievements .school-mark{font-size:.95rem;width:54px;height:62px}
#achievements .unlock-label{font-size:.7rem}
#achievements .certificate-caption{font-size:.92rem}
#achievements .image-count,
#achievements .preview-hint{font-size:.85rem}

@media(max-width:760px){
  #achievements .education-heading h3{font-size:1.25rem}
  #achievements .school-name{font-size:.95rem}
  #achievements .school-meta{font-size:.85rem}
}
