/* Keep every slide on one grid, irrespective of title length or image ratio. */
.hero-top{grid-template-columns:minmax(0,358fr) minmax(0,998fr)}
.carousel-wrap{min-width:0}
.hero-slide{grid-template-columns:minmax(0,232fr) minmax(0,766fr);grid-template-rows:minmax(0,1fr)}
.slide-label{min-width:0;min-height:0;overflow:hidden;gap:12px}
.slide-label strong{font-size:clamp(12px,1.2vw,21px);line-height:1.25;overflow-wrap:normal;letter-spacing:-.025em}
.slide-media{position:relative;min-width:0;min-height:0;width:100%;height:100%;overflow:hidden;background:#fff}
.hero-slide .slide-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%}
.hero-slide .fit-contain img{object-fit:contain}
@media (max-width:1000px) and (min-width:651px){.slide-label{padding:12px 8px}.slide-label strong{font-size:clamp(9px,1.2vw,12px)}.slide-label .eyebrow{font-size:7px;letter-spacing:.5px}}
/* At tablet widths keep the slider readable instead of squeezing its sidebar. */
@media (max-width:800px) and (min-width:651px){
 .hero-top{grid-template-columns:minmax(0,1fr);gap:24px}
 .role{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
 .role i{display:none}
 .role .availability{margin-top:0}
 .slide-label strong{font-size:clamp(11px,1.65vw,13px)}
 .home-hero h1{font-size:clamp(32px,5.15vw,40px)}
}