.atelier-gallery{position:relative;width:100%;display:flex;flex-direction:column;gap:1.5rem}@media screen and (max-width:749px){.atelier-gallery{gap:12px}}.atelier-gallery__viewport{position:relative;width:100%;aspect-ratio:1 / 1;overflow:hidden;background:#f5f0eb}@media screen and (min-width:990px){.atelier-gallery__viewport{max-height:calc(100vh - 200px);max-width:calc(100vh - 200px);margin-left:auto;margin-right:auto}}.atelier-gallery__track{list-style:none;margin:0;padding:0;display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none;height:100%;width:100%}.atelier-gallery__track::-webkit-scrollbar{display:none}.atelier-gallery__track:focus{outline:none}.atelier-gallery__slide{flex:0 0 100%;width:100%;height:100%;scroll-snap-align:start;position:relative}@media screen and (max-width:749px){.atelier-gallery__track{gap:8px}.atelier-gallery__slide{flex:0 0 calc(100% - 32px)}}.atelier-gallery__poster{position:relative;width:100%;height:100%;display:block;transition:padding .4s ease,border-width .4s ease,border-color .4s ease,background .4s ease;padding:0;border:0 solid transparent;background:#f5f0eb}.atelier-gallery__img{width:100%;height:100%;object-fit:contain;display:block}.atelier-gallery__img--placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.75rem;width:100%;height:100%;color:#1a1a1a59;font-family:DM Sans,system-ui,sans-serif;font-size:.6875rem;letter-spacing:.18em;text-transform:uppercase;background:linear-gradient(135deg,#d4a57440,#b8504226)}.atelier-gallery__nav{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;display:none;align-items:center;justify-content:center;border:0;border-radius:50%;background:#ffffffeb;color:#1a1a1a;cursor:pointer;z-index:2;box-shadow:0 4px 16px #1a1a1a1f;transition:background .2s ease,transform .2s ease}.atelier-gallery__nav:hover{background:#fff;transform:translateY(-50%) scale(1.05)}.atelier-gallery__nav--prev{left:12px}.atelier-gallery__nav--next{right:12px}@media(hover:hover)and (min-width:750px){.atelier-gallery__nav{display:inline-flex}}.atelier-gallery__thumbs{list-style:none;margin:0;padding:0;display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}.atelier-gallery__thumbs::-webkit-scrollbar{display:none}.atelier-gallery__thumb{flex:0 0 auto;width:64px;height:64px;padding:0;border:1.5px solid transparent;background:#f5f0eb;cursor:pointer;overflow:hidden;transition:border-color .2s ease,opacity .2s ease;opacity:.6;border-radius:2px}.atelier-gallery__thumb:hover{opacity:1}.atelier-gallery__thumb--active{border-color:#b85042;opacity:1}.atelier-gallery__thumb-img{width:100%;height:100%;object-fit:contain;display:block;background:#f5f0eb}@media screen and (max-width:749px){.atelier-gallery__thumb{width:56px;height:56px}.atelier-gallery__thumbs{gap:6px}}.atelier-gallery[data-current-frame=none] .atelier-gallery__poster{padding:0;border:0}.atelier-gallery[data-current-frame=natural-wood] .atelier-gallery__poster{border-style:solid;border-width:clamp(10px,2.4vw,18px);border-color:#b89065;padding:clamp(6px,1.6vw,14px);background:#fff;box-shadow:inset 0 0 0 1px #1a1a1a0f}.atelier-gallery[data-current-frame=black-wood] .atelier-gallery__poster{border-style:solid;border-width:clamp(10px,2.4vw,18px);border-color:#1a1a1a;padding:clamp(6px,1.6vw,14px);background:#fff}.atelier-gallery[data-current-frame=white-wood] .atelier-gallery__poster{border-style:solid;border-width:clamp(10px,2.4vw,18px);border-color:#efeae2;padding:clamp(6px,1.6vw,14px);background:#fff;box-shadow:inset 0 0 0 1px #1a1a1a14}.atelier-gallery[data-current-frame=black-metal] .atelier-gallery__poster{border-style:solid;border-width:clamp(6px,1.4vw,10px);border-color:#2a2a2a;padding:clamp(4px,1vw,8px);background:#fff}.atelier-gallery[data-current-frame=silver-metal] .atelier-gallery__poster{border-style:solid;border-width:clamp(6px,1.4vw,10px);border-color:#bfbfbf;padding:clamp(4px,1vw,8px);background:#fff}.atelier-gallery[data-current-frame=gold-metal] .atelier-gallery__poster{border-style:solid;border-width:clamp(6px,1.4vw,10px);border-color:#c29550;padding:clamp(4px,1vw,8px);background:#fff}.atelier-gallery__poster .atelier-gallery__img{width:100%;height:100%}
/*# sourceMappingURL=/cdn/shop/t/5/assets/atelier-product-gallery-frame.css.map */