/* Architectural editorial direction based on the supplied OnGrid reference. */
:root{--blue:#145dff;--hero-ink:#0c1116}
.site-header{height:86px;background:#fff;border-bottom:0;padding-inline:clamp(1.25rem,5vw,5.5rem);position:relative}
.site-header .supplied-logo{width:182px}
.site-header nav{gap:clamp(1.5rem,3vw,3rem);font-size:.9rem}
.site-header nav a:not(.button){padding:.75rem 0;color:#2b3038}
.site-header nav .button{padding-inline:1.45rem;min-height:46px;box-shadow:0 8px 22px rgba(20,93,255,.18)}
.reference-hero{position:relative;isolation:isolate;min-height:calc(100svh - 86px);overflow:hidden;background:var(--hero-ink);color:#fff;display:flex;align-items:center;padding:clamp(4rem,7vw,7rem) clamp(1.5rem,7.2vw,8rem)}
.reference-hero-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:61% 58%;filter:grayscale(1) contrast(1.06) brightness(.67);z-index:-3}
.reference-hero-shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,rgba(6,11,16,.98) 0%,rgba(8,13,18,.9) 31%,rgba(10,15,20,.48) 57%,rgba(7,11,16,.2) 100%)}
.reference-hero:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(0,0,0,.1),transparent 55%,rgba(0,0,0,.35))}
.reference-hero-copy{width:min(690px,58vw)}
.reference-hero-copy .eyebrow{color:#d3d8df;letter-spacing:.25em;max-width:19rem;margin:0 0 2rem}
.reference-hero-copy h1{font:400 clamp(4.75rem,8vw,8.8rem)/.9 var(--display);letter-spacing:.01em;text-transform:uppercase;text-shadow:0 2px 18px rgba(0,0,0,.2)}
.reference-hero-copy h1 span{display:block}
.reference-hero-lede{max-width:35rem;margin:1.8rem 0 2rem;font-size:clamp(1.05rem,1.5vw,1.3rem);line-height:1.55;color:#e2e6eb}
.reference-hero-cta{gap:1.4rem;min-width:205px;justify-content:space-between;box-shadow:0 10px 28px rgba(0,68,255,.24)}
.reference-hero-cta span{font-size:1.25rem;line-height:1}
.reference-hero-note{font:.75rem/1.55 var(--mono);letter-spacing:.03em;color:#c1c8d1;margin:1.3rem 0 0}
.reference-hero-index{position:absolute;right:clamp(1.5rem,7.2vw,8rem);top:clamp(4rem,9vw,7rem);display:flex;flex-direction:column;gap:.5rem;border-top:2px solid rgba(255,255,255,.65);padding-top:1rem;width:9rem;font:500 .78rem/1.45 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:#dce1e8}
.reference-hero-mark{position:absolute;right:clamp(1.5rem,7.2vw,8rem);bottom:clamp(3rem,6vw,5rem);margin:0;font:500 .78rem/1.55 var(--mono);letter-spacing:.13em;text-transform:uppercase;color:#dce1e8}
.reference-foundation{background:#fff;padding-top:clamp(4.5rem,7vw,7rem)}
.reference-foundation .foundation-intro{grid-template-columns:minmax(140px,18%) minmax(0,1fr);align-items:start}
.reference-foundation .foundation-intro>.eyebrow{color:var(--blue);letter-spacing:.1em;border-top:2px solid var(--blue);padding-top:1rem}
.reference-foundation .foundation-intro h2{max-width:700px}
.reference-foundation .structural-bays{border-top:1px solid #cbd0d8}
.reference-foundation .structural-bays article{transition:background-color .2s,color .2s}
.reference-foundation .structural-bays article:hover{background:#12171d;color:#fff}
.reference-foundation .structural-bays article:hover p,.reference-foundation .structural-bays article:hover .bay-number{color:#cdd3dc}
@media(max-width:900px){.site-header{height:80px}.site-header nav{top:80px}.reference-hero{min-height:760px;padding-top:4rem;padding-bottom:4rem;align-items:flex-end}.reference-hero-copy{width:min(620px,75vw)}.reference-hero-copy h1{font-size:clamp(4rem,11vw,6.5rem)}.reference-hero-index{top:3rem}.reference-hero-mark{display:none}}
@media(max-width:600px){.site-header .supplied-logo{width:154px}.site-header nav{background:#fff}.reference-hero{min-height:690px;padding:3rem var(--gutter)}.reference-hero-image{object-position:56% center}.reference-hero-shade{background:linear-gradient(90deg,rgba(6,11,16,.96),rgba(8,13,18,.72) 72%,rgba(8,13,18,.4))}.reference-hero-copy{width:100%}.reference-hero-copy .eyebrow{font-size:.75rem;letter-spacing:.16em;margin-bottom:1.5rem}.reference-hero-copy h1{font-size:clamp(3.7rem,17vw,5rem);line-height:.92}.reference-hero-lede{font-size:1.05rem;max-width:22rem;margin:1.4rem 0 1.7rem}.reference-hero-cta{width:100%;max-width:300px}.reference-hero-note{font-size:.7rem;max-width:18rem}.reference-hero-index{display:none}.reference-foundation .foundation-intro{grid-template-columns:1fr}.reference-foundation .foundation-intro>.eyebrow{width:max-content;max-width:100%}.reference-foundation .structural-bays article:hover{background:transparent;color:inherit}.reference-foundation .structural-bays article:hover p{color:var(--slate)}.reference-foundation .structural-bays article:hover .bay-number{color:var(--slate)}}