.main-scriptorium-container{display:flex;position:relative;flex-direction:column;align-items:center;justify-content:center;width:100%;height:auto;margin:var(--space-64) 0;padding:var(--space-32);gap:var(--space-72)}.article-container{display:flex;justify-content:left;flex-direction:column;height:auto}.article-card-container{display:grid;grid-template-columns:repeat(4,1fr);grid-gap:var(--space-16);grid-template-rows:auto;width:100%;height:auto}.article-filter-container{display:flex;align-items:center;flex-direction:column;height:45rem;width:100%;background-color:var(--color-4);padding:var(--space-32);gap:var(--space-24);border-radius:var(--border-radius-large)}.article-filter-text{width:100%;height:auto;display:flex;justify-content:center;align-items:center}.article-filter-text h3{font-size:var(--typo-size-32);font-weight:var(--typo-weight-semi-bold);color:var(--color-2);margin:0}.article-filter-item-container{display:grid;width:100%;height:100%;grid-template-columns:repeat(2,1fr);grid-gap:var(--space-8);gap:var(--space-8);grid-template-rows:auto}.article-filter-item-container-btn{background-color:var(--color-3);border:none;border-radius:var(--border-radius-medium);transition:background-color var(--motion-small-2) var(--power-2-out),color var(--motion-small-2) var(--power-2-out);cursor:pointer}.article-filter-item-container-btn:hover{background-color:var(--color-1)}.article-filter-item-container-btn:hover h5{color:var(--color-5)}.article-filter-item-container-btn.active{background-color:var(--color-1)}.article-filter-item-container-btn.active h5{color:var(--color-5)}.article-filter-item-container h5{font-size:var(--typo-size-16);font-weight:var(--typo-weight-medium);color:var(--color-1);margin:0}.script-article{display:flex;position:relative;flex-direction:column;align-items:center;justify-content:center;border-radius:var(--border-radius-small);min-height:45rem;background-color:var(--color-4);transition:box-shadow var(--motion-medium-2) var(--power-2-out),background-color var(--motion-medium-2) var(--power-2-out),transform var(--motion-medium-2) var(--power-2-out)}.script-article:hover{box-shadow:var(--shadow-large);background-color:var(--color-1)}.script-article:hover .script-article-info h4,.script-article:hover .script-article-info p{color:var(--color-4)}.script-article:hover .script-article-tags-icon svg path{stroke:var(--color-4);fill:var(--color-4)}.script-article:hover .script-article-tags button{background-color:var(--color-4)}.script-article:hover .script-article-tags button h4{color:var(--color-2)}.script-article.reverse{flex-direction:column-reverse}.script-article.reverse .script-article-img{align-items:flex-end;align-content:flex-end}.script-article-img{display:flex;align-items:flex-start;align-content:flex-start;position:relative;flex-wrap:wrap;width:100%;height:50%;overflow:hidden;border-radius:var(--border-radius-small);padding:var(--space-24);gap:var(--space-8);z-index:1}.script-article-img img{object-fit:cover;z-index:5}.script-article-img img,.script-article-img:before{width:100%;height:100%;position:absolute;top:0;left:0}.script-article-img:before{content:"";background-color:rgba(0,0,0,.25);z-index:10}.script-article-img span{background-color:var(--color-1);padding:var(--space-8) var(--space-16);height:auto;border-radius:100px;z-index:15}.script-article-img h4{font-size:var(--typo-size-14);font-weight:var(--typo-weight-medium);color:var(--color-4);margin:0}.script-article-info{width:100%;height:50%;display:flex;flex-direction:column;align-items:left;text-align:left;padding:var(--space-24);z-index:1}.script-article-info h3{font-size:var(--typo-size-24);font-weight:var(--typo-weight-semi-bold);color:var(--color-2);margin:0;margin-bottom:var(--space-8);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal}.script-article-info h4{font-size:var(--typo-size-16);font-weight:var(--typo-weight-regular);font-family:var(--font-body);margin-bottom:var(--space-16)}.script-article-info h4,.script-article-info p{color:var(--font-middle);transition:color var(--motion-large-1) var(--power-1-out)}.script-article-info p{font-size:var(--typo-size-14);font-family:var(--font-body),monospace;margin:0;display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;white-space:normal}.script-article-tags{width:100%;display:flex;justify-content:flex-start;align-items:center;margin-top:auto}.script-article-tags-icon{display:flex;align-items:center;width:50%;gap:var(--space-8)}.script-article-tags-icon h4{font-size:var(--typo-size-16);margin:0;color:var(--color-1)}.script-article-tags-icon svg{height:var(--typo-size-16);width:var(--typo-size-16)}.script-article-tags-icon svg path{stroke:var(--color-1);fill:var(--color-1);transition:fill var(--motion-medium-2) var(--power-2-out),stroke var(--motion-medium-2) var(--power-2-out)}.script-article-tags button{width:50%;height:100%;position:relative;padding:var(--space-16) var(--space-24);border:none;background-color:var(--color-1);border-radius:var(--border-radius-small);transition:background-color var(--motion-medium-2) var(--power-2-out),color var(--motion-medium-2) var(--power-2-out);cursor:pointer}.script-article-tags button a{position:absolute;top:0;left:0;width:100%;height:100%;z-index:10}.script-article-tags button h4{margin:0;font-size:var(--typo-size-16);font-weight:var(--typo-weight-regular);font-family:var(--font-display);color:var(--color-2)}@media (max-width:1500px){.article-card-container{grid-template-columns:repeat(2,1fr)}}@media (max-width:750px){.article-card-container{grid-template-columns:repeat(1,1fr)}}