/* Branding page only: design process and a physical identity gallery. */
.branding-fit{gap:30px 56px;padding-bottom:85px}
.branding-fit>.lead{max-width:640px;margin:0;align-self:center}
.branding-process{grid-column:1/-1;margin:12px 0 0;min-width:0}
.brand-process-panels{display:grid;grid-template-columns:1fr 1.15fr;grid-template-rows:230px 230px;overflow:hidden;border-radius:6px;border:1px solid #dedfd6}
.brand-process-stage{position:relative;min-width:0;display:flex;align-items:center;justify-content:center;padding:30px;overflow:hidden}
.brand-process-stage>p{position:absolute;left:28px;top:22px;margin:0;display:flex;align-items:center;gap:12px;font-size:13px;font-weight:600;line-height:1.4;z-index:1}
.brand-process-stage>p span{font-size:11px;font-weight:500;letter-spacing:.08em}
.brand-process-stage img{display:block;width:166px;height:170px;object-fit:contain;margin-top:22px;max-width:90%}
.brand-process-explore{background:#183238;color:#fff}
.brand-process-construct{grid-column:1;grid-row:2;background:#233f43;color:#fff;border-top:1px solid #486163}
.brand-process-final{grid-column:2;grid-row:1/3;background:#e4ecb9;color:#232321}
.brand-process-final img{width:280px;height:287px;max-width:80%;margin-top:15px}
.branding-process figcaption{display:flex;justify-content:space-between;align-items:baseline;gap:20px;padding-top:14px;font-size:13px;line-height:1.5;color:#41443a}
.branding-process figcaption>span{font-weight:500}
.branding-process figcaption small{font-size:11px;line-height:1.5;color:#5b5f53}
.branding-projects .section-heading{margin-bottom:34px}
.branding-projects .service-project-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:42px 28px}
.branding-project-card{min-width:0}
.branding-mockup{display:block;width:100%;aspect-ratio:3/2;background:#eeeae1;border-radius:5px;overflow:hidden}
.branding-mockup img{display:block;width:100%;height:100%;max-width:none;object-fit:cover;object-position:center}
.branding-projects .project-meta{align-items:flex-start;padding-top:18px}
.branding-projects .project-meta h3{font-size:26px;line-height:1.2;letter-spacing:-.035em;margin:5px 0 0}
.branding-projects .project-meta p{font-size:13px!important;line-height:1.5;color:#50504a}
.branding-projects .project-status{font-size:11px!important;max-width:100%;line-height:1.5;margin-top:10px}
.branding-project-card:focus-visible{outline:3px solid #1d7160;outline-offset:6px;border-radius:5px}
.branding-project-card:hover .branding-mockup{outline:1px solid #b0b8a0;outline-offset:-1px}
.branding-projects>.scope-note{font-size:12px;line-height:1.6;color:#55574c;margin-top:30px}
@media(max-width:900px){
 .branding-fit{gap:26px}
 .brand-process-panels{grid-template-rows:210px 210px}
 .brand-process-stage{padding:24px}
 .brand-process-stage>p{left:22px;top:20px}
 .brand-process-stage img{width:145px;height:148px;margin-top:22px}
 .brand-process-final img{width:230px;height:236px}
 .branding-projects .service-project-grid{gap:35px 22px}
 .branding-projects .project-meta h3{font-size:24px}
}
@media(max-width:700px){
 .branding-fit{grid-template-columns:1fr;padding-bottom:55px;gap:22px}
 .branding-process{margin-top:4px}
 .brand-process-panels{grid-template-columns:1fr 1fr;grid-template-rows:auto auto}
 .brand-process-stage{padding:50px 12px 20px;min-height:215px;align-items:center}
 .brand-process-stage>p{left:15px;top:18px;gap:8px;font-size:12px}
 .brand-process-stage img{width:126px;height:129px;margin:0;max-width:100%}
 .brand-process-construct{grid-column:2;grid-row:1;border-top:0;border-left:1px solid #486163}
 .brand-process-final{grid-column:1/-1;grid-row:2;min-height:300px}
 .brand-process-final img{width:206px;height:211px;max-width:75%;margin-top:10px}
 .branding-process figcaption{flex-direction:column;gap:5px;padding-top:12px}
 .branding-projects .service-project-grid{grid-template-columns:1fr;gap:34px}
 .branding-projects .project-meta h3{font-size:24px}
 .branding-projects .project-meta{padding-top:15px}
}
