.abi-bn-wrap{display:block;width:100%;margin:0 0 1.5em;padding:0;clear:both}
.abi-bn{--abi-b1:#0047BB;--abi-b2:#0773E6;--abi-b3:#00AAFF;--abi-o1:#FFC800;--abi-o2:#FFA010;--abi-o3:#FF6B1A;
 position:relative;display:block;width:100%;aspect-ratio:var(--abi-ar-d);min-height:var(--abi-min-d);
 border-radius:var(--abi-r);overflow:hidden;isolation:isolate;container-type:inline-size;container-name:abi;
 color:#fff;font-family:inherit;font-size:16px;line-height:1.3;text-align:left;touch-action:pan-y;
 box-shadow:0 18px 50px -18px rgba(7,115,230,.55)}
.abi-bn.is-full{border-radius:0;box-shadow:none;max-width:none}
.abi-bn *,.abi-bn *::before,.abi-bn *::after{box-sizing:border-box}
.abi-bn:focus-visible{outline:3px solid var(--abi-o2);outline-offset:-3px}

/* slide */
.abi-bn .abi-bn__slide{position:absolute;inset:0;overflow:hidden;opacity:0;visibility:hidden;transition:opacity .9s ease,visibility 0s .9s;background:linear-gradient(120deg,var(--abi-b1),var(--abi-b2) 55%,var(--abi-b3))}
.abi-bn .abi-bn__slide.is-g1{background:linear-gradient(140deg,#0A3FA8,#0773E6 60%,#19B4FF)}
.abi-bn .abi-bn__slide.is-g2{background:radial-gradient(circle at 85% 95%,rgba(255,107,26,.4),transparent 45%),linear-gradient(120deg,var(--abi-b1),var(--abi-b2) 60%,var(--abi-b3))}
.abi-bn .abi-bn__slide.is-active{opacity:1;visibility:visible;transition:opacity .9s ease}
.abi-bn--slide .abi-bn__slide{opacity:1;visibility:visible;transition:transform .85s cubic-bezier(.77,0,.18,1)}
.abi-bn--slide .abi-bn__slide.is-after{transform:translateX(100%)}
.abi-bn--slide .abi-bn__slide.is-before{transform:translateX(-100%)}
.abi-bn--slide .abi-bn__slide.is-active{transform:none}

/* gambar: tampil penuh (contain) + latar blur supaya tidak ada ruang kosong */
.abi-bn .abi-bn__fill{position:absolute;inset:-6%;background-size:cover;background-position:center;background-image:var(--abi-fill);filter:blur(26px) saturate(1.15);opacity:.95}
.abi-bn .abi-bn__pic{position:absolute;inset:0;display:block;margin:0;padding:0}
.abi-bn .abi-bn__pic img{position:absolute;inset:0;display:block;width:100%;height:100%;max-width:none;margin:0;padding:0;border:0;border-radius:0;box-shadow:none;object-fit:var(--abi-fit);object-position:center}
.abi-bn .abi-bn__ov{position:absolute;inset:0;background:linear-gradient(100deg,rgba(0,45,130,var(--abi-ov)) 0%,rgba(7,115,230,calc(var(--abi-ov)*.6)) 55%,rgba(0,170,255,.05) 100%)}
.abi-bn .abi-bn__slide.is-center .abi-bn__ov{background:linear-gradient(180deg,rgba(0,45,130,calc(var(--abi-ov)*.85)),rgba(7,115,230,var(--abi-ov)))}
.abi-bn .abi-bn__cover{position:absolute;inset:0;z-index:4;display:block}

/* dekorasi (hanya slide tanpa gambar) */
.abi-bn .abi-bn__deco{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.abi-bn .abi-bn__mtn{position:absolute;left:0;bottom:0;width:100%;height:24%;fill:rgba(255,255,255,.08)}
.abi-bn .abi-bn__arc{position:absolute;inset:0;width:100%;height:100%}
.abi-bn .abi-bn__arc path{fill:none;stroke:var(--abi-o2);stroke-width:4;stroke-linecap:round;stroke-dasharray:2 16;opacity:.5;vector-effect:non-scaling-stroke}
.abi-bn .is-active .abi-bn__arc path{animation:abiDash 1.4s linear infinite}
.abi-bn .abi-bn__sun{position:absolute;right:-3%;bottom:-24%;width:clamp(120px,26vw,340px);width:clamp(120px,26cqw,340px);aspect-ratio:1;border-radius:50%;background:linear-gradient(160deg,var(--abi-o1),var(--abi-o2) 55%,var(--abi-o3));box-shadow:0 0 80px 10px rgba(255,170,20,.3);opacity:0}
.abi-bn .is-active .abi-bn__sun{animation:abiSun 1.2s cubic-bezier(.2,.8,.2,1) both,abiFloat 6s 1.2s ease-in-out infinite}
.abi-bn .abi-bn__plane{position:absolute;width:clamp(26px,4vw,52px);width:clamp(26px,4.2cqw,52px);fill:#fff;filter:drop-shadow(0 4px 8px rgba(0,30,90,.35));left:-6%;top:78%;opacity:0}
.abi-bn .is-active .abi-bn__plane{animation:abiFly 4.5s .4s cubic-bezier(.3,.6,.3,1) both}
@keyframes abiSun{from{transform:translateY(60px) scale(.6);opacity:0}to{transform:none;opacity:.9}}
@keyframes abiFloat{0%,100%{transform:none}50%{transform:translateY(-10px)}}
@keyframes abiDash{to{stroke-dashoffset:-36}}
@keyframes abiFly{0%{left:-6%;top:78%;opacity:0;transform:rotate(66deg)}12%{opacity:1}100%{left:88%;top:14%;opacity:1;transform:rotate(66deg)}}

/* teks */
.abi-bn .abi-bn__in{position:absolute;inset:0;z-index:3;display:flex;align-items:center;padding:0 clamp(56px,7vw,110px) 28px}
.abi-bn .is-center .abi-bn__in{justify-content:center;text-align:center}
.abi-bn .abi-bn__tx{max-width:660px;min-width:0}
.abi-bn .is-center .abi-bn__tx{max-width:780px}
.abi-bn .abi-bn__badge{display:inline-flex;align-items:center;gap:8px;margin:0 0 14px;padding:6px 14px;border-radius:99px;background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.35);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);font-size:13px;font-weight:600;letter-spacing:.02em;color:#fff}
.abi-bn .abi-bn__badge::before{content:"";width:8px;height:8px;border-radius:50%;background:linear-gradient(var(--abi-o1),var(--abi-o3));box-shadow:0 0 0 4px rgba(255,160,16,.3)}
.abi-bn .abi-bn__ttl{margin:0 0 12px;padding:0;font-size:clamp(22px,3.4vw,52px);font-size:clamp(22px,4.2cqw,56px);line-height:1.1;font-weight:800;letter-spacing:-.02em;color:#fff;text-shadow:0 2px 18px rgba(0,30,90,.35)}
.abi-bn .abi-bn__hl{background:linear-gradient(90deg,var(--abi-o1),var(--abi-o2));-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;text-shadow:none}
.abi-bn .abi-bn__dsc{margin:0;padding:0;max-width:560px;font-size:clamp(13px,1.3vw,18px);font-size:clamp(13px,1.6cqw,19px);line-height:1.55;color:rgba(255,255,255,.96);text-shadow:0 1px 8px rgba(0,30,90,.3);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.abi-bn .is-center .abi-bn__dsc{margin:0 auto}
.abi-bn .abi-bn__cta{display:flex;flex-wrap:wrap;gap:12px;margin:20px 0 0;padding:0}
.abi-bn .is-center .abi-bn__cta{justify-content:center}
.abi-bn a.abi-bn__btn{display:inline-flex;align-items:center;justify-content:center;margin:0;padding:13px 24px;border-radius:99px;font-family:inherit;font-weight:700;font-size:15px;line-height:1;letter-spacing:0;text-transform:none;text-decoration:none!important;transition:transform .25s,box-shadow .25s,background .25s,color .25s}
.abi-bn a.abi-bn__btn.is-primary,.abi-bn a.abi-bn__btn.is-primary:hover,.abi-bn a.abi-bn__btn.is-primary:focus,.abi-bn a.abi-bn__btn.is-primary:visited{background:linear-gradient(135deg,#FFC800,#FFA010 60%,#FF8A1F);color:#06285F!important;border:0;box-shadow:0 10px 24px -8px rgba(255,107,26,.75)}
.abi-bn a.abi-bn__btn.is-primary:hover{transform:translateY(-3px);box-shadow:0 16px 30px -8px rgba(255,107,26,.85)}
.abi-bn a.abi-bn__btn.is-ghost,.abi-bn a.abi-bn__btn.is-ghost:visited{background:rgba(255,255,255,.12);border:1.5px solid rgba(255,255,255,.75);color:#fff!important;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.abi-bn a.abi-bn__btn.is-ghost:hover,.abi-bn a.abi-bn__btn.is-ghost:focus{background:#fff;color:#0773E6!important;transform:translateY(-3px)}
.abi-bn a.abi-bn__btn:focus-visible{outline:3px solid #fff;outline-offset:2px}
.abi-bn .abi-bn__slide.is-active .abi-bn__badge{animation:abiUp .7s .2s both}
.abi-bn .abi-bn__slide.is-active .abi-bn__ttl{animation:abiUp .8s .35s both}
.abi-bn .abi-bn__slide.is-active .abi-bn__dsc{animation:abiUp .8s .5s both}
.abi-bn .abi-bn__slide.is-active .abi-bn__cta{animation:abiUp .8s .65s both}
@keyframes abiUp{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}

/* kontrol (button di-reset agar tidak tertimpa style tema) */
.abi-bn .abi-bn__nav,.abi-bn .abi-bn__dot{all:unset;box-sizing:border-box;cursor:pointer}
.abi-bn .abi-bn__nav{position:absolute;top:50%;z-index:5;width:46px;height:46px;border-radius:50%;border:1.5px solid rgba(255,255,255,.55);background:rgba(255,255,255,.16);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);display:grid;place-items:center;transform:translateY(-50%);transition:background .25s,transform .25s,border-color .25s}
.abi-bn .abi-bn__nav:hover,.abi-bn .abi-bn__nav:focus{background:linear-gradient(135deg,var(--abi-o2),var(--abi-o3));border-color:transparent;transform:translateY(-50%) scale(1.08)}
.abi-bn .abi-bn__nav.is-prev{left:16px}
.abi-bn .abi-bn__nav.is-next{right:16px}
.abi-bn .abi-bn__nav svg{width:20px;height:20px;stroke:#fff;fill:none;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.abi-bn .abi-bn__dots{position:absolute;z-index:5;left:clamp(56px,7vw,110px);bottom:20px;display:flex;gap:8px}
.abi-bn .abi-bn__dot{width:10px;height:10px;border-radius:99px;background:rgba(255,255,255,.55);transition:width .35s,background .35s}
.abi-bn .abi-bn__dot.is-on{width:34px;background:linear-gradient(90deg,var(--abi-o1),var(--abi-o2))}
.abi-bn .abi-bn__nav:focus-visible,.abi-bn .abi-bn__dot:focus-visible{outline:3px solid #fff;outline-offset:2px}
.abi-bn .abi-bn__cnt{position:absolute;z-index:5;right:clamp(56px,5vw,80px);bottom:14px;font-size:13px;font-weight:700;letter-spacing:.1em;color:#fff;text-shadow:0 1px 6px rgba(0,30,90,.4)}
.abi-bn .abi-bn__cnt b{color:var(--abi-o1);font-size:18px}
.abi-bn .abi-bn__prog{position:absolute;z-index:6;left:0;right:0;bottom:0;height:4px;background:rgba(255,255,255,.2)}
.abi-bn .abi-bn__prog i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--abi-o1),var(--abi-o3))}
.abi-bn.is-run .abi-bn__prog i{animation:abiProg var(--abi-dur) linear forwards}
.abi-bn.is-paused .abi-bn__prog i{animation-play-state:paused}
.abi-bn--nopg .abi-bn__prog{opacity:0}
@keyframes abiProg{from{width:0}to{width:100%}}

/* wadah sempit (kolom tema kecil) */
@container abi (max-width:700px){
 .abi-bn .abi-bn__in{padding:0 56px 34px}
 .abi-bn .abi-bn__badge{font-size:12px;padding:5px 12px;margin-bottom:10px}
 .abi-bn .abi-bn__dsc{-webkit-line-clamp:2}
 .abi-bn .abi-bn__cta{margin-top:14px;gap:8px}
 .abi-bn a.abi-bn__btn{padding:11px 18px;font-size:13px}
 .abi-bn .abi-bn__nav{width:38px;height:38px}
 .abi-bn .abi-bn__nav.is-prev{left:10px}
 .abi-bn .abi-bn__nav.is-next{right:10px}
 .abi-bn .abi-bn__dots{left:56px;bottom:14px}
 .abi-bn .abi-bn__sun{opacity:.6}
}
@container abi (max-width:480px){
 .abi-bn .abi-bn__nav{display:none}
 .abi-bn .abi-bn__in{padding:0 22px 40px}
 .abi-bn .abi-bn__dots{left:22px}
 .abi-bn .abi-bn__cnt{right:22px}
 .abi-bn .abi-bn__dsc{display:none}
}
@media(max-width:640px){
 .abi-bn{aspect-ratio:var(--abi-ar-m);min-height:var(--abi-min-m)}
 .abi-bn .abi-bn__fill{background-image:var(--abi-fill-m,var(--abi-fill))}
}
@media(prefers-reduced-motion:reduce){
 .abi-bn *,.abi-bn *::before,.abi-bn *::after{animation:none!important;transition-duration:.01ms!important}
 .abi-bn .abi-bn__sun{opacity:.9}
 .abi-bn .abi-bn__plane{opacity:1;left:88%;top:14%;transform:rotate(66deg)}
}