.hf-board{width:100%;background:#fff;container-type:inline-size;isolation:isolate}
.hf-board__pieces{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:24cqw;gap:5cqw;align-items:center}
.hf-board__piece{display:block;position:relative;width:100%;height:100%;min-width:0;min-height:0;mix-blend-mode:multiply}
.hf-board__piece img{display:block;width:100%;height:100%;object-fit:contain;max-width:none;transform:scale(var(--hf-scale,1))}
.hf-board__piece:focus-visible,.hf-board__pin:focus-visible{outline:1px solid #000;outline-offset:5px}
.hf-board--freeform .hf-board__pieces{position:relative;display:block;aspect-ratio:var(--hf-board-ratio,.88);overflow:hidden}
.hf-board--freeform .hf-board__piece{position:absolute;left:var(--hf-x);top:var(--hf-y);width:var(--hf-w);height:var(--hf-h);z-index:var(--hf-layer,1)}
.hf-board--hero .hf-board__pieces{grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:23cqw;gap:4cqw}
.hf-board--hero .hf-board__piece:first-child{grid-column:span 2;grid-row:span 2}
.hf-board--hero .hf-board__piece:nth-child(3n){padding:2cqw}
.hf-board--grid .hf-board__pieces{padding:4cqw 0;row-gap:9cqw}
.hf-board__scene{position:relative;margin-bottom:6cqw}
.hf-board__scene>img{display:block;width:100%;height:auto;max-height:none;object-fit:contain}
.hf-styling a.hf-board__pin{position:absolute;left:var(--hf-pin-x);top:var(--hf-pin-y);transform:translate(-50%,-50%);display:grid;place-items:center;min-width:44px;min-height:44px;z-index:2;text-decoration:none;isolation:isolate}
.hf-board__pin>span:first-child{display:grid;place-items:center;width:28px;height:28px;border:1px solid #000;border-radius:50%;background:#fff;color:#000;font-size:13px;line-height:1;box-shadow:0 0 0 4px #ffffff70}
.hf-board__pin-label{position:absolute;bottom:calc(100% + 3px);left:50%;transform:translateX(-50%);width:max-content;max-width:180px;padding:7px 10px;background:#fff;color:#000;font-size:13px;line-height:1.4;box-shadow:0 2px 12px #0001;opacity:0;pointer-events:none}
.hf-board__pin:is(:hover,:focus-visible) .hf-board__pin-label{opacity:1}
.hf-layout-preview{max-width:1000px;margin:64px auto 96px}
.hf-layout-preview>h2{font-family:var(--font-h2--family,Cormorant,serif);font-size:46px;font-weight:400;line-height:1.1;margin:0 0 14px}
.hf-layout-preview>p{font-size:18px;line-height:1.65;max-width:700px;margin:0 0 28px}
.hf-layout-preview__board{max-width:850px;margin:auto}
@media(max-width:749px){
 .hf-board--freeform .hf-board__piece{left:var(--hf-mx,var(--hf-x));top:var(--hf-my,var(--hf-y));width:var(--hf-mw,var(--hf-w));height:var(--hf-mh,var(--hf-h))}
 .hf-styling a.hf-board__pin{left:var(--hf-pin-mx,var(--hf-pin-x));top:var(--hf-pin-my,var(--hf-pin-y))}
 .hf-board__pin-label{max-width:140px}
 .hf-layout-preview{margin:42px 0 64px}
 .hf-layout-preview>h2{font-size:36px}
 .hf-layout-preview>p{font-size:17px}
}
.hf-layout-library__nav{display:flex;flex-wrap:wrap;gap:12px 28px;margin:24px 0 48px}.hf-layout-preview{scroll-margin-top:110px}
