MUI makeStyles no funciona en el componente Card.

Tengo este componente llamado Product que se basa en este ejemplo aquí. Aquí está mi componente:

Product.tsx:

import useStyles from './useStyles'

const Product: React.FC = () => {
  const classes = useStyles();

  return (
    <card classname="{classes.secondaryBorder}">
      <cardactionarea>
        <cardcontent>
          <typography gutterbottom="" variant="h5">
            Este es mi título
          </typography>

          <typography variant="body2" color="text.secondary">
            Este es mi cuerpo
          </typography>
        </cardcontent>
      </cardactionarea>
    </card>
  );
};

useStyles.ts:

import { makeStyles } from '@mui/styles';

const useStyles = makeStyles({
  secondaryBorder: {
    border: '2px solid blue',
  },
  flex: {
    display: 'flex',
  },
});

El problema es que el componente Card no tiene el estilo secondaryBorder, es decir, no tiene un borde azul alrededor. ¿Cuál es el problema?

¡Gracias!