.main-case-studies{padding-bottom:7.5rem}
.main-case-studies .container{max-width:1048px}
.main-case-studies .hero{padding:3.25rem 0;text-align:center;background-color:var(--color-bg-dark-100)}
.main-case-studies .hero h1{font-size:var(--font-size-5xl);font-weight:700;margin-bottom:.5rem}
.main-case-studies .hero p{color:var(--color-text-200);display:block;max-width:684px;margin:0 auto;font-size:var(--font-size-lg)}
.main-case-studies .filters{display:-webkit-box;display:-ms-flexbox;display:flex;gap:1.5rem;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-top:3.75rem;margin-bottom:2.25rem;-webkit-box-pack:start;-ms-flex-pack:start;justify-content:flex-start}
.main-case-studies .filter-btn{background:var(--color-bg-dark-200);border:none;color:var(--color-text-200);padding:0.5rem 1rem;border-radius:2rem;cursor:pointer;font-size:var(--font-size-md);-webkit-transition:all 0.3s;transition:all 0.3s;font-weight:700}
.main-case-studies .filter-btn.active{background:var(--color-primary);color:var(--color-bg-dark-100)}
.main-case-studies .filter-btn:hover{border-color:var(--color-primary)}
.main-case-studies .case-studies-grid{display:grid;grid-template-columns:repeat(var(--grid-columns),1fr);gap:var(--grid-gap-blog);margin-bottom:4rem}
.main-case-studies .case-studies-card{grid-column:span 6;background:var(--color-bg-dark-100);border-radius:0.75rem;overflow:hidden;-webkit-transition:-webkit-transform 0.3s;transition:-webkit-transform 0.3s;transition:transform 0.3s;transition:transform 0.3s,-webkit-transform 0.3s;text-decoration:none;display:block;-webkit-transition:0.4s;transition:0.4s;position:relative}
.main-case-studies .case-studies-card:hover{-webkit-filter:var(--filter-shadow-100);filter:var(--filter-shadow-100)}
.main-case-studies .case-studies-card:hover .case-studies-card-image img{-webkit-filter:brightness(0.25);filter:brightness(0.25)}
.main-case-studies .case-studies-name{position:absolute;left:.75rem;top:1rem;background-color:var(--color-bg-dark-200);border:solid 1px var(--color-border-100);color:var(--color-primary);padding:.75rem;border-radius:12px;opacity:1;z-index:1;-webkit-transition:0.4s;transition:0.4s}
.main-case-studies .case-studies-card:hover .case-studies-card-image .case-studies-card-btn{opacity:1}.main-case-studies .case-studies-card:hover .case-studies-name{-webkit-filter:brightness(0.3);filter:brightness(0.3)}
.main-case-studies .case-studies-card-btn{position:absolute;left:50%;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);opacity:0;z-index:1;-webkit-transition:0.4s;transition:0.4s}
.main-case-studies .case-studies-card-image{width:100%;height:396px;background:var(--color-border-100);position:relative;overflow:hidden}
.main-case-studies .case-studies-card-image img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;-webkit-transition:0.4s;transition:0.4s}
.main-case-studies .case-studies-card-content{padding:1.5rem}
.main-case-studies .case-studies-title{font-size:var(--font-size-1xl);font-weight:700;color:var(--color-text-100);margin-bottom:0.75rem;line-height:1.4}
.main-case-studies .case-studies-description{font-size:var(--font-size-md);color:var(--color-text-200);margin-bottom:1.25rem}
.main-case-studies .case-studies-tags{display:flex;flex-wrap:wrap;gap:1.5rem}
.main-case-studies .case-studies-tag{display:inline-block;background:transparent;border:1px solid var(--color-primary);color:var(--color-primary);padding:0.125rem 0.5rem;border-radius:2rem;font-size:var(--font-size-md);font-weight:700}
.main-case-studies .load-more{text-align:center}
.main-case-studies .btn-load-more{background:transparent;border:1px solid var(--color-primary);color:var(--color-primary);padding:0.875rem 2.5rem;border-radius:0.5rem;font-size:var(--font-size-base);font-weight:600;cursor:pointer;-webkit-transition:all 0.3s;transition:all 0.3s}
.main-case-studies .btn-load-more:hover{background:var(--color-primary);color:var(--color-bg-dark-100)}
.main-case-studies .case-studies-pagination{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;gap:0.5rem;margin-top:3rem}
.main-case-studies .case-studies-pagination ul{display:-webkit-box;display:-ms-flexbox;display:flex;gap:0.5rem;list-style:none;-webkit-box-align:center;-ms-flex-align:center;align-items:center}
.main-case-studies .case-studies-pagination a,
.main-case-studies .case-studies-pagination span{display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;min-width:2.5rem;height:2.5rem;padding:0.5rem 0.75rem;background:var(--color-bg-dark-200);color:var(--color-text-200);border:1px solid var(--color-border-100);border-radius:6px;font-weight:700;font-size:var(--font-size-md);text-decoration:none;-webkit-transition:all 0.3s;transition:all 0.3s;cursor:pointer}
.main-case-studies .case-studies-pagination a:hover{background:var(--color-primary);color:var(--color-bg-dark-100);border-color:var(--color-primary)}
.main-case-studies .case-studies-pagination .active span{background:var(--color-primary);color:var(--color-bg-dark-100);border-color:var(--color-primary)}
.main-case-studies .case-studies-pagination .disabled span{opacity:0.5;cursor:not-allowed}
.main-case-studies .case-studies-pagination .disabled span:hover{background:var(--color-bg-dark-200);color:var(--color-text-200);border-color:var(--color-border-100)}
@media (max-width:1024px){.main-case-studies .case-studies-card{grid-column:span 6}}
@media (max-width:768px){.main-case-studies .case-studies-card{grid-column:span 12}.main-case-studies .hero h1{font-size:3rem}}
@media (max-width:480px){.main-case-studies .filter-btn{padding:0.375rem 1rem}}