.frame-guide-popup{position:fixed;top:0;left:0;width:100%;height:100%;z-index:1000;display:flex;justify-content:center;align-items:center;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility .3s ease}.frame-guide-popup.active{opacity:1;visibility:visible}.frame-guide-popup__overlay{position:absolute;top:0;left:0;width:100%;height:100%;background-color:#00000080;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1}.frame-guide-popup__content{position:relative;background-color:rgb(var(--color-background));width:90%;max-width:500px;max-height:90vh;border-radius:8px;box-shadow:0 4px 20px #00000026;z-index:2;overflow-y:auto;display:flex;flex-direction:column;transform:translateY(20px);transition:transform .3s ease}.frame-guide-popup.active .frame-guide-popup__content{transform:translateY(0)}.frame-guide-popup__close{position:absolute;top:1rem;right:1rem;background:none;border:none;cursor:pointer;padding:.5rem;color:rgb(var(--color-foreground));z-index:3}.frame-guide-popup__close:hover{opacity:.7}.frame-guide-popup__header{padding:1.5rem 2rem;border-bottom:1px solid rgba(var(--color-foreground),.1);text-align:center;position:sticky;top:0;background-color:rgb(var(--color-background));z-index:2}.frame-guide-popup__title{margin:0;font-size:2rem;font-family:var(--font-heading-family);color:rgb(var(--color-foreground))}.frame-guide-popup__body{padding:2rem;display:flex;flex-direction:column;gap:2.5rem}.frame-guide-item{display:flex;flex-direction:column;gap:1rem}.frame-guide-item__image-container{width:100%;border-radius:8px;overflow:hidden;background-color:#f5f5f5;aspect-ratio:4 / 3}.frame-guide-item__image{width:100%;height:100%;object-fit:contain;display:block}.frame-guide-item__info h3{margin:0 0 .5rem;font-size:1.8rem;font-weight:600;color:rgb(var(--color-foreground))}.frame-guide-item__info p{margin:0;font-size:1.4rem;line-height:1.5;color:rgba(var(--color-foreground),.75)}@media screen and (max-width: 749px){.frame-guide-popup__content{width:95%;max-height:85vh}.frame-guide-popup__body{padding:1.5rem;gap:2rem}.frame-guide-item__info h3{font-size:1.6rem}}
/*# sourceMappingURL=/cdn/shop/t/3/assets/frame-guide-popup.css.map */