<div class="o-duplex  @if(!empty($duplexIsReversed) && $duplexIsReversed == true) o-duplex--reversed @endif  @modifiers('o-duplex') ">
    <div class="o-duplex__grid">
        <div class="o-duplex__figure">
            @if(!empty($duplexImage))
                <img class="o-duplex__image  u-clip-path" data-id="clip-path-image-1" src="{{$duplexImage->medium_image_url}}" alt="{{ $duplexImage->name }}">
            @endif

            @if(!empty($duplexShowRating) && $duplexShowRating == true)
                <div class="o-duplex__extra">
                    @include('site.components.rating', ['modifiers' => ['boxed']])
                </div>
            @endif

        </div>
        <div class="o-duplex__content  s-text    @if(isset($scopeClasses)) {{ $scopeClasses }} @endif  @if(!empty($duplexOnDark) && $duplexOnDark == true) s-text--on-dark @endif @if(!empty($duplexPulledDownContent) && $duplexPulledDownContent == true) is-pulled-down @endif">
            @if(!empty($duplexTitle))
                <h2>{{$duplexTitle}}</h2>
            @endif

            @if(!empty($duplexContent))
                {!! $duplexContent !!}
            @endif

            @if(!empty($duplexButtonLink) && !empty($duplexButtonText))
                @include('site.components.button', [
                    'buttonIcon' => 'arrowRight',
                    'buttonText' => $duplexButtonText,
                    'buttonLink' => $duplexButtonLink,
                ])
            @endif

            @if(!empty($duplexNote))
                <div class="o-duplex__note">
                    @include('site.components.note', [
                        'noteContent' => $duplexNote,
                    ])
                </div>
            @endif
        </div>
    </div>
</div>