.pre { display: grid; margin-top: var(--space-xx-large); padding-inline: var(--space-large); } .pre a { color: var(--color-green); font-weight: normal; justify-self: center; text-decoration: none; } .pre pre { color: var(--color-green); font-size: clamp(0.425rem, 1.25vw, 1rem); justify-self: center; letter-spacing: -0.0425em; line-height: 1.09375; transition: color var(--transition); white-space: pre; } @media(hover: hover) { .pre a:hover pre { color: var(--color-turquoise); } } @media(min-width: 64em) { .pre { margin-top: var(--space-xxxx-large); padding-inline: var(--space-xx-large); } } .pre--error { margin-top: 0; }