.hero{background:radial-gradient(circle at 74% 16%,rgba(40,121,238,.13),transparent 27%),linear-gradient(135deg,#f9fbff 0,#eef5ff 48%,#fff8ed 125%)}
.hero-grid{grid-template-columns:.96fr 1.04fr;gap:48px;min-height:700px}
.hero-human{position:relative;min-height:565px;border-radius:34px 110px 34px 34px;overflow:hidden;background:#071b3f;box-shadow:0 35px 80px rgba(7,27,63,.25);isolation:isolate}
.hero-human:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,21,47,.46),transparent 38%),linear-gradient(0deg,rgba(7,21,47,.34),transparent 45%);z-index:1;pointer-events:none}
.hero-human>img{position:absolute;width:100%;height:100%;object-fit:cover;object-position:64% center;z-index:0}
.human-badge{position:absolute;z-index:3;display:flex;align-items:center;gap:11px;padding:12px 15px;border:1px solid rgba(255,255,255,.22);border-radius:14px;background:rgba(5,20,48,.76);color:#fff;box-shadow:0 16px 34px rgba(0,0,0,.22);backdrop-filter:blur(13px)}
.human-badge small,.human-badge strong{display:block}.human-badge small{color:#9db2d0;font-size:10px}.human-badge strong{font-size:13px}.badge-online{top:28px;left:25px}.badge-online>i{width:10px;height:10px;border-radius:50%;background:#36d38a;box-shadow:0 0 0 6px rgba(54,211,138,.13)}.badge-help{right:22px;bottom:24px}.badge-icon{display:grid;place-items:center;width:39px;height:39px;border-radius:11px;background:#f6a623;color:#2c1b00;font-size:10px;font-weight:800}.hero-orbit{position:absolute;z-index:2;border:1px solid rgba(113,175,255,.22);border-radius:50%;pointer-events:none}.orbit-one{width:240px;height:240px;right:-88px;top:-74px;box-shadow:0 0 0 38px rgba(61,137,235,.045)}.orbit-two{width:110px;height:110px;left:-44px;bottom:42px}
.wa-float{position:fixed;right:22px;bottom:22px;z-index:1000;display:flex;align-items:center;gap:10px;padding:9px 16px 9px 9px;border-radius:999px;background:#1f9d67;color:#fff;box-shadow:0 12px 32px rgba(7,21,47,.24);font-size:14px;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease}.wa-float span{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#fff;color:#168457}.wa-float svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.wa-float svg path+path{fill:currentColor;stroke:none}.wa-float strong{font-weight:700}.wa-float:hover{color:#fff;transform:translateY(-2px);box-shadow:0 16px 38px rgba(7,21,47,.3)}
@media(max-width:1000px){.hero-grid{grid-template-columns:.9fr 1.1fr;gap:35px}.hero-human{min-height:520px}}
@media(max-width:760px){.hero-grid{display:block}.hero-human{min-height:440px;margin-top:42px;border-radius:24px 68px 24px 24px}.hero-human>img{object-position:62% center}.human-badge{padding:10px 12px}.badge-online{top:18px;left:16px}.badge-help{right:14px;bottom:14px}.wa-float{right:14px;bottom:14px;padding-right:12px}.wa-float strong{display:none}}

.hero{background:#1599e9 url('/assets/hero-campaign-v3.webp') center center/cover no-repeat;border-bottom:0;color:#fff}
.hero:before{display:none}
.hero-grid{display:block;min-height:650px;padding:92px 0 76px}
.hero-copy{width:49%;position:relative;z-index:2}
.hero .eyebrow{display:inline-flex;align-items:center;padding:10px 16px;margin-bottom:27px;border-radius:999px;background:#fff200;color:#17223a;font-size:11px;letter-spacing:.08em;box-shadow:0 10px 22px rgba(21,65,130,.18)}
.hero h1{color:#fff;font-size:clamp(45px,5.3vw,70px);text-shadow:0 3px 14px rgba(11,78,158,.16)}
.hero h1 em{color:#fff200}
.hero .lead{color:rgba(255,255,255,.92);font-size:18px;max-width:590px}
.hero .button.primary{background:#fff200;color:#16243c;box-shadow:0 10px 22px rgba(23,74,151,.22)}
.hero .button.primary:hover{background:#fff86a}
.hero .button.secondary{color:#fff;background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.7);backdrop-filter:blur(8px)}
.hero-proof{border-color:rgba(255,255,255,.28)}.hero-proof span{color:rgba(255,255,255,.76);border-color:rgba(255,255,255,.24)}.hero-proof b{color:#fff}
@media(max-width:900px){.hero{background-position:59% center}.hero-copy{width:56%}.hero h1{font-size:52px}}
@media(max-width:760px){.hero{background-image:linear-gradient(90deg,rgba(10,112,210,.96),rgba(10,112,210,.68)),url('/assets/hero-campaign-v3.webp');background-position:64% center}.hero-grid{padding:62px 0;min-height:640px}.hero-copy{width:100%}.hero h1{font-size:46px}.hero .lead{max-width:92%}.hero-actions{flex-direction:column;align-items:flex-start}.hero-proof{max-width:90%}}

.payment-showcase{position:relative;overflow:hidden;padding:105px 0;background:linear-gradient(135deg,#eef8ff,#f8fbff 54%,#fff7df)}.payment-showcase:before{content:"";position:absolute;width:420px;height:420px;border-radius:50%;right:-160px;top:-190px;background:radial-gradient(circle,rgba(17,150,232,.18),transparent 68%)}.payment-layout{display:grid;grid-template-columns:1.15fr .85fr;gap:90px;align-items:center;position:relative}.payment-copy h2{margin:0;color:#071b3f;font:800 46px/1.08 'Manrope',sans-serif;letter-spacing:-2.2px;max-width:620px}.payment-copy>p:not(.eyebrow){max-width:620px;color:#627086;font-size:16px}.payment-methods{display:grid;gap:10px;margin:30px 0}.payment-methods article{display:flex;align-items:center;gap:15px;padding:14px 16px;border:1px solid #d8e6f3;border-radius:12px;background:rgba(255,255,255,.82);box-shadow:0 8px 22px rgba(20,65,110,.05)}.payment-methods strong,.payment-methods small{display:block}.payment-methods strong{color:#0a2b58}.payment-methods small{color:#718096}.pay-mark{display:grid;place-items:center;width:48px;height:48px;border-radius:12px;font-weight:900;font-size:12px}.pay-mark.bca{background:#e8f3ff;color:#0867b2}.pay-mark.gopay{background:#e9fbff;color:#00a9cc}.pay-mark.qris{background:#fff0f2;color:#dc2d42}.payment-link{display:inline-flex;gap:16px;align-items:center;color:#116ed2;font-weight:800}.qris-card{position:relative;justify-self:center;width:min(360px,100%);padding:22px;border:1px solid rgba(255,255,255,.86);border-radius:28px;background:rgba(255,255,255,.88);box-shadow:0 28px 65px rgba(20,77,135,.18);backdrop-filter:blur(12px);transform:rotate(1.5deg)}.qris-card img{display:block;width:100%;height:365px;object-fit:cover;object-position:center 57%;border-radius:17px}.qris-card small{display:block;padding:15px 8px 2px;color:#68768b;line-height:1.5}.qris-label{position:absolute;z-index:2;top:36px;left:36px;padding:7px 11px;border-radius:999px;background:#071b3f;color:#fff;font-size:10px;font-weight:800;letter-spacing:.08em}.qris-glow{position:absolute;width:160px;height:160px;right:-35px;bottom:-35px;border-radius:50%;background:#fff200;filter:blur(45px);opacity:.28}.qris-card>*{position:relative}.qris-card .qris-glow{position:absolute}
@media(max-width:900px){.payment-layout{gap:45px}.payment-copy h2{font-size:39px}}
@media(max-width:760px){.payment-showcase{padding:75px 0}.payment-layout{grid-template-columns:1fr}.payment-copy h2{font-size:35px}.qris-card{width:min(330px,100%);transform:none}.qris-card img{height:335px}}

.plans{position:relative;overflow:hidden;background:linear-gradient(180deg,#fff,#f8fbff)}.plans:before{content:"";position:absolute;width:460px;height:460px;left:-260px;top:120px;border-radius:50%;background:radial-gradient(circle,rgba(21,153,233,.12),transparent 68%)}.plans .wrap{position:relative}.plan-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:18px}.plan-card{border:0;border-radius:26px 68px 26px 26px;padding:30px 28px 25px;background:linear-gradient(145deg,#fff,#f3f8ff);box-shadow:0 18px 45px rgba(18,66,119,.1);overflow:hidden}.plan-card:before{content:"";position:absolute;width:115px;height:115px;right:-48px;top:-52px;border-radius:50%;background:rgba(28,130,231,.08);box-shadow:0 0 0 22px rgba(28,130,231,.025)}.plan-card:nth-child(1),.plan-card:nth-child(2){grid-column:span 3;min-height:360px}.plan-card:nth-child(n+3){grid-column:span 2;min-height:430px}.plan-card:nth-child(2),.plan-card:nth-child(4){background:linear-gradient(145deg,#f3fbff,#fff)}.plan-card.featured{border:0;padding:30px 28px 25px;background:linear-gradient(150deg,#0f7bdf,#1765d8);box-shadow:0 24px 55px rgba(21,105,224,.27);color:#fff}.plan-card.featured:before{background:rgba(255,255,255,.13);box-shadow:0 0 0 22px rgba(255,255,255,.035)}.plan-card.featured .plan-title h3,.plan-card.featured .price,.plan-card.featured li b{color:#fff}.plan-card.featured .plan-title p,.plan-card.featured li,.plan-card.featured .price small{color:rgba(255,255,255,.76)}.plan-card.featured ul{border-color:rgba(255,255,255,.18)}.plan-card.featured li:before{color:#fff200}.plan-card.featured>a{background:#fff200;color:#17233a}.plan-card>a{border-radius:999px;padding:13px 16px}.popular{right:26px;top:18px;background:#fff200}.plan-card:hover{transform:translateY(-6px) rotate(-.25deg);box-shadow:0 25px 58px rgba(13,61,112,.15)}
@media(max-width:1000px){.plan-grid{grid-template-columns:repeat(2,1fr)}.plan-card:nth-child(n){grid-column:span 1;min-height:410px}.plan-card:nth-child(5){grid-column:1/-1;min-height:350px}.plan-card:nth-child(4),.plan-card:nth-child(5){transform:none}}
@media(max-width:760px){.plan-grid{grid-template-columns:1fr}.plan-card:nth-child(n){grid-column:auto;min-height:0;border-radius:23px 52px 23px 23px}.plan-card:nth-child(5){grid-column:auto}.plan-card:hover{transform:translateY(-4px)}}
