/* Sadek-IT — pages/portfolio.css */
.filterbar{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 30px}
.filterbar button{background:#0b1624;border:1px solid var(--line);color:#aabbd1;border-radius:30px;padding:9px 18px;font-size:.87rem}
.filterbar button[aria-pressed=true]{background:#173964;color:#e6f2ff;border-color:#3c79b9}
.portfolio-toolbar{display:flex;align-items:start;justify-content:space-between;gap:25px}
.filterbar{margin-bottom:45px}
.filterbar button{font-size:.87rem;min-height:44px;padding:9px 20px;transition:background .2s,border-color .2s,color .2s}
.filterbar button:hover{border-color:#6095b5;color:white}
.project-count{white-space:nowrap;font-size:.8rem;margin-top:12px}
.portfolio-grid{gap:46px 28px}
.case-study{border-radius:14px;overflow:hidden;min-width:0;display:flex;flex-direction:column;background:#0c1522}
.case-study .case-visual{display:block;position:relative;overflow:hidden;min-width:0}
.case-study .browserbar{height:35px}
.case-study .browser img{aspect-ratio:1.47;object-fit:cover}
.case-study .projectbody{padding:30px;flex:1;display:flex;flex-direction:column}
.case-study h3{font-size:2rem;margin:12px 0 26px}
.case-study p{min-height:0}
.case-story{margin:0;display:grid;gap:19px}
.case-story>div{display:grid;grid-template-columns:64px 1fr;gap:16px}
.case-story dt{font-size:.75rem;color:#64deec;padding-top:2px}
.case-story dd{margin:0;color:#b7c6d9;font-size:.91rem;line-height:1.65}
.case-study .more{margin-top:auto;min-height:48px;padding-top:18px;transition:color .2s}
.case-study .more:hover{color:#64deec}
.portfolio-grid .case-lead,.portfolio-grid .case-advanced{grid-column:1/-1;display:grid;grid-template-columns:1.35fr 1fr;align-items:stretch}
.portfolio-grid .case-lead .browser img,.portfolio-grid .case-advanced .browser img{aspect-ratio:1.42;object-fit:cover}
.portfolio-grid .case-lead .case-visual,.portfolio-grid .case-advanced .case-visual{display:flex;align-items:center;background:#111e2f;padding:24px}
.portfolio-grid .case-lead .browser,.portfolio-grid .case-advanced .browser{border:1px solid #38506c;border-radius:9px;width:100%}
.portfolio-grid .case-lead .projectbody,.portfolio-grid .case-advanced .projectbody{padding:36px}
.portfolio-grid .case-advanced{background:#0b1828;border-color:#304d71}
.portfolio-grid .case-advanced .case-visual{background:#0c1e32}
.portfolio-note{font-size:.84rem;margin:40px 0 0;padding-top:24px;border-top:1px solid #27374b;max-width:850px}
.after-project{display:grid;grid-template-columns:1fr 1fr;gap:20px 80px}
.after-project>.eyebrow{grid-column:1/-1}
.after-project-lines>div{padding:22px 0;border-top:1px solid #2c405a}
.after-project-lines strong{font-size:1.05rem}
.after-project-lines p{font-size:.9rem;margin:8px 0 0}
@media (max-width:1050px){.portfolio-grid .case-lead,.portfolio-grid .case-advanced{grid-template-columns:1.2fr 1fr}}
@media (max-width:1050px){.case-story>div{display:block}}
@media (max-width:1050px){.case-story dt{margin-bottom:7px}}
@media (max-width:1050px){.portfolio-grid .case-lead .projectbody,.portfolio-grid .case-advanced .projectbody{padding:27px}}
@media (max-width:800px){.portfolio-grid .case-lead,.portfolio-grid .case-advanced{display:flex;grid-column:1/-1}}
@media (max-width:800px){.portfolio-grid .case-lead .case-visual,.portfolio-grid .case-advanced .case-visual{padding:0}}
@media (max-width:800px){.portfolio-grid .case-lead .browser,.portfolio-grid .case-advanced .browser{border:0;border-radius:0}}
@media (max-width:800px){.after-project{grid-template-columns:1fr;gap:12px}}
@media (max-width:800px){.portfolio-toolbar{display:block}}
@media (max-width:800px){.project-count{margin:-20px 0 28px}}
@media (max-width:520px){.case-study .projectbody,.portfolio-grid .case-lead .projectbody,.portfolio-grid .case-advanced .projectbody{padding:25px}}
@media (max-width:520px){.case-story>div{display:block}}
@media (max-width:520px){.case-story dd{font-size:.9rem}}
@media (max-width:520px){.case-study h3{font-size:1.9rem}}
@media (max-width:520px){.portfolio-grid{gap:30px}}
@media (max-width:520px){.filterbar{gap:8px}}
@media (max-width:520px){.filterbar button{font-size:.8rem;padding:9px 13px}}
.case-study .projectbody>p{font-size:.92rem;line-height:1.75}
.case-study .projectbody{display:flex;flex-direction:column}
.case-study .projectbody>.tags{margin:24px 0}
.case-study .projectbody>.more{margin-top:auto;color:var(--cyan);border-color:#375663;padding:15px 0}
.case-study .project-disclosure{padding:12px 15px;border-left:2px solid var(--cyan);background:#10232a;color:#bfdae0;font-size:.82rem}
.filterbar button{min-height:44px}
.filterbar button[aria-pressed=true]{background:var(--cyan);border-color:var(--cyan);color:#06242b}
.portfolio-toolbar{align-items:flex-start;gap:20px}
.filterbar{flex-wrap:wrap}
.project-count{flex-shrink:0}
@media (max-width:800px){.portfolio-grid{grid-template-columns:1fr}}
.case-study[data-project=gustopizza] .browser img{aspect-ratio:1.6;object-position:top}
.case-study[data-project=amijolie] .browser img{aspect-ratio:1.9}
.case-study[data-project=naomra] .browser img{aspect-ratio:1.95}
.case-study[data-project=baytzawaj] .browser img{aspect-ratio:1.55}
.case-study[data-project=portfolio] h3{font-size:1.8rem}
.case-study h3{line-height:1.25;font-size:2rem}
.case-study .projectbody>p{font-size:.98rem}
.case-story dd{font-size:.94rem}
.case-study .tags{gap:7px}
.case-study .more{min-height:48px}
.case-study .external-label{font-size:.71rem}
@media (max-width:520px){.case-study h3{font-size:1.8rem}}
@media (max-width:520px){.case-study .projectbody{padding:22px}}
@media (max-width:520px){.case-study[data-project=portfolio] h3{font-size:1.6rem}}