Overriding content area Unsemantic CSS classes

Hello team!

In my archive page with left sidebar, I have the following css classes added to it:

<div id="primary" class="content-area grid-parent mobile-grid-100 push-25 grid-75 tablet-push-0 tablet-grid-100">

On tablet, this causes the content area to have a width of 75%. But I would like to stretch it to 100%.

Upon digging through the theme's markup.php, I found a filter that allows me to change the class value - generate_left_sidebar_tablet_width - and this was what I came up with:

add_filter( 'generate_left_sidebar_tablet_width', function($width) {
	if ( is_archive ) {
		$width = 0;
		return $width;
	}

	return $width;
});

and it works great. However, I'm thinking if this is the best and recommended way to solve the problem? Or should I just change the width and other styles using CSS?

Personally I feel that using filters seem less 'hacky' and it doesn't mess up the default styling.

Appreciate any input!

Ed