/* V2.2.0 Corporate Hero Slider and premium text outline */
.hero-bg{background:none!important;overflow:hidden;z-index:-2}
.hero-slide-bg{position:absolute;inset:0;background-color:#1b384e;background-size:cover;background-position:center;opacity:0;transform:scale(1.025);transition:opacity 1150ms ease,transform 7s ease;will-change:opacity}
.hero-slide-bg.is-active{opacity:1;transform:scale(1.075)}
.hero-bg:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,rgba(3,16,28,.89) 0%,rgba(4,21,35,.84) 32%,rgba(5,24,40,.59) 64%,rgba(5,20,33,.38) 100%),linear-gradient(0deg,rgba(3,12,23,.30),transparent 36%)}
.hero[data-outline="soft"] #heroTitle,.hero[data-outline="soft"] #heroTitle em{-webkit-text-stroke:.7px rgba(2,13,24,.78);paint-order:stroke fill;text-shadow:0 3px 15px rgba(0,0,0,.7),0 1px 3px rgba(0,0,0,.9)}
.hero[data-outline="strong"] #heroTitle,.hero[data-outline="strong"] #heroTitle em{-webkit-text-stroke:1.45px #091c2c;paint-order:stroke fill;text-shadow:0 4px 16px rgba(0,0,0,.95),0 2px 5px rgba(0,0,0,.92)}
.hero[data-outline="off"] #heroTitle,.hero[data-outline="off"] #heroTitle em{-webkit-text-stroke:0;text-shadow:none}
.hero[data-outline="soft"] #heroDescription{text-shadow:0 2px 8px rgba(0,0,0,.95),0 0 2px #061624}
.hero[data-outline="strong"] #heroDescription{-webkit-text-stroke:.22px rgba(4,16,28,.75);text-shadow:0 2px 9px #02101b,0 0 3px #02101b}
.hero[data-outline="off"] #heroDescription{text-shadow:none}
.hero .eyebrow-light,.hero-promises{filter:drop-shadow(0 2px 5px rgba(0,0,0,.54))}
.hero-text-in{animation:heroTextEnter .66s cubic-bezier(.2,.6,.3,1) both}
@keyframes heroTextEnter{from{opacity:.5;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
/* V2.2.1 — Navigation minimalis: panah di sisi gambar, indikator di tengah bawah. */
.hero-slider-controls{
 position:absolute;inset:0;z-index:5;display:block;
 padding:0;border:0;background:transparent;box-shadow:none;backdrop-filter:none;
 pointer-events:none;
}
.hero-slider-controls[hidden]{display:none!important}
.hero-arrow{
 position:absolute;top:51%;width:40px;height:40px;min-width:0;min-height:0;
 display:grid;place-items:center;border-radius:50%;
 border:1px solid rgba(255,255,255,.25);color:#fff;
 background:rgba(9,24,36,.17);backdrop-filter:blur(3px);
 box-shadow:none;opacity:.72;cursor:pointer;pointer-events:auto;
 transform:translateY(-50%);transition:background .2s,border-color .2s,opacity .2s,transform .2s;
}
.hero-arrow-prev{left:clamp(10px,1.5vw,26px)}
.hero-arrow-next{right:clamp(10px,1.5vw,26px)}
.hero-arrow svg{display:block}
.hero-arrow:hover{opacity:1;background:rgba(7,24,36,.58);border-color:rgba(255,255,255,.74);transform:translateY(-50%) scale(1.06)}
.hero-arrow:focus-visible,.hero-dot:focus-visible{outline:3px solid #e6ba77;outline-offset:3px;opacity:1}
.hero-dots{
 position:absolute;bottom:66px;left:50%;transform:translateX(-50%);
 display:flex;align-items:center;justify-content:center;gap:11px;
 margin:0;padding:0;background:none;border:0;pointer-events:auto;
}
.hero-dot{
 display:block;width:7px;height:7px;min-width:7px;min-height:7px;
 padding:0;border:0;border-radius:10px;background:rgba(255,255,255,.6);
 box-shadow:0 1px 7px rgba(0,0,0,.35);
 cursor:pointer;transition:width .25s,background .25s,opacity .25s;
}
.hero-dot:hover{background:#fff}
.hero-dot.is-active{width:25px;background:#e9bc77}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;clip-path:inset(50%)}
@media(max-width:680px){
 .hero-slide-bg{background-position:61% center}
 .hero-bg:after{background:linear-gradient(90deg,rgba(3,16,28,.91) 0%,rgba(4,21,35,.77) 58%,rgba(4,21,35,.54) 100%),linear-gradient(0deg,rgba(3,12,23,.35),transparent 50%)}
 .hero-arrow{top:auto;bottom:67px;width:34px;height:34px;opacity:.67;transform:none;background:rgba(10,28,42,.14)}
 .hero-arrow-prev{left:20px}.hero-arrow-next{right:20px}
 .hero-arrow:hover{transform:scale(1.06)}
 .hero-dots{bottom:80px;gap:9px}
 .hero-dot{width:7px;height:7px;min-width:7px;min-height:7px}
 .hero-dot.is-active{width:22px}
}
@media(max-width:390px){.hero-arrow{bottom:61px}.hero-arrow-prev{left:15px}.hero-arrow-next{right:15px}.hero-dots{bottom:74px}}
@media(prefers-reduced-motion:reduce){
 .hero-slide-bg,.hero-dot,.hero-arrow{transition:none!important;transform:none!important}
 .hero-text-in{animation:none!important}
}