/* Keep the complete slideshow navigation inside the hero at any viewport width. */
.home-reference .hero { position:relative; }
.home-reference .hero-bottom.wrap {
    position:absolute;
    left:clamp(20px,4vw,56px);
    right:clamp(20px,4vw,56px);
    width:auto;
    max-width:1456px;
    margin-left:auto;
    margin-right:auto;
    padding-left:0;
    padding-right:0;
    transform:none;
    translate:none;
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:24px;
    box-sizing:border-box;
}
.home-reference .hero-bottom .slide-tabs {
    position:static;
    left:auto;
    right:auto;
    transform:none;
    translate:none;
    display:flex;
    flex:0 1 650px;
    min-width:0;
    width:auto;
    max-width:100%;
    margin:0;
    gap:clamp(10px,1.5vw,24px);
}
.home-reference .hero-bottom .slide-tabs button {
    flex:1 1 0;
    min-width:0;
    width:auto;
    margin-left:0;
    margin-right:0;
    box-sizing:border-box;
    white-space:normal;
    overflow-wrap:normal;
}
.home-reference .hero-bottom .slide-controls {
    flex:0 0 auto;
    position:static;
    transform:none;
    margin:0;
    display:flex;
    gap:8px;
}
@media(max-width:600px) {
    .home-reference .hero-bottom.wrap { flex-direction:column;align-items:stretch;gap:14px; }
    .home-reference .hero-bottom .slide-tabs { flex:0 0 auto;width:100%; }
    .home-reference .hero-bottom .slide-tabs button { font-size:12px;line-height:1.4; }
    .home-reference .hero-bottom .slide-controls { align-self:flex-end; }
}
