.art-of-light{padding:100px 0;background:#fff;text-align:center;@keyframes spin{0%{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}}.art-of-light .container{max-width:1400px;margin:0 auto;padding:0 20px}.art-of-light .header{margin-bottom:40px}.art-of-light .title{font-size:36px;font-weight:700;margin-bottom:20px}.art-of-light .subtitle{font-size:16px;color:#555;max-width:800px;margin:0 auto 40px}.art-of-light .colors{display:flex;justify-content:center;flex-wrap:wrap;gap:30px;margin-bottom:40px;cursor:pointer}.art-of-light .color-item{display:flex;flex-direction:column;align-items:center;transition:transform .3s ease}.art-of-light .color-item.active .color-icon{border:2px solid black;padding:2px;border-radius:50%}.art-of-light .color-icon{width:50px;height:50px;border-radius:50%;object-fit:cover;margin-bottom:8px;transition:border .3s ease}.art-of-light .color-label{font-size:14px;color:#333}.art-of-light .social-grid-wrapper{position:relative}.art-of-light .social-grid{column-count:4;column-gap:20px;margin-bottom:60px;opacity:0;transition:opacity .5s ease}.art-of-light .social-item{break-inside:avoid;margin-bottom:20px;display:block}.art-of-light .social-item img{width:100%;border-radius:8px;display:block;object-fit:cover}.art-of-light .social-item:nth-child(1) img,.art-of-light .social-item:nth-child(4) img,.art-of-light .social-item:nth-child(5) img,.art-of-light .social-item:nth-child(8) img{height:220px}.art-of-light .social-item:nth-child(2) img,.art-of-light .social-item:nth-child(3) img,.art-of-light .social-item:nth-child(6) img,.art-of-light .social-item:nth-child(7) img{height:340px}.art-of-light .button-wrapper{margin-top:30px}.art-of-light .cta-button{display:inline-block;padding:14px 30px;background:#fff;border:2px solid #000;font-weight:600;text-decoration:none;color:#000;transition:all .3s ease}.art-of-light .cta-button:hover{background:#000;color:#fff}.art-of-light .loader{position:absolute;top:40%;left:50%;transform:translate(-50%,-50%);width:40px;height:40px;border:4px solid #ddd;border-top:4px solid #000;border-radius:50%;animation:spin 1s linear infinite;display:none;z-index:10}@media (max-width: 768px){.art-of-light{padding:20px 0}.art-of-light .social-grid{column-count:2}.art-of-light .header,.art-of-light .colors{margin-bottom:20px}.art-of-light .social-item:nth-child(odd) img,.art-of-light .social-item:nth-child(2n) img{height:240px}}
/*# sourceMappingURL=/cdn/shop/t/8/assets/custom-art-of-light.css.map */
