/* Build 201 — one hero plus 1–3 ordered supporting-photo windows in every style. */
.marketingSupportPicker{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:10px 0;padding:10px 11px;border:1px solid #d8e6ec;border-radius:11px;background:#f7fbfc}.marketingSupportPicker b,.marketingSupportPicker span{display:block}.marketingSupportPicker b{color:#082d63;font-size:10px}.marketingSupportPicker span{margin-top:2px;color:#667085;font-size:8px}.marketingSupportPicker>div:last-child{display:flex;gap:5px}.marketingSupportPicker button{display:grid;place-items:center;width:30px;height:30px;border:1px solid #bfd0dc;border-radius:8px;background:#fff;color:#17365f;font-size:11px;font-weight:900}.marketingSupportPicker button.selected{border-color:#10aaa7;background:#10aaa7;color:#fff;box-shadow:0 4px 12px rgba(16,170,167,.22)}
.marketingSelectedPhotos{grid-template-columns:repeat(2,minmax(0,1fr))}.marketingSelectedSlot>img{height:135px;cursor:zoom-in}.marketingSlotEmpty{height:135px}.marketingGallery.marketingGalleryAll{grid-template-columns:repeat(2,minmax(0,1fr));max-height:520px;gap:10px}.marketingGalleryAll .marketingThumb{aspect-ratio:4/3;min-height:128px}.marketingGalleryAll .marketingThumb img{object-fit:contain}.marketingGalleryAll .marketingThumb i{position:absolute;left:6px;bottom:6px;display:grid;place-items:center;width:27px;height:27px;border-radius:7px;background:rgba(255,255,255,.94);box-shadow:0 3px 10px rgba(0,0,0,.18);color:#082d63;font:900 17px/1 Arial;font-style:normal}
.marketingPhotoLightbox{position:fixed;z-index:100000;inset:0;display:grid;place-items:center;padding:5vh 5vw;background:rgba(4,15,28,.92);cursor:zoom-out}.marketingPhotoLightbox img{display:block;max-width:90vw;max-height:84vh;object-fit:contain;box-shadow:0 25px 70px rgba(0,0,0,.55)}.marketingPhotoLightbox button{position:absolute;right:24px;top:20px;border:0;background:none;color:#fff;font:300 42px/1 Arial}.marketingPhotoLightbox span{position:absolute;bottom:18px;color:#fff;font-size:11px}

/* Universal layer system. The hero always fills the art; detail images float above it. */
.marketingPreview.style-bold .marketingPhoto1,.marketingPreview.style-classy .marketingPhoto1,.marketingPreview.style-modern .marketingPhoto1,.marketingPreview.style-luxury .marketingPhoto1,.marketingPreview.style-coastal .marketingPhoto1,.marketingPreview.style-clean .marketingPhoto1{inset:0!important;width:100%!important;height:76%!important;clip-path:none!important;object-fit:cover!important}
.marketingPreview.style-bold .marketingPhoto2,.marketingPreview.style-bold .marketingPhoto3,.marketingPreview.style-bold .marketingPhoto4,.marketingPreview.style-classy .marketingPhoto2,.marketingPreview.style-classy .marketingPhoto3,.marketingPreview.style-classy .marketingPhoto4,.marketingPreview.style-modern .marketingPhoto2,.marketingPreview.style-modern .marketingPhoto3,.marketingPreview.style-modern .marketingPhoto4,.marketingPreview.style-luxury .marketingPhoto2,.marketingPreview.style-luxury .marketingPhoto3,.marketingPreview.style-luxury .marketingPhoto4,.marketingPreview.style-coastal .marketingPhoto2,.marketingPreview.style-coastal .marketingPhoto3,.marketingPreview.style-coastal .marketingPhoto4,.marketingPreview.style-clean .marketingPhoto2,.marketingPreview.style-clean .marketingPhoto3,.marketingPreview.style-clean .marketingPhoto4{display:block!important;z-index:7!important;left:auto!important;right:3.5%!important;width:23%!important;height:21%!important;border:5px solid #fff!important;border-radius:5px!important;clip-path:none!important;object-fit:cover!important;box-shadow:0 12px 28px rgba(0,20,55,var(--mk-shadow-opacity))!important}
.marketingPreview .marketingPhoto2{top:8%!important}.marketingPreview .marketingPhoto3{top:30.5%!important}.marketingPreview .marketingPhoto4{top:53%!important}

/* Keep copy and branding clear of the photo stack. */
.marketingPreview.style-bold .marketingPreviewTop{right:29%}.marketingPreview.style-bold .marketingPreviewTop .marketingLogo{right:-38%;top:560%;width:28%;max-width:28%!important;max-height:100px!important}.marketingPreview.style-bold .marketingPreviewCopy{height:25%;padding:3.2% 5% 2.5%;clip-path:none!important}.marketingPreview.style-bold .marketingPreviewCopy:after{width:32%;clip-path:polygon(18% 0,100% 0,100% 100%,0 100%)}.marketingPreview.style-bold .marketingPreviewCopy h2{max-width:66%}.marketingPreview.style-bold .marketingPreviewCopy>p{max-width:66%;font-size:clamp(13px,1.9vw,27px)}.marketingPreview.style-bold .marketingPropertyFacts{max-width:65%}.marketingPreview.style-bold .marketingAgent{right:2.5%;bottom:7%;width:25%;transform-origin:right bottom}
.marketingPreview.style-classy .marketingPreviewCopy,.marketingPreview.style-luxury .marketingPreviewCopy{right:31%}.marketingPreview.style-classy .marketingAgent,.marketingPreview.style-luxury .marketingAgent{position:relative;right:auto;bottom:auto}
.marketingPreview.style-modern .marketingPreviewCopy{right:31%}.marketingPreview.style-modern .marketingAgent{position:relative;right:auto;bottom:auto;justify-content:flex-start;transform-origin:left bottom}
.marketingPreview.style-coastal .marketingPreviewCopy{right:31%}.marketingPreview.style-clean .marketingPreviewCopy{padding-right:31%}.marketingPreview.style-clean .marketingAgent{right:3%;bottom:10%}
@media(max-width:650px){.marketingSupportPicker{align-items:flex-start}.marketingSelectedPhotos{grid-template-columns:1fr}.marketingGallery.marketingGalleryAll{grid-template-columns:1fr}.marketingGalleryAll .marketingThumb{min-height:180px}}