:root{
    --zaks-primary:#08AAA9;
    --zaks-primary-hover:#078F8F;
    --zaks-navy:#14232B;
    --zaks-bg:#F5F7F8;
    --zaks-card:#FFFFFF;
    --zaks-text:#4F5C63;
    --zaks-muted:#849097;
    --zaks-border:#E1E6E8;
    --zaks-radius:14px;
    --zaks-gap:22px;
    --zaks-image-height:250px;
    --zaks-gallery-height:220px;
    --zaks-hero-height:560px;
}

.zaks-projects{
    background:var(--zaks-bg);
    color:var(--zaks-navy);
    padding:48px 20px 70px;
}
.zaks-projects-inner{
    max-width:1180px;
    margin:0 auto;
}
.zaks-projects-heading{
    max-width:800px;
    margin:0 auto 28px;
    text-align:center;
}
.zaks-projects-kicker{
    color:var(--zaks-primary);
    font-size:13px;
    font-weight:800;
    letter-spacing:3px;
    text-transform:uppercase;
    margin-bottom:9px;
}
.zaks-projects-heading h2{
    margin:0 0 10px;
    color:var(--zaks-navy);
    font-size:clamp(30px,4vw,46px);
    line-height:1.08;
    font-weight:800;
    letter-spacing:1.4px;
    text-transform:uppercase;
}
.zaks-projects-heading p{
    margin:0;
    color:var(--zaks-muted);
    font-size:15px;
    line-height:1.6;
}
.zaks-projects-summary{
    text-align:center;
    color:var(--zaks-muted);
    font-size:12px;
    margin-bottom:22px;
}
.zaks-project-filters{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    justify-content:center;
    margin:0 auto 28px;
}
.zaks-project-filter{
    appearance:none;
    border:1px solid var(--zaks-border);
    background:#fff;
    color:var(--zaks-navy);
    padding:9px 14px;
    border-radius:999px;
    font:inherit;
    font-size:12px;
    font-weight:800;
    cursor:pointer;
    transition:.18s ease;
}
.zaks-project-filter:hover,
.zaks-project-filter.is-active{
    background:var(--zaks-primary);
    border-color:var(--zaks-primary);
    color:#fff;
}
.zaks-project-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:var(--zaks-gap);
}
.zaks-project-card{
    min-width:0;
    overflow:hidden;
    background:var(--zaks-card);
    border-radius:var(--zaks-radius);
    box-shadow:0 8px 25px rgba(20,35,43,.13);
    transition:transform .2s ease,box-shadow .2s ease;
}
.zaks-project-card:hover{
    transform:translateY(-3px);
    box-shadow:0 14px 32px rgba(20,35,43,.18);
}
.zaks-project-card-image{
    display:block;
    height:var(--zaks-image-height);
    overflow:hidden;
    background:#e9edef;
}
.zaks-project-card-image img{
    display:block!important;
    width:100%!important;
    height:100%!important;
    max-width:none!important;
    object-fit:cover!important;
    object-position:center!important;
}
.zaks-project-no-image{
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:100%;
    color:var(--zaks-muted);
    font-size:12px;
}
.zaks-project-card-body{
    padding:19px 20px 21px;
}
.zaks-project-card-meta{
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    color:var(--zaks-muted);
    font-size:11px;
    margin-bottom:7px;
}
.zaks-project-card h3{
    margin:0 0 8px;
    color:var(--zaks-navy);
    font-size:20px;
    line-height:1.25;
    font-weight:800;
}
.zaks-project-quantity{
    display:inline-flex;
    padding:5px 8px;
    margin-bottom:10px;
    border-radius:999px;
    background:#f0f2f3;
    color:#647077;
    font-size:11px;
    font-weight:700;
}
.zaks-project-card p{
    margin:0 0 15px;
    color:var(--zaks-text);
    font-size:13px;
    line-height:1.62;
}
.zaks-project-card-link{
    color:var(--zaks-primary)!important;
    text-decoration:none!important;
    font-size:12px;
    font-weight:800;
    letter-spacing:.65px;
}
.zaks-project-card-link:hover{
    color:var(--zaks-primary-hover)!important;
}
.zaks-projects-empty{
    grid-column:1/-1;
    text-align:center;
    padding:40px 20px;
    background:#fff;
    border-radius:var(--zaks-radius);
    color:var(--zaks-muted);
}

.zaks-project-single{
    max-width:1180px;
    margin:0 auto;
    padding:45px 20px 70px;
    color:var(--zaks-navy);
}
.zaks-project-back{
    color:var(--zaks-primary)!important;
    text-decoration:none!important;
    font-size:12px;
    font-weight:800;
    letter-spacing:.5px;
}
.zaks-project-single-head{
    margin:18px 0 26px;
}
.zaks-project-single-head h1{
    margin:9px 0 10px;
    color:var(--zaks-navy);
    font-size:clamp(34px,5vw,58px);
    line-height:1.04;
    font-weight:800;
}
.zaks-project-single-sub{
    margin:0;
    max-width:850px;
    color:var(--zaks-muted);
    font-size:16px;
    line-height:1.7;
}
.zaks-project-main-image{
    height:min(58vw,var(--zaks-hero-height));
    min-height:280px;
    overflow:hidden;
    border-radius:var(--zaks-radius);
    box-shadow:0 10px 30px rgba(20,35,43,.13);
    background:#e9edef;
    margin:0 0 28px;
}
.zaks-project-main-image img{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    display:block!important;
}
.zaks-project-details{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:42px;
    margin:0 0 34px;
}
.zaks-project-detail{
    min-width:0;
    padding:0;
    background:transparent;
    border:0;
    border-radius:0;
    box-shadow:none;
    display:block;
}
.zaks-project-detail small{
    display:block;
    margin:0 0 7px;
    color:var(--zaks-muted);
    font-size:10px;
    font-weight:800;
    letter-spacing:1.5px;
    text-transform:uppercase;
}
.zaks-project-detail strong{
    display:block;
    color:var(--zaks-navy);
    font-size:16px;
    line-height:1.25;
    font-weight:800;
}
.zaks-project-detail-quantity strong span{
    color:var(--zaks-primary);
    font-size:.9em;
    font-weight:800;
}
.zaks-project-section-title{
    margin:38px 0 16px;
    color:var(--zaks-navy);
    font-size:26px;
    line-height:1.15;
    text-transform:uppercase;
    letter-spacing:1px;
}
.zaks-project-description{
    max-width:900px;
    color:var(--zaks-text);
    font-size:15px;
    line-height:1.8;
    white-space:pre-line;
}.zaks-before-after{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:20px;
}
.zaks-ba-item{
    position:relative;
    overflow:hidden;
    border-radius:12px;
    background:#e9edef;
    box-shadow:0 8px 24px rgba(20,35,43,.11);
}
.zaks-ba-item img{
    display:block!important;
    width:100%!important;
    height:420px!important;
    object-fit:cover!important;
}
.zaks-ba-label{
    position:absolute;
    left:12px;
    top:12px;
    background:var(--zaks-primary);
    color:#fff;
    padding:7px 10px;
    border-radius:5px;
    font-size:10px;
    font-weight:800;
    letter-spacing:1px;
}
.zaks-project-gallery{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:12px;
}
.zaks-gallery-item{
    display:block;
    height:var(--zaks-gallery-height);
    overflow:hidden;
    border-radius:10px;
    background:#e9edef;
}
.zaks-gallery-item img{
    display:block!important;
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    transition:transform .2s ease;
}
.zaks-gallery-item:hover img{
    transform:scale(1.03);
}
.zaks-project-lightbox{
    position:fixed;
    inset:0;
    display:none;
    align-items:center;
    justify-content:center;
    z-index:999999;
    background:rgba(10,17,21,.93);
    padding:25px;
}
.zaks-project-lightbox.is-open{display:flex}
.zaks-project-lightbox img{
    display:block;
    max-width:92vw;
    max-height:88vh;
    object-fit:contain;
}
.zaks-lightbox-close,
.zaks-lightbox-prev,
.zaks-lightbox-next{
    position:absolute;
    color:#fff;
    cursor:pointer;
    user-select:none;
}
.zaks-lightbox-close{
    top:10px;
    right:22px;
    font-size:42px;
}
.zaks-lightbox-prev,
.zaks-lightbox-next{
    top:50%;
    transform:translateY(-50%);
    padding:18px;
    font-size:46px;
}
.zaks-lightbox-prev{left:5px}
.zaks-lightbox-next{right:5px}

@media (max-width: 900px){
    .zaks-project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .zaks-project-details{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width: 620px){
    .zaks-projects{padding:32px 14px 50px}
    .zaks-project-grid{grid-template-columns:1fr}
    .zaks-project-single{padding:32px 14px 50px}
    .zaks-project-single-head h1{font-size:34px}
    .zaks-project-details{grid-template-columns:1fr 1fr}
    .zaks-before-after{grid-template-columns:1fr}
    .zaks-ba-item img{height:300px!important}
    .zaks-project-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}
    .zaks-gallery-item{height:150px}
}

@media(max-width:620px){.zaks-project-details-clean{grid-template-columns:1fr}}

.zaks-project-work-block{
    margin:0 0 30px;
    padding:24px 26px 26px;
    background:#fff;
    border:1px solid var(--zaks-border);
    border-radius:14px;
    box-shadow:0 7px 22px rgba(20,35,43,.06);
}
.zaks-project-section-eyebrow{
    margin:0 0 6px;
    color:var(--zaks-primary);
    font-size:10px;
    font-weight:800;
    letter-spacing:2px;
    text-transform:uppercase;
}
.zaks-project-work-title{
    margin:0 0 17px;
    color:var(--zaks-navy);
    font-size:24px;
    line-height:1.15;
    font-weight:800;
    letter-spacing:.8px;
}
.zaks-project-work-list{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px 16px;
}
.zaks-project-work-item{
    display:flex;
    align-items:flex-start;
    gap:10px;
    padding:12px 13px;
    background:#f8fafb;
    border:1px solid #edf0f1;
    border-radius:10px;
    color:var(--zaks-text);
    font-size:14px;
    line-height:1.45;
}
.zaks-project-work-icon{
    display:flex;
    align-items:center;
    justify-content:center;
    width:22px;
    height:22px;
    min-width:22px;
    border-radius:50%;
    background:var(--zaks-primary);
    color:#fff;
    font-size:12px;
    font-weight:800;
    margin-top:1px;
}@media(max-width:900px){
    .zaks-project-details{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:700px){
    .zaks-project-work-list{grid-template-columns:1fr}
}
@media(max-width:620px){
    .zaks-project-details{grid-template-columns:1fr}
}

.zaks-project-work-block{margin-top:4px}
.zaks-project-work-title{margin-bottom:15px}