/* Keep the existing, clearly labelled ad positions; preserve the whole image. */
#main > .placement-rails.container{margin-block:24px 16px;gap:16px}
#main > .placement-rails .placement-rail{min-width:0}
#main > .placement-rails .placement-slot-vertical .placement-creative{display:grid;grid-template-columns:140px minmax(0,1fr);height:260px}
#main > .placement-rails .placement-slot-vertical .placement-media{height:260px;min-height:0;aspect-ratio:auto;padding:0;border:0;flex:none}
#main > .placement-rails .placement-slot-vertical .placement-media > img{object-fit:contain}
#main > .placement-rails .placement-slot-vertical .placement-caption{height:100%;font-size:14px;line-height:1.7;padding:20px;white-space:normal;background:var(--surface,var(--white))}
#main > .placement-rails .placement-slot-vertical .placement-caption > strong{white-space:normal;overflow-wrap:anywhere;-webkit-line-clamp:5}

/* Rails stay at the screen edges. Cap the whole content canvas, including hero
   backgrounds, rather than merely padding its inner text containers. Each side
   reserves the rail, 16px outer margin and at least 32px of clear space. */
@media(min-width:1280px){
 #main:has(> .placement-rails){--side-promotion-width:160px;--side-promotion-space:208px;width:min(1280px,calc(100% - var(--side-promotion-space) - var(--side-promotion-space)));margin-inline:auto;padding-inline:0}
 #main:has(> .placement-rails) > .container:not(.placement-rails),
 #main:has(> .placement-rails) > :not(.container) .container{width:min(1280px,calc(100% - 32px))}
 #main:has(> .placement-rails) > .placement-rails.container{display:contents}
 body:has(#main > .placement-rails) .back-to-top{right:max(192px,calc((100% - 1280px)/2))}
 #main > .placement-rails > .placement-rail{position:fixed;top:150px;width:var(--side-promotion-width,160px);max-height:calc(100dvh - 172px);z-index:12}
 #main > .placement-rails > .placement-rail-left{left:16px}
 #main > .placement-rails > .placement-rail-right{right:16px}
 #main > .placement-rails .placement-slot-vertical{height:min(632px,calc(100dvh - 172px))}
 #main > .placement-rails .placement-slot-vertical .placement-slot-meta{height:30px;padding:7px 10px}
 #main > .placement-rails .placement-slot-vertical .placement-creative{display:flex;flex-direction:column;height:calc(100% - 30px)}
 #main > .placement-rails .placement-slot-vertical .placement-media{width:100%;height:auto;flex:1;min-height:0}
 #main > .placement-rails .placement-slot-vertical .placement-caption{height:auto;min-height:40px;padding:9px 10px;font-size:11px;line-height:1.5;border-top:1px solid var(--line);gap:6px}
 #main > .placement-rails .placement-slot-vertical .placement-caption > strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 #main > .placement-rails .placement-slot-vertical .placement-caption > .icon{width:13px;height:13px;flex:none}
 #main > .placement-rails .placement-slot-vertical .placement-slot-placeholder{height:calc(100% - 30px);min-height:0;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:22px;padding:22px 16px}
 #main > .placement-rails .placement-placeholder-symbol{display:grid;width:40px;height:40px}
 #main > .placement-rails .placement-placeholder-copy{gap:14px}
 #main > .placement-rails .placement-placeholder-copy > strong{font-size:22px;line-height:1.4;white-space:normal;overflow-wrap:anywhere}
 #main > .placement-rails .placement-placeholder-copy > strong > br{display:initial}
 #main > .placement-rails .placement-placeholder-link{white-space:normal;font-size:12px;min-height:44px}
}
@media(min-width:1440px){
 #main:has(> .placement-rails){--side-promotion-width:200px;--side-promotion-space:248px}
 body:has(#main > .placement-rails) .back-to-top{right:max(232px,calc((100% - 1280px)/2))}
}
@media(min-width:1280px) and (max-width:1759px){
 .page-firms #main:has(> .placement-rails) .listing-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 #main:has(> .placement-rails) .profile-layout{grid-template-columns:minmax(0,1fr) 260px;gap:24px}
 #main:has(> .placement-rails) .categories-section .category-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(max-width:760px){
 #main > .placement-rails.container{gap:12px;margin-block:18px 14px}
 #main > .placement-rails .placement-slot-vertical .placement-creative{display:flex;flex-direction:column;height:auto}
 #main > .placement-rails .placement-slot-vertical .placement-media{height:240px;min-height:0;width:100%;aspect-ratio:auto}
 #main > .placement-rails .placement-slot-vertical .placement-caption{height:auto;min-height:44px;padding:9px 10px;flex-direction:row;align-items:center;justify-content:space-between;font-size:11px;gap:6px;border-top:1px solid var(--line)}
 #main > .placement-rails .placement-slot-vertical .placement-caption > strong{display:-webkit-box;-webkit-line-clamp:2;line-height:1.6}
 #main > .placement-rails .placement-slot-vertical .placement-caption > .icon{width:13px;height:13px;flex:none}
 #main .directory-sidebar-placement .placement-creative{display:flex;flex-direction:column;height:auto}
 #main .directory-sidebar-placement .placement-media{width:100%;height:340px;min-height:0;aspect-ratio:auto;flex:none;padding:0;border:0}
 #main .directory-sidebar-placement .placement-media > img{width:100%;height:100%;object-fit:contain}
 #main .directory-sidebar-placement .placement-caption{height:auto;min-height:44px;padding:10px 12px;border-left:0;border-top:1px solid var(--line);font-size:12px;flex-direction:row;align-items:center}
}
@media(max-width:370px){
 #main > .placement-rails.container{gap:9px}
 #main > .placement-rails .placement-slot-vertical .placement-media{height:210px}
}
@media print{#main > .placement-rails{display:none!important}#main:has(> .placement-rails){width:auto!important;margin-inline:0!important;padding-inline:0!important}}
