.bro{position:relative}
.bro-viewport{overflow:hidden}
.bro-track{display:flex;transition:transform .5s ease}
.bro-slide{flex:0 0 100%;min-width:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;min-height:520px;background:linear-gradient(90deg,var(--color_pd,#0f2342) 0,var(--color_pd,#0f2342) 56%,var(--color_pl,#e8e8e8) 56%)}
.bro-slide.no-img{grid-template-columns:1fr;background:var(--color_pd,#0f2342)}
.bro-text{padding:60px 40px 70px 70px;color:#fff}
.bro .bro-meta{margin:0 0 30px;font-size:14px;font-family:Arial,Helvetica,sans-serif;color:#fff}
.bro .bro-cat{color:var(--color_a,#f7a51c);font-weight:700;text-transform:uppercase}
.bro .bro-title{margin:0 0 18px;font-size:40px;line-height:1.2;color:#fff}
.bro .bro-title a,.bro .bro-title a:visited{color:inherit;text-decoration:none}
.bro .bro-title a:hover{text-decoration:underline}
.bro .bro-summary{font-size:19px;line-height:1.5;font-weight:700;color:var(--color_pl,#79acdf)}
.bro-img{display:block;padding:10px;margin:10px 30px 10px 0;border:1px solid var(--color_pl,#6d9fd0)}
.bro-img img{display:block;width:100%;height:auto;aspect-ratio:1/1;max-height:600px;object-fit:cover}
.bro .bro-prev,.bro .bro-next{position:absolute;top:50%;z-index:2;display:inline-flex;align-items:center;justify-content:center;width:60px;height:60px;margin:-30px 0 0;padding:0;border:0;border-radius:50%;cursor:pointer;box-shadow:0 2px 8px rgba(0,0,0,.25)}
.bro .bro-prev{left:0;color:#000;background:#fff}
.bro .bro-next{right:0;color:#fff;background:var(--color_pd,#0f2342)}
.bro .bro-prev:hover,.bro .bro-next:hover{opacity:.85}
.bro-dots{position:absolute;left:0;right:0;bottom:14px;display:flex;justify-content:center;gap:8px}
.bro .bro-dots button{width:8px;height:8px;margin:0;padding:0;border:0;border-radius:50%;background:rgba(150,150,150,.6);cursor:pointer}
.bro .bro-dots button.is-on{background:var(--color_pl,#79acdf)}
@media (max-width:900px){
.bro-slide{grid-template-columns:1fr;min-height:0;background:var(--color_pd,#0f2342)}
.bro-text{padding:36px 24px 20px}
.bro .bro-title{font-size:28px}
.bro-img{margin:0 24px 44px}
.bro .bro-prev,.bro .bro-next{top:auto;bottom:6px;width:44px;height:44px;margin:0}
.bro .bro-prev{left:12px}
.bro .bro-next{right:12px}
}
