.bento-grid-section{margin-top:var(--mg-top-desktop, 50px);margin-bottom:var(--mg-bottom-desktop, 50px)}@media(max-width:767px){.bento-grid-section{margin-top:var(--mg-top-mobile, 30px);margin-bottom:var(--mg-bottom-mobile, 30px)}}.bento-grid-wrapper{display:grid;grid-template-columns:repeat(var(--grid-cols, 6),1fr);grid-auto-rows:var(--row-h, 180px);grid-auto-flow:row dense;gap:var(--gap, 20px);width:100%}@media(max-width:767px){.bento-grid-wrapper{grid-template-columns:repeat(var(--grid-cols-mb, 2),1fr);grid-auto-rows:var(--row-h-mb, 160px);gap:var(--gap-mb, 10px)}}.bento-grid-item{grid-column:span var(--col-span, 2);grid-row:span var(--row-span, 2);position:relative;overflow:hidden;border-radius:var(--radius, 24px);min-width:0}@media(max-width:767px){.bento-grid-item{grid-column:span var(--col-span-mb, 2);grid-row:span var(--row-span-mb, 2)}}.bento-inner{position:relative;width:100%;height:100%;overflow:hidden;border-radius:var(--radius, 24px)}.bento-grid-item .image-box{position:relative;width:100%;height:100%;overflow:hidden}.bento-grid-item .image-box img,.bento-grid-item .image-box .placeholder-svg{display:block;width:100%;height:100%;object-fit:cover;object-position:center center;transition:transform .5s ease}.bento-grid-item:hover .image-box img{transform:scale(1.04)}.bento-grid-item .image-box img.hidden-mobile{display:block}.bento-grid-item .image-box img.hidden-desktop{display:none}@media(max-width:767px){.bento-grid-item .image-box img.hidden-mobile{display:none}.bento-grid-item .image-box img.hidden-desktop{display:block}}.bento-grid-item .overlay-content{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(20px,2.5vw,32px);background:linear-gradient(to top,#0000008c,#00000040 35%,#0000 65%);color:#fff;pointer-events:none;z-index:2}.bento-grid-item .item-heading{margin:0 0 6px;font-family:"Kanit",var(--font-heading-family),sans-serif;font-size:var(--heading-font-size, 24px);font-weight:700;line-height:1.2;color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.4)}.bento-grid-item .item-description{margin:0;font-family:"Kanit",var(--font-body-family),sans-serif;font-size:var(--desc-font-size, 16px);font-weight:400;line-height:1.5;color:#fff;opacity:.95;text-shadow:0 1px 4px rgba(0,0,0,.4)}@media(max-width:767px){.bento-grid-item .overlay-content{padding:clamp(14px,4vw,20px)}.bento-grid-item .item-heading{font-size:var(--heading-font-size-mb, 20px)}.bento-grid-item .item-description{font-size:var(--desc-font-size-mb, 14px)}}.bento-grid-item.specs-block .bento-inner{display:flex;align-items:center;padding:clamp(20px,2vw,32px) clamp(24px,3vw,48px)}.bento-grid-item.specs-block .specs-container{display:flex;flex-direction:row;align-items:center;justify-content:space-around;gap:clamp(16px,3vw,40px);width:100%;height:100%}.bento-grid-item.specs-vertical .specs-container{flex-direction:column;justify-content:center;align-items:flex-start}.bento-grid-item.specs-block .spec-item{display:flex;flex-direction:column;align-items:flex-start;gap:6px;flex:1 1 0;min-width:0}.bento-grid-item.specs-vertical .spec-item{flex-direction:row;align-items:center;gap:12px;flex:0 0 auto;width:100%}.bento-grid-item.specs-block .spec-icon img{display:block;width:28px;height:28px;object-fit:contain;filter:brightness(0) invert(1)}.bento-grid-item.specs-block .spec-heading{font-family:"Kanit",var(--font-heading-family),sans-serif;font-size:var(--specs-heading-font-size, 32px);font-weight:700;line-height:1.1;color:#fff}.bento-grid-item.specs-block .spec-description{font-family:"Kanit",var(--font-body-family),sans-serif;font-size:var(--specs-desc-font-size, 14px);font-weight:400;line-height:1.4;color:#fff;opacity:.9;margin-top:2px}@media(max-width:767px){.bento-grid-item.specs-block .bento-inner{padding:clamp(16px,4vw,24px)}.bento-grid-item.specs-block .specs-container{flex-direction:column;align-items:flex-start;gap:12px;justify-content:center}.bento-grid-item.specs-block .spec-item{flex-direction:row;align-items:center;width:100%}.bento-grid-item.specs-block .spec-heading{font-size:var(--specs-heading-font-size-mb, 24px)}.bento-grid-item.specs-block .spec-description{font-size:var(--specs-desc-font-size-mb, 12px)}.bento-grid-item.specs-block .spec-icon img{width:22px;height:22px}}
/*# sourceMappingURL=/cdn/shop/t/15/assets/section-bento-grid.css.map */
