As mentioned above why don’t you use: /%category%/%postname%/
one disadvantage – if you got 2 or more Categories for one Post the first category name will be inserted in that permalink.

the point is that even if the images are within your media gallery, they will not be used on the blog or single page. Images recalculated by Enfold are used there. Thats what i wrote above. Only if you are using the portfolio element or blog element on a page there is on the second tab of the element editor the option to choose the image used ( that is the custom setting ) – and on that custom setting you can have original image. But is it advisable to use original sizes of the images in a 3 or 4 grid display where the image widths can hardly exceed 300px? 20 or more featured images on a page with 900px ( and more ) – what would that do to performance?

And on blog and archive pages ( category pages) these options are not available.
In the blog it is by default : portfolio (‘width’ => 495, ‘height’ => 400)
In the single post, depending on whether with sidebar or without :
entry_without_sidebar ( ‘width’ => 1210, ‘height’ => 423 ) or entry_with_sidebar ( ‘width’ => 845, ‘height’ => 321 ) are used.

The second solution above not to take the nearby aspect ratio of magazine is to have your own image size registered – but then a recalculation of the thumbnails has to be done.

but what you are showing in your screenshot seems to be no accordion ! ;)
is it a tab container? – yes it is.

A Tab Element is exactly to save space and to make content more compact.

if your nick belongs to your page – i think i know what you like to go for.

Enfold uses different sources for the images on different elements. For example on a single post it uses the entry_with_sidebar size!
This is a ratio at : 2.6
the magazine ratio is nearby: 1.89 – so try this one if it is ok for you
On a blog in grid view – it uses the portfolio image size. – But you can change that by child-theme functions.php snippet:

try:

add_filter("avf_post_slider_args", function($atts, $context) {
	if( $context == "archive" ) {
		$atts['type']  = 'grid'; 
		$atts['columns']  = 3;
		$atts['preview_mode'] = 'custom';
		$atts['image_size'] = 'magazine';
	}
	return $atts;
}, 10, 2);

_______
now : if it has to be that 16:9 aspect-ratio:
you can either redefine the entry_with_sidebar size to that ratio or set your own image-size in that ratio.
Both solutions need a recalculation of your thumbnails.

just a little question – did you activate the advanced layout builder for your custom post type – via filter: avf_alb_supported_post_types ?
and is it a CPT or do we have here a custom template – based on archive ?

so what was the reason to use the grid-row element? – because that is exactly the point – it is a full-width element on default

if i like to use the grid-row element as a container for other elements and have not a full-width setting. i use a littel snippet for child-theme functions.php.
And i use it with a custom-class on grid-row ( here in my case: grid-notfull )

function grid_layout_notfull(){
$responsive_size = avia_get_option('responsive_size');
?>
<script>
(function($){
  $('.av-layout-grid-container.grid-notfull' ).each(function() {
    var notfullID = $(this).attr('id');
    $(this).hasClass('main_color') ? $(this).wrap('<div class="main_color notfullsize '+notfullID+'"></div>') : '';
    $(this).hasClass('alternate_color') ? $(this).wrap( '<div class="alternate_color notfullsize '+notfullID+'"></div>') : '';
  });
  $('.notfullsize').css({"clear": "both", "width": "100%" , "float": "left" , "position": "static" , "min-height": "100px" });
  $('.grid-notfull').css({"max-width": "<?php echo $responsive_size; ?>" , "margin": "0 auto" , "padding": "0 50px"});
})(jQuery);
</script>
<?php
}
add_action('wp_footer', 'grid_layout_notfull');

______________

Now:. if you do not want to use grid-row element on portfolios as a fullwidth element – you can change the selector above to alway set on single portfolios:
#top.single-portfolio .av-layout-grid-container :

