@import url('/academic-v346.css?v=3.4.6');

/* AYOLES.ID V3.4.7 — Comprehensive academic UI/UX correction */
:root{
  --v347-blue:#125BCD;
  --v347-navy:#10346E;
  --v347-yellow:#FFC107;
  --v347-softblue:#EAF2FF;
  --v347-softyellow:#FFF8DD;
  --v347-text:#17345e;
  --v347-muted:#58708f;
  --v347-line:#d9e6f5;
}

/* ---------- Section rhythm / visual identity ---------- */
.academicLanding .acadSection{padding-top:78px;padding-bottom:78px;position:relative;overflow:hidden}
.academicLanding .acadSection:nth-of-type(even){background:#f8fbff}
.academicLanding .acadHead{max-width:850px;margin-bottom:32px}
.academicLanding .acadHead h2{font-size:clamp(30px,4vw,43px);line-height:1.1;letter-spacing:-1.4px;color:var(--v347-navy);margin:12px 0 10px}
.academicLanding .acadHead p{font-size:16px;line-height:1.75;color:var(--v347-muted);margin:0}
.academicLanding .tag{display:inline-flex;align-items:center;gap:7px;padding:8px 12px;border-radius:999px;background:var(--v347-softblue);color:var(--v347-blue);font-size:11px;font-weight:950;letter-spacing:.4px}

/* ---------- Hero ---------- */
.academicLanding .acadHero{background:radial-gradient(circle at 86% 20%,rgba(255,193,7,.16),transparent 27%),linear-gradient(135deg,#f7fbff 0%,#fff 55%,#fff8df 100%);padding-bottom:76px}
.academicLanding .heroGrid{gap:48px}
.academicLanding .heroVisual{border:7px solid #fff;box-shadow:0 25px 65px rgba(16,52,110,.17)}
.academicLanding .heroVisual img{height:455px}
.academicLanding .trustLine{border-left:5px solid var(--v347-yellow);background:#fff8df;border-radius:0 16px 16px 0;padding:15px 17px;color:var(--v347-navy);font-weight:850;line-height:1.55}

/* ---------- Grade / program selection ---------- */
.academicLanding .choiceSection{background:linear-gradient(180deg,#f2f7ff,#fff)!important}
.academicLanding .gradeGrid{grid-template-columns:repeat(3,1fr);gap:20px}
.academicLanding .gradeGrid a{position:relative;min-height:210px;padding:28px;border:0;border-radius:26px;background:linear-gradient(145deg,#125BCD,#0d469f);color:#fff;box-shadow:0 20px 42px rgba(18,91,205,.18);overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;transition:transform .2s ease,box-shadow .2s ease}
.academicLanding .gradeGrid a:nth-child(2){background:linear-gradient(145deg,#FFC107,#eda800);color:#17345e;box-shadow:0 20px 42px rgba(237,168,0,.18)}
.academicLanding .gradeGrid a:nth-child(3){background:linear-gradient(145deg,#10346E,#1d5ba9);color:#fff}
.academicLanding .gradeGrid a:before{content:"";position:absolute;right:-25px;top:-35px;width:145px;height:145px;border-radius:50%;background:rgba(255,255,255,.13)}
.academicLanding .gradeGrid a:hover{transform:translateY(-5px);box-shadow:0 26px 52px rgba(16,52,110,.2)}
.academicLanding .gradeGrid a b{font-size:30px;line-height:1;margin-bottom:6px}
.academicLanding .gradeGrid a span{font-weight:850;font-size:14px;opacity:.9}
.academicLanding .gradeGrid a small{margin-top:13px;font-size:13px;line-height:1.55;max-width:270px;opacity:.9}
.academicLanding .gradeGrid a::after{content:"Lihat program →";position:absolute;right:24px;bottom:24px;font-size:12px;font-weight:900}

/* ---------- Learning mode: unmistakable product choices ---------- */
.academicLanding .modeSection{background:linear-gradient(180deg,#eef5ff 0%,#f8fbff 100%)!important;padding-top:84px;padding-bottom:84px}
.academicLanding .modeGrid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.academicLanding .modeCard{min-height:480px!important;border:0!important;border-radius:30px!important;padding:32px!important;box-shadow:0 24px 55px rgba(16,52,110,.14)!important;position:relative!important;overflow:hidden!important}
.academicLanding .modeCard:after{content:"";position:absolute;right:-55px;top:-55px;width:190px;height:190px;border-radius:50%;background:rgba(255,255,255,.12);pointer-events:none}
.academicLanding .modeCard.offline:after{background:rgba(255,255,255,.28)}
.academicLanding .modeIcon{width:68px;height:68px;border-radius:20px;font-size:34px;position:relative;z-index:1}
.academicLanding .modeCard>span{position:relative;z-index:1;font-size:12px;font-weight:950;letter-spacing:.7px;margin-top:3px}
.academicLanding .modeCard h3{font-size:31px!important;letter-spacing:-.8px;position:relative;z-index:1}
.academicLanding .modeCard p,.academicLanding .modeCard ul{position:relative;z-index:1}
.academicLanding .modeCard ul{padding-left:20px}
.academicLanding .modePriceBtn{position:relative;z-index:2;margin-top:auto!important;min-height:52px!important;font-size:14px!important}

/* ---------- Feature / subject / focus / process ---------- */
.academicLanding .featureSection{background:#fff!important}
.academicLanding .featureGrid{grid-template-columns:repeat(4,1fr);gap:16px}
.academicLanding .featureGrid article{position:relative;min-height:245px;padding:27px;border:1px solid var(--v347-line);border-radius:24px;background:linear-gradient(145deg,#fff,#f3f8ff);box-shadow:0 12px 30px rgba(16,52,110,.06);overflow:hidden}
.academicLanding .featureGrid article:nth-child(2){background:linear-gradient(145deg,#fffdf1,#fff3c6)}
.academicLanding .featureGrid article:nth-child(3){background:linear-gradient(145deg,#eef5ff,#dceaff)}
.academicLanding .featureGrid article:nth-child(4){background:linear-gradient(145deg,#fff,#f8f2df)}
.academicLanding .featureGrid article:after{content:"";position:absolute;right:-30px;bottom:-45px;width:120px;height:120px;border-radius:50%;background:rgba(18,91,205,.07)}
.academicLanding .featureGrid article:nth-child(2):after{background:rgba(255,193,7,.13)}
.academicLanding .featureGrid article>b{display:grid;place-items:center;width:46px;height:46px;border-radius:14px;background:var(--v347-navy);color:#fff;font-size:13px}
.academicLanding .featureGrid article:nth-child(2)>b{background:var(--v347-yellow);color:#17345e}
.academicLanding .featureGrid article h3{font-size:21px;margin:22px 0 9px;color:var(--v347-navy)}
.academicLanding .featureGrid article p{color:var(--v347-muted);line-height:1.65;margin:0}

.academicLanding .subjectSection{background:linear-gradient(180deg,#f8fbff,#fff)!important}
.academicLanding .subjectGrid{grid-template-columns:repeat(4,1fr);gap:17px}
.academicLanding .acadSubject{min-height:220px;border:0;border-radius:24px;padding:24px;background:#fff;box-shadow:0 13px 32px rgba(16,52,110,.08);position:relative;overflow:hidden}
.academicLanding .acadSubject:nth-child(2n){background:#fffdf1}
.academicLanding .acadSubject>div{width:54px;height:54px;border-radius:17px;background:var(--v347-softblue);color:var(--v347-blue);font-size:22px}
.academicLanding .acadSubject:nth-child(2n)>div{background:#ffefb3;color:#8b6400}
.academicLanding .acadSubject h3{color:var(--v347-navy);font-size:20px}
.academicLanding .acadSubject p{font-size:13px}

.academicLanding .focusSection{background:linear-gradient(180deg,#fff8dc,#fffdf7)!important;border-top:1px solid #f0dfaa;border-bottom:1px solid #f0dfaa}
.academicLanding .focusGrid{grid-template-columns:repeat(3,1fr);gap:18px}
.academicLanding .focusGrid article{position:relative;min-height:215px;padding:25px;border:0;border-radius:24px;background:#fff;box-shadow:0 13px 34px rgba(16,52,110,.08)}
.academicLanding .focusGrid article:nth-child(2){background:#eef5ff}.academicLanding .focusGrid article:nth-child(3){background:#fff3c5}
.academicLanding .focusGrid article>b{font-size:12px;color:var(--v347-blue);letter-spacing:.5px}.academicLanding .focusGrid article h3{color:var(--v347-navy);font-size:20px;margin:13px 0 8px}.academicLanding .focusGrid article p{color:var(--v347-muted);line-height:1.65;margin:0}

.academicLanding .processSection{background:linear-gradient(180deg,#f0f6ff,#fff)!important}
.academicLanding .processGrid{gap:38px}
.academicLanding .processSteps{gap:14px}
.academicLanding .processSteps div{min-height:120px;background:var(--v347-navy);border-radius:20px;padding:21px;box-shadow:0 12px 25px rgba(16,52,110,.12)}
.academicLanding .processSteps div:nth-child(2){background:var(--v347-blue)}
.academicLanding .processSteps div:nth-child(3){background:#e8a900;color:#17345e}
.academicLanding .processSteps div:nth-child(4){background:#fff;border:1px solid var(--v347-line);color:var(--v347-navy)}
.academicLanding .processSteps div:nth-child(4) b{color:var(--v347-blue)}

/* ---------- Offline pricing: stronger price hierarchy ---------- */
.academicLanding .pricingSection{background:linear-gradient(180deg,#fff7d7,#fffdf7)!important;padding-top:84px;padding-bottom:84px}
.academicLanding .bimbelPriceGrid{grid-template-columns:repeat(3,1fr);gap:18px}
.academicLanding .bimbelPriceCard{min-height:390px!important;padding:28px!important;border:1px solid rgba(16,52,110,.07)!important;border-radius:26px!important;box-shadow:0 16px 38px rgba(16,52,110,.10)!important}
.academicLanding .bimbelPriceCard:before{height:9px!important}
.academicLanding .bimbelPriceCard:after{content:"";position:absolute;right:-35px;top:30px;width:100px;height:100px;border-radius:50%;background:rgba(255,255,255,.48)}
.academicLanding .bimbelPriceCard>span{font-size:18px!important;position:relative;z-index:1}
.academicLanding .bimbelPriceCard>strong{font-size:37px!important;line-height:1!important;margin-top:18px!important;letter-spacing:-1.2px;position:relative;z-index:1}
.academicLanding .bimbelPriceCard>small{font-size:12px;position:relative;z-index:1}
.academicLanding .bimbelPriceCard>div{position:relative;z-index:1;gap:7px;margin:21px 0}
.academicLanding .bimbelPriceCard>div b{display:flex;align-items:center;gap:7px;background:rgba(255,255,255,.72)!important;border:1px solid rgba(16,52,110,.06);border-radius:10px;padding:9px 10px;font-size:12px}
.academicLanding .bimbelPriceCard>div b:before{content:"✓";font-weight:950;color:var(--v347-blue)}
.academicLanding .bimbelPriceCard .btn{position:relative;z-index:2;min-height:48px;font-size:13px;justify-content:center}
.academicLanding .bimbelPriceCard:nth-child(3n+2){transform:translateY(-5px)}
.academicLanding .offlinePriceCta{background:var(--v347-navy)!important;color:#fff!important;border-radius:24px!important;padding:23px 25px!important;display:flex;align-items:center;justify-content:space-between;gap:20px}
.academicLanding .offlinePriceCta strong{display:block;font-size:18px}.academicLanding .offlinePriceCta span{display:block;color:#dce8fa;margin-top:4px;font-size:13px}

/* ---------- Online pricing ---------- */
.academicLanding .onlinePricing{background:linear-gradient(180deg,#eaf2ff,#f8fbff 70%,#fff)!important;padding-top:84px;padding-bottom:84px}
.academicLanding .onlinePriceGrid{grid-template-columns:repeat(3,1fr);gap:18px}
.academicLanding .onlinePriceCard{min-height:360px!important;padding:27px!important;border:1px solid #d6e4f6!important;border-radius:26px!important;background:#fff!important;box-shadow:0 16px 38px rgba(16,52,110,.09)!important}
.academicLanding .onlinePriceCard:nth-child(2),.academicLanding .onlinePriceCard:nth-child(5){background:linear-gradient(145deg,#fffdf0,#fff3c6)!important;border-color:#f1dda0!important}
.academicLanding .onlinePriceCard:nth-child(3),.academicLanding .onlinePriceCard:nth-child(4){background:linear-gradient(145deg,#fff,#eef5ff)!important}
.academicLanding .onlinePriceCard:before{height:9px!important}
.academicLanding .onlinePriceCard .onlineIcon{width:58px;height:58px;border-radius:17px;font-size:25px}
.academicLanding .onlinePriceCard h3{font-size:20px!important;margin:17px 0 7px!important}
.academicLanding .onlinePriceCard .price{font-size:37px!important;line-height:1!important;letter-spacing:-1px}
.academicLanding .onlinePriceCard .priceNote{font-size:12px;color:var(--v347-muted)}
.academicLanding .onlinePriceCard ul{padding-left:18px;margin:20px 0!important;color:#4f6887;line-height:1.7}
.academicLanding .onlinePriceCard .onlineCardCta{margin-top:auto;width:100%;display:flex;justify-content:center}
.academicLanding .onlinePlatform{margin-top:24px!important}
.academicLanding .onlineSectionCta{background:#fff!important;border:1px solid #d6e4f6!important;padding:23px 25px!important;box-shadow:0 12px 30px rgba(16,52,110,.07)}

/* ---------- Online private calculator: no fake package discounts ---------- */
.academicLanding .onlinePrivateSection{background:linear-gradient(180deg,#eef5ff,#fff)!important}
.academicLanding .onlinePrivateCalculator{grid-template-columns:minmax(0,1fr) minmax(330px,.72fr)!important;background:#fff!important;border:1px solid #d4e3f5!important;border-radius:30px!important;padding:24px!important;box-shadow:0 20px 50px rgba(16,52,110,.11)!important}
.academicLanding .onlineCalcControls{grid-template-columns:1fr 1fr!important;gap:14px!important}
.academicLanding .onlineCalcControls label{min-height:110px;padding:17px!important;background:linear-gradient(145deg,#f8fbff,#eef5ff)!important;border:1px solid #d8e7f7!important;border-radius:18px!important;font-size:12px!important}
.academicLanding .onlineCalcControls label:last-child{grid-column:auto}
.academicLanding .onlineCalcControls select{min-height:48px!important;font-size:14px!important;font-weight:800!important;color:var(--v347-navy)!important;background:#fff!important}
.academicLanding .onlineCalcResult{min-height:100%;border-radius:25px!important;padding:29px!important;background:linear-gradient(145deg,#10346E,#125BCD)!important}
.academicLanding .onlineCalcResult>strong{font-size:43px!important;letter-spacing:-1.4px}
.academicLanding .onlineCalcActions{margin-top:auto;display:grid!important;grid-template-columns:1fr 1fr!important;gap:9px!important}
.academicLanding .onlineCalcActions .btn{min-height:48px!important}
.academicLanding .onlineRuleStrip{grid-template-columns:repeat(4,1fr)!important}
.academicLanding .onlineRuleStrip div{min-height:88px;background:#fff!important;border-radius:17px!important;display:flex;flex-direction:column;justify-content:center}
.academicLanding .onlineRuleStrip div:nth-child(2){background:#fff8dd!important}.academicLanding .onlineRuleStrip div:nth-child(3){background:#eaf2ff!important}.academicLanding .onlineRuleStrip div:nth-child(4){background:#fff!important}

/* ---------- Offline private calculator ---------- */
.academicLanding .privatePricing{background:linear-gradient(180deg,#fff8dc,#fffdf7)!important;padding-top:84px;padding-bottom:84px}
.academicLanding .privateCalculator{grid-template-columns:minmax(0,1fr) minmax(330px,.72fr)!important;padding:24px!important;border-radius:30px!important;background:#fff!important;border:1px solid #eadca9!important;box-shadow:0 20px 50px rgba(16,52,110,.10)!important}
.academicLanding .calcControls{grid-template-columns:1fr 1fr!important;gap:14px!important}
.academicLanding .calcControls label{min-height:110px;padding:17px!important;background:linear-gradient(145deg,#fffdf6,#fff7dc)!important;border-radius:18px!important}
.academicLanding .calcControls select{min-height:48px!important;font-size:14px!important;font-weight:800!important}
.academicLanding .calcResult{min-height:100%;border-radius:25px!important;padding:29px!important;background:linear-gradient(145deg,#10346E,#125BCD)!important}
.academicLanding .calcResult strong{font-size:41px!important}
.academicLanding .priceMatrix{margin-top:25px!important}
.academicLanding .priceMatrix article{padding:24px!important;min-height:190px}

/* ---------- Learning hubs ---------- */
.academicLanding .locationSection{background:linear-gradient(180deg,#f3f8ff,#fff)!important}
.academicLanding .hubGrid{gap:17px}
.academicLanding .hubCard{border:0!important;border-radius:23px!important;background:#fff!important;box-shadow:0 13px 34px rgba(16,52,110,.08)!important;padding:23px!important}
.academicLanding .hubCard.featured{background:linear-gradient(145deg,#eaf2ff,#fff)!important;border:1px solid #d3e3f5!important}
.academicLanding .hubCard:not(.featured){background:linear-gradient(145deg,#fffdf1,#fff)!important}
.academicLanding .hubLabel{font-size:10px!important;font-weight:950!important;letter-spacing:.5px;color:var(--v347-blue)!important}
.academicLanding .hubCard h3{color:var(--v347-navy)!important}
.academicLanding .hubCta{background:var(--v347-navy)!important;color:#fff!important;border-radius:23px!important;padding:22px 24px!important}
.academicLanding .hubCta span{color:#dce8fa!important}

/* ---------- Teacher / testimonials ---------- */
.academicLanding .teacherSection{background:#fff!important}
.academicLanding .teacherGrid{grid-template-columns:repeat(5,1fr);gap:14px}
.academicLanding .acadTeacher{border:0!important;border-radius:24px!important;background:linear-gradient(180deg,#fff,#f4f8ff)!important;box-shadow:0 14px 34px rgba(16,52,110,.09)!important}
.academicLanding .acadTeacher:nth-child(2),.academicLanding .acadTeacher:nth-child(4){background:linear-gradient(180deg,#fffdf1,#fff)!important}
.academicLanding .acadTeacher img{height:230px!important;object-fit:cover;object-position:center top}
.academicLanding .acadTeacher>div{padding:18px!important}
.academicLanding .acadTeacher span{display:inline-flex;padding:6px 9px;border-radius:999px;background:#eaf2ff;color:var(--v347-blue)!important}
.academicLanding .acadTeacher:nth-child(2) span,.academicLanding .acadTeacher:nth-child(4) span{background:#fff0b7;color:#876100!important}
.academicLanding .acadTeacher h3{font-size:19px!important;color:var(--v347-navy)}
.academicLanding .acadTeacher p{min-height:105px}
.academicLanding .acadTeacher strong{display:block;padding-top:10px;border-top:1px solid #dbe6f3}
.academicLanding .testimonialSection{background:linear-gradient(180deg,#eaf2ff,#f8fbff)!important}
.academicLanding .testimonialGrid{grid-template-columns:repeat(5,1fr);gap:14px}
.academicLanding .acadTestimonial{border:0!important;border-radius:24px!important;background:#fff!important;box-shadow:0 14px 34px rgba(16,52,110,.08)!important;padding:23px!important;min-height:250px!important}
.academicLanding .acadTestimonial:nth-child(2),.academicLanding .acadTestimonial:nth-child(4){background:#fffdf1!important}
.academicLanding .quoteMark{width:38px;height:38px;border-radius:13px;background:#eaf2ff;display:grid;place-items:center;font-size:28px;margin-bottom:13px}
.academicLanding .acadTestimonial:nth-child(2) .quoteMark,.academicLanding .acadTestimonial:nth-child(4) .quoteMark{background:#fff0b7}
.academicLanding .acadTestimonial p{font-size:13px;line-height:1.7;color:#4c6684}
.academicLanding .acadTestimonial strong{color:var(--v347-navy)}

/* ---------- Assessment and final CTA ---------- */
.academicLanding .assessmentSection{background:linear-gradient(180deg,#fffdf2,#fff)!important}
.academicLanding .assessmentCard{background:linear-gradient(135deg,#fff3bf,#fffdf4)!important;border:1px solid #efd77d!important;box-shadow:0 18px 45px rgba(16,52,110,.08)!important}
.academicLanding .assessmentSide{background:#fff;border-radius:20px;padding:18px 20px;box-shadow:0 10px 25px rgba(16,52,110,.08)}
.academicLanding .ctaSection{background:linear-gradient(180deg,#fff,#eef5ff)!important}
.academicLanding .ctaCard{box-shadow:0 20px 50px rgba(16,52,110,.18)!important}

/* ---------- Mobile ---------- */
@media(max-width:1000px){
 .academicLanding .teacherGrid,.academicLanding .testimonialGrid{grid-template-columns:repeat(2,1fr)}
 .academicLanding .onlinePriceGrid,.academicLanding .bimbelPriceGrid{grid-template-columns:1fr 1fr}
 .academicLanding .onlinePrivateCalculator,.academicLanding .privateCalculator{grid-template-columns:1fr!important}
 .academicLanding .onlineRuleStrip{grid-template-columns:repeat(2,1fr)!important}
}
@media(max-width:680px){
 .academicLanding .acadSection{padding-top:60px;padding-bottom:60px}
 .academicLanding .acadHead{margin-bottom:25px}
 .academicLanding .acadHead h2{font-size:30px}
 .academicLanding .heroVisual img{height:315px!important}
 .academicLanding .gradeGrid,.academicLanding .modeGrid,.academicLanding .featureGrid,.academicLanding .subjectGrid,.academicLanding .focusGrid,.academicLanding .bimbelPriceGrid,.academicLanding .onlinePriceGrid,.academicLanding .teacherGrid,.academicLanding .testimonialGrid{grid-template-columns:1fr!important}
 .academicLanding .gradeGrid a{min-height:190px}
 .academicLanding .modeCard{min-height:0!important;padding:25px!important}
 .academicLanding .modeCard h3{font-size:27px!important}
 .academicLanding .bimbelPriceCard,.academicLanding .onlinePriceCard{min-height:0!important}
 .academicLanding .bimbelPriceCard:nth-child(3n+2){transform:none}
 .academicLanding .onlinePrivateCalculator,.academicLanding .privateCalculator{padding:15px!important}
 .academicLanding .onlineCalcControls,.academicLanding .calcControls{grid-template-columns:1fr!important}
 .academicLanding .onlineCalcControls label,.academicLanding .calcControls label{min-height:0}
 .academicLanding .onlineCalcResult>strong,.academicLanding .calcResult strong{font-size:34px!important}
 .academicLanding .onlineCalcActions{grid-template-columns:1fr!important}
 .academicLanding .onlineRuleStrip{grid-template-columns:1fr 1fr!important}
 .academicLanding .onlinePlatform{padding:20px!important}
 .academicLanding .acadTeacher img{height:270px!important}
 .academicLanding .acadTeacher p{min-height:0}
 .academicLanding .acadTestimonial{min-height:0!important}
 .academicLanding .offlinePriceCta,.academicLanding .onlineSectionCta{display:block!important}
 .academicLanding .offlinePriceCta .btn,.academicLanding .onlineSectionCta .btn{width:100%;margin-top:15px}
}

/* Final V3.4.7 calculator action treatment */
.academicLanding .calcActionStack{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:20px}
.academicLanding .calcActionStack .btn{min-height:48px;display:flex;align-items:center;justify-content:center;text-align:center}
@media(max-width:680px){.academicLanding .calcActionStack{grid-template-columns:1fr}}