.blog__container{--size: 20px}.blog__tag-list{max-width:440px;width:100%;height:fit-content;display:flex;flex-wrap:wrap;gap:20px;transition:.3s ease}.blog__wrapper--portfolio .blog__tag-list{max-width:100%;justify-content:center}.tag__button{position:relative;padding:12px 20px;background:rgba(var(--color-shadow));border:none!important;color:rgba(var(--color-text));font-family:var(--font-heading-family);font-size:14px;font-style:normal;font-weight:700;line-height:normal;text-transform:uppercase;border-radius:var(--buttons-radius-outset);border:none;display:flex;align-items:center;gap:0;cursor:pointer;transition:.5s ease}.tag__button svg{width:0;height:16px;overflow:hidden;transition:width .3s ease}.tag__button--current{gap:15px;background-color:rgba(var(--color-button))!important;color:rgba(var(--color-shadow))!important}.tag__button--current svg{animation:title-star 5s ease-in-out infinite,newCurrentTag .3s ease forwards}@keyframes newCurrentTag{0%{width:0}to{width:16px}}@keyframes title-star{0%{transform:rotate(0)}80%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes showCurrentStylesStar{0%{width:0;height:0}to{width:16px;height:16px}}.tag__button--current.animation{animation:hideCurrentStylesBackground .3s ease forwards}@keyframes hideCurrentStylesBackground{0%{background:rgba(var(--color-accent-foreground));color:rgba(var(--color-button));gap:15px}to{background:rgba(var(--color-button));color:rgba(var(--color-button-text));gap:0}}.tag__button--current.animation:before{animation:hideCurrentStylesStar .3s ease forwards}@keyframes hideCurrentStylesStar{0%{width:16px;height:16px}to{width:0;height:0}}.blog__articles-grid{display:grid;grid-template-columns:repeat(2,1fr);grid-column-gap:20px;grid-row-gap:40px}.blog__wrapper--portfolio .blog__articles-grid{grid-template-columns:repeat(3,1fr);width:100%}.blog__list{display:grid;grid-template-columns:repeat(3,1fr);grid-column-gap:20px;grid-row-gap:40px}.blog__wrapper--portfolio .blog__list{display:flex;flex-direction:column;gap:var(--portfolio-list-gap-size)}.blog__wrapper--portfolio .blog__tag-list-container{grid-area:1 / 1 / 2 / 3}.blog__tag-list--button{padding:10px 20px}.blog__wrapper--portfolio .blog__tag-list{margin-bottom:20px}.article__container{opacity:0;transform:scale(.7);animation:showArticleContainer .3s ease forwards}@keyframes showArticleContainer{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}.blog__list.animation .article__container{animation:hideArticleContainer .3s ease forwards}@keyframes hideArticleContainer{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.7)}}.article__title-tag{margin-right:calc(10px + var(--portfolio-article-cta-icon-size))}.article__image img{aspect-ratio:440 / 300}.article__info{display:flex}.article__info *{color:#9d9d9d;font-size:12px}.blog__tag-list-button{padding:15px 20px;font-family:var(--font-heading-family);font-size:12px;font-style:normal;font-weight:700;line-height:normal;text-transform:uppercase;border-radius:var(--buttons-radius-outset);border:none;display:none;justify-content:space-between;align-items:center;gap:15px;background:rgba(var(--color-button));color:rgba(var(--color-button-text));cursor:pointer;transition:.3s ease}.blog__tag-list-button span{background:rgba(var(--color-button-text));width:18px;height:18px;border-radius:40px;transform:rotate(0);color:rgba(var(--color-button));transition:.3s ease;display:flex;align-items:center;justify-content:center}.blog__tag-list-button span svg{width:5px}.blog__tag-list-button.is-open{background:rgba(var(--color-shadow));color:rgba(var(--color-button))}.blog__tag-list-button.is-open span{color:rgba(var(--color-shadow));background:rgba(var(--color-button));transform:rotate(90deg)}.blog-list__pagination{width:100%;grid-area:2 / 1 / 3 / 3;margin-top:40px;opacity:0;transform:scale(.7);animation:showPagination .3s ease forwards}@keyframes showPagination{to{opacity:1;transform:scale(1)}}.blog-list__pagination.animation{animation:hidePagination .3s ease forwards}@keyframes hidePagination{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.7)}}.blog-list__pagination-container{display:flex;align-items:flex-end;justify-content:center;gap:20px}.pagination__item[disabled]{opacity:.5}.pagination__item{width:50px;height:50px;border-radius:var(--buttons-radius-outset);background-color:rgba(var(--color-shadow));font-family:var(--font-heading-family);font-size:14px;font-weight:700;border:none!important;transition:.5s ease}.pagination__item.animate--hover-background-elipse.button--solid:not([disabled]):not(:hover){color:rgb(var(--color-foreground))}.pagination__item--next,.pagination__item--previous{display:flex;align-items:center;justify-content:center}.pagination__item--next svg{transform:rotate(-90deg);height:7px}.pagination__item--previous svg{transform:rotate(90deg);height:7px}.pagination__item--current{color:rgba(var(--color-button));border:1px solid rgba(var(--color-button))!important;background:none}@media screen and (max-width:1100px){.blog__wrapper--portfolio .blog__articles-grid{grid-template-columns:repeat(2,1fr)}}@media screen and (max-width:749px){.blog__wrapper--portfolio .blog__list,.blog__list{display:flex;flex-direction:column;align-items:center;gap:20px}.blog__tag-list-container{position:relative;max-width:440px;width:100%}.blog__tag-list-button{width:100%;display:flex}.blog__wrapper--blog .blog__tag-list{margin-top:20px;gap:10px;max-height:0;z-index:1;overflow:hidden}.blog__wrapper--portfolio .blog__tag-list{justify-content:center}.tag__button{width:100%;justify-content:space-between;font-size:10px;padding:10px 15px}.tag__button--current{gap:10px}.tag__button:hover{transform:scale(1)}.tag__button--current.animation:after{animation:hideCurrentAfterStyles .3s ease forwards}@keyframes hideCurrentAfterStyles{0%{background-image:url(icon-pointer-current.svg);background-color:rgba(var(--color-button));background-size:5px}50%{background-size:0}to{background-size:5px;background-image:url(icon-pointer.svg);background-color:rgba(var(--color-accent-foreground))}}.blog-list__pagination{margin-top:40px}.blog-list__pagination-container{gap:8px}.pagination__item{width:35px;height:35px}.pagination__item svg{width:10px;height:10px}.article__info *{font-size:11px}.article__date{margin-right:10px}.article__reading-time{gap:10px}}@media screen and (max-width:550px){.blog__wrapper--portfolio .blog__articles-grid{grid-template-columns:repeat(1,1fr)}}
/*# sourceMappingURL=/cdn/shop/t/9/assets/section-blog.css.map */
