@props(['data'])

@php
    /**
     * Full-width banner: background image + rich text on top.
     *
     * This is the "Ofertas especiales" strip the Mexico / Argentina / Brasil homes carried as a
     * hand-written `<div class="section-banner-home">` with a page-local `@push('styles')` block.
     * The gradient is inlined the same way section-wrapper does for a `custom` background group, so
     * the text stays readable over any photo without a second CSS rule.
     */
    $image   = $data['background_image'] ?? null;
    $content = translate_data($data['content'] ?? null);
@endphp

@if (!empty($image) || !empty($content))
    <div class="image-banner-text text-white"
         @if (!empty($image))
             style="background-image: linear-gradient(rgba(0,0,0,0.35), rgba(0,0,0,0.65)), url('{{ Storage::url($image) }}');"
         @endif
    >
        <div class="auto-container">
            <div class="row justify-content-center">
                <div class="col-lg-8 col-md-10 text-center tiptap-content">
                    {!! tiptap_converter()->asHTML($content) !!}
                </div>
            </div>
        </div>
    </div>
@endif