/* HBC case study — V5 CSS isolation, without changes to shared header/footer rules. */
body.hbc-case-study{--cyan:#18C2DC;--cyan-d:#0FA3BF;--cyan-l:#6EDDF0;--navy:#0D1B2E;--navy-2:#152540;--gold:#C9963A;--white:#fff;--off:#F5F2ED;--ink:#0D1B2E;--ink-60:#4A6080;--ink-30:#9BAEC2;--font-display:'Cormorant Garamond',serif;--font-body:'Outfit',sans-serif;--ease-smooth:cubic-bezier(.25,.46,.45,.94)}
body.hbc-case-study,body.hbc-case-study *,body.hbc-case-study *::before,body.hbc-case-study *::after{box-sizing:border-box}
html{scroll-behavior:smooth;font-size:16px}
body.hbc-case-study{margin:0;background:#f6f5f2;color:#172333;font-family:var(--font-body)}
.hbc-project{font-family:var(--font-body)}
body.hbc-case-study .skip-link{position:absolute;top:8px;left:8px;z-index:1100;background:#fff;color:#101d2d;padding:12px;transform:translateY(-150%)}
body.hbc-case-study .skip-link:focus{transform:translateY(0)}
body.hbc-case-study a:focus-visible,body.hbc-case-study button:focus-visible{outline:3px solid #18c2dc;outline-offset:5px}
@font-face{font-family:HBCPoppins;src:url(../../fonts/hbc/poppins-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:HBCPoppins;src:url(../../fonts/hbc/poppins-600.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:HBCPoppins;src:url(../../fonts/hbc/poppins-800.woff2) format("woff2");font-weight:800;font-display:swap}
.hbc-project *{box-sizing:border-box}
.hbc-project header{background:#101d2d;color:white;padding:75px 8% 65px}
.hbc-project header small{color:#71d2db;letter-spacing:3px;font-size:11px}
.hbc-project h1{font-size:clamp(38px,5.5vw,76px);font-weight:500;line-height:1.1;max-width:950px;margin:25px 0}
.hbc-project header p{font-size:19px;line-height:1.7;max-width:760px;color:#c6ced7}
.hbc-project .meta{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;border-top:1px solid #40505f;padding-top:25px;margin-top:40px;font-size:13px}
.hbc-project .meta b{display:block;color:#71d2db;margin-bottom:9px;font-size:11px;text-transform:uppercase;letter-spacing:2px}
.hbc-project .cover{margin:0;background:white;padding:100px 18%;}
.hbc-project .cover img{max-width:950px;margin:auto}
.hbc-project main{max-width:1440px;margin:auto;padding:0 clamp(20px,5.1vw,96px)}
.hbc-project section{padding:75px 0}
.hbc-project .section-text{display:block;max-width:1100px;margin:0 0 45px}
.hbc-project .section-text h2{margin:0 0 1.5rem}
.hbc-project h2{font-family:var(--font-body);font-size:clamp(1.8rem,3vw,2.6rem);font-weight:700;line-height:1.15;letter-spacing:-.025em;color:var(--ink)}
.hbc-project p{font-family:var(--font-body);line-height:1.8;font-size:1rem;margin:0 0 1.2rem;color:var(--ink-60)}
.hbc-project figure{margin:0 0 24px;overflow:hidden}
.hbc-project figure img{display:block;width:100%;height:auto}
.hbc-project .dark-logo{width:100%;background:black}
.hbc-project .dark-logo img{max-height:670px;object-fit:contain}
.hbc-project .photo{margin-bottom:25px}
.hbc-project .caption{font-size:12px;text-align:center}
.hbc-project .research-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;align-items:stretch}
.hbc-project .research-grid figure{background:white;display:flex;align-items:center}
.hbc-project .research-grid figure:first-child{background:#1f2025}
.hbc-project .research-grid figure:not(:first-child){padding:35px}
.hbc-project .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.hbc-project .steps p{font-size:14px}
.hbc-project .steps b{display:block;color:#172333;margin-bottom:10px}
.hbc-project .posts{max-width:1250px;margin:auto}
.hbc-project .architecture{background:white}
.hbc-project .type-specimen{background:white;padding:65px;font-family:HBCPoppins,sans-serif}
.hbc-project .type-top{display:flex;justify-content:space-between;gap:30px;align-items:center;border-bottom:1px solid #c9c9c9;padding-bottom:35px}
.hbc-project .type-name{font-size:clamp(45px,8vw,120px);line-height:1.15;font-weight:400;letter-spacing:-4px}
.hbc-project .weights{display:flex;flex-direction:column;gap:6px;font-size:18px}
.hbc-project .semibold{font-weight:600}
.hbc-project .extrabold{font-weight:800}
.hbc-project .glyphs{font-size:clamp(16px,2.7vw,36px);line-height:1.65;margin:35px 0;overflow-wrap:anywhere}
.hbc-project .type-columns{display:grid;grid-template-columns:1fr 1fr;gap:60px}
.hbc-project .type-label{display:block;font-size:12px;color:#6f6f6f;margin-bottom:14px}
.hbc-project .type-columns h3{font-size:25px;margin:0 0 20px;font-weight:inherit}
.hbc-project .type-columns p{font-family:inherit;font-size:14px;line-height:1.8;font-weight:inherit;color:#172333}
.hbc-project .palette{font-family:HBCPoppins,sans-serif;background:white;padding:60px 35px;display:grid;grid-template-columns:1.6fr 1fr;align-items:center;gap:30px}
.hbc-project .primary-colors{display:flex;align-items:center}
.hbc-project .color-circle{border-radius:50%;aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:white;gap:12px}
.hbc-project .primary{width:55%;flex-shrink:0;min-width:0}
.hbc-project .primary+.primary{margin-left:-10%;position:relative}
.hbc-project .color-circle b{font-size:20px;max-width:150px}
.hbc-project .color-circle span{font-size:13px}
.hbc-project .secondary-colors{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.hbc-project .secondary{width:100%;gap:7px}
.hbc-project .secondary:not(:first-child){color:#172333}
.hbc-project .secondary b{font-size:15px}
.hbc-project .secondary span{font-size:11px}
.hbc-project .pattern-full img{height:650px;object-fit:cover}
.hbc-project .pattern-detail{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:50px;margin-top:35px;background:white;padding:40px}
.hbc-project .pattern-detail figure{max-width:400px;margin:0}
.hbc-project .pattern-detail p{max-width:440px}
.hbc-project .card-mockup{position:relative;width:100%;aspect-ratio:1780/964;overflow:hidden}
.hbc-project .mockup-bg{display:block;width:100%;height:100%}
.hbc-project .card-front,.hbc-project .card-back{position:absolute;top:33.5%;width:31.85%;height:33.65%;object-fit:fill;background:white}
.hbc-project .card-front{left:14.8%}
.hbc-project .card-back{left:53.7%}
.hbc-project .documents{display:grid;grid-template-columns:1fr 1fr;gap:45px;padding:55px;background:#e7e6e1}
.hbc-project .documents figure{margin:0;background:white;box-shadow:0 15px 40px #17233316;align-self:start}
.hbc-project .credits{padding:35px;background:#e9ecef;display:flex;flex-direction:column;gap:15px;max-width:1070px;margin:auto}
.hbc-project .credits p{font-size:14px;margin:0}
.hbc-project .project-end{padding-bottom:75px}
.hbc-project .cta{background:#101d2d;color:white;text-align:center;padding:80px 25px}
.hbc-project .cta h2{max-width:750px;margin:0 auto 24px}
.hbc-project .cta a{display:inline-block;color:#101d2d;background:#71d2db;text-decoration:none;padding:17px 30px;border-radius:3px}
@media(max-width:800px){.hbc-project header{padding:55px 7%}
.hbc-project .meta{grid-template-columns:1fr;gap:20px}
.hbc-project .cover{padding:65px 8%}
.hbc-project main{padding:0 22px}
.hbc-project section{padding:45px 0}

.hbc-project .research-grid,.hbc-project .steps{grid-template-columns:1fr}
.hbc-project .research-grid figure:not(:first-child){padding:35px}
.hbc-project .type-specimen{padding:25px}
.hbc-project .type-top{flex-wrap:wrap}
.hbc-project .type-name{letter-spacing:-2px}
.hbc-project .weights{font-size:15px;flex-direction:row;flex-wrap:wrap}
.hbc-project .glyphs{font-size:18px}
.hbc-project .type-columns{grid-template-columns:1fr;gap:30px}
.hbc-project .palette{padding:30px 15px;grid-template-columns:1fr;gap:35px}
.hbc-project .primary{width:55%}
.hbc-project .color-circle b{font-size:16px}
.hbc-project .color-circle span{font-size:11px}
.hbc-project .secondary-colors{grid-template-columns:repeat(2,1fr);max-width:360px;width:100%;margin:auto}
.hbc-project .pattern-full img{height:380px}
.hbc-project .pattern-detail{grid-template-columns:1fr;gap:25px;padding:25px}
.hbc-project .documents{grid-template-columns:1fr;padding:25px;gap:25px}
.hbc-project .credits{padding:25px}
.hbc-project .cta{padding:55px 22px}
}
.hbc-project .pattern-process{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px;background:white;padding:35px}
.hbc-project .process-card{min-width:0}
.hbc-project .process-card figure{aspect-ratio:1;margin:0 0 25px;display:flex;align-items:center;justify-content:center}
.hbc-project .process-card figure img{width:100%;height:100%;object-fit:contain}
.hbc-project .process-copy{border-top:1px solid #d8dce0;padding-top:20px}
.hbc-project .process-copy>span{display:block;color:#8f175c;font-size:12px;margin-bottom:12px}
.hbc-project .process-copy h3{font:700 1.3rem/1.25 var(--font-body);margin:0 0 14px;color:var(--ink)}
.hbc-project .process-copy p{font-size:14px;margin:0}
.hbc-project .pattern-applications{margin-top:65px}
.hbc-project .pattern-applications>h3,.hbc-project .pattern-applications>p:not(.caption){max-width:850px;margin-left:auto;margin-right:auto}
.hbc-project .pattern-applications>h3{font:700 1.7rem/1.2 var(--font-body);margin-bottom:20px;color:var(--ink)}
.hbc-project .pattern-applications>p{margin-bottom:35px}
.hbc-project .wall-wide{width:100%;max-width:1181px;margin:0 auto 35px}
.hbc-project .wall-pair{display:flex;justify-content:center;max-width:1181px;margin:auto;align-items:center}
.hbc-project .wall-pair figure{margin:0}
.hbc-project .wall-lounge{max-width:421px;width:100%;justify-self:center}
.hbc-project .pattern-applications>.caption{margin-top:25px}
.hbc-project .report-mockup{margin:0}
.hbc-project .report-mockup img{width:100%;height:auto}
@media(max-width:800px){.hbc-project .pattern-process{grid-template-columns:1fr;padding:25px;gap:35px}
.hbc-project .process-card figure{max-width:520px;margin-left:auto;margin-right:auto}
.hbc-project .pattern-applications{margin-top:45px}
.hbc-project .wall-pair{gap:25px}
.hbc-project .wall-wide{margin-bottom:25px}
.hbc-project .pattern-applications>h3{font-size:25px}
.hbc-project .wall-lounge{max-width:421px}
}
.hbc-project .project-hero{margin:0;background:#101d2d}
.hbc-project .project-hero img{display:block;width:100%;max-width:1350px;margin:0 auto;height:auto}
.hbc-project .charter-type{background:white;padding:40px;max-width:1150px;margin:0 auto}
.hbc-project .charter-type img{width:100%;height:auto}
@media(max-width:800px){.hbc-project .charter-type{padding:20px}
}

.hbc-project header{padding-top:145px}
.hbc-project section{scroll-margin-top:95px}
.hbc-project .cta{border-bottom:1px solid #344352}
@media(max-width:800px){.hbc-project header{padding-top:115px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}