html{scroll-behavior:smooth}
body{margin:0;background:#FFFFFF}
*{box-sizing:border-box}
img{max-width:100%}
a{color:#023C89}
a:hover{color:#0B2F6B}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #0880E8;outline-offset:2px}
@media (max-width:640px){
 h1{font-size:38px !important}
 h2{font-size:30px !important}
 header nav{gap:14px !important}
}
.page{background: #FFFFFF; font-family: Inter, sans-serif; color: #1A2A33; min-width: 0}
.site-header{border-bottom: 1px solid #DBE8F8; background: #FFFFFF}
.header-inner{max-width: 1200px; margin: 0 auto; padding: 18px 24px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px}
.brand{display: flex; align-items: center; gap: 18px}
.brand a{display: flex; align-items: center; line-height: 0; text-decoration: none}
.brand-logo-ascentum{height: 22px; width: auto; display: block}
.brand-divider{width: 1px; height: 28px; background: #C9D4DE}
.brand-logo-netsuite{height: 26px; width: auto; display: block}
.header-nav{display: flex; flex-wrap: wrap; align-items: center; gap: 24px; font-size: 14px; font-weight: 500}
.lang{display: flex; border: 1.5px solid #d7dde6; border-radius: 999px; overflow: hidden}
.lang button{border: 0; background: #fff; font: 700 13px Inter, sans-serif; padding: 8px 14px; cursor: pointer; color: #1a2a33; min-height: 36px; min-width: 42px}
.lang button[aria-pressed="true"]{background: #0B2F6B; color: #fff}
html[data-lang="id"] .en{display: none}
html[data-lang="en"] .id{display: none}
.nav-link{color: #1A2A33; text-decoration: none}
.nav-cta{background: #C30008; color: #FFFFFF; text-decoration: none; font-weight: 600; padding: 12px 18px; border-radius: 4px}
.hero{background: #0B2F6B; color: #FFFFFF}
.hero-inner{max-width: 1200px; margin: 0 auto; padding: 80px 24px 72px; display: flex; flex-wrap: wrap; gap: 56px; align-items: center}
.hero-copy{flex: 999 1 520px; min-width: 0; display: flex; flex-direction: column; gap: 22px}
.hero-kicker{display: flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 600; letter-spacing: 2px; color: #A9CBF5; text-transform: uppercase}
.hero-dot{width: 10px; height: 10px; background: #C30008; display: inline-block}
.hero-title{margin: 0; font-family: Raleway, sans-serif; font-weight: 800; font-size: 56px; line-height: 1.05; letter-spacing: -0.5px}
.hero-lead{margin: 0; font-size: 18px; line-height: 1.6; color: #E8F1F4; max-width: 600px}
.hero-actions{display: flex; flex-wrap: wrap; gap: 12px; margin-top: 6px}
.btn-primary{background: #C30008; color: #FFFFFF; text-decoration: none; font-weight: 600; font-size: 15px; padding: 15px 24px; border-radius: 4px}
.btn-outline-light{border: 1px solid #5E86C4; color: #FFFFFF; text-decoration: none; font-weight: 600; font-size: 15px; padding: 15px 24px; border-radius: 4px}
.hero-card{flex: 1 1 340px; min-width: 0; background: #FFFFFF; color: #1A2A33; border-radius: 6px; padding: 28px; display: flex; flex-direction: column; gap: 18px}
.card-kicker{font-size: 12px; font-weight: 600; letter-spacing: 1.5px; color: #023C89; text-transform: uppercase}
.timeline{display: flex; flex-direction: column; gap: 14px}
.timeline-row{display: flex; flex-direction: column; gap: 6px}
.timeline-label{display: flex; justify-content: space-between; font-size: 14px; font-weight: 600}
.timeline-weeks{color: #023C89}
.timeline-track{height: 10px; background: #DBE8F8; border-radius: 5px}
.timeline-fill-basic{width: 57%; height: 10px; background: #0880E8; border-radius: 5px}
.timeline-fill-standard{width: 79%; height: 10px; background: #023C89; border-radius: 5px}
.timeline-fill-advance{width: 100%; height: 10px; background: #0B2F6B; border-radius: 5px}
.card-note{font-size: 13px; line-height: 1.5; color: #4B5670; border-top: 1px solid #DBE8F8; padding-top: 14px}
.offer-bar{background: #023C89}
.offer-inner{max-width: 1200px; margin: 0 auto; padding: 16px 24px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px}
.offer-title{display: flex; align-items: center; gap: 12px; font-size: 15px; font-weight: 600}
.offer-badge{background: #C30008; color: #FFFFFF; font-size: 11px; font-weight: 700; letter-spacing: 1.5px; padding: 5px 10px; border-radius: 3px; text-transform: uppercase}
.offer-note{color: #FFFFFF; font-size: 14px; font-weight: 600}
.benefits{background: #F4F7FB; border-bottom: 1px solid #DBE8F8}
.benefits-grid{max-width: 1200px; margin: 0 auto; padding: 40px 24px; display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 24px}
.benefit{display: flex; gap: 14px; align-items: flex-start}
.benefit-icon{width: 44px; height: 44px; flex-shrink: 0; border-radius: 50%; background: #0B2F6B; color: #FFFFFF; display: flex; align-items: center; justify-content: center}
.benefit-copy{display: flex; flex-direction: column; gap: 4px}
.benefit-title{font-family: Raleway, sans-serif; font-weight: 700; font-size: 16px; color: #0B2F6B}
.benefit-text{font-size: 14px; line-height: 1.5; color: #4B5670}
.packages{max-width: 1200px; margin: 0 auto; padding: 88px 24px 40px; display: flex; flex-direction: column; gap: 40px}
.section-intro{display: flex; flex-direction: column; gap: 12px; max-width: 720px}
.eyebrow{font-size: 12px; font-weight: 600; letter-spacing: 2px; color: #023C89; text-transform: uppercase}
.section-title{margin: 0; font-family: Raleway, sans-serif; font-weight: 800; font-size: 40px; line-height: 1.1; color: #0B2F6B}
.section-lead{margin: 0; font-size: 17px; line-height: 1.6; color: #4B5670}
.package-grid{display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 24px; align-items: stretch}
.package-card{border: 1px solid #DBE8F8; border-radius: 6px; padding: 32px 28px; display: flex; flex-direction: column; gap: 20px; background: #FFFFFF}
.package-head{display: flex; flex-direction: column; gap: 8px}
.package-name{font-family: Raleway, sans-serif; font-weight: 800; font-size: 28px; color: #0B2F6B}
.package-summary{font-size: 15px; line-height: 1.5; color: #4B5670}
.package-facts{display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; background: #F4F7FB; padding: 16px; border-radius: 4px}
.fact-label{font-size: 12px; color: #4B5670}
.fact-value{font-family: Raleway, sans-serif; font-weight: 800; font-size: 22px; color: #0B2F6B}
.feature-list{margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 10px; font-size: 14px; line-height: 1.45}
.feature-item{display: flex; gap: 10px}
.feature-icon{flex-shrink: 0; margin-top: 1px}
.package-foot{margin-top: auto; display: flex; flex-direction: column; gap: 10px}
.package-note{font-size: 13px; color: #4B5670}
.btn-outline{display: block; text-align: center; border: 1.5px solid #0B2F6B; color: #0B2F6B; text-decoration: none; font-weight: 600; font-size: 15px; padding: 14px 20px; border-radius: 4px}
.package-card-featured{border: 2px solid #0B2F6B; border-radius: 6px; padding: 32px 28px; display: flex; flex-direction: column; gap: 20px; background: #FFFFFF; position: relative}
.package-badge{position: absolute; top: -14px; left: 28px; background: #C30008; color: #FFFFFF; font-size: 11px; font-weight: 700; letter-spacing: 1.5px; padding: 6px 12px; border-radius: 3px; text-transform: uppercase}
.package-addon{font-size: 13px; font-weight: 600; color: #023C89}
.btn-solid{display: block; text-align: center; background: #0B2F6B; color: #FFFFFF; text-decoration: none; font-weight: 600; font-size: 15px; padding: 14px 20px; border-radius: 4px}
.included-wrap{max-width: 1200px; margin: 0 auto; padding: 24px 24px 64px}
.included-box{background: #F4F7FB; border-radius: 6px; padding: 32px; display: flex; flex-direction: column; gap: 20px}
.included-title{margin: 0; font-family: Raleway, sans-serif; font-weight: 800; font-size: 22px; color: #0B2F6B}
.included-grid{display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 20px}
.included-col-blue{display: flex; flex-direction: column; gap: 6px; border-top: 3px solid #0880E8; padding-top: 14px}
.included-col-title{font-weight: 600; font-size: 15px; color: #0B2F6B}
.included-col-navy{display: flex; flex-direction: column; gap: 6px; border-top: 3px solid #023C89; padding-top: 14px}
.included-col-deep{display: flex; flex-direction: column; gap: 6px; border-top: 3px solid #0B2F6B; padding-top: 14px}
.section-rule{border-top: 1px solid #DBE8F8}
.compare{max-width: 1200px; margin: 0 auto; padding: 80px 24px; display: flex; flex-direction: column; gap: 32px}
.compare-intro{display: flex; flex-direction: column; gap: 12px}
.compare-title{margin: 0; font-family: Raleway, sans-serif; font-weight: 800; font-size: 36px; line-height: 1.1; color: #0B2F6B}
.table-scroll{overflow-x: auto; border: 1px solid #DBE8F8; border-radius: 6px}
.compare-table{width: 100%; min-width: 720px; border-collapse: collapse; font-size: 14px}
.th-feature{text-align: left; padding: 16px 20px; font-weight: 600}
.th-package{padding: 16px 20px; font-weight: 600; width: 18%}
.row-group{background: #F4F7FB}
.td-group{text-align: left; padding: 12px 20px; font-size: 12px; letter-spacing: 1.5px; text-transform: uppercase; color: #023C89}
.td-feature{padding: 14px 20px}
.td-yes{text-align: center; padding: 14px 20px; color: #023C89; font-weight: 600}
.td-no{text-align: center; padding: 14px 20px; color: #4B5670}
.td-plain{text-align: center; padding: 14px 20px}
.td-strong{text-align: center; padding: 14px 20px; font-weight: 600}
.phases{max-width: 1200px; margin: 0 auto; padding: 80px 24px; display: flex; flex-direction: column; gap: 36px}
.phase-grid{display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 20px}
.phase-card{background: #FFFFFF; border-radius: 6px; padding: 24px; display: flex; flex-direction: column; gap: 10px}
.phase-number{font-family: Raleway, sans-serif; font-weight: 800; font-size: 30px; color: #0880E8; line-height: 1}
.phase-title{font-family: Raleway, sans-serif; font-weight: 700; font-size: 18px; color: #0B2F6B}
.phase-gate{margin-top: auto; font-size: 13px; font-weight: 600; color: #023C89; border-top: 1px solid #DBE8F8; padding-top: 10px}
.phase-note{background: #0B2F6B; color: #FFFFFF; border-radius: 6px; padding: 20px 24px; display: flex; flex-wrap: wrap; align-items: center; gap: 12px; font-size: 15px; line-height: 1.5}
.phase-dot{width: 8px; height: 8px; background: #C30008; display: inline-block; flex-shrink: 0}
.addon-card{border: 1px solid #DBE8F8; border-radius: 6px; padding: 22px; display: flex; flex-direction: column; gap: 8px}
.addon-title{font-family: Raleway, sans-serif; font-weight: 700; font-size: 17px; color: #0B2F6B}
.faq{max-width: 900px; margin: 0 auto; padding: 80px 24px; display: flex; flex-direction: column; gap: 28px}
.faq-list{display: flex; flex-direction: column}
.faq-item{border-top: 1px solid #DBE8F8; padding: 20px 0}
.faq-summary{cursor: pointer; font-weight: 600; font-size: 17px; color: #0B2F6B}
.faq-answer{margin: 12px 0 0; font-size: 15px; line-height: 1.6; color: #4B5670}
.faq-item-last{border-top: 1px solid #DBE8F8; border-bottom: 1px solid #DBE8F8; padding: 20px 0}
.workshop{max-width: 1200px; margin: 0 auto; padding: 80px 24px; display: flex; flex-wrap: wrap; gap: 48px; align-items: flex-start}
.workshop-copy{flex: 1 1 420px; min-width: 0; display: flex; flex-direction: column; gap: 18px}
.workshop-title{margin: 0; font-family: Raleway, sans-serif; font-weight: 800; font-size: 40px; line-height: 1.1}
.workshop-lead{margin: 0; font-size: 17px; line-height: 1.6; color: #E8F1F4}
.workshop-list{margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 10px; font-size: 15px; color: #E8F1F4}
.workshop-check{flex-shrink: 0; margin-top: 2px}
.workshop-form{flex: 1 1 420px; min-width: 0; background: #FFFFFF; color: #1A2A33; border-radius: 6px; padding: 32px; display: flex; flex-direction: column; gap: 16px}
.form-grid{display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 16px}
.field{display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 600}
.field-input{font: inherit; font-weight: 400; font-size: 15px; padding: 12px; border: 1px solid #C9D4DE; border-radius: 4px; min-height: 44px; box-sizing: border-box}
.field-select{font: inherit; font-weight: 400; font-size: 15px; padding: 12px; border: 1px solid #C9D4DE; border-radius: 4px; min-height: 44px; background: #FFFFFF}
.form-submit{font: inherit; font-weight: 600; font-size: 16px; background: #C30008; color: #FFFFFF; border: 0; border-radius: 4px; padding: 15px 20px; min-height: 48px; cursor: pointer}
.form-alert{border-radius: 4px; padding: 12px 14px; font-size: 14px; line-height: 1.5}
.form-alert-ok{background: #E7F6EE; color: #0E6B3A}
.form-alert-err{background: #FDECEA; color: #9B1C1C}
.site-footer{background: #F4F7FB; border-top: 1px solid #DBE8F8}
.footer-inner{max-width: 1200px; margin: 0 auto; padding: 40px 24px; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 32px; font-size: 14px; line-height: 1.6; color: #4B5670}
.footer-brand{display: flex; flex-direction: column; align-items: flex-start; gap: 12px; flex: 1 1 300px}
.footer-logo-ascentum{height: 32px; width: auto; display: block}
.footer-contact{display: flex; flex-direction: column; gap: 4px; flex: 1 1 220px}
.footer-label{font-weight: 600; color: #0B2F6B}
.footer-member{display: flex; align-items: center; gap: 14px; flex: 0 1 auto}
.footer-logo-vta{height: 78px; width: auto; display: block}
.footer-member-text{font-size: 13px; line-height: 1.35; font-weight: 500; color: #1A2A33}