✍️ Font style

The font-style utility allows you to quickly apply text styles such as italic or normal to elements. It supports both static and responsive variants generated through mixins and loops.

🧱 Naming convention

.u--font-style-{value}
.u--font-style-{breakpoint}-{value}

✅ When to use

Use this utility when:

• You want to apply diferent text styling (e.g. italic, normal)
• You need to toggle diferent text styling styles at specific breakpoints

🧪 Responsive usage

This utility supports responsive variants, using breakpoint prefixes like: desktop, laptop, tabletl, tabletm, tablets, mobile.

✅ How to use

You can apply them directly in HTML:

<p class="u--font-style-italic">This text is italic.</p>

Or extend them in SCSS if you have a custom class:

.c--card-a {
    @extend .u--font-style-italic;
}