the thing is not that the 3/5 container does not what you like to have the point is that the background-image and the container does not do what you intend to have.
The above gives you the possibility to have a responsive Color-section – but you have to make adjustments to have content that fits into the smaller section

so my recommendation : use the fullwidth easy slider – it starts from the beginning with responsiveness. – and even the content is prepared for that.

you don’t need to find a relative font-size like the code above does with screen width relation – each slide got his own screen behavior to adjust for smaller screens :

just one moment – i did’t saw the test link in your starting thread.

To have a responsive Color-Section – you have to have a responsive Content ! – otherwise it will go out of the container.
Your bg-image is 1600/768 so an aspect ration of 48%

so you have to set your background-image to “contain” the image – but the height of the color-section should be 48% of width:
in responsive Case the 3/5th container should stay in this width or should be adjusted to your needs – enfold goes to have the containers under each other at a responsive width so to speek on 100% width:

see here the test page: https://webers-testseite.de/responsive-color-section/

.page-id-35548 #av_section_1 {
  width: 100vw;
  height: 48vw !important;
}

.page-id-35548 .flex_column.av_three_fifth {
  width: 58vw !important;
}

.page-id-35548 .flex_column.av_three_fifth .av-special-heading h1 {
  font-size: 4vw !important;
  line-height: 6vw !important;
}

.page-id-35548 .flex_column.av_three_fifth .av-special-heading .av-subheading {
  font-size: 3vw !important;
  line-height: 4vw !important;
}

.page-id-35548 .avia-button .avia_iconbox_title {
    font-size: 2.5vw !important;
}

.page-id-35548 .flex_column.av_three_fifth .av-special-heading h1 {
	font-size: 3.2vw !important;
	line-height: 5vw !important;
}
.page-id-35548 .flex_column.av_three_fifth .av-special-heading .av-subheading {
	font-size: 2vw !important;
}

mal von der Gesprächshypnose ausgehend, werde ich fortan dir besser in deutsch antworten.
manchmal sind im css definitionen durch mehr selektoren höher in ihrem Gewicht.
heißt: wenn da eine Definition zu h2 existiert: .responsive #top .av-heading h2 etc dann ist die gewichtiger als deine h2.custom-h2
du kannst das immer durchsetzen, indem du den merkmalen ein !important gibst:

h2.custom-h2 {
font-size:20px  !important ;
line-height:1.4em  !important ;
}

was auch sein kann: du hast bei Enfold das Merging aktiviert ( ist bei Performance ( leistung))
das Merging ist oft dafür Verantwortlich, dass man Veränderungen nicht direkt sieht.
Daher meine Empfehlung: solange man am Styling bastelt das teil abschalten.
( unten kann man aber auch das Neugenerieren durch löschen des bestehenden veranlassen)
“Delete old CSS and JS files?”

so you have set on text ALB Element in your text some h2 .
The best way could be to change to text view – then you see the tags set in html view.

you text may look like:
<h2> some heading inside </h2>

you can change it to:
<h2 style="custom-class"> some heading inside </h2>

then you can put in your quick css :

h2.custom-class {
font-size:2em
}

Yes – but i would advice you to have “buttons” on small screens underneath each other.

if you know how to insert the shortcode here is the shortcode of that layout:

[av_layout_row border='' min_height_percent='percent' min_height_pc='35' min_height='0' color='main_color' mobile='av-flex-cells' id='' av_element_hidden_in_editor='0' mobile_breaking='' av_uid='av-jz6fxoy1' custom_class='']
[av_cell_one_third vertical_align='middle' padding='30px' padding_sync='true' background='bg_color' background_color='#38a8da' background_gradient_color1='' background_gradient_color2='' background_gradient_direction='vertical' src='' attachment='' attachment_size='' background_attachment='scroll' background_position='top left' background_repeat='no-repeat' link='manually,#' linktarget='' link_hover='' mobile_display='' av_uid='av-jz6fvtyh' custom_class='']

