.commerce-mobile-sticky { position: fixed; inset: auto 0 0; z-index: var(--commerce-layer-sticky); display: none; grid-template-columns: repeat(5, 1fr); border-top: 1px solid var(--commerce-color-border); background: var(--commerce-color-background); box-shadow: var(--commerce-shadow-header); transform: translateY(0); transition: transform 300ms var(--commerce-motion-easing-standard); will-change: transform; }
.commerce-mobile-sticky.is-hidden { transform: translateY(100%); }
.commerce-mobile-sticky.is-visible { transform: translateY(0); }
.commerce-mobile-sticky a { display: grid; place-items: center; gap: .2rem; min-width: 0; min-height: 3.5rem; padding: .35rem; font-size: .7rem; text-decoration: none; }
.commerce-subscription-popup { --commerce-overlay-z-index: var(--commerce-layer-modal); display: grid; place-items: center; }
.commerce-subscription-popup__backdrop { position: absolute; inset: 0; border: 0; background: var(--commerce-color-overlay); }
.commerce-subscription-popup__panel { position: relative; display: grid; grid-template-columns: 47.728% 52.272%; width: min(calc(100% - 2rem), var(--commerce-popup-width, 55rem)); max-height: min(90vh, 48rem); padding: 0; overflow: auto; overscroll-behavior: contain; border-radius: var(--commerce-radius-surface); background: var(--commerce-color-background); box-shadow: none; opacity: 0; transform: scale(.8); transition: opacity 600ms cubic-bezier(.7,0,.2,1), transform 600ms cubic-bezier(.7,0,.2,1); }
.commerce-subscription-popup:is([data-state="opening"], [data-state="open"]) .commerce-subscription-popup__panel { opacity: 1; transform: scale(1); }
.commerce-subscription-popup__panel:not(:has(.commerce-subscription-popup__media)) { grid-template-columns: minmax(0, 1fr); }
.commerce-subscription-popup__close { position: absolute; top: .5rem; right: .5rem; z-index: 1; background: var(--commerce-color-background); }
.commerce-subscription-popup__media { min-height: 100%; background: var(--commerce-color-surface); }
.commerce-subscription-popup__media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.commerce-subscription-popup__content { display: grid; align-content: center; justify-items: center; gap: 1.5rem; padding: 2.5rem; text-align: center; }
.commerce-subscription-popup__panel h2 { margin: 0; font: var(--commerce-font-weight-heading) var(--commerce-heading-md)/var(--commerce-line-height-heading) var(--commerce-font-heading); }
.commerce-subscription-popup__panel p { margin: 0; }
.commerce-subscription-popup__social-menu { display: flex; flex-wrap: wrap; justify-content: center; gap: .75rem; padding: 0; margin: 0; list-style: none; }
.commerce-subscription-popup__social-menu a { display: inline-flex; min-height: var(--commerce-touch-target); align-items: center; }
@media (max-width: 1023px) { .commerce-subscription-popup__panel { grid-template-columns: 1fr; } .commerce-subscription-popup__media { min-height: 12rem; max-height: 40vh; } .commerce-subscription-popup__content { gap: 1rem; padding: 2rem 1rem; } }
@media (max-width: 1023px) { .commerce-mobile-sticky { display: grid; } body:has(.commerce-mobile-sticky) { padding-bottom: 3.5rem; } }
@media (prefers-reduced-motion: reduce) { .commerce-subscription-popup__panel, .commerce-mobile-sticky { transition: none !important; } }
