.heroFinal{--wf-x:50%;--wf-y:-20%;--wf-tilt:0deg;--wf-depth:1;--wf-flight-opacity:0;--wf-touch-opacity:0;--wf-touch-y:-42px;--wf-crouch-rise:1;--wf-land-opacity:0;--wf-landing-lift:50px;--wf-shadow-opacity:0;--wf-shadow-scale:.35;position:relative;isolation:isolate;overflow:hidden;min-height:570px;height:min(680px,calc(100vh - 105px));border:1px solid #fff;border-radius:34px;background:radial-gradient(circle at 84% 18%,#74d7ff70 0,transparent 27%),radial-gradient(circle at 68% 76%,#ffffffb8 0,transparent 26%),linear-gradient(145deg,#fbfeff 0%,#e9f8ff 56%,#c7ecff 100%);box-shadow:0 24px 70px #0a6b9b21}
.heroFinal:before{content:"";position:absolute;z-index:0;inset:auto -5% -8% 34%;height:42%;background:repeating-linear-gradient(90deg,#fff0 0 8%,#fff8 8.5% 10%);clip-path:polygon(0 100%,0 72%,12% 65%,22% 78%,34% 40%,46% 70%,58% 20%,70% 55%,82% 4%,100% 48%,100% 100%);opacity:.5}
.heroFinal:after{content:"";position:absolute;z-index:0;inset:0;background-image:radial-gradient(circle,#087faa22 1.2px,transparent 1.4px),linear-gradient(115deg,transparent 0 52%,#48b9da20 52.2% 52.5%,transparent 52.7% 100%);background-size:28px 28px,100% 100%;opacity:.62}
.heroFinal .heroCopy{position:relative;z-index:4;width:63%;padding:54px 24px 250px 44px}.heroFinal .eyebrow{display:block;margin-bottom:16px;color:#0586af;font-size:13px;font-weight:900;letter-spacing:.17em}.heroFinal h1{position:relative;z-index:2;margin:0;max-width:650px;color:#054f7d;font:600 clamp(42px,5vw,68px)/1.01 Georgia,"Times New Roman",serif;letter-spacing:-.045em;text-wrap:balance}.heroFinal .heroCopy p{max-width:590px;margin:24px 0 19px;font-size:17px;line-height:1.55;color:#567b8e}.heroFinal .badges{display:flex;flex-wrap:wrap;gap:9px}.heroFinal .badges span{padding:8px 12px;border-radius:999px;background:#ffffffdc;color:#087267;font-size:12px;font-weight:800}
.wf-finance-scene{position:absolute;z-index:1;right:4%;bottom:12%;width:39%;height:42%;opacity:.76;pointer-events:none;perspective:760px}.wf-finance-bars{position:absolute;inset:17% 5% 0;display:flex;align-items:flex-end;justify-content:space-around;gap:5%;border-bottom:1px solid #ffffffd0;transform:rotateX(4deg) rotateY(-7deg);filter:drop-shadow(14px 16px 18px #08699129)}.wf-finance-bars i{position:relative;display:block;width:11%;border:1px solid #ffffffcf;border-bottom:0;border-radius:10px 10px 2px 2px;background:linear-gradient(90deg,#1b94c861,#bff4ffb8 48%,#2189c378);box-shadow:inset 5px 0 8px #ffffff70,inset -5px 0 8px #075c8a31,0 8px 16px #087ca72c}.wf-finance-bars i:nth-child(1){height:27%}.wf-finance-bars i:nth-child(2){height:42%}.wf-finance-bars i:nth-child(3){height:36%}.wf-finance-bars i:nth-child(4){height:61%}.wf-finance-bars i:nth-child(5){height:82%}.wf-growth-line{position:absolute;z-index:2;inset:0;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 0 5px #51d5f0) drop-shadow(0 7px 8px #087aa34a)}.wf-growth-line polyline{fill:none;stroke:url(#wfGrowthStroke);stroke-width:5;stroke-linecap:round;stroke-linejoin:round;opacity:.9}.wf-growth-line circle{fill:#fff;stroke:#0c8fc0;stroke-width:3}
.wf-flight{position:absolute;z-index:1;inset:0;opacity:var(--wf-flight-opacity)}.wf-flight.wf-front{z-index:5}.wf-front-phase .wf-flight.wf-back,.wf-back-phase .wf-flight.wf-front{visibility:hidden}.wf-flight img{position:absolute;left:var(--wf-x);top:var(--wf-y);width:clamp(240px,24vw,310px);transform:translate(-50%,-50%) rotate(var(--wf-tilt)) scale(var(--wf-depth));filter:drop-shadow(0 13px 17px #06476d35)}
.wf-touchdown{position:absolute;z-index:6;inset:0;opacity:var(--wf-touch-opacity);transform:translateY(calc(var(--wf-touch-y) - var(--wf-landing-lift)));transform-origin:74% 96%}.wf-land-frame,.wf-wave-frame{position:absolute;left:74%;bottom:3%;width:clamp(276px,25vw,320px);transform:translateX(-50%);filter:drop-shadow(0 18px 22px #06476d20);opacity:0}.wf-land-frame:nth-child(3){transform:translateX(-50%) scaleY(var(--wf-crouch-rise));transform-origin:50% 100%}.wf-landing{position:absolute;z-index:6;inset:0;opacity:var(--wf-land-opacity);transform:translateY(calc(0px - var(--wf-landing-lift)));transform-origin:74% 96%}.wf-wave-frame:nth-child(2){margin-left:-6px}.wf-wave-frame:nth-child(3){margin-left:5px}.wf-wave-frame:nth-child(4){margin-left:6px}.wf-wave-frame:nth-child(5){margin-left:-1px}.wf-wave-1 .wf-wave-frame:nth-child(1),.wf-wave-2 .wf-wave-frame:nth-child(2),.wf-wave-3 .wf-wave-frame:nth-child(3),.wf-wave-4 .wf-wave-frame:nth-child(4),.wf-wave-5 .wf-wave-frame:nth-child(5),.wf-blinking .wf-blink-frame{opacity:1}.wf-blinking .wf-wave-frame:nth-child(1){opacity:0}
.wf-platform{position:absolute;z-index:2;left:74%;bottom:calc(.2% + var(--wf-landing-lift));width:29%;height:9%;transform:translateX(-50%) scaleX(var(--wf-shadow-scale));border:1px solid #ffffffb8;border-radius:50%;background:radial-gradient(ellipse,#0b527e6e 0,#36a7d05c 38%,#b9efff61 62%,transparent 74%);box-shadow:inset 0 7px 14px #ffffff90,0 12px 28px #0a729545;opacity:var(--wf-shadow-opacity)}.wf-platform span{position:absolute;left:9%;right:9%;bottom:-8px;height:48%;border-radius:50%;background:linear-gradient(180deg,#7de4fb4f,#087fa81f)}.wf-settled .wf-landing{animation:wfIdle 3.8s ease-in-out infinite}@keyframes wfIdle{0%,100%{transform:translateY(calc(0px - var(--wf-landing-lift)))}50%{transform:translateY(calc(-2px - var(--wf-landing-lift)))}}
@media(max-width:720px){.heroFinal{height:780px;min-height:780px;border-radius:27px}.heroFinal .heroCopy{width:100%;padding:36px 24px 20px}.heroFinal h1{font-size:clamp(38px,11.4vw,54px)}.heroFinal .heroCopy p{font-size:14px}.wf-flight img{width:clamp(180px,50vw,220px)}.wf-touchdown,.wf-landing{transform-origin:50% 96%}.wf-land-frame,.wf-wave-frame{left:50%;bottom:3%;width:clamp(190px,53vw,220px)}.wf-finance-scene{right:7%;bottom:11%;width:86%;height:32%;opacity:.58}.wf-wave-frame:nth-child(2){margin-left:-4px}.wf-wave-frame:nth-child(3){margin-left:3px}.wf-wave-frame:nth-child(4){margin-left:4px}.wf-wave-frame:nth-child(5){margin-left:-1px}.wf-platform{left:50%;width:58%}}
@media(prefers-reduced-motion:reduce){.wf-flight,.wf-touchdown{display:none}.wf-landing,.wf-platform{opacity:1!important}.wf-landing .wf-wave-frame{display:none}.wf-landing .wf-wave-frame:nth-child(3){display:block;opacity:1!important}}

/* Penempatan final untuk kartu hero aplikasi: teks dan area Wira dipisahkan. */
@media(min-width:831px){
  .hero.heroFinal{height:830px;min-height:830px;padding:0}
  .heroFinal .heroCopy{width:100%;max-width:100%;padding:42px 27px 315px}
  .heroFinal h1{font-size:34px;line-height:1.02}
  .heroFinal .heroCopy p{font-size:14px;line-height:1.5;margin:18px 0 14px}
  .heroFinal .badges{margin-top:14px;gap:7px}
  .heroFinal .badges span{padding:7px 9px;font-size:10px}
  .wf-flight img{width:205px}
  .wf-touchdown,.wf-landing{transform-origin:50% 96%}
  .wf-land-frame,.wf-wave-frame{left:50%;bottom:3%;width:205px}
  .wf-finance-scene{right:6%;bottom:10%;width:88%;height:30%;opacity:.62}
  .wf-platform{left:50%;width:64%}
}
@media(max-width:830px){
  .hero.heroFinal{display:block;height:663px;min-height:663px;padding:0;text-align:left!important}
  .heroFinal .heroCopy{width:100%;max-width:100%;padding:30px 22px 285px}
  .heroFinal h1{max-width:100%;font-size:clamp(32px,8.6vw,38px);line-height:1.03;margin:12px 0}
  .heroFinal .heroCopy p{max-width:100%;font-size:14px;line-height:1.48;margin:18px 0 14px}
  .heroFinal .badges{margin-top:14px;gap:7px}
  .heroFinal .badges span{padding:7px 9px;font-size:10px}
  .wf-flight img{width:clamp(165px,46vw,195px)}
  .wf-land-frame,.wf-wave-frame{left:50%;bottom:2%;width:clamp(180px,50vw,200px)}
  .wf-finance-scene{right:6%;bottom:9%;width:88%;height:29%;opacity:.58}
  .wf-platform{left:50%;bottom:calc(0% + var(--wf-landing-lift));width:62%}
}
@media(max-width:390px){
  .hero.heroFinal{height:648px;min-height:648px}
  .heroFinal .heroCopy{padding:27px 18px 275px}
  .heroFinal h1{font-size:31px}
  .heroFinal .heroCopy p{font-size:13px}
  .wf-land-frame,.wf-wave-frame{width:184px}
}
