/* Shared typography only. Each mock retains its own composition and color palette. */
main[data-animated-product]{font-family:var(--f-body);line-height:1.55}
main[data-animated-product] :where(h2,h3){font-family:var(--f-display)}
main[data-animated-product] :where(h2,h3,p,summary,dd,button){overflow-wrap:anywhere}
main[data-animated-product] :where(p,blockquote,dl){max-width:none}
main[data-animated-product] h2{font-size:clamp(28px,2.8vw,39px);font-weight:550;line-height:1.2;letter-spacing:-.02em}
main[data-animated-product] .eyebrow:before{display:none}
main[data-animated-product] .eyebrow{font-family:var(--f-body)}
main[data-animated-product] .panel-title{font-family:var(--f-display);font-weight:600;font-size:26px;line-height:1.3}
main[data-animated-product] summary{font-size:clamp(16px,1.4vw,19.52px);line-height:1.4}
main[data-animated-product] details p{font-size:16px;line-height:1.75}
main[data-animated-product] button{font-family:var(--f-body)}
main[data-animated-product] [hidden]{display:none!important}
main[data-animated-product] .animated-product-status{width:min(1120px,calc(100% - 64px));margin:0 auto;padding-block:24px;display:flex;align-items:start;gap:24px;border-top:1px solid #dce4e9}
main[data-animated-product] .animated-product-status p,main[data-animated-product] .animated-product-status a{font-size:13px;line-height:1.75}
main[data-animated-product] .animated-product-status a{flex-shrink:0}
@media(max-width:640px){
 main[data-animated-product] .animated-product-status{width:calc(100% - 36px);display:block}
 main[data-animated-product] .animated-product-status a{display:inline-block;margin-top:12px}
}