@charset "UTF-8";
.hbn-portfolio{--hbn-ink:#1d3034;--hbn-soft:#43595d;--hbn-muted:#61777c;--hbn-rule:#dce4e5;--hbn-accent:#285d5c;margin:0;background:#fff;color:var(--hbn-ink);font-family:Arial,Helvetica,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.hbn-portfolio *{box-sizing:border-box}
.hbn-page{width:min(1170px,calc(100% - 88px));margin:0 auto}
.hbn-header{padding:66px 0 36px;border-bottom:1px solid var(--hbn-rule)}
.hbn-page h1{max-width:1120px;margin:0 0 21px;color:#19343a;font-size:clamp(32px,3.15vw,43px);line-height:1.16;letter-spacing:-.032em;font-weight:700}
.hbn-page .hbn-lead{max-width:925px;font-size:17px;line-height:1.75;margin:0;color:var(--hbn-soft)}
.hbn-page h2{margin:0 0 20px;font-size:25px;line-height:1.3;letter-spacing:-.02em;color:#1f3b41}
.hbn-page p{font-size:16px;line-height:1.8;color:#3d5359;margin:0 0 17px}
.hbn-page strong{font-weight:650;color:#29464b}
.hbn-structure{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.04fr);align-items:center;gap:54px;padding:53px 0 56px;border-bottom:1px solid var(--hbn-rule)}
.hbn-copy p:last-child{margin-bottom:0}
.hbn-structure-figure{min-width:0;margin:0}
.hbn-structure-figure img{display:block;width:100%;height:auto;border:1px solid #e3e9e9}
.hbn-page figcaption{margin-top:11px;color:var(--hbn-muted);font-size:12px;line-height:1.6}
.hbn-learning{padding:54px 0 58px}
.hbn-learning-copy{max-width:1080px}
.hbn-learning-copy p{max-width:1050px}
.hbn-architecture{margin:29px 0 0;padding:12px;border:1px solid var(--hbn-rule);border-radius:3px;background:#fff}
.hbn-architecture picture,.hbn-architecture img{display:block;width:100%;height:auto}
.hbn-architecture figcaption{margin:9px 6px 2px}
.hbn-page .hbn-learning-end{margin:23px 0 19px;max-width:1020px;font-size:15px}
.hbn-page .hbn-reference{max-width:1030px;margin:0;padding-top:17px;border-top:1px solid var(--hbn-rule);font-size:12px;line-height:1.7;color:var(--hbn-muted)}
.hbn-reference a{color:var(--hbn-accent);text-decoration-thickness:1px;text-underline-offset:3px;overflow-wrap:anywhere}
.hbn-reference a:focus-visible{outline:2px solid var(--hbn-accent);outline-offset:4px}
@media(max-width:950px){.hbn-page{width:min(760px,calc(100% - 48px))}.hbn-header{padding-top:48px}.hbn-structure{grid-template-columns:1fr;gap:26px;padding:41px 0}.hbn-structure-figure{max-width:620px}.hbn-learning{padding:43px 0 48px}.hbn-title-break{display:none}}
@media(max-width:950px){.hbn-architecture{padding:12px 8px}.hbn-architecture picture{max-width:460px;margin:0 auto;aspect-ratio:600/2460}.hbn-architecture img{aspect-ratio:600/2460}}
@media(max-width:520px){.hbn-page{width:calc(100% - 36px)}.hbn-header{padding:34px 0 29px}.hbn-page h1{font-size:30px;line-height:1.17;letter-spacing:-.026em;margin-bottom:18px}.hbn-page .hbn-lead{font-size:15px;line-height:1.75}.hbn-page h2{font-size:23px;margin-bottom:17px}.hbn-page p{font-size:15px;line-height:1.78}.hbn-structure{padding:34px 0 36px}.hbn-learning{padding:35px 0 38px}.hbn-architecture{margin-top:23px}.hbn-page figcaption{font-size:11.5px}.hbn-page .hbn-learning-end{font-size:14px;line-height:1.75}.hbn-page .hbn-reference{font-size:11.5px}}
@media print{.hbn-page{width:100%}.hbn-header{padding-top:0}.hbn-structure{grid-template-columns:1fr 1fr;gap:24px}.hbn-architecture{break-inside:avoid}.hbn-page a{color:inherit}}