function grid_layout_notfull(){
$responsive_size = avia_get_option('responsive_size');
?>
<script>
(function($){
  $('#top.single-portfolio .av-layout-grid-container' ).each(function() {
    var notfullID = $(this).attr('id');
    $(this).hasClass('main_color') ? $(this).wrap('<div class="main_color notfullsize '+notfullID+'"></div>') : '';
    $(this).hasClass('alternate_color') ? $(this).wrap( '<div class="alternate_color notfullsize '+notfullID+'"></div>') : '';
  });
  $('.notfullsize').css({"clear": "both", "width": "100%" , "float": "left" , "position": "static" , "min-height": "100px" });
  $('.grid-notfull').css({"max-width": "<?php echo $responsive_size; ?>" , "margin": "0 auto" , "padding": "0 50px"});
})(jQuery);
</script>
<?php
}
add_action('wp_footer', 'grid_layout_notfull');

the IDs transfer as class to the wrapping container is only to have better selectors for them on other settings.

One thing – there might be a little difference on the alignment. this derives from the padding that commonly the columns will have ( f.e. if you tend to have 30px padding on columns – you can correct this line in the snippet to:
$('.grid-notfull').css({"max-width": "<?php echo $responsive_size; ?>" , "margin": "0 auto" , "padding": "0 20px"});

see here a demo page: https://webers-testseite.de/grid-row-alb/

OK – Mike is right. The p-tag designation in your question misled me a bit.
Open both 1/2 columns and remove the background image there.
The one on the color-section is enough ;)

Why do you choose this way to do it?

Push your page/portfolio as column to the place to go – and insert to the column label your text including the image:
f.e.:
10 Washington Avenue in San Rafael front exterior<br><br><img class="alignnone size-full" src="https://www.thomashenthorne.com/wp-content/uploads/2023/03/10-Washington-Ave-San-Rafael-78-of-78-HERO-cropped-180x180.jpg" alt="10 Washington Avenue in San Rafael front exterior" width="180" height="180" />

you do not need to set it as sublevel menu item

it seems that these images inserted to column labels are not transfered to mobile menu!

womit hast du die zip Datei erstellt?

Entpacke mal das zip file und lade die drei Schriftarten hier hoch: Transfonter

die Demo brauchst du nicht! – Die wahl welche Schrifttypen du wählst, ist natürlich dir überlassen. Ich nehme meist nur ttf und woff2.
Alle modernen Browser kommen mit woff2 zurecht. Das ttf quasi nur als fallback bei alten browsern.

Im Grunde ist das zip welches du dort runterladen kannst nach dem convertieren schon upload fähig für den Enfold Font Manager.
Was aber bei den Dropdown Auswahlen in Enfold angezeigt wird ist der name des zip files – also:
vor dem Upload umbenennen mit dem Schriftnamen : z.B. open-sans.zip
( die @font-face rules die enfold generiert, haben mit diesem Namen nichts zu tun, die sind abhängig von den Schriftnamen in dem zip )

so verfahren solltest Du alle Schriftschnitte dann auch im Font-Manager angezeigt bekommen:

and where can we see it on your page. It’s not so obvious where you see that.

btw. your borlabs does not show on page opening.

have you installed an additional plugin? where does the class ci-search comes from?
that might be the reason.

Thank you for finding/creating a solution for this. This is a good thing for photographers and sites that display art objects (paintings, sculptures, etc.), as most search results only contain links to attachment pages (photos or other media files).

it is hard to inspect because some signs ( f.e. empty single quotation marks are transfered to one double quotation mark line 670, 671

since line 820 there seems to be new entries for prize:

$cat_walk = ";
$cat_class = 'stray';

foreach($cats as $terms) {
foreach($terms as $term) {
if(in_array($term->name, array("price", "Price", "catty"))) {
$cat_class = "pets";
}
$cat_walk .= "term_id) . "'>" . $term->name . "";
}
}

$cat_walk = ";

$meta_out .= '<span class="blog-categories minor-meta">';
$meta_out .= $cat_walk;
$meta_out .= '</span>';

}
}

$stock_availability = get_post_meta( $the_id , 'a_stock_availability', true);
if ( ! empty ( $stock_availability ) ) {

echo $stock_availability; // also tried return instead of echo
$meta_out .= $stock_availability;
$output .= $stock_availability;
};
…

and from 911:

$output .= $meta_out;

$stock_availability = get_post_meta($the_id , 'a_stock_availability', true);

if ( ! empty ( $stock_availability ) ) {
$output .= "<div class='slide-meta-availability'> ". $stock_availability ."</div>";
}

ok