/* Fourth selected platform; previous sections remain untouched. */
.bl-magnet-preview .magnet-in-use { padding:0 24px 56px; scroll-margin-top:110px; }
.bl-magnet-preview .magnet-in-use-platform { container-type:inline-size; padding:2.9% 1.5% 2.2% 4.5%; border-radius:4px; background:#f1f0ec url('./assets/selection-background.png') center/cover no-repeat; box-shadow:0 32px 56px -28px #25302b35,0 8px 18px -10px #25302b20; }
.bl-magnet-preview .magnet-in-use-heading { padding-left:1.8cqw; margin-bottom:1.4cqw; }
.bl-magnet-preview .magnet-in-use-heading .hsb-eyebrow { margin-bottom:.9cqw; font-size:.9cqw; letter-spacing:.34em; }
.bl-magnet-preview .magnet-in-use-heading h2 { font-size:4.05cqw; line-height:.97; letter-spacing:-.045em; font-weight:750; color:#0d1730; }
.bl-magnet-preview .magnet-in-use-heading h2 span { color:#006142; }
.bl-magnet-preview .magnet-in-use-layout { display:grid; grid-template-columns:1.82fr 1fr; gap:3.2cqw; align-items:stretch; height:51cqw; }
.bl-magnet-preview .magnet-in-use-scene { position:relative; margin:0; min-width:0; width:100%; height:100%; border-radius:1.3cqw; overflow:hidden; }
.bl-magnet-preview .magnet-in-use-scene > img { display:block; width:100%; height:100%!important; object-fit:cover; }
.bl-magnet-preview .magnet-in-use-scene-caption { position:absolute; left:1.8cqw; bottom:2.3cqw; }
.bl-magnet-preview .magnet-in-use-gallery { display:flex; align-items:center; gap:1.05cqw; min-height:3.3cqw; padding:.55cqw 1.05cqw; border:0; border-radius:999px; background:#fffffff5; color:#087a43; box-shadow:0 4px 16px #14202a24; font:650 1.14cqw/1.3 "Segoe UI",system-ui,sans-serif; cursor:pointer; }
.bl-magnet-preview .magnet-in-use-gallery > img { width:1.6cqw; height:1.6cqw; filter:invert(31%) sepia(99%) saturate(610%) hue-rotate(108deg) brightness(85%) contrast(96%); }
.bl-magnet-preview .magnet-in-use-gallery-arrow { display:flex; align-items:center; justify-content:center; width:2.15cqw; height:2.15cqw; border-radius:50%; background:#087a43; }
.bl-magnet-preview .magnet-in-use-gallery-arrow img { width:1.5cqw; height:1.5cqw; filter:brightness(0) invert(1); }
.bl-magnet-preview .magnet-in-use-scene-caption > p { margin-top:.8cqw; padding-left:.2cqw; font-size:1cqw; letter-spacing:.17em; color:#334258; text-shadow:0 1px 4px #fff; }
.bl-magnet-preview .magnet-in-use-details { display:flex; flex-direction:column; min-width:0; min-height:0; }
.bl-magnet-preview .magnet-in-use-details > .hsb-eyebrow { font-size:.85cqw; line-height:1.3; letter-spacing:.3em; margin:0; }
.bl-magnet-preview .magnet-in-use-detail-list { flex:1; display:grid; grid-template-rows:repeat(3,minmax(0,1fr)); min-height:0; }
.bl-magnet-preview .magnet-in-use-detail { display:grid; grid-template-columns:1.05fr 1fr; align-items:center; gap:.45cqw; min-height:0; border-bottom:1px solid #dfe1de; }
.bl-magnet-preview .magnet-in-use-detail-copy { position:relative; z-index:1; padding-bottom:.4cqw; }
.bl-magnet-preview .magnet-in-use-detail h3 { font-size:1.65cqw; line-height:1.1; letter-spacing:-.025em; font-weight:750; color:#0e1930; }
.bl-magnet-preview .magnet-in-use-detail p { margin-top:.65cqw; font-size:1.18cqw; line-height:1.28; color:#3b485c; }
.bl-magnet-preview .magnet-in-use-detail-image { display:block; min-width:0; width:100%; height:100%; padding:0; border:0; background:transparent; cursor:pointer; }
.bl-magnet-preview .magnet-in-use-detail-image img { display:block; width:100%; height:100%!important; object-fit:contain; }
.bl-magnet-preview .magnet-in-use-detail-image:hover img { transform:translateY(-2px); }
.bl-magnet-preview .magnet-in-use-gallery:focus-visible,.bl-magnet-preview .magnet-in-use-detail-image:focus-visible { outline:2px solid #7a8898; outline-offset:3px; }
.bl-magnet-preview .magnet-in-use-consult { padding-top:1.2cqw; }
.bl-magnet-preview .magnet-in-use-consult > p { margin:0 0 .9cqw; font-size:.98cqw; line-height:1.3; color:#52617a; }
.bl-magnet-preview .magnet-in-use-consult .hsb-button { display:flex; justify-content:center; gap:1.8cqw; width:100%; min-height:4.8cqw; padding:1cqw 2.5cqw; font-size:1.3cqw; font-weight:650; }
.bl-magnet-preview .magnet-in-use-consult .hsb-button > img { width:2cqw; height:2cqw; filter:brightness(0) invert(1); }
.bl-magnet-preview .magnet-in-use-drawer .hsb-gallery-rail { scrollbar-width:none; }
.bl-magnet-preview .magnet-in-use-drawer [data-hsb-gallery-panel="scene"] .hsb-gallery-slide { flex-basis:100%; }
.bl-magnet-preview .magnet-in-use-drawer [data-hsb-gallery-panel="scene"] .hsb-gallery-rail::after { display:none; }
@media(max-width:1100px) {
 .bl-magnet-preview .magnet-in-use-platform { padding:34px 24px 28px; }
 .bl-magnet-preview .magnet-in-use-heading { padding-left:0; margin-bottom:26px; }
 .bl-magnet-preview .magnet-in-use-heading .hsb-eyebrow { font-size:11px; margin-bottom:14px; }
 .bl-magnet-preview .magnet-in-use-heading h2 { font-size:clamp(36px,4.2vw,48px); line-height:1.02; }
 .bl-magnet-preview .magnet-in-use-layout { gap:28px; grid-template-columns:1fr; height:auto; }
 .bl-magnet-preview .magnet-in-use-scene { aspect-ratio:1.225; height:auto; border-radius:16px; }
 .bl-magnet-preview .magnet-in-use-scene-caption { left:16px; right:16px; bottom:24px; }
 .bl-magnet-preview .magnet-in-use-gallery { min-height:46px; gap:10px; padding:7px 12px; font-size:14px; }
 .bl-magnet-preview .magnet-in-use-gallery > img { width:21px; height:21px; }
 .bl-magnet-preview .magnet-in-use-gallery-arrow { width:28px; height:28px; }
 .bl-magnet-preview .magnet-in-use-gallery-arrow img { width:20px; height:20px; }
 .bl-magnet-preview .magnet-in-use-scene-caption > p { font-size:11px; margin-top:10px; }
 .bl-magnet-preview .magnet-in-use-details > .hsb-eyebrow { font-size:10px; margin-bottom:8px; }
 .bl-magnet-preview .magnet-in-use-detail { min-height:150px; gap:8px; }
 .bl-magnet-preview .magnet-in-use-detail h3 { font-size:20px; }
 .bl-magnet-preview .magnet-in-use-detail p { font-size:15px; line-height:1.3; margin-top:8px; }
 .bl-magnet-preview .magnet-in-use-consult { padding-top:16px; }
 .bl-magnet-preview .magnet-in-use-consult > p { margin-bottom:12px; font-size:13px; }
 .bl-magnet-preview .magnet-in-use-consult .hsb-button { min-height:58px; padding:12px 20px; gap:16px; font-size:17px; }
 .bl-magnet-preview .magnet-in-use-consult .hsb-button > img { width:24px; height:24px; }
}
@media(max-width:900px) {
 .bl-magnet-preview .magnet-in-use-layout { grid-template-columns:1fr; }
 .bl-magnet-preview .magnet-in-use-scene { aspect-ratio:1.225; min-height:0; }
 .bl-magnet-preview .magnet-in-use-detail-list { grid-template-rows:none; }
 .bl-magnet-preview .magnet-in-use-detail { min-height:180px; grid-template-columns:1fr 1fr; }
 .bl-magnet-preview .magnet-in-use-detail-image { height:180px; }
 .bl-magnet-preview .magnet-in-use-detail h3 { font-size:24px; }
 .bl-magnet-preview .magnet-in-use-detail p { max-width:280px; font-size:17px; }
}
@media(max-width:767px) {
 .bl-magnet-preview .magnet-in-use { padding:0 12px 30px; scroll-margin-top:84px; }
 .bl-magnet-preview .magnet-in-use-platform { padding:30px 18px 24px; }
 .bl-magnet-preview .magnet-in-use-heading h2 { font-size:clamp(30px,7.8vw,46px); }
 .bl-magnet-preview .magnet-in-use-scene { aspect-ratio:1/1.12; border-radius:12px; }
 .bl-magnet-preview .magnet-in-use-scene-caption { left:12px; right:12px; bottom:18px; }
 .bl-magnet-preview .magnet-in-use-gallery { font-size:13px; gap:8px; padding:6px 10px; }
 .bl-magnet-preview .magnet-in-use-gallery > img { width:20px; height:20px; }
 .bl-magnet-preview .magnet-in-use-gallery-arrow { width:26px; height:26px; }
 .bl-magnet-preview .magnet-in-use-scene-caption > p { font-size:9px; letter-spacing:.12em; }
 .bl-magnet-preview .magnet-in-use-detail { min-height:180px; grid-template-columns:1.05fr 1fr; gap:6px; }
 .bl-magnet-preview .magnet-in-use-detail h3 { font-size:21px; }
 .bl-magnet-preview .magnet-in-use-detail p { font-size:15px; }
 .bl-magnet-preview .magnet-in-use-detail-image { height:165px; }
 .bl-magnet-preview .magnet-in-use-consult .hsb-button { min-height:58px; font-size:16px; }
}
@media(prefers-reduced-motion:reduce) { .bl-magnet-preview .magnet-in-use-detail-image:hover img { transform:none; } }
