/* ===== Variables ===== */
:root{
  --brand:#0b3c7d; --white:#fff; --card-bg:#fff;
  --min-height:300px; --min-height-compact:220px;
  --img-side-width:50%; --text-h-min:72px; --img-h-min:120px;
  --text-h-ratio:40%; --img-h-ratio:60%;
  --radius:14px; --transition:transform .55s cubic-bezier(.22,.9,.28,1);
  --dot-size:12px;
}

/* ===== Base container / track ===== */
#hero, .hero-wrap, .carousel,
#slides { width:100%!important; max-width:100%!important; box-sizing:border-box; padding:0; margin:0; }
#hero, .carousel { overflow:hidden; } /* clip neighbor peeking */

#slides {
  display:flex!important; align-items:center;
  transition:var(--transition); will-change:transform;
  transform:translate3d(0,0,0);
}

/* ===== Slide card ===== */
#slides > .slide-card,
.slides > .slide-card {
  flex:0 0 100%!important; width:100%!important; max-width:100%!important; min-width:0!important;
  box-sizing:border-box; margin:0; overflow:hidden; position:relative;
  display:flex; flex-direction:column;
  border-radius:var(--radius); background:var(--card-bg);
  background-clip:padding-box;
  box-shadow:0 8px 28px rgba(2,6,23,0.06);
}

/* ===== Shared blocks ===== */
.slide-content {
  position:relative; z-index:3;
  padding:36px 18px; box-sizing:border-box;
  background:var(--brand); color:var(--white);
  display:flex; flex-direction:column; justify-content:center; text-align:left;
  border-top-left-radius:var(--radius); border-bottom-left-radius:var(--radius);
}
.slide-content h2{ margin:0; font-size:clamp(20px,5.2vw,34px); line-height:1.08; font-weight:700; max-width:60ch; }
.slide-content p{ margin:6px 0 0; font-size:clamp(13px,3.2vw,16px); opacity:.95; max-width:50ch; }

.slide-img{ overflow:hidden; box-sizing:border-box; min-width:0!important; line-height:0; }
.slide-img img{ display:block; width:100%; height:100%; object-fit:cover; object-position:center; -webkit-backface-visibility:hidden; }

/* ===== Dots ===== */
.dots{ display:flex; justify-content:center; gap:10px; margin:10px 0 20px; }
.dot{ width:var(--dot-size); height:var(--dot-size); border-radius:50%; background:rgba(0,0,0,.08); cursor:pointer; border:0; outline:none; }
.dot:focus{ box-shadow:0 0 0 3px rgba(33,150,243,.18); } 
.dot.active{ background:#2196f3; }

/* ===== Modifier: pinned-right ===== */
.layout--pinned-right #slides > .slide-card { display:block; min-height:var(--min-height); }

/* Blue banner flush on right edge */
.layout--pinned-right .slide-content {
  padding:36px 18px; margin:0;
  padding-right:calc(var(--img-side-width) + 28px);
  align-items:flex-start; text-align:left;
  position:relative; z-index:3;

  /* square on right edge so banner & image meet cleanly */
  border-top-right-radius:0;
  border-bottom-right-radius:0;
  border-top-left-radius:var(--radius);
  border-bottom-left-radius:var(--radius);
}

.layout--pinned-right .slide-img{
  position:absolute; top:0; right:0; bottom:0;
  width:var(--img-side-width);
  z-index:2; overflow:hidden; line-height:0;
  border-top-right-radius:var(--radius);
  border-bottom-right-radius:var(--radius);
}
.layout--pinned-right .slide-img img{ width:100%; height:100%; object-fit:cover; }

/* ===== Modifier: stacked-compact ===== */
.layout--stacked-compact #slides > .slide-card{
  display:flex; flex-direction:column; min-height:var(--min-height-compact); max-height:420px; margin-bottom:24px;
}
.layout--stacked-compact .slide-content{
  flex:0 0 max(calc(var(--text-h-ratio)), var(--text-h-min));
  padding:14px 20px; border-radius:12px 12px 0 0; text-align:left;
}
.layout--stacked-compact .slide-content h2{ font-size:clamp(18px,4.6vw,26px); line-height:1.06; max-height:3.6em; overflow:hidden; }
.layout--stacked-compact .slide-content p{ font-size:clamp(12px,2.8vw,14px); }
.layout--stacked-compact .slide-img{
  flex:0 0 max(calc(var(--img-h-ratio)), var(--img-h-min)); min-height:0;
  border-radius:0 0 12px 12px;
}
.layout--stacked-compact .slide-img img{ width:100%; height:100%; object-fit:cover; }

/* ===== Centered banner ===== */
.banner--centered .slide-content{ align-items:center; text-align:center; padding:16px 20px; }
.banner--centered .slide-content h2{ margin:0 0 6px; font-size:clamp(18px,4.6vw,24px); }

/* ===== Responsive fallbacks ===== */
@media (max-width:520px){
  .layout--pinned-right .slide-img{
    position:relative; width:100%; height:220px; border-radius:0 0 var(--radius) var(--radius);
  }
  .layout--pinned-right .slide-content{
    margin-right:0; padding:20px;
    border-radius:var(--radius) var(--radius) 0 0;
  }
}
@media (max-width:420px){
  .layout--stacked-compact #slides > .slide-card{ min-height:180px; max-height:none; }
  .layout--stacked-compact .slide-content{ padding:12px 16px; flex:0 0 auto; }
  .layout--stacked-compact .slide-img{ flex:0 0 140px; height:140px; }
}

/* ===== Prefers reduced motion ===== */
@media (prefers-reduced-motion:reduce){ #slides{ transition:none; } }