/* Architecture page: the blueprint */
.bp{position:relative;margin:clamp(28px,4vw,48px) 0 clamp(40px,6vw,72px);border:1px solid #23443A33;
  background-color:#F8F7F3;
  background-image:linear-gradient(#23443A0F 1px,transparent 1px),linear-gradient(90deg,#23443A0F 1px,transparent 1px),linear-gradient(#23443A07 1px,transparent 1px),linear-gradient(90deg,#23443A07 1px,transparent 1px);
  background-size:80px 80px,80px 80px,16px 16px,16px 16px;padding:clamp(18px,3vw,36px) clamp(14px,3vw,40px) clamp(16px,2.5vw,28px)}
.bp-annot{display:flex;justify-content:space-between;gap:16px;font-size:12px;color:#575B56;margin-bottom:18px}
.bp-annot b{font-weight:600;color:#23443A}
.bp-stage{position:relative}
.bp-svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.bp-svg path{fill:none;stroke:#23443A;stroke-width:1;stroke-dasharray:3 5;opacity:.28;transition:opacity .4s,stroke-width .3s}
.bp-svg path.on{stroke-dasharray:none;stroke-width:2;opacity:1;animation:bpdraw .9s cubic-bezier(.2,.8,.2,1) both}
.bp-svg path.dim{opacity:.06}
@keyframes bpdraw{from{stroke-dasharray:var(--len) var(--len);stroke-dashoffset:var(--len)}to{stroke-dasharray:var(--len) var(--len);stroke-dashoffset:0}}
.bp-beam{position:relative;background:#121417;color:#F8F7F3;text-align:center;padding:12px 16px;font-family:'Instrument Serif',Georgia,serif;font-size:clamp(24px,2.6vw,34px);line-height:1;margin:0 2%}
.bp-beam small{display:block;font-family:'DM Sans',sans-serif;font-size:12px;color:#B4B7AE;margin-top:6px}
.bp-cols{display:grid;grid-template-columns:repeat(6,1fr);gap:clamp(6px,1.4vw,18px);margin:0 4%;height:clamp(170px,20vw,230px)}
.bp-col{position:relative;z-index:1;border:1px solid #23443A;border-top:0;background:#F8F7F3E6;cursor:pointer;display:flex;align-items:flex-end;justify-content:center;padding:12px 0;transition:background .35s,color .35s,opacity .35s,transform .35s;font:inherit;color:#121417}
.bp-col::before{content:"";position:absolute;left:-5px;right:-5px;top:0;height:6px;border:1px solid #23443A;background:#F8F7F3}
.bp-col span{writing-mode:vertical-rl;transform:rotate(180deg);font-size:clamp(12px,1.25vw,15px);font-weight:500;white-space:nowrap}
.bp-col:hover,.bp-col:focus-visible{background:#E4ECE7;outline:none}
.bp-col.on{background:#23443A;color:#F8F7F3}
.bp-col.on::before{background:#23443A}
.bp.has-sel .bp-col:not(.on){opacity:.4}
.bp-plinth{height:10px;border:1px solid #23443A;border-top:0;margin:0 2%;background:repeating-linear-gradient(45deg,#23443A22 0 2px,transparent 2px 7px)}
.bp-foot{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(8px,1.2vw,14px);margin-top:clamp(56px,7vw,86px)}
.bp-f{font:inherit;text-align:left;border:1px solid #23443A66;background:#FFFFFFD9;padding:12px 14px;cursor:pointer;transition:all .35s;color:#121417;min-height:64px}
.bp-f b{display:block;font-family:'Instrument Serif',Georgia,serif;font-weight:400;font-size:clamp(17px,1.5vw,20px);line-height:1.1}
.bp-f small{display:block;font-size:12px;color:#575B56;margin-top:4px}
.bp-f:hover,.bp-f:focus-visible{border-color:#23443A;outline:none}
.bp-f.on{position:relative;z-index:2;background:#E4ECE7;border-color:#23443A;box-shadow:inset 0 -3px 0 #23443A}
.bp.has-sel .bp-f:not(.on){opacity:.3}
.bp-cap{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:10px 24px;border-top:1px solid #23443A33;margin-top:22px;padding-top:16px;min-height:3.4em}
.bp-cap p{margin:0;font-size:15.5px;line-height:1.5;color:#121417;max-width:62ch}
.bp-cap p strong{font-weight:600;color:#23443A}
.bp-cap a{font-size:14px;font-weight:600;color:#2E5A4C;white-space:nowrap}
.bp-cap a[hidden]{display:none}
@media(max-width:760px){
  .bp-cols{margin:0 1%;gap:5px;height:190px}
  .bp-col span{font-size:11.5px}
  .bp-foot{grid-template-columns:repeat(2,1fr);margin-top:56px}
  .bp-f{min-height:0;padding:10px}
  .bp-f small{display:none}
  .bp-annot span:last-child{display:none}
}
@media(prefers-reduced-motion:reduce){.bp-svg path.on{animation:none}.bp-col,.bp-f{transition:none}}