[av_font_icon icon='ue84d' font='entypo-fontello' style='border' caption='' link='manually,#' linktarget='' size='40px' position='center' animation='' color='#ffffff' av_uid='av-jz6fyjec' custom_class='' admin_preview_bg=''][/av_font_icon]

[av_heading heading='— Renting Process —' tag='h2' link_apply='' link='manually,http://' link_target='' alt_attr='' style='blockquote modern-quote modern-centered' size='' subheading_active='' subheading_size='15' id='' margin='' padding='10' color='custom-color-heading' custom_font='#ffffff' custom_class='' admin_preview_bg='' av-desktop-hide='' av-medium-hide='' av-small-hide='' av-mini-hide='' av-medium-font-size-title='' av-small-font-size-title='' av-mini-font-size-title='' av-medium-font-size='' av-small-font-size='' av-mini-font-size='' av_uid='av-1fveu9n'][/av_heading]

[/av_cell_one_third][av_cell_one_third vertical_align='middle' padding='30px' padding_sync='true' background='bg_color' background_color='#a7a7a7' background_gradient_color1='' background_gradient_color2='' background_gradient_direction='vertical' src='' attachment='' attachment_size='' background_attachment='scroll' background_position='top left' background_repeat='no-repeat' link='manually,#' linktarget='' link_hover='' mobile_display='' av_uid='av-jz6fvyc9' custom_class='']

[av_font_icon icon='ue80b' font='entypo-fontello' style='border' caption='' link='manually,#' linktarget='' size='40px' position='center' animation='' color='#ffffff' av_uid='av-jz6fyjec' custom_class='' admin_preview_bg=''][/av_font_icon]

[av_heading heading='— Sellers Guide —' tag='h2' link_apply='' link='manually,http://' link_target='' alt_attr='' style='blockquote modern-quote modern-centered' size='' subheading_active='' subheading_size='15' id='' margin='' padding='10' color='custom-color-heading' custom_font='#ffffff' custom_class='' admin_preview_bg='' av-desktop-hide='' av-medium-hide='' av-small-hide='' av-mini-hide='' av-medium-font-size-title='' av-small-font-size-title='' av-mini-font-size-title='' av-medium-font-size='' av-small-font-size='' av-mini-font-size='' av_uid='av-16oz9iz'][/av_heading]

[/av_cell_one_third][av_cell_one_third vertical_align='middle' padding='30px' padding_sync='true' background='bg_color' background_color='#e83947' background_gradient_color1='' background_gradient_color2='' background_gradient_direction='vertical' src='' attachment='' attachment_size='' background_attachment='scroll' background_position='top left' background_repeat='no-repeat' link='manually,#' linktarget='' link_hover='' mobile_display='' av_uid='av-jz6fw4u3' custom_class='']

[av_font_icon icon='ue821' font='entypo-fontello' style='border' caption='' link='manually,#' linktarget='' size='40px' position='center' animation='' color='#ffffff' av_uid='av-jz6fyjec' custom_class='' admin_preview_bg=''][/av_font_icon]

[av_heading heading='— Buyers Guide —' tag='h2' link_apply='' link='manually,http://' link_target='' alt_attr='' style='blockquote modern-quote modern-centered' size='' subheading_active='' subheading_size='15' id='' margin='' padding='10' color='custom-color-heading' custom_font='#ffffff' custom_class='' admin_preview_bg='' av-desktop-hide='' av-medium-hide='' av-small-hide='' av-mini-hide='' av-medium-font-size-title='' av-small-font-size-title='' av-mini-font-size-title='' av-medium-font-size='' av-small-font-size='' av-mini-font-size='' av_uid='av-kbfs1n'][/av_heading]

[/av_cell_one_third]
[/av_layout_row]

you can decide if you like to have column link or link on icon and heading ( you then must synchronize it)
looks this way: https://webers-testseite.de/pseudobuttons/

there are small borders (allthough this is not selected on grid alb element) these comes from width 33,3 % width if the width was defined as 33,33% it is not shown – but it might get in to problems on different browsers.
Easier to solve that problem is to give to the whole gird-row a the background-color of the middle column:

#av-layout-grid-1 {
    background-color: #a7a7a7;
}