.comp-blogs-grid{width:100%;position:relative}.comp-blogs-grid__header{display:flex;justify-content:space-between;align-items:center;margin-bottom:2.5rem;flex-wrap:wrap;gap:1rem}.comp-blogs-grid__heading{font-family:NeueMontrealBold;text-transform:capitalize;font-size:32px;font-weight:700;margin:0;color:#000}.comp-blogs-grid__view-all{display:flex;align-items:center;gap:.5rem;padding:.3rem .75rem;font-weight:600;color:#fff;background:#09bde3;border-radius:6px;text-decoration:none;transition:all .3s ease}.comp-blogs-grid__view-all:hover{opacity:.8;color:#000}.comp-blogs-grid__view-all:hover svg path{fill:#000}.comp-blogs-grid__container{display:grid;grid-template-columns:repeat(5,1fr);gap:1rem}.comp-blogs-grid__card{background:#fff;overflow:hidden;box-shadow:0 4px 20px #0000001a;transition:transform .3s ease,box-shadow .3s ease;opacity:0;transform:translateY(20px)}.comp-blogs-grid__card.animate-in{opacity:1;transform:translateY(0)}.comp-blogs-grid__card:hover{transform:translateY(-4px);box-shadow:0 8px 30px #00000026}.comp-blogs-grid__image-container{position:relative;width:100%;overflow:hidden}.comp-blogs-grid__image{width:100%;height:100%;object-fit:cover;transition:transform .3s ease}.comp-blogs-grid__card:hover .comp-blogs-grid__image{transform:scale(1.05)}.comp-blogs-grid__image-placeholder{width:100%;height:100%;background:#f3f3f3;display:flex;align-items:center;justify-content:center}.comp-blogs-grid__content{padding:1rem 1.5rem 1.5rem}.comp-blogs-grid__title{font-size:17px;font-weight:600;margin:0 0 .5rem;line-height:1.4}.comp-blogs-grid__title a{color:#000;text-decoration:none;transition:color .3s ease}.comp-blogs-grid__title a:hover{color:#09bde3}.comp-blogs-grid__excerpt{color:#000;line-height:1.6;font-size:12px;font-weight:200;margin-bottom:.5rem}.comp-blogs-grid__details{display:flex;flex-direction:column;margin-bottom:.5rem}.comp-blogs-grid__author{font-size:13px}.comp-blogs-grid__date{font-size:12px;font-weight:300}.comp-blogs-grid__read-more{display:flex;align-items:center;gap:.5rem;font-weight:600;font-size:12px;color:#09bde3;text-decoration:none;transition:gap .3s ease}.comp-blogs-grid__read-more:hover{gap:.75rem}.comp-blogs-grid__mobile-nav{display:none;justify-content:center;align-items:center;gap:1rem;margin-left:auto}.comp-blogs-grid__nav-btn{width:40px;height:40px;border:1px solid #ddd;border-radius:50%;background:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .3s ease;border-color:#09bde3;color:#09bde3}.comp-blogs-grid__nav-btn:disabled{opacity:.5;cursor:not-allowed;border-color:#ddd;color:#ddd}.comp-blogs-grid__nav-btn:disabled:hover{background:#fff;border-color:#ddd;color:inherit}.comp-blogs-grid__nav-btn svg{width:20px;height:20px}@media screen and (max-width: 1024px){.comp-blogs-grid__container{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;scrollbar-width:none;gap:15px;padding:0 10px;margin:0 -10px}.comp-blogs-grid__container::-webkit-scrollbar{display:none}.comp-blogs-grid__card{flex:0 0 calc(33.333% - 10px);min-width:calc(33.333% - 10px);scroll-snap-align:start}.comp-blogs-grid__view-all{display:none}.comp-blogs-grid__mobile-nav{display:flex}.comp-blogs-grid__header{padding:0 10px}}@media screen and (max-width: 768px){.comp-blogs-grid__header{flex-direction:column;align-items:flex-start;margin-bottom:1rem;padding:0 15px}.comp-blogs-grid__heading{font-size:2rem}.comp-blogs-grid__container{padding:0 15px;margin:0 -15px;gap:12px}.comp-blogs-grid__card{flex:0 0 calc(50% - 6px);min-width:calc(50% - 6px)}.comp-blogs-grid__image-container{height:200px}.comp-blogs-grid__content{padding:1.25rem}}@media screen and (min-width: 1025px){.comp-blogs-grid__mobile-nav{display:none!important}.comp-blogs-grid__container{grid-template-columns:repeat(5,1fr);display:grid;overflow:visible}.comp-blogs-grid__view-all{display:flex}}@media screen and (min-width: 1920px){.comp-blogs-grid__container{gap:2rem}.comp-blogs-grid__image-container{height:280px}}
/*# sourceMappingURL=/cdn/shop/t/22/assets/comp-blogs-grid-styles.css.map */
