html{overflow-x:hidden}body{margin-top:6em;height:100%;background-color:#121212}main{background:transparent;overflow:hidden!important}.product-detail-container{width:100%;margin:0;padding:0;min-height:100vh;color:#fff;position:relative;background-color:#121212;display:flex;flex-flow:column wrap;justify-content:center;align-items:center}.product-main-section{display:flex;width:75%;margin:0 auto;align-items:stretch}.product-image-gallery{width:50%;background-color:#252525;display:flex;align-items:center;justify-content:center;padding:1em;border-top-left-radius:10px;border-bottom-left-radius:10px}.product-image-gallery .main-product-image{max-width:100%;max-height:500px;-o-object-fit:contain;object-fit:contain}.product-details{width:50%;background-color:#000000e6;display:flex;align-items:center;flex-direction:column;padding:2em;border-top-right-radius:10px;border-bottom-right-radius:10px;justify-content:center}.product-header{width:100%;color:#fff;text-align:left;margin-bottom:1em}.product-header h1{color:#b0c912;font-size:2.5em;margin-bottom:.5em}.product-header h4{color:#d7d7d7;margin-bottom:1em}.product-description{width:100%;text-align:justify;margin-bottom:1em}.related-products{width:75%;margin:2em auto;padding:1em;background-color:#1e1e1e;border-radius:10px}.related-products h3{color:#b0c912;border-bottom:2px solid #b0c912;padding-bottom:.5em;margin-bottom:1em}.product-list{display:grid;grid-template-columns:repeat(3,1fr);gap:1em}.product-item{background-color:#252525;padding:1em;border-radius:8px;text-align:center;transition:transform .3s ease}.product-item:hover{transform:scale(1.05);background-color:#2e2e2e}.product-certifications{display:flex;gap:1em;margin-top:1em}.badge{background-color:#b0c912;color:#121212;padding:.5em 1em;border-radius:4px;font-weight:700}.product-metadata{width:100%;margin-bottom:.5em;color:#d7d7d7}@media (max-width: 1024px){.product-main-section{flex-direction:column;width:95%}.product-image-gallery,.product-details{width:100%;border-radius:0}.product-details{border-top-right-radius:0;border-top-left-radius:0}.product-list{grid-template-columns:repeat(2,1fr)}}@media (max-width: 576px){.product-list{grid-template-columns:1fr}.product-header h1{font-size:2em}}.slide-left-enter{transform:translate(100%);opacity:0}.slide-left-enter-active{transform:translate(0);opacity:1;transition:all .6s ease-in-out}.slide-left-exit{transform:translate(0);opacity:1}.slide-left-exit-active{transform:translate(-100%);opacity:0;transition:all .6s ease-in-out}.slide-right-enter{transform:translate(-100%);opacity:0}.slide-right-enter-active{transform:translate(0);opacity:1;transition:all .6s ease-in-out}.slide-right-exit{transform:translate(0);opacity:1}.slide-right-exit-active{transform:translate(100%);opacity:0;transition:all .6s ease-in-out}.navigation-buttons{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:100}.nav-button{position:absolute;top:50%;transform:translateY(-50%);background-color:#252525e6;color:#d7d7d7;border:none;padding:2.5rem 1.5rem;cursor:pointer;transition:all .4s cubic-bezier(.4,0,.2,1);pointer-events:auto;overflow:hidden}.nav-button:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:#b0c912;transform:translate(-100%);transition:transform .4s cubic-bezier(.4,0,.2,1);z-index:-1}.nav-button:hover:before{transform:translate(0)}.nav-button:hover{color:#121212}.nav-button.prev{left:0;border-top-right-radius:8px;border-bottom-right-radius:8px}.nav-button.next{right:0;border-top-left-radius:8px;border-bottom-left-radius:8px}.nav-button .product-name{max-width:0;overflow:hidden;white-space:nowrap;display:inline-block;transition:max-width .4s cubic-bezier(.4,0,.2,1);vertical-align:middle;margin:0 .5rem}.nav-button:hover .product-name{max-width:200px}.nav-button .arrow{display:inline-block;font-size:2rem;vertical-align:middle;transition:transform .4s cubic-bezier(.4,0,.2,1)}.nav-button.prev:hover .arrow{transform:translate(-30%)}.nav-button.next:hover .arrow{transform:translate(30%)}.product-detail-container{overflow:hidden;position:relative}@media (max-width: 768px){.nav-button{padding:1.5rem .8rem}.nav-button:hover .product-name{max-width:150px}.nav-button .arrow{font-size:1.5rem}}.capitalize{text-transform:capitalize}.loading{width:100%;padding:2em;text-align:center;color:#b0c912;border-radius:8px;font-size:1.1em;animation:pulse 1.5s infinite}@keyframes pulse{0%{opacity:1}50%{opacity:.5}to{opacity:1}}
