<main class="home">
    <section class="section">
        <div class="sxs-banner sxs-banner--top sxs-banner--v1 active">
            <div class="sxs-banner__bg absolute after media-con">
                <div class="size-full">
                    <div class="media-con size-full">
                        <video width="1920" height="1080" autoplay="" loop="" playsinline="" preload="metadata" class="size-full object-cover">
                            <source src="{{ asset('videos/banner-video.mp4') }}" type="video/mp4">
                        </video>
                    </div>
                </div><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 159.87 159.87" class="sxs-banner__svg active">
                    <circle cx="79.94" cy="79.94" r="66.94" style="--a: 425;"></circle>
                </svg>
            </div>
            <div class="sxs-container sxs-banner__con0">
                <div class="sxs-banner__con1 row">
                    <div class="sxs-banner__con2 col"><a href="/ciencia#ingenieria-metabolica" data-discover="true">
                            <header class="sxs-headline sxs-banner__hdr">
                                <h1 class="sxs-headline__tit sxs-headline__tit--shadowed sxs-headline__tit--align-start sxs-headline__tit--text-color-white sxs-headline__tit--text-weight-700 sxs-headline__tit--text-size-80">
                                    <div class="sxs-rtxt"><span class="sgs_txtwrp"><span class="sgs_txt" style="--sas-idx: 0; translate: none; rotate: none; scale: none; transform: translate(0px, 0px); opacity: 1;">D</span><span class="sgs_txt" style="--sas-idx: 1; translate: none; rotate: none; scale: none; transform: translate(0px, 0px); opacity: 1;">o</span><span class="sgs_txt" style="--sas-idx: 2; translate: none; rotate: none; scale: none; transform: translate(0px, 0px); opacity: 1;">m</span><span class="sgs_txt" style="--sas-idx: 3; translate: none; rotate: none; scale: none; transform: translate(0px, 0px); opacity: 1;">i</span><span class="sgs_txt" style="--sas-idx: 4; translate: none; rotate: none; scale: none; transform: translate(0px, 0px); opacity: 1;">n</span><span class="sgs_txt" style="--sas-idx: 5; translate: none; rotate: none; scale: none; transform: translate(0px, 0px); opacity: 1;">a</span><span class="sgs_txt" style="--sas-idx: 6; translate: none; rotate: none; scale: none; transform: translate(0px, 0px); opacity: 1;">&nbsp;</span></span><span class="sgs_txtwrp"><span class="sgs_txt" style="--sas-idx: 0; translate: none; rotate: none; scale: none; transform: translate(0px, 0px); opacity: 1;">t</span><span class="sgs_txt" style="--sas-idx: 1; translate: none; rotate: none; scale: none; transform: translate(0px, 0px); opacity: 1;">u</span><span class="sgs_txt" style="--sas-idx: 2; translate: none; rotate: none; scale: none; transform: translate(0px, 0px); opacity: 1;">&nbsp;</span></span><span class="sgs_txtwrp"><span class="sgs_txt" style="--sas-idx: 0; translate: none; rotate: none; scale: none; transform: translate(0px, 0px); opacity: 1;">m</span><span class="sgs_txt" style="--sas-idx: 1; translate: none; rotate: none; scale: none; transform: translate(0px, 0px); opacity: 1;">e</span><span class="sgs_txt" style="--sas-idx: 2; translate: none; rotate: none; scale: none; transform: translate(0px, 0px); opacity: 1;">t</span><span class="sgs_txt" style="--sas-idx: 3; translate: none; rotate: none; scale: none; transform: translate(0px, 0px); opacity: 1;">a</span><span class="sgs_txt" style="--sas-idx: 4; translate: none; rotate: none; scale: none; transform: translate(0px, 0px); opacity: 1;">b</span><span class="sgs_txt" style="--sas-idx: 5; translate: none; rotate: none; scale: none; transform: translate(0px, 0px); opacity: 1;">o</span><span class="sgs_txt" style="--sas-idx: 6; translate: none; rotate: none; scale: none; transform: translate(0px, 0px); opacity: 1;">l</span><span class="sgs_txt" style="--sas-idx: 7; translate: none; rotate: none; scale: none; transform: translate(0px, 0px); opacity: 1;">i</span><span class="sgs_txt" style="--sas-idx: 8; translate: none; rotate: none; scale: none; transform: translate(0px, 0px); opacity: 1;">s</span><span class="sgs_txt" style="--sas-idx: 9; translate: none; rotate: none; scale: none; transform: translate(0px, 0px); opacity: 1;">m</span><span class="sgs_txt" style="--sas-idx: 10; translate: none; rotate: none; scale: none; transform: translate(0px, 0px); opacity: 1;">o</span></span></div>
                                </h1>
                            </header>
                            <div class="sxs-banner__subtit o_tot anmt">Reprograma tu cuerpo y transforma tu vida</div>
                        </a></div>
                    <div class="sxs-banner__folw col">
                        <div class="sxs-banner__folw-con0"><a class="sxs-banner__folw-lin o_tot anmt" href="#" aria-label="Ir a la siguiente sección"><span class="sxs-banner__folw-con1"><i class="icon icon-flecha1 abajo"></i></span></a></div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <section id="sec-ftproducts" class="section sec-prods o_ring--before o_ring--after">
        <div class="sxs-container sec-prods__con0">
            <div class="sec-prods__con1">
                <header class="sxs-headline sec-prods__hdr">
                    <h2 class="sxs-headline__tit sxs-headline__tit--align-center sxs-headline__tit--text-color-duller sxs-headline__tit--text-weight-800 sxs-headline__tit--text-size-40">
                        <div class="sxs-rtxt">
                            <span class="sgs_txtwrp">
                                <span class="sgs_txt">P</span><span class="sgs_txt">r</span><span class="sgs_txt">o</span><span class="sgs_txt">d</span><span class="sgs_txt">u</span><span class="sgs_txt">c</span><span class="sgs_txt">t</span><span class="sgs_txt">o</span><span class="sgs_txt">s</span><span class="sgs_txt" >&nbsp;</span>
                            </span>
                            <span class="sgs_txtwrp">
                                <span class="sgs_txt">D</span><span class="sgs_txt">e</span><span class="sgs_txt">s</span><span class="sgs_txt">t</span><span class="sgs_txt">a</span><span class="sgs_txt">c</span><span class="sgs_txt">a</span><span class="sgs_txt">d</span><span class="sgs_txt">o</span><span class="sgs_txt">s</span>
                            </span>
                        </div>
                    </h2>
                </header>
                <div class="sxs-cardscar">
                    <div class="sxs-cardscar__liswrp0">
                        <div class="sxs-cardscar__liswrp1">
                            <ul class="sxs-cardscar__lis keen-slider">
                                @foreach ($objProDest as $a)

                                <li class="sxs-cardscar__ite keen-slider__slide" style="min-width: 358.5px; max-width: 358.5px; transform: translate3d(0px, 0px, 0px);">
                                    <div class="sxs-fdin anmt" style="--_idx: 0;">
                                        <a aria-hidden="false" class="sxs-pcrd sxs-pcrd--squared" href="{{ env('VITE_HTML_BASE').'productos/'.$a['url']}}">
                                            <div class="sxs-pcrd__samp"><span class="sxs-pcrd__samp-wtm-1"></span><span class="sxs-pcrd__samp-wtm-2"></span>
                                                <figure class="figure media-con media-cover"><img loading="lazy" alt="" class="lazy loaded t-opacity" src="{{$a['galeria'][0]['img']}}"></figure>
                                            </div>
                                        </a>
                                        <div class="sxs-pcrd__text">
                                            <a aria-hidden="false" class="sxs-pcrd sxs-pcrd--squared" href="{{ env('VITE_HTML_BASE').'productos/'.$a['url']}}">
                                                <div class="sxs-pcrd__txt">
                                                    <div class="sxs-pcrd__tit">{{$a['titulo']}}</div>
                                                    <div class="sxs-pcrd__pce">$ {{ $a['precio_original']}} MXN</div>
                                                </div>
                                            </a>
                                            <div class="sxs-pcrd__ftr">
                                                <div class="sxs-qpckr sxs-qpckr--v1">
                                                    <button type="button" data-url="{{$a['url']}}" data-id="amt{{$a['url']}}" data-a="amt" data-tope="2" onclick=agritem(this) class="sxs-qpckr__btn" aria-label="Disminuir cantidad" aria-disabled="false"><i class="icon icon-misc1 menos"></i></button>
                                                    <div id="amt{{$a['url']}}" class="sxs-qpckr__amt" aria-live="polite" aria-atomic="true" role="status">1</div>
                                                    <button type="button" data-url="{{$a['url']}}" data-id="amt{{$a['url']}}" data-a="amt" data-tope="1" onclick=agritem(this) class="sxs-qpckr__btn" aria-label="Aumentar cantidad"><i class="icon icon-misc1 mas"></i></button>
                                                </div>
                                                @php
                                                  $class = ($a['es_verde'] == true?" sxs-btn--style-bg-green sxs-pcrd__btn":" sxs-pcrd__btn");
                                                @endphp
                                                <button type="button" data-url="{{$a['url']}}" data-a="amt" data-tope="1" onclick=addcard(this) aria-hidden="false" class="sxs-btn sxs-btn--primary sxs-btn--style-primary {{$class}}">
                                                    <div class="sxs-btn__con0"><span class="sxs-btn__wv"></span>
                                                        <div class="sxs-btn__con1">
                                                            <div class="sxs-btn__con2"><span class=""><span class="sas-bs" style="--sas-idx: 0;">A</span><span class="sas-bs" style="--sas-idx: 1;">g</span><span class="sas-bs" style="--sas-idx: 2;">r</span><span class="sas-bs" style="--sas-idx: 3;">e</span><span class="sas-bs" style="--sas-idx: 4;">g</span><span class="sas-bs" style="--sas-idx: 5;">a</span><span class="sas-bs" style="--sas-idx: 6;">r</span></span></div>
                                                            <div class="sxs-btn__con2"><span class=""><span class="sas-bs" style="--sas-idx: 0;">A</span><span class="sas-bs" style="--sas-idx: 1;">g</span><span class="sas-bs" style="--sas-idx: 2;">r</span><span class="sas-bs" style="--sas-idx: 3;">e</span><span class="sas-bs" style="--sas-idx: 4;">g</span><span class="sas-bs" style="--sas-idx: 5;">a</span><span class="sas-bs" style="--sas-idx: 6;">r</span></span></div>
                                                        </div>
                                                    </div>
                                                </button>
                                            </div>
                                        </div>
                                        
                                    </div>
                                </li>
                                @endforeach
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    @if($objSecInfoProducts!=null)
    @foreach ($objSecInfoProducts as $a =>$b)
    <section class="section sec-iprods {{ $a & 1 ? ' sec-iprods--rtl' : ' sec-iprods--ltr'}} o_ring--before">
        <div class="sxs-container sec-iprods__con0">
            <div class="sec-iprods__con1 row row--f">
                <div class="sec-iprods__text col col--f">
                    <div class="sec-iprods__text-con0-bg anmt"><span class="o_ring--before"></span></div>
                    <div class="sec-iprods__text-con0 before">
                        <header class="sxs-headline sec-iprods__hdr o_tot anmt">
                            <h2 class="sxs-headline__tit sxs-headline__tit--align-start sxs-headline__tit--text-color-duller sxs-headline__tit--text-weight-700 sxs-headline__tit--text-size-50">
                                <span class="flex-ai-center">
                                    <span class="sxs-icon sxs-icon--v1">
                                        <i class="icon icon-misc1 omega"></i>
                                    </span>
                                    <span>{{ $b['titulo']}}</span>
                                </span>
                            </h2>
                        </header>
                        <div class="sec-iprods__subtit o_tot anmt">{{ $b['subtitulo']}}</div>
                        <div class="sec-iprods__samp">
                            <figure class="figure  anmt"><img loading="lazy" class="lazy loaded t-opacity" alt="" src="{{ $b['img']}}"></figure>
                        </div>
                    </div>
                </div>
                <div class="sec-iprods__cntn col col--f">
                    <div class="sec-iprods__liswrp0">
                        <ul class="sec-iprods__lis row">
                            @foreach ($b['items'] as $x)
                            <li class="sec-iprods__ite col">
                                <div class="sxs-fdin anmt" style="--_idx: 0;">
                                        <a aria-hidden="false" class="sxs-pcrd" href="{{ env('VITE_HTML_BASE').'productos/'.$x['url']}}">
                                            <div class="sxs-pcrd__samp"><span class="sxs-pcrd__samp-wtm-1"></span><span class="sxs-pcrd__samp-wtm-2"></span>
                                                <figure class="figure media-con media-cover"><img loading="lazy" alt="" class="lazy loaded t-opacity" src="{{$x['galeria'][0]['img']}}"></figure>
                                            </div>
                                        </a>
                                        <div class="sxs-pcrd__text">
                                            <a aria-hidden="false" class="sxs-pcrd" href="{{ env('VITE_HTML_BASE').'productos/'.$x['url']}}">
                                                <div class="sxs-pcrd__txt">
                                                    <div class="sxs-pcrd__tit">{{$x['titulo']}}</div>
                                                    <div class="sxs-pcrd__pce">$ {{$x['precio_original']}} MXN</div>
                                                </div>
                                            </a>
                                            <div class="sxs-pcrd__ftr">
                                                <div class="sxs-qpckr sxs-qpckr--v1">
                                                    <button type="button" data-url="{{$x['url']}}" data-id="amt{{$x['url']}}" data-a="amt" data-tope="2" onclick=agritem(this) class="sxs-qpckr__btn" aria-label="Disminuir cantidad" aria-disabled="false"><i class="icon icon-misc1 menos"></i></button>
                                                    <div id="amt{{$x['url']}}" class="sxs-qpckr__amt" aria-live="polite" aria-atomic="true" role="status">1</div>
                                                    <button type="button" data-url="{{$x['url']}}" data-id="amt{{$x['url']}}" data-a="amt" data-tope="1" onclick=agritem(this) class="sxs-qpckr__btn" aria-label="Aumentar cantidad"><i class="icon icon-misc1 mas"></i></button>
                                                </div>
                                                 @php
                                                  $class = ($x['es_verde'] == true?" sxs-btn--style-bg-green sxs-pcrd__btn":" sxs-pcrd__btn");
                                                 @endphp
                                                <button type="button" data-url="{{$x['url']}}" data-a="amt" data-tope="1" onclick=addcard(this) aria-hidden="false" class="sxs-btn sxs-btn--primary sxs-btn--style-primary {{$class}}">
                                                    <div class="sxs-btn__con0"><span class="sxs-btn__wv"></span>
                                                        <div class="sxs-btn__con1">
                                                            <div class="sxs-btn__con2"><span class=""><span class="sas-bs" style="--sas-idx: 0;">A</span><span class="sas-bs" style="--sas-idx: 1;">g</span><span class="sas-bs" style="--sas-idx: 2;">r</span><span class="sas-bs" style="--sas-idx: 3;">e</span><span class="sas-bs" style="--sas-idx: 4;">g</span><span class="sas-bs" style="--sas-idx: 5;">a</span><span class="sas-bs" style="--sas-idx: 6;">r</span></span></div>
                                                            <div class="sxs-btn__con2"><span class=""><span class="sas-bs" style="--sas-idx: 0;">A</span><span class="sas-bs" style="--sas-idx: 1;">g</span><span class="sas-bs" style="--sas-idx: 2;">r</span><span class="sas-bs" style="--sas-idx: 3;">e</span><span class="sas-bs" style="--sas-idx: 4;">g</span><span class="sas-bs" style="--sas-idx: 5;">a</span><span class="sas-bs" style="--sas-idx: 6;">r</span></span></div>
                                                        </div>
                                                    </div>
                                                </button>
                                            </div>
                                        </div>
                                    </div>
                            </li>
                            @endforeach
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </section>
    @endforeach
    @endif
    @if($objGrupo!=null)
    <div class="sxs-pxsec__wrp0">
        <section class="section sxs-pxsec">
            <div class="sxs-container sxs-pxsec__con0">
                <div class="sxs-pxsec__con1 row">
                    <div class="sxs-pxsec__col sxs-pxsec__col--left col">
                        <div class="sxs-pxsec__track" style="transform: translate(0px, -476px); translate: none; rotate: none; scale: none;">
                            @foreach ($objGrupo[0] as $a =>$b)
                            <div class="sxs-pxsec__track-ite"><a class="sxs-bcrd" href="{{ env('VITE_HTML_BASE').'blog/'.$b['url']}}">
                                    <figure class="figure sxs-bcrd__samp media-cover media-con"><img loading="lazy" class="lazy loaded t-opacity" alt="" src="{{ $b['img_min']}}"></figure>
                                    <div class="sxs-bcrd__tgs">
                                        <div class="sxs-itxg sxs-itxg--v1 sxs-bcrd__tag"><i class="icon icon-blog calendario"></i><span class="sxs-itxg__txt">{{ $b['fecha']}}</span></div>
                                    </div>
                                    <div class="sxs-bcrd__tit">{{ $b['titulo']}}</div>
                                    <div class="sxs-bcrd__des">{{ $b['resumen']}}</div>
                                </a>
                            </div>
                            @endforeach
                        </div>
                    </div>
                    <div class="sxs-pxsec__col sxs-pxsec__col--center col">
                        <header class="sxs-headline sec-blog__hdr">
                            <h2 class="sxs-headline__tit sxs-headline__tit--align-center sxs-headline__tit--text-color-duller sxs-headline__tit--text-weight-700 sxs-headline__tit--text-size-40">Blog del Dr. Sears</h2>
                        </header>
                        <div class="sxs-pxsec__track">
                            @foreach ($objGrupo[1] as $a =>$b)
                            <div class="sxs-pxsec__track-ite"><a class="sxs-bcrd" href="{{ env('VITE_HTML_BASE').'blog/'.$b['url']}}">
                                    <figure class="figure sxs-bcrd__samp media-cover media-con"><img loading="lazy" class="lazy loaded t-opacity" alt="" src="https://manager.zonediet.com.mx/assets/images/blog-03.webp"></figure>
                                    <div class="sxs-bcrd__tgs">
                                        <div class="sxs-itxg sxs-itxg--v1 sxs-bcrd__tag"><i class="icon icon-blog calendario"></i><span class="sxs-itxg__txt">{{ $b['fecha']}}</span></div>
                                    </div>
                                    <div class="sxs-bcrd__tit">{{ $b['titulo']}}</div>
                                    <div class="sxs-bcrd__des">{{ $b['resumen']}}</div>
                                </a>
                            </div>
                            @endforeach
                        </div>
                    </div>
                    <div class="sxs-pxsec__col sxs-pxsec__col--right col">
                        <div class="sxs-pxsec__track">
                            @foreach ($objGrupo[2] as $a =>$b)
                            <div class="sxs-pxsec__track-ite"><a class="sxs-bcrd" href="{{ env('VITE_HTML_BASE').'blog/'.$b['url']}}">
                                    <figure class="figure sxs-bcrd__samp media-cover media-con"><img loading="lazy" class="lazy loaded t-opacity" alt="" src="{{ $b['img_min']}}"></figure>
                                    <div class="sxs-bcrd__tgs">
                                        <div class="sxs-itxg sxs-itxg--v1 sxs-bcrd__tag"><i class="icon icon-blog calendario"></i><span class="sxs-itxg__txt">{{ $b['fecha']}}</span></div>
                                    </div>
                                    <div class="sxs-bcrd__tit">{{ $b['titulo']}}</div>
                                    <div class="sxs-bcrd__des">{{ $b['resumen']}}</div>
                                </a>
                            </div>
                            @endforeach
                        </div>
                     
                    </div>
                </div>
            </div>
    </div>
    </section>
    </div>
    @endif
</main>