/* Give the artwork and caption separate grid rows at every viewport width. */
.lpb-site .hero-art{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto auto;gap:20px;min-height:0;height:auto;padding:26px 24px 24px;align-items:center;justify-items:center}
.lpb-site .hero-art .art-label{position:static;grid-area:1/1;justify-self:start;margin:0}
.lpb-site .hero-art .circle{position:relative;grid-area:2/1;top:auto;left:auto;width:100%;max-width:345px;height:auto;aspect-ratio:1;margin:0;align-self:center}
.lpb-site .hero-art figure{position:relative;grid-area:2/1;width:100%;max-width:345px;height:auto;aspect-ratio:1;margin:0;z-index:1}
.lpb-site .hero-art figure img{display:block;width:100%;height:100%;margin:0;object-fit:contain;filter:none}
.lpb-site .hero-art .spec-tag{position:relative;grid-area:2/1;right:auto;top:auto;align-self:start;justify-self:end;margin:30px 0 0;z-index:2}
.lpb-site .hero-art .hero-product{position:static;grid-area:3/1;width:100%;margin:0;padding-top:16px;align-self:start}
@media(max-width:620px){.lpb-site .hero-art{padding:24px 22px 22px;gap:20px}.lpb-site .hero-art .spec-tag{margin-top:24px}.lpb-site .hero-product small{font-size:8px}}
@media(prefers-reduced-motion:no-preference){
.lpb-site .product,.lpb-site .way{transition:transform 220ms ease,box-shadow 220ms ease}
.lpb-site .wp-block-button__link,.lpb-site .setup-controls button{transition:transform 180ms ease,background-color 180ms ease,filter 180ms ease}
@media(hover:hover){.lpb-site .product:hover,.lpb-site .way:hover{transform:translateY(-3px);box-shadow:0 10px 28px #20231f0b}.lpb-site .wp-block-button__link:hover{transform:translateY(-2px)}}
}
@media(prefers-reduced-motion:reduce){.lpb-site *{animation:none!important;transition:none!important}html{scroll-behavior:auto}}
