the quick and easy way: inserting a “soft-hyphen” manually that sign is ­ or : ­

so when filling out the title – insert this sign where the word can break! –
But you can not see it in your entered preview – but it is active.
And if you open that ALB again – the setting is lost.

the other method is to let the hyphens set automatically. But something like this:

.iconbox .iconbox_content .iconbox_content_title {
    word-wrap: break-word;
    hyphens: auto;
}

will often end up in word-break without dash ! this looks ugly.

my recomendation: do it manually with additon of a small enfold plugin.

Guenter here from the board has written a little plugin to insert into input fields of enfold special characters like bigger than or less than sings – quotation marks etc. – you can find that on : https://github.com/KriesiMedia/enfold-library/tree/master/integration%20plugins/Enfold/Special%20Character%20Translation

this could be installed like a normal plugin. Afterwards you can have tag signs or quotes etc. f.e. in tables or in heading input fields.
add that Line to the plugin:
'#shy#' => '­', so you can use #shy# for ­. or the same thing: ­

because i’m a lazy guy i only edited that plugin a bit – so that the list does not have three # before and after that translation part.
so my part of that looks like this:

sorry Boardsoft transfers directly the special characters to something else – even if it is in code tags:
so here is the image of it:

so you can use it like this:

and you can edit it again and again – you can see it in the preview where you have inserted it – but on Frontend:
https://webers-testseite.de/iconboxes-with-equalheight/

you mean that iconbox heading – or in the content text?

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
}

not all Advanced Layout Builder Elements ( ALB Elements ) have that input field for IDs – but most of them got the possibility to have classes.
If you haven’t already activated that fields – goto Enfold Options Page and look at: Layout Builder – mark : “Show element options for developers”
From that on you will have that extra input field on the ALB Elements.

Now the css code depends on the heading you like to change.
Are these headings from the headings ALB or h2 on sliders etc. pp.

Best would be to see the live page to give better advice.

or is it this you like to achive: https://webers-testseite.de/cynthia/video-under-header/
: a kind of watermark

insert to your slide an overlay : no color but an image – set transparency on it you like.
After that you can style it to be not as a pattern but as one image centered:
f.e:

 div .av-section-color-overlay {
    background-repeat: no-repeat !important;
    background-position: center center;
}

play with that background-position if you like –
first value is : background-position-x
second value is: background-position-y

i do not see your private content (i’m participant as you) but to solve that issue we had to see the site or have more details.
What kind of header you have ( logo left – menu right etc) ?
is it a fixed header or does it scroll away with content?
Does the content of that extra container have dynamic content or is it static and not often changed?
What should happen to that extra container on scroll?

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;
}

Offtopic – one of my old requests – we need an ALB Element which reacts like a color-section ( as a container for different albs ) fullwidth but not pushing sidebar down but besides sidebar.
Or in other words an alb which reacts to the surrounding environment like a 1/1 container but inner behavior like color-section with drag and drop level 1 … that could solve a lot of layout idiosyncrasies

___________
this is a solution for a whole sticky sidebar ( aside ) …
now Ampower look here and scroll down the page – you see the sidebar is sticky as long the as possible – https://webers-testseite.de/buttons/
if you are interested in that solution i link you to that page here: https://kriesi.at/support/topic/an-actual-solution-to-a-sticky-column/#post-1124882

if you can’t transfer the solution to sidebar – i will tell you how.

this was the screenshot you gave me as you would like tlo have it:
my comment :

this has influence to the lines – add or change the existing rules to:

add new rules gave to you – change existing ones gave to you!

    ⇒         your last screencast

so all have right border – except the first row last column
where is that rule gone:

#header .avia_mega_div .units {
  border-right: 1px solid #010660 ;
}

On your screen there are no left lines to the first Columns

/* Nascondere per nascondere barra sinistra delle categorie OK */
#header .avia_mega_div .avia_mega_menu_columns_first {
    padding-left: 15px;
    border-left: none;
}

so you don’t like the border on the upper row right side – where is the new rule with the :not instruction:

#header .avia_mega_div :not(.avia_mega_hr) .avia_mega_menu_columns_last {
    border-right: none !important;
}

on insertion into functions.php : replace it with:

function insert_mega_div_separator() { 
?>
<script>
(function($){
$('<div style="margin-bottom:10px;" class="hr hr-custom hr-center"><span class="hr-inner inner-border-av-border-fat" style=" width:80%; border-color:#010660;"><span class="hr-inner-style"></span></span></div>').insertBefore('.avia_mega_hr');
})(jQuery);
</script>
<?php
}
add_action('wp_footer', 'insert_mega_div_separator');

this has influence to the lines – add or change the existing rules to:

#top #header .avia_mega_div > .sub-menu {
padding: 20px 30px 10px;
}

.hr-custom .hr-inner.inner-border-av-border-fat {
    border-top-width: 1px;
}

#header .avia_mega_div :not(.avia_mega_hr) .avia_mega_menu_columns_last {
    border-right: none !important;
}

Well, I almost had to help with that, didn’t I? ;)
now i’m out sorry – the next patient is already waiting.

btw: chrome on pc got the advantage that you can let the dropdown menus open when exploring them with a shortcut
believe it is F8

Safari on Mac did the trick without shortcut.

that rule here:

#top #header .avia_mega_div {
    max-height: calc(100vh - 200px);
    overflow: auto !important;
}

is for scrollable mega menu.
If the height of the mega div is more than the screen-height the overflow is on .
you can play a bit with the value 200px 50px seems to be enough

next comment to your navigation area.
if you get rid with :

.logo {
    margin-top: -100px;
    margin-left: -200px;
}

on Enfold there is on : Header – Header Behavior : ” Let logo and menu position adapt to browser window ”
Guess that this will fit better for your layout!

you could do this instead : https://webers-testseite.de/brighter/
if you like it – i’ll show you how to.

btw: after you have seen the test-page i delete your images!
it’s just to show you how it could look like.

well if you put in quick css this – you will see that it could work this manner you started.
But : there’s too much else wrong. Have a look at your navigation and the logo behaviour on small screens. Mobile devices so to speak.
I think one should first dedicate oneself to this topic. And then go to Borderstyling.

#av_section_2.test3 {
 position:relative !important;
 z-index:1 !important;
 background:transparent url(https://bright.itsomimedia.nl/wp-content/uploads/Rand_Bright_lichtgrijs.png) !important;
 height: 340px;
 margin: -300px auto 0;
 background-size: 100% 100% !important;
 background-repeat: no-repeat !important;
 background-clip:padding-box
}

https://kriesi.at/documentation/enfold/child-theme/

On default there is no child-theme present. But you can download a predefined one from link above.
A lot of those snippets here on board only work good with a child-theme.
You can update the parent theme without the risk of lost the made adjustments to the theme.

If you are not familiar with child-theme – read that carefully – and read my tutorial on that linked page above carefully too.