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/main.css

@@ -57,8 +57,8 @@
   flex: 1;
 }
 
-/* card__media is a <figure> (with image) or <div> (gradient placeholder) */
-.card__media {
+/* Media wrapper: <figure> for real images/video, <div class="card__media--gradient"> for placeholders */
+.home-body figure {
   width: 100%;
   aspect-ratio: 4/3;
   overflow: hidden;
@@ -67,8 +67,8 @@
   margin: 0; /* reset <figure> default margin */
 }
 
-.card__media img,
-.card__media video {
+.home-body figure img,
+.home-body figure video {
   width: 100%;
   height: 100%;
   object-fit: cover;
@@ -76,8 +76,8 @@
   transition: transform 0.3s ease;
 }
 
-.card:hover .card__media img,
-.card:hover .card__media video {
+.card:hover figure img,
+.card:hover figure video {
   transform: scale(1.02);
 }
 
@@ -127,8 +127,8 @@
   font-style: italic;
 }
 
-/* Card caption — <p> directly inside the <a>, below the media */
-.card__caption {
+/* Card caption — <p> directly inside the card <a> link, below the media */
+.home-body li > a > p {
   padding: 0.55rem 0.5rem 0.65rem;
   font-size: 0.88rem;
   line-height: 1.35;
@@ -226,12 +226,12 @@
 
 /* Suppress card hover scale for users who prefer reduced motion */
 @media (prefers-reduced-motion: reduce) {
-  .card__media img,
-  .card__media video {
+  .home-body figure img,
+  .home-body figure video {
     transition: none;
   }
-  .card:hover .card__media img,
-  .card:hover .card__media video {
+  .card:hover figure img,
+  .card:hover figure video {
     transform: none;
   }
   .card__media--gradient {

public/assets/css/search.css

@@ -52,7 +52,7 @@
   border-right: none;
 }
 
-.repertoire-col > h2 {
+.repertoire-index section > h2 {
   font-size: 0.72rem;
   letter-spacing: 0.1em;
   text-transform: uppercase;

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;