css: replace presentational class selectors with semantic element selectors

Replace 6 CSS class selectors across tfe.css, main.css, and search.css with
semantic element-based selectors, removing the corresponding classes from the
HTML templates entirely.

tfe.css:
- .tfe-meta-list → article dl / article dl > div / article dl dt / article dl dd
- .tfe-media-block → aside figure (+ img, video, embed children)
- .tfe-file-caption → aside figcaption

main.css:
- .card__media → .home-body figure (+ img/video children and hover/motion rules)
- .card__caption → .home-body li > a > p

search.css:
- .repertoire-col > h2 → .repertoire-index section > h2

Template changes:
- tfe.php: removed class= from <dl>, <figure>, and <figcaption>
- index.php: removed class= from <figure> and <p class=card__caption>;
  stripped orphaned card__media from the gradient <div> (only --gradient needed)

No visual change — selectors match the same elements as before since the
semantic HTML was already in place from prior refactoring work.

public/assets/css/tfe.css

@@ -58,8 +58,8 @@
   letter-spacing: -0.01em;
 }
 
-/* Metadata description list */
-.tfe-meta-list {
+/* Metadata description list — target <dl> directly inside article > header */
+article dl {
   display: flex;
   flex-direction: column;
   gap: 0.45rem;
@@ -69,25 +69,25 @@
 }
 
 /* Each dt/dd pair grouped in a <div> inside <dl> */
-.tfe-meta-list > div {
+article dl > div {
   display: flex;
   gap: 0.4rem;
   flex-wrap: wrap;
 }
 
-.tfe-meta-list dt {
+article dl dt {
   color: var(--black);
   font-weight: 400;
   flex-shrink: 0;
 }
 
-.tfe-meta-list dd {
+article dl dd {
   color: var(--black);
   font-weight: 700;
   margin: 0;
 }
 
-.tfe-meta-list dd a {
+article dl dd a {
   color: inherit;
   text-decoration: underline;
   text-underline-offset: 2px;
@@ -117,35 +117,35 @@
   gap: 1.5rem;
 }
 
-/* Each file display unit */
-.tfe-media-block {
+/* Each file display unit — target <figure> directly inside <aside> */
+aside figure {
   overflow: hidden;
   margin: 0;
 }
 
-.tfe-media-block img {
+aside figure img {
   width: 100%;
   height: auto;
   display: block;
 }
 
-.tfe-media-block embed,
-.tfe-media-block video {
+aside figure embed,
+aside figure video {
   width: 100%;
   display: block;
   border: none;
 }
 
-.tfe-media-block video {
+aside figure video {
   max-height: 500px;
 }
 
-.tfe-media-block embed {
+aside figure embed {
   height: clamp(300px, 80vh, 700px);
 }
 
-/* figcaption under media */
-.tfe-file-caption {
+/* figcaption under media — target <figcaption> inside <aside> */
+aside figcaption {
   font-size: 0.8rem;
   color: var(--text-muted);
   margin: 0.3rem 0 0;