/* Current customer references: edge-to-edge screenshots within rounded cards. */
.project-card{border:1px solid #d8e2ec;border-radius:14px;background:#fff;overflow:hidden;transition:border-color .18s ease}
.project-card:hover,.project-card:focus-within{border-color:#9abdc3}
.project-card .project-preview{padding:0;border:0;border-radius:0;overflow:hidden;background:#f3f6f8;display:block}
.project-card .project-preview img{display:block;width:100%;height:auto;aspect-ratio:1.5;object-fit:cover;object-position:top;border:0;border-radius:0;box-shadow:none}
.project-card .card-body{padding:28px;display:flex;flex-direction:column;align-items:flex-start}
.project-card h3{font-size:1.35rem;font-weight:550;line-height:1.35;margin:0}
.project-card p{font-size:16px;color:#5d6c80;line-height:1.7;margin:16px 0 22px}
.project-card .project-type{font-size:14px;color:var(--petrol);margin-bottom:12px}
.project-card .card-link{font-size:15px;margin-top:auto}
.project-domain{font-size:14px;color:#5d6c80;margin-top:12px;overflow-wrap:anywhere}
.portfolio-section{padding-bottom:80px}
.portfolio-note{font-size:14px;color:#5d6c80;max-width:75ch;margin:34px 0 0}
.portfolio-filters{gap:8px}
.filter-button{font-size:14px;padding:12px 16px}
.portfolio-toolbar{align-items:flex-start}
.portfolio-count{padding-top:12px}

/* A real project collage replaces the decorative workspace photography. */
.client-showcase{position:relative;min-height:500px;isolation:isolate;padding:24px 0 110px}
.showcase-project{display:block;overflow:hidden;border-radius:13px;background:#fff;text-decoration:none;box-shadow:0 15px 35px #10265314}
.showcase-project img{display:block;width:100%;height:auto;aspect-ratio:1.44;object-fit:cover;object-position:top}
.showcase-project>span{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 16px;color:var(--navy);font-size:14px;overflow-wrap:anywhere}
.showcase-project .inline-icon{width:16px;height:16px}
.showcase-project-0{width:85%;margin-left:10%;transform:rotate(1.5deg)}
.showcase-project-1,.showcase-project-2{position:absolute;width:44%;bottom:0;z-index:1}
.showcase-project-1{left:0;transform:rotate(-3deg)}
.showcase-project-2{right:0;transform:rotate(3deg)}
.design-showcase{min-height:480px}
.person-avatar{width:46px;height:46px;flex-shrink:0;display:inline-grid;place-items:center;border-radius:50%;background:#dfeaf3;color:var(--navy);font-size:15px;font-weight:550;letter-spacing:-.02em}
.portrait-panel .portrait-monogram{display:grid;place-items:center;width:170px;height:170px;margin-bottom:26px;border-radius:50%;background:#fff;color:var(--navy);font-size:57px;font-weight:400;letter-spacing:-.04em}
.contact-avatar{width:72px;height:72px;font-size:24px;background:#fff;margin-bottom:24px}

/* Manual, keyboard-accessible customer slider; no automatic motion. */
.client-track{display:flex;gap:18px;list-style:none;margin:0;padding:5px 3px 18px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:3px;overscroll-behavior-inline:contain;scrollbar-width:thin;scrollbar-color:#b5cad6 transparent}
.client-track>li{flex:0 0 calc((100% - 72px)/5);min-width:0;scroll-snap-align:start}
.client-tile{display:flex;flex-direction:column;align-items:center;height:100%;min-height:240px;padding:26px 18px;text-align:center;background:#fff;border:1px solid var(--line);border-radius:13px;text-decoration:none;color:var(--navy)}
.client-tile:hover{border-color:#9abdc3;background:#f8fbfd}
.client-tile img{width:76px;height:76px;margin-bottom:20px}
.client-tile h3{font-size:17px;font-weight:550;line-height:1.45;margin:0 0 11px;letter-spacing:-.01em}
.client-tile>span{font-size:14px;color:#5d6c80;overflow-wrap:anywhere;margin-top:auto}
.slider-footer{display:flex;align-items:center;justify-content:space-between;gap:25px;margin-top:20px}
.slider-footer>p{font-size:14px;color:#5d6c80;margin:0}
.slider-controls{display:flex;align-items:center;gap:12px}
.slider-position{font-size:14px;color:#5d6c80;margin-right:8px;min-width:82px;text-align:right}
.slider-button{display:grid;place-items:center;width:46px;height:46px;border:1px solid #cbd9e5;border-radius:7px;background:#fff;color:var(--navy);flex-shrink:0}
.slider-button:hover:not(:disabled){border-color:var(--petrol);color:var(--petrol)}
.slider-button:disabled{opacity:.4;cursor:default}
@media(max-width:1199px){.client-track>li{flex-basis:calc((100% - 54px)/4)}.portfolio-toolbar{flex-wrap:wrap}.client-showcase{min-height:450px}}
@media(max-width:991px){.client-track>li{flex-basis:calc((100% - 36px)/3)}.client-showcase{max-width:650px;margin-inline:auto;min-height:500px}.design-showcase{margin-top:15px}}
@media(max-width:575px){.project-card .card-body{padding:24px}.project-card .project-preview img{aspect-ratio:1.44}.client-track{gap:14px}.client-track>li{flex-basis:calc((100% - 14px)/2)}.client-tile{padding:22px 12px;min-height:250px}.client-tile img{width:64px;height:64px}.client-tile h3{font-size:16px}.slider-footer{align-items:flex-start;flex-direction:column;gap:18px}.slider-controls{align-self:flex-end}.client-showcase{padding-top:12px;padding-bottom:65px;min-height:335px}.showcase-project-0{width:91%;margin-left:5%}.showcase-project-1,.showcase-project-2{width:46%}.showcase-project>span{padding:10px;font-size:14px}.showcase-project-1>span,.showcase-project-2>span{font-size:14px;padding:10px 8px}.showcase-project-1 .inline-icon,.showcase-project-2 .inline-icon{display:none}.design-showcase{min-height:340px}.portfolio-section{padding-bottom:55px}}
@media(max-width:360px){.client-showcase{min-height:300px}.showcase-project-1,.showcase-project-2{width:47%}.client-tile{min-height:260px}.client-tile h3{font-size:15px}}