:root{--navy:#10234b;--blue:#1d5fd1;--yellow:#ffbd18;--bg:#f5f7fb;--text:#15223b;--muted:#69758b;--line:#e4e9f2;--white:#fff;--green:#16845b;--red:#c53b4b}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text);background:var(--bg);line-height:1.55}a{text-decoration:none;color:inherit}button,input,select{font:inherit}.wrap{max-width:1180px;margin:auto;padding:0 22px}.nav{height:76px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;position:sticky;top:0;z-index:50}.nav .wrap{display:flex;align-items:center;justify-content:space-between;width:100%}.brand{display:flex;align-items:center;gap:10px}.mark{width:42px;height:42px;border-radius:13px;background:var(--navy);position:relative}.mark:after{content:"";position:absolute;width:18px;height:18px;border:5px solid var(--yellow);border-left-color:transparent;border-radius:50%;left:11px;top:7px;transform:rotate(25deg)}.brand strong{font-size:22px;letter-spacing:-.8px}.brand small{display:block;color:var(--muted);font-size:10px}.navlinks{display:flex;gap:22px;font-size:13px;font-weight:750}.navlinks a:hover{color:var(--blue)}.navbtns{display:flex;gap:8px}.btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 18px;border-radius:12px;font-weight:800;border:1px solid transparent;cursor:pointer}.btn.primary{background:var(--yellow)}.btn.dark{background:var(--navy);color:#fff}.btn.light{background:#fff;border-color:var(--line)}.btn.blue{background:var(--blue);color:#fff}.btn.wa{background:#25D366;color:#fff;border-color:#25D366;gap:9px}.btn.wa:hover{filter:brightness(.96)}.waIcon{width:20px;height:20px;display:inline-flex;flex:0 0 20px}.waIcon svg{width:100%;height:100%;display:block}.hero{background:#fff;padding:52px 0 35px}.heroGrid{display:grid;grid-template-columns:44% 56%;align-items:center;gap:25px}.eyebrow,.tag{display:inline-block;padding:6px 9px;border-radius:9px;background:#edf3ff;color:var(--blue);font-size:10px;font-weight:850}.eyebrow{background:#fff5d6;color:#8b6500;border-radius:999px;padding:8px 12px;margin-bottom:16px}.hero h1{font-size:clamp(42px,5vw,68px);line-height:1.02;letter-spacing:-3px;margin:0 0 18px}.hero h1 span{color:var(--yellow)}.hero p{font-size:18px;color:var(--muted);max-width:570px}.heroBtns{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}.visual{position:relative;min-height:500px}.photo{position:absolute;overflow:hidden;border-radius:26px;box-shadow:0 20px 55px rgba(16,35,75,.16)}.photo img{width:100%;height:100%;object-fit:cover}.p1{left:4%;top:0;width:58%;height:380px}.p2{right:0;top:0;width:39%;height:205px}.p3{right:0;bottom:20px;width:48%;height:225px}.floating{position:absolute;left:44%;bottom:8px;background:#fff;border:1px solid var(--line);border-radius:20px;padding:17px 19px;box-shadow:0 18px 45px rgba(16,35,75,.15);width:270px}.floating b{display:block;color:#e5484d;font-size:11px}.floating strong{font-size:20px;display:block}.floating small{color:var(--muted)}section{padding:58px 0}.sectionHead{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:24px}.sectionHead h2{margin:0;font-size:34px;letter-spacing:-1px}.sectionHead p{margin:5px 0 0;color:var(--muted)}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.card,.panel{background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:0 8px 25px rgba(16,35,75,.05)}.cardImg{height:170px}.cardImg img{width:100%;height:100%;object-fit:cover}.cardBody{padding:18px}.card h3{font-size:18px;margin:8px 0 5px}.card p{font-size:13px;color:var(--muted);margin:0 0 13px}.price{font-size:19px;font-weight:900}.small{font-size:11px;color:var(--muted)}.split{display:grid;grid-template-columns:1fr 1fr;gap:22px}.panel{padding:28px}.benefits{display:grid;gap:15px}.benefit{display:grid;grid-template-columns:44px 1fr;gap:12px}.ico{width:44px;height:44px;border-radius:14px;background:#f1f6ff;display:grid;place-items:center}.benefit b{display:block}.benefit span{color:var(--muted);font-size:13px}.hub{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:center}.hub img{width:100%;height:270px;object-fit:cover;border-radius:18px}.stats{background:var(--navy);color:#fff;border-radius:24px;padding:28px;display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.stat{text-align:center;border-right:1px solid #ffffff2b}.stat:last-child{border:0}.stat strong{display:block;color:var(--yellow);font-size:30px}.stat span{font-size:11px;opacity:.8}.assessment{background:linear-gradient(135deg,#fff4c9,#fff);border:1px solid #f1df9b;border-radius:26px;padding:35px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:20px}.assessment h2{margin:0 0 8px;font-size:32px}.assessment p{color:var(--muted);margin:0}.formWrap{max-width:680px;margin:40px auto}.form{display:grid;gap:13px}.form label{font-size:12px;font-weight:800}.form input,.form select{width:100%;padding:12px;border:1px solid var(--line);border-radius:11px;background:#fff;outline:none}.form input:focus,.form select:focus{border-color:var(--blue)}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:13px}.dashboard{padding:35px 0}.dashGrid{display:grid;grid-template-columns:240px 1fr;gap:20px}.side{background:var(--navy);color:#fff;border-radius:20px;padding:18px;height:max-content}.side a{display:block;padding:10px 12px;border-radius:10px;color:#d7def0;font-size:13px}.side a.active,.side a:hover{background:#ffffff16;color:#fff}.main{min-width:0}.topline{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.kpi{background:#fff;border:1px solid var(--line);border-radius:16px;padding:17px}.kpi small{color:var(--muted)}.kpi strong{display:block;font-size:25px;margin-top:4px}.table{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:auto;margin-top:16px}.table table{width:100%;border-collapse:collapse;font-size:13px}.table th,.table td{padding:12px 14px;border-bottom:1px solid var(--line);text-align:left}.status{font-size:10px;font-weight:850;padding:5px 8px;border-radius:999px;background:#eaf8f2;color:var(--green)}.status.pending{background:#fff5d6;color:#8b6500}.status.fail{background:#fdecef;color:var(--red)}.notice{padding:12px 14px;border-radius:12px;background:#eef5ff;color:#31548d;font-size:12px;margin:12px 0}.footer{background:#0b1936;color:#fff;padding:35px 0}.footer p,.footer li{color:#b9c3d8;font-size:12px}.footerGrid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:25px}.copyright{border-top:1px solid #ffffff1f;margin-top:25px;padding-top:16px;color:#9aa7bf;font-size:10px}.hidden{display:none!important}@media(max-width:900px){.navlinks{display:none}.heroGrid,.split,.hub,.dashGrid{grid-template-columns:1fr}.visual{min-height:470px}.cards{grid-template-columns:repeat(2,1fr)}.stats,.kpis{grid-template-columns:repeat(2,1fr)}.assessment{grid-template-columns:1fr}}@media(max-width:560px){html,body{max-width:100%;overflow-x:hidden}.wrap{padding-left:16px;padding-right:16px}.nav{height:auto;min-height:64px}.nav .wrap{gap:10px}.brand{min-width:0;gap:7px}.brand strong{font-size:18px;letter-spacing:-.5px}.brand small{display:none}.mark{width:36px;height:36px;border-radius:11px}.mark:after{width:15px;height:15px;border-width:4px;left:10px;top:6px}.navbtns{flex-shrink:0}.navbtns .light{display:none}.nav>.wrap>.btn.light{padding:9px 12px;font-size:12px}.hero{padding-top:35px}.hero h1{font-size:42px;letter-spacing:-2px}.hero p{font-size:16px}.heroBtns .btn{width:100%}.featureRow{grid-template-columns:1fr}.visual{min-height:390px}.p1{height:300px}.p2{height:160px}.p3{height:180px}.floating{left:25%;width:220px}.cards,.grid2,.kpis,.stats{grid-template-columns:1fr}.sectionHead{display:block}.sectionHead .btn{margin-top:12px;width:100%}.panel{padding:20px}.assessment{padding:22px}.assessment .btn,.form .btn{width:100%}.form input,.form select{min-height:46px}.btn{min-height:44px;padding:11px 14px}.table{max-width:100%;-webkit-overflow-scrolling:touch}.table table{min-width:620px}.footerGrid{grid-template-columns:1fr}h1{overflow-wrap:anywhere}.card h3,.panel h2,.panel h3,.notice{overflow-wrap:anywhere}.photo{box-shadow:0 12px 30px rgba(16,35,75,.14)}}
/* v4.6 brand-first public website */
.navDropdown{position:relative}.navDropdown summary{list-style:none;cursor:pointer;font-weight:800}.navDropdown summary::-webkit-details-marker{display:none}.navDropdown summary span{font-size:11px;margin-left:4px;color:var(--muted)}.dropdownMenu{position:absolute;top:34px;left:-18px;width:290px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:8px;box-shadow:0 18px 45px rgba(16,35,75,.14)}.dropdownMenu a{display:block;padding:12px;border-radius:11px}.dropdownMenu a:hover{background:#f5f7fb}.dropdownMenu b{display:block;font-size:13px}.dropdownMenu small{display:block;color:var(--muted);font-size:11px;margin-top:2px}.catalogHero{padding-bottom:20px}.catalogHero h1{font-size:clamp(40px,5vw,58px);letter-spacing:-2px;max-width:780px;margin:12px 0}.catalogHero p{color:var(--muted);font-size:18px;max-width:720px}.programCards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.programCard{background:#fff;border:1px solid var(--line);border-radius:22px;overflow:hidden;box-shadow:0 8px 28px rgba(16,35,75,.06);transition:transform .18s ease,box-shadow .18s ease}.programCard:hover{transform:translateY(-3px);box-shadow:0 16px 36px rgba(16,35,75,.1)}.programVisual{height:220px;position:relative;overflow:hidden;background:#eef3fb}.programVisual img{width:100%;height:100%;object-fit:cover}.programIcon{position:absolute;right:16px;bottom:16px;width:48px;height:48px;border-radius:15px;background:#fff;display:grid;place-items:center;font-size:23px;box-shadow:0 8px 22px rgba(16,35,75,.15)}.cardLink{display:inline-block;margin-top:10px;color:var(--blue);font-size:13px;font-weight:850}.valueGrid{display:grid;grid-template-columns:.85fr 1.15fr;gap:55px;align-items:start}.valueGrid h2{font-size:38px;letter-spacing:-1.4px;margin:10px 0}.lead{color:var(--muted);font-size:17px}.valueList{display:grid;gap:2px}.valueItem{display:grid;grid-template-columns:46px 1fr;gap:15px;padding:17px 0;border-bottom:1px solid var(--line)}.valueItem:last-child{border-bottom:0}.valueItem>span{font-size:12px;font-weight:900;color:var(--blue);padding-top:2px}.valueItem b{font-size:15px}.valueItem p{margin:4px 0 0;color:var(--muted);font-size:13px}.softSection{background:#fff}.how{background:#f5f7fb}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.step{background:#fff;border:1px solid var(--line);border-radius:18px;padding:22px}.step>span{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:var(--navy);color:#fff;font-weight:900}.step h3{margin:14px 0 6px;font-size:17px}.step p{margin:0;color:var(--muted);font-size:13px}.heroTrust{display:flex;gap:14px;flex-wrap:wrap;margin-top:20px;color:#53617a;font-size:12px;font-weight:750}.heroTrust span{background:#f5f7fb;border:1px solid var(--line);border-radius:999px;padding:7px 10px}.landingHero{background:#fff;padding:58px 0}.landingGrid{display:grid;grid-template-columns:1.02fr .98fr;gap:50px;align-items:center}.landingHero h1{font-size:clamp(42px,5vw,64px);line-height:1.04;letter-spacing:-2.8px;margin:0 0 18px}.landingHero p{font-size:18px;color:var(--muted);max-width:620px}.landingImage{position:relative;min-height:420px;border-radius:28px;overflow:hidden;background:#edf3ff;box-shadow:0 22px 55px rgba(16,35,75,.12)}.landingImage>img{width:100%;height:420px;object-fit:cover}.imageBadge{position:absolute;left:20px;bottom:20px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:13px 16px;box-shadow:0 12px 30px rgba(16,35,75,.13)}.imageBadge b{display:block;font-size:13px}.imageBadge span{display:block;color:var(--muted);font-size:11px;margin-top:2px}.miniCards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.miniCard{background:#fff;border:1px solid var(--line);border-radius:18px;padding:22px}.miniCard>span{font-size:26px}.miniCard h3{margin:12px 0 6px}.miniCard p{margin:0;color:var(--muted);font-size:13px}.testimonialHead{max-width:760px}.testimonialHead h2{font-size:36px;letter-spacing:-1px;margin:10px 0}.testimonialHead p{color:var(--muted);font-size:15px}. .testimonialGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:24px}.testimonialCard{background:#fff;border:1px solid var(--line);border-radius:20px;padding:22px;box-shadow:0 10px 28px rgba(16,35,75,.06);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.testimonialCard:hover{transform:translateY(-3px);box-shadow:0 16px 34px rgba(16,35,75,.10);border-color:#cbd8ef}.testimonialCard .stars{letter-spacing:2px;font-size:13px;color:#d79b00;margin-bottom:12px}.testimonialCard>p{margin:0;color:#4e5e79;font-size:14px;line-height:1.65}.testimonialPerson{margin-top:18px;padding-top:14px;border-top:1px solid var(--line)}.testimonialPerson strong{display:block;font-size:14px}.testimonialPerson span{display:block;margin-top:3px;color:var(--muted);font-size:11px}.
testimonialPlaceholder{margin-top:22px;border:1px dashed #cbd5e1;border-radius:18px;padding:20px;display:flex;gap:15px;align-items:flex-start;background:#f8fafc}.testimonialPlaceholder>span{font-size:24px}.testimonialPlaceholder b{font-size:14px}.testimonialPlaceholder p{margin:4px 0 0;color:var(--muted);font-size:13px}.ctaBand{background:var(--navy);color:#fff;border-radius:26px;padding:34px;display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center}.ctaBand h2{margin:10px 0 7px;font-size:31px;letter-spacing:-1px}.ctaBand p{margin:0;color:#c8d1e2}.ctaBand .tag{background:#fff5d6;color:#8b6500}.ctaBand .btn.dark{background:#fff;color:var(--navy)}.comingNote{margin-top:18px;display:inline-block;background:#fff5d6;color:#6f5a18;border:1px solid #f1df9b;border-radius:12px;padding:9px 12px;font-size:12px}.baristaVisual{display:grid;place-items:center;background:linear-gradient(135deg,#f6eadb,#fff8ef)}.baristaArt{font-size:90px;line-height:1;filter:drop-shadow(0 18px 20px rgba(16,35,75,.15))}.baristaArt.large{font-size:180px}.baristaHero{display:grid;place-items:center}.baristaHero .imageBadge{bottom:22px}
@media(max-width:900px){.testimonialGrid{grid-template-columns:1fr 1fr}.programCards{grid-template-columns:1fr 1fr}.landingGrid,.valueGrid{grid-template-columns:1fr;gap:28px}.miniCards,.steps{grid-template-columns:1fr}.landingImage,.landingImage>img{height:360px;min-height:360px}.ctaBand{grid-template-columns:1fr}.navDropdown .dropdownMenu{position:static;width:100%;margin-top:8px}.navlinks{align-items:flex-start}}
@media(max-width:560px){.testimonialGrid{grid-template-columns:1fr}.nav .wrap{position:relative}.navlinks{display:flex;gap:0;order:3;width:100%;padding:0 0 8px}.nav .wrap{flex-wrap:wrap}.navlinks>a{display:none}.navDropdown{width:100%}.navDropdown summary{padding:8px 0;font-size:12px;color:var(--blue)}.dropdownMenu{position:static!important;width:100%!important;box-shadow:none;margin:5px 0 0!important}.programCards{grid-template-columns:1fr}.programVisual{height:205px}.landingHero{padding:38px 0}.landingHero h1{font-size:41px;letter-spacing:-2px}.landingHero p{font-size:16px}.landingImage,.landingImage>img{height:300px;min-height:300px}.baristaArt.large{font-size:120px}.heroTrust{display:grid;gap:7px}.heroTrust span{display:block}.valueGrid h2,.testimonialHead h2{font-size:31px}.ctaBand{padding:23px}.ctaBand h2{font-size:27px}.catalogHero h1{font-size:40px}.catalogHero p{font-size:16px}}
/* v4.6.1 registration UX */
.registerPage{max-width:1040px;padding-top:48px;padding-bottom:70px}.registerIntro{max-width:720px;margin:0 auto 28px;text-align:center}.registerIntro h1{font-size:clamp(38px,5vw,54px);letter-spacing:-2px;margin:12px 0 8px}.registerIntro p{margin:0;color:var(--muted);font-size:16px}.roleCards{display:grid;grid-template-columns:1fr 1fr;gap:20px;max-width:900px;margin:0 auto}.roleCard{appearance:none;text-align:left;border:1px solid var(--line);border-radius:24px;background:#fff;padding:28px;cursor:pointer;box-shadow:0 10px 30px rgba(16,35,75,.06);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;position:relative;overflow:hidden}.roleCard:before{content:"";position:absolute;inset:0 auto 0 0;width:5px;background:var(--yellow);transform:scaleY(.25);transform-origin:center;transition:transform .2s ease}.roleCard:hover{transform:translateY(-4px);box-shadow:0 18px 42px rgba(16,35,75,.12);border-color:#cbd8ef}.roleCard:hover:before,.roleCard:focus-visible:before{transform:scaleY(1)}.roleCard:active{transform:translateY(-1px) scale(.985);box-shadow:0 8px 20px rgba(16,35,75,.1)}.roleCard:focus-visible{outline:3px solid rgba(29,95,209,.18);outline-offset:3px}.roleIcon{display:grid;place-items:center;width:58px;height:58px;border-radius:18px;background:#eef5ff;font-size:28px;margin-bottom:18px}.roleCard h2{margin:10px 0 7px;font-size:25px;letter-spacing:-.6px}.roleCard p{margin:0;color:var(--muted);font-size:14px;min-height:66px}.roleAction{display:flex;justify-content:space-between;align-items:center;margin-top:22px;color:var(--blue);font-size:13px;font-weight:900}.roleAction b{font-size:19px;transition:transform .18s ease}.roleCard:hover .roleAction b{transform:translateX(4px)}.registerForm{max-width:900px;margin:0 auto;background:#fff;border:1px solid var(--line);border-radius:26px;padding:26px;box-shadow:0 14px 45px rgba(16,35,75,.08)}.registerTopbar{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;padding:4px 2px 24px;border-bottom:1px solid var(--line)}.registerTopbar h2{font-size:30px;letter-spacing:-1px;margin:10px 0 3px}.registerTopbar p{margin:0;color:var(--muted);font-size:13px}.backBtn{white-space:nowrap}.formSection{padding:26px 2px;border-bottom:1px solid var(--line)}.sectionMiniHead{display:flex;gap:13px;align-items:flex-start;margin-bottom:18px}.sectionMiniHead>span{flex:0 0 auto;width:34px;height:34px;display:grid;place-items:center;border-radius:11px;background:#eef5ff;color:var(--blue);font-size:11px;font-weight:900}.sectionMiniHead h3{margin:1px 0 2px;font-size:17px}.sectionMiniHead p{margin:0;color:var(--muted);font-size:12px}.formSection>.grid2{gap:16px 18px}.formSection label{display:block}.form input,.form select{transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease}.form input:hover,.form select:hover{border-color:#c9d5e8}.form input:focus,.form select:focus{border-color:var(--blue);box-shadow:0 0 0 4px rgba(29,95,209,.08)}.fieldHint{display:block;color:var(--muted);font-size:11px;font-weight:500;margin-top:5px}.rtRw{display:grid;grid-template-columns:1fr 1fr;gap:10px}.formMessage{margin:20px 2px 0;padding:13px 15px;border-radius:13px;background:#eef5ff;color:#31548d;font-size:12px}.formMessage.error{background:#fff0f2;color:var(--red);border:1px solid #f5c8cf}.submitArea{padding:24px 2px 0}.submitBtn{width:100%;min-height:54px;font-size:15px;position:relative;box-shadow:0 7px 0 #d79b00;transition:transform .12s ease,box-shadow .12s ease,filter .12s ease}.submitBtn:hover{filter:brightness(1.02)}.submitBtn:active{transform:translateY(4px);box-shadow:0 3px 0 #d79b00}.submitBtn:disabled{cursor:wait;opacity:.86;transform:none;box-shadow:0 4px 0 #d79b00}.submitBtn.is-loading .btnLabel{opacity:.7}.btnSpinner{display:none;width:18px;height:18px;border:3px solid rgba(16,35,75,.22);border-top-color:var(--navy);border-radius:50%;animation:registerSpin .7s linear infinite;margin-left:9px}.submitBtn.is-loading .btnSpinner{display:inline-block}@keyframes registerSpin{to{transform:rotate(360deg)}}.submitArea p{text-align:center;color:var(--muted);font-size:11px;margin:12px 0 0}@media(max-width:700px){.registerPage{padding-top:30px}.roleCards{grid-template-columns:1fr}.roleCard{padding:22px}.roleCard p{min-height:0}.registerForm{padding:18px;border-radius:20px}.registerTopbar{align-items:center}.registerTopbar h2{font-size:25px}.backBtn{padding:9px 11px;font-size:11px}.formSection{padding:22px 0}.formSection>.grid2{gap:13px}.rtRw{gap:8px}.registerIntro h1{font-size:38px}}@media(max-width:560px){.registerIntro{text-align:left}.registerIntro h1{font-size:36px}.registerIntro p{font-size:14px}.roleCard h2{font-size:22px}.registerTopbar{gap:10px}.registerTopbar .tag{font-size:9px}.registerTopbar p{font-size:12px}.sectionMiniHead{gap:10px}.sectionMiniHead h3{font-size:16px}.sectionMiniHead p{font-size:11px}.formSection>.grid2{grid-template-columns:1fr}.registerForm .btn{width:100%}.backBtn{width:auto!important}.submitArea{padding-top:20px}}
/* =========================================================
   ADMIN CMS + ARTICLES
   ========================================================= */
.adminPage{padding-top:38px;padding-bottom:70px}.adminHero{display:flex;justify-content:space-between;gap:24px;align-items:flex-end;margin-bottom:24px}.adminHero h1{margin:8px 0 8px}.adminStatus{min-width:190px;padding:16px 18px;border:1px solid var(--line,#dfe5ef);border-radius:18px;background:#fff;box-shadow:0 10px 30px rgba(20,35,70,.06)}.adminStatus span{color:#1a9b63}.adminStatus b,.adminStatus small{display:block}.adminStatus small{color:#6b7890;margin-top:3px}.adminTabs{display:flex;gap:8px;flex-wrap:wrap;margin:22px 0}.adminTab{border:1px solid #dfe5ef;background:#fff;border-radius:12px;padding:11px 16px;font-weight:800;cursor:pointer}.adminTab.active{background:#142b59;color:#fff;border-color:#142b59}.adminPanel{background:#fff;border:1px solid #dfe5ef;border-radius:22px;padding:26px;box-shadow:0 16px 45px rgba(20,35,70,.06)}.adminList{display:grid;gap:16px}.adminCard{border:1px solid #e1e7f0;border-radius:18px;padding:20px;background:#fff}.adminCardHead{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:15px}.adminCard h3{margin:7px 0 0}.statusPill{background:#eef7f1;color:#23734b;border-radius:999px;padding:6px 10px;font-size:12px;font-weight:800}.adminGrid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.adminGrid .full{grid-column:1/-1}.adminCard label,.adminEditor label{display:block;font-size:13px;font-weight:800;color:#263653}.adminCard input,.adminCard textarea,.adminCard select,.adminEditor input,.adminEditor textarea,.bankToolbar select{display:block;width:100%;margin-top:7px;border:1px solid #dce3ee;border-radius:12px;padding:12px 13px;font:inherit;background:#fff;color:#172744}.adminCard textarea,.adminEditor textarea{min-height:100px;resize:vertical}.articleBodyInput{min-height:220px!important}.rowBtns{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}.newLabel{font-size:12px;font-weight:900;color:#2165d5;margin:12px 0}.bankToolbar{display:grid;grid-template-columns:1.5fr 1fr;gap:12px;margin-bottom:16px}.adminEditor{border:1px solid #dfe5ef;border-radius:18px;padding:20px;background:#fbfcff}.optionsGrid{margin-top:14px}.toast{position:fixed;right:22px;bottom:22px;transform:translateY(20px);opacity:0;pointer-events:none;padding:13px 16px;border-radius:12px;background:#142b59;color:#fff;font-weight:800;transition:.2s;z-index:50}.toast.show{opacity:1;transform:none}.toast.bad{background:#a52a2a}.articleGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.articleCard{background:#fff;border:1px solid #dfe5ef;border-radius:18px;overflow:hidden;box-shadow:0 12px 30px rgba(20,35,70,.05)}.articleCard img{width:100%;height:190px;object-fit:cover;display:block}.articleCard .cardBody{padding:18px}.articleCard h3{margin:10px 0 8px}.articleCard p{color:#687892;min-height:48px}.articleGridWide{margin-top:22px}.pageTop{padding-top:46px;padding-bottom:70px}.articleDetail{padding-top:48px;padding-bottom:80px;max-width:900px}.articleDetail h1{font-size:clamp(34px,5vw,58px);line-height:1.05;margin:12px 0}.articleHero{width:100%;max-height:500px;object-fit:cover;border-radius:22px;margin:24px 0 30px}.articleBody{font-size:18px;line-height:1.8;color:#435371}.articleBody p{margin:0 0 18px}
@media(max-width:900px){.adminHero{align-items:flex-start;flex-direction:column}.adminStatus{width:100%}.adminGrid,.bankToolbar,.articleGrid{grid-template-columns:1fr}.adminGrid .full{grid-column:auto}.adminPanel{padding:20px}}

/* AYOLES.ID v4.8.0 — visual upgrade without changing assessment data/API */
.dashboard{padding:28px 0 64px}.dashboard>.wrap> .dashboardHeroCard{margin-bottom:16px}.dashboardHeroCard{position:relative;overflow:hidden;min-height:170px;padding:28px 30px;border-radius:24px;background:linear-gradient(135deg,#10234b 0%,#17366f 62%,#2457a7 100%);color:#fff;display:flex;align-items:center;justify-content:space-between;box-shadow:0 18px 45px rgba(16,35,75,.18)}.dashboardHeroCard h1{font-size:34px;letter-spacing:-1.3px;margin:9px 0 5px}.dashboardHeroCard p{margin:0;color:#d7e1f4;font-size:13px}.dashboardHeroCard .tag{background:#ffffff18;color:#ffd34f;border:1px solid #ffffff22}.heroQuick{display:flex;gap:9px;flex-wrap:wrap;margin-top:18px}.heroQuick .btn{min-height:42px}.heroOrb{width:128px;height:128px;border-radius:50%;display:grid;place-items:center;font-size:54px;color:#ffcf38;background:radial-gradient(circle,#ffffff20 0,#ffffff08 58%,transparent 59%);border:1px solid #ffffff14;margin-right:30px}.dashboard .card{border-color:#e0e7f1;box-shadow:0 10px 30px rgba(16,35,75,.055);border-radius:21px}.dashboard h2{letter-spacing:-.5px}.dashboard #studentView>.card,.dashboard #parentView>.card{margin-top:16px}.dashboard #history{display:grid;gap:10px}.dashboard #history>.panel{margin:0!important;padding:16px!important;border-radius:16px;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}.dashboard #history>.panel:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(16,35,75,.08);border-color:#cbd8eb}.dashboard #history>.panel h3{font-size:14px;color:#182b50}.dashboard #history>.panel small{color:#718098}.dashboard #history>.panel .btn{margin-top:2px}.dashboardConsult{display:flex;align-items:center;gap:14px;margin-top:16px;padding:17px 19px;border-radius:19px;background:#effbf5;border:1px solid #c8eed9;box-shadow:0 8px 22px rgba(24,130,91,.06)}.dashboardConsult>div:nth-child(2){flex:1}.dashboardConsult h2{font-size:15px;margin:5px 0 2px}.dashboardConsult p{font-size:10px;color:#5c786c;margin:0}.dashboardConsult .consultIcon{width:45px;height:45px;border-radius:14px;background:#25D366;color:#fff;display:grid;place-items:center;flex:0 0 45px}.dashboardConsult .consultIcon .waIcon{width:26px;height:26px}.btn.wa{background:#25D366!important;border-color:#25D366!important;color:#fff!important;gap:8px;box-shadow:0 7px 18px rgba(37,211,102,.18)}.btn.wa:hover{background:#1fbd59!important;filter:none}.waIcon{width:19px;height:19px;display:inline-flex;align-items:center;justify-content:center}.waIcon svg{width:100%;height:100%}
/* Result screen visual hierarchy */
#result.notice{padding:0;background:transparent;color:var(--text);font-size:inherit}.assessmentResultCard{background:#fff;border:1px solid #e1e7f0;border-radius:24px;padding:25px;box-shadow:0 14px 38px rgba(16,35,75,.07);margin-top:20px}.assessmentResultCard .resultCelebration{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:5px 2px 20px}.assessmentResultCard .resultCelebration h2{font-size:29px;letter-spacing:-1px;margin:9px 0 3px}.assessmentResultCard .resultCelebration p{color:var(--muted);font-size:12px;margin:0}.resultScoreBig{width:116px;height:116px;border-radius:50%;background:linear-gradient(145deg,#edf8ff,#fff8d9);border:8px solid #fff;box-shadow:0 0 0 1px #e5eaf1,0 10px 25px rgba(16,35,75,.08);display:flex;align-items:center;justify-content:center;flex-wrap:wrap;align-content:center;column-gap:2px}.resultScoreBig span{width:100%;text-align:center;font-size:8px;font-weight:900;color:var(--muted)}.resultScoreBig strong{font-size:34px;line-height:1}.resultScoreBig small{font-size:11px;color:var(--muted);font-weight:800}.resultMetricRow{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.resultMetricRow>div{border:1px solid #e6eaf1;background:#fbfcff;border-radius:13px;padding:12px}.resultMetricRow small{display:block;color:var(--muted);font-size:9px}.resultMetricRow strong{display:block;font-size:12px;margin-top:3px}.resultMessage{margin-top:13px;background:#fff8e8;border:1px solid #f2dfb0;border-radius:14px;padding:14px}.resultMessage strong{font-size:12px}.resultMessage p{font-size:10px;color:#766943;margin:4px 0 0}.resultActions{display:flex;gap:9px;flex-wrap:wrap;margin-top:17px}.resultActions .btn{min-height:45px}.resultActions .wa{background:#25D366!important;border-color:#25D366!important;color:#fff!important}
@media(max-width:700px){.dashboardHeroCard{padding:22px;min-height:0}.dashboardHeroCard h1{font-size:27px}.heroOrb{display:none}.heroQuick{flex-direction:column}.heroQuick .btn{width:100%}.dashboardConsult{align-items:flex-start;flex-wrap:wrap}.dashboardConsult .btn{width:100%}.resultCelebration{align-items:flex-start!important;flex-direction:column}.resultScoreBig{align-self:center}.resultMetricRow{grid-template-columns:1fr}.resultActions .btn{width:100%}}

/* =========================================================
   AYOLES.ID v4.9 — BRAND EXPERIENCE / LANDING UI
   ========================================================= */
:root{
  --navy:#10234b;--navy2:#17356e;--blue:#2563eb;--blue2:#4f8cff;--yellow:#ffc53d;
  --cream:#fff9ed;--sky:#eef5ff;--mint:#edfdf6;--purple:#f3efff;--text:#13213b;--muted:#68758c;
  --line:#e6ebf3;--shadow:0 18px 50px rgba(16,35,75,.10);--shadow-lg:0 28px 80px rgba(16,35,75,.15);
}
body{background:#f7f9fc;color:var(--text)}
.nav{height:82px;backdrop-filter:blur(14px);background:rgba(255,255,255,.94);box-shadow:0 1px 0 rgba(16,35,75,.05)}
.nav .wrap{max-width:1240px}.brand{gap:11px}.brand strong{font-size:21px}.brand small{font-size:10px;margin-top:-1px}
.navlinks{align-items:center;gap:25px}.navlinks a,.navDropdown summary{font-size:13px}.navDropdown summary{cursor:pointer;list-style:none}.navDropdown summary::-webkit-details-marker{display:none}
.dropdownMenu{min-width:270px;padding:10px;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:var(--shadow-lg)}
.dropdownMenu a{display:block;padding:12px;border-radius:11px}.dropdownMenu a:hover{background:var(--sky)}.dropdownMenu small{display:block;color:var(--muted);margin-top:2px}
.btn{min-height:44px;padding:12px 18px;border-radius:13px;transition:.2s ease;box-shadow:none}.btn:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(16,35,75,.10)}
.btn.primary{background:var(--yellow);color:#17243f}.btn.dark{background:var(--navy)}.btn.blue{background:var(--blue)}.btn.wa{background:#25D366!important;border-color:#25D366!important;color:#fff!important;box-shadow:0 10px 24px rgba(37,211,102,.18)}
.waIcon{width:21px;height:21px}.waIcon svg{fill:currentColor}
.hero{padding:76px 0 70px;background:radial-gradient(circle at 80% 10%,#eef5ff 0,transparent 34%),linear-gradient(180deg,#fff 0,#f7f9fc 100%);overflow:hidden}
.heroGrid{grid-template-columns:48% 52%;max-width:1240px;gap:36px}.hero h1{font-size:clamp(45px,5.2vw,72px);letter-spacing:-3.8px;line-height:.99;max-width:650px}.hero p{font-size:18px;line-height:1.75;max-width:600px}.heroTrust{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}.heroTrust span{padding:9px 12px;border:1px solid var(--line);background:#fff;border-radius:999px;font-size:12px;font-weight:750;color:#43516a;box-shadow:0 6px 20px rgba(16,35,75,.04)}
.visual{min-height:535px}.photo{border-radius:30px;box-shadow:var(--shadow-lg);border:7px solid rgba(255,255,255,.9)}.p1{width:61%;height:74%}.p2{width:43%;height:46%;top:10%;right:0}.p3{width:45%;height:38%;bottom:0;right:7%}.floating{left:5%;bottom:7%;z-index:5;border:1px solid rgba(255,255,255,.7);background:rgba(255,255,255,.94);backdrop-filter:blur(15px);border-radius:18px;padding:15px 18px;box-shadow:var(--shadow);min-width:245px}.floating b{font-size:11px;color:var(--blue)}.floating strong{display:block;font-size:16px;margin-top:2px}.floating small{color:var(--muted)}
section{padding:82px 0}.sectionHead{margin-bottom:30px;align-items:end}.sectionHead h2,.valueGrid h2{font-size:clamp(30px,4vw,46px);letter-spacing:-1.8px;line-height:1.08;margin:10px 0}.sectionHead p,.lead{color:var(--muted);font-size:16px}.programCards{gap:20px}.programCard{background:#fff;border:1px solid var(--line);border-radius:24px;overflow:hidden;box-shadow:0 10px 35px rgba(16,35,75,.06);transition:.25s ease}.programCard:hover{transform:translateY(-7px);box-shadow:var(--shadow-lg)}.programVisual{height:230px;position:relative;overflow:hidden;background:#edf3ff}.programVisual img{width:100%;height:100%;object-fit:cover;transition:.35s}.programCard:hover .programVisual img{transform:scale(1.04)}.programIcon{position:absolute;left:16px;top:16px;background:rgba(255,255,255,.93);width:44px;height:44px;border-radius:14px;display:grid;place-items:center;font-size:20px;box-shadow:0 8px 20px rgba(0,0,0,.10)}.cardBody{padding:22px}.cardBody h3{font-size:21px;letter-spacing:-.5px;margin:10px 0 8px}.cardBody p{color:var(--muted);min-height:50px}.cardLink{display:inline-flex;margin-top:8px;color:var(--blue);font-weight:850;font-size:13px}
.valueGrid{gap:60px;align-items:start}.valueList{display:grid;gap:12px}.valueItem{background:#fff;border:1px solid var(--line);border-radius:18px;padding:17px 18px;box-shadow:0 8px 24px rgba(16,35,75,.04)}.valueItem>span{width:34px;height:34px;display:grid;place-items:center;background:var(--sky);border-radius:10px;color:var(--blue);font-weight:900}.valueItem p{color:var(--muted);margin:3px 0 0}
.softSection{background:#f0f5ff}.steps{gap:16px}.step{background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px;box-shadow:0 8px 25px rgba(16,35,75,.05);position:relative}.step span{width:42px;height:42px;border-radius:13px;background:var(--navy);color:#fff;display:grid;place-items:center;font-weight:900}.step h3{margin:17px 0 6px}.step p{color:var(--muted)}
.assessment,.ctaBand{border-radius:30px!important;background:linear-gradient(135deg,#10234b,#1d4f9d);color:#fff;box-shadow:var(--shadow-lg)!important;padding:40px!important;position:relative;overflow:hidden}.assessment:after,.ctaBand:after{content:"";position:absolute;width:260px;height:260px;border-radius:50%;background:rgba(255,197,61,.16);right:-70px;top:-100px}.assessment h2,.ctaBand h2{font-size:34px;letter-spacing:-1.3px}.assessment p,.ctaBand p{color:#dce6f8}.assessment .btn.light,.ctaBand .btn.light{background:#fff}.articleGrid{gap:18px}.articleCard{background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:0 8px 25px rgba(16,35,75,.05)}.articleCard img{height:190px;width:100%;object-fit:cover}.articleCard .cardBody{padding:18px}.articleCard h3{font-size:19px}
.footer{padding:55px 0 25px;background:#0d1c3d;color:#dbe5f8}.footer a{color:#fff}.footer .brand strong{color:#fff}.copyright{border-top:1px solid rgba(255,255,255,.12);padding-top:18px;margin-top:28px;color:#94a4c2}
/* Landing pages */
.landingHero{padding:70px 0 65px;background:radial-gradient(circle at 80% 20%,#e8f1ff 0,transparent 36%),linear-gradient(180deg,#fff,#f6f9ff);overflow:hidden}.landingGrid{grid-template-columns:51% 49%;gap:38px;align-items:center}.landingHero h1{font-size:clamp(42px,5vw,65px);line-height:1.02;letter-spacing:-3.4px;margin:12px 0 18px}.landingHero> .wrap>div>p{font-size:18px;line-height:1.75;color:var(--muted);max-width:620px}.landingImage{height:480px;border-radius:32px;overflow:hidden;box-shadow:var(--shadow-lg);border:7px solid #fff;position:relative}.landingImage img{width:100%;height:100%;object-fit:cover}.imageBadge{position:absolute;left:22px;bottom:22px;background:rgba(255,255,255,.94);backdrop-filter:blur(14px);padding:13px 16px;border-radius:15px;box-shadow:var(--shadow);display:flex;flex-direction:column}.imageBadge span{color:var(--muted);font-size:12px}.comingNote{margin-top:17px;display:inline-block;background:#fff7dd;color:#7b5a00;border:1px solid #f4df9b;border-radius:12px;padding:10px 13px;font-size:12px}.miniCards{gap:18px}.miniCard{background:#fff;border:1px solid var(--line);border-radius:22px;padding:24px;box-shadow:0 8px 28px rgba(16,35,75,.05);transition:.2s}.miniCard:hover{transform:translateY(-4px);box-shadow:var(--shadow)}.miniCard>span{display:grid;place-items:center;width:48px;height:48px;border-radius:15px;background:var(--sky);font-size:22px}.miniCard h3{margin:16px 0 6px}.miniCard p{color:var(--muted);margin:0}.testimonialHead{max-width:720px;margin-bottom:28px}.testimonialHead h2{font-size:40px;letter-spacing:-1.5px}.testimonialGrid{gap:16px}.testimonialCard{background:#fff;border:1px solid var(--line);border-radius:20px;padding:22px;box-shadow:0 8px 25px rgba(16,35,75,.05)}.stars{color:#f5ad00;letter-spacing:2px}.testimonialCard p{font-size:15px;line-height:1.7}.testimonialPerson{display:flex;flex-direction:column;margin-top:16px}.testimonialPerson span{color:var(--muted);font-size:12px}.baristaVisual{display:grid;place-items:center;background:linear-gradient(135deg,#1b2432,#5c4028)}.baristaArt{font-size:92px;filter:drop-shadow(0 20px 20px rgba(0,0,0,.25))}.baristaHero{background:linear-gradient(135deg,#1a2433,#6c4a2f)}.baristaHero .large{font-size:180px;display:grid;place-items:center;width:100%;height:100%}
/* Dashboard */
.dashboard{padding:34px 0 70px;background:radial-gradient(circle at 90% 0,#eaf2ff 0,transparent 28%)}.dashboard>.wrap{max-width:1240px}.dashboardHeroCard{border-radius:28px;padding:34px 38px;background:linear-gradient(135deg,#10234b,#1e4f9d);color:#fff;display:flex;justify-content:space-between;align-items:center;box-shadow:var(--shadow-lg);overflow:hidden;position:relative}.dashboardHeroCard:after{content:"";position:absolute;width:330px;height:330px;border-radius:50%;right:-100px;top:-150px;background:rgba(255,197,61,.15)}.dashboardHeroCard h1{font-size:38px;letter-spacing:-1.5px;margin:9px 0 5px}.dashboardHeroCard p{color:#dbe6f8}.heroQuick{display:flex;gap:10px;flex-wrap:wrap;margin-top:20px}.heroOrb{font-size:92px;opacity:.75;z-index:1}.dashboard .card,.dashboard .panel{background:#fff;border:1px solid var(--line);border-radius:22px;box-shadow:0 8px 28px rgba(16,35,75,.05)}.dashboard .card{padding:24px!important}.dashboard .card h2{font-size:24px;letter-spacing:-.7px}.dashboardConsult{margin-top:18px;border:1px solid #bcefd1;background:linear-gradient(135deg,#f0fff6,#fff);border-radius:22px;padding:22px;display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;box-shadow:0 10px 28px rgba(37,211,102,.08)}.consultIcon{width:54px;height:54px;border-radius:17px;background:#25D366;color:#fff;display:grid;place-items:center}.dashboardConsult h2{margin:3px 0}.dashboardConsult p{color:var(--muted);margin:0}.greenTag{background:#e8fff1;color:#11854d!important}.historyGrid{display:grid;gap:12px}.historyItem{display:grid;grid-template-columns:auto 1fr auto;gap:15px;align-items:center;border:1px solid var(--line);border-radius:18px;padding:16px;background:#fff;transition:.2s}.historyItem:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(16,35,75,.06)}.subjectIcon{width:48px;height:48px;border-radius:14px;background:var(--sky);display:grid;place-items:center;font-size:21px}.scoreStrong{font-size:21px;font-weight:900}.scoreGood{color:#159447}.scoreMid{color:#d18b00}.scoreLow{color:#d63e4e}.muted{color:var(--muted)}
/* Assessment / result */
main.wrap.panel{max-width:1120px!important;margin:34px auto 70px;border:1px solid var(--line);border-radius:28px;background:#fff;box-shadow:var(--shadow);padding:34px!important}.panel{background:#fff}.notice{border-radius:16px;border:1px solid var(--line);background:#f7faff;padding:15px}.form label{color:#273651}.form input,.form select{border:1px solid #dce3ee;border-radius:12px;padding:12px;background:#fff}.quizResultHero{border-radius:24px;padding:28px;background:linear-gradient(135deg,#edf5ff,#fff9e9);border:1px solid #dce8fb}.scoreCircle{width:112px;height:112px;border-radius:50%;display:grid;place-items:center;background:#fff;border:10px solid #dce9ff;box-shadow:0 12px 30px rgba(16,35,75,.08)}.resultActions{display:flex;gap:10px;flex-wrap:wrap}.reviewQuestion{border:1px solid var(--line);border-radius:18px;padding:18px;background:#fff}.answerOption{padding:11px 13px;margin:7px 0;border:1px solid var(--line);border-radius:12px;background:#fbfcfe}.answerOption.correct{border-color:#9fe1bb;background:#f0fff6}.answerOption.wrong{border-color:#f2a8b1;background:#fff4f5}
@media(max-width:900px){.navlinks{display:none}.heroGrid,.landingGrid{grid-template-columns:1fr}.visual{min-height:430px}.landingImage{height:390px}.dashboardHeroCard{padding:28px;}.dashboardConsult{grid-template-columns:auto 1fr}.dashboardConsult>.btn{grid-column:1/-1}.historyItem{grid-template-columns:auto 1fr}.historyItem>.btn{grid-column:2;justify-self:start}.hero h1,.landingHero h1{letter-spacing:-2.5px}.valueGrid{grid-template-columns:1fr}.sectionHead{display:block}}
@media(max-width:600px){.wrap{padding:0 16px}.nav{height:70px}.navbtns .btn.light{display:none}.hero,.landingHero{padding:48px 0}.hero h1,.landingHero h1{font-size:43px}.hero p,.landingHero> .wrap>div>p{font-size:16px}.visual{min-height:350px}.p1{width:65%;height:70%}.p2{width:45%;height:44%}.p3{width:48%;height:35%}.floating{left:2%;bottom:4%;min-width:215px}.programVisual{height:190px}.assessment,.ctaBand{padding:28px!important;border-radius:22px!important}.dashboard{padding-top:18px}.dashboardHeroCard{border-radius:22px;padding:24px}.dashboardHeroCard h1{font-size:30px}.heroOrb{display:none}.dashboardConsult{padding:18px}.landingImage{height:330px}.testimonialHead h2{font-size:31px}section{padding:60px 0}main.wrap.panel{margin:18px auto 50px;padding:20px!important;border-radius:20px}}

.dashboardStats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:4px 0 18px}.dashboardStats>div{padding:16px;border:1px solid var(--line);border-radius:17px;background:#f9fbff;display:grid;grid-template-columns:auto 1fr;column-gap:10px;align-items:center}.dashboardStats span{grid-row:1/3;width:38px;height:38px;border-radius:11px;background:#fff;display:grid;place-items:center}.dashboardStats b{font-size:21px}.dashboardStats small{color:var(--muted)}.profileHero{display:flex;align-items:center;gap:15px;padding:16px;background:linear-gradient(135deg,#f0f6ff,#fff);border-radius:18px;border:1px solid var(--line)}.avatarCircle{width:58px;height:58px;border-radius:18px;background:var(--navy);color:#fff;display:grid;place-items:center;font-size:24px;font-weight:900}.profileHero h3{margin:5px 0 0;font-size:21px}.profileHero p{margin:2px 0;color:var(--muted)}.profileMeta{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:12px 0 18px}.profileMeta>div{padding:12px;border:1px solid var(--line);border-radius:13px}.profileMeta small,.profileMeta b{display:block}.profileMeta small{color:var(--muted);font-size:11px}.profileMeta b{margin-top:3px}.resultHeader{display:flex;justify-content:space-between;gap:12px;align-items:start}.reviewIntro{margin:16px 0;padding:17px 18px;border-radius:17px;background:linear-gradient(135deg,#edf5ff,#f8fbff);border:1px solid #dce8fb;display:flex;flex-direction:column;gap:4px}.reviewIntro span{color:var(--muted);font-size:13px}@media(max-width:900px){.dashboardStats{grid-template-columns:repeat(2,1fr)}.profileMeta{grid-template-columns:1fr}}@media(max-width:600px){.dashboardStats{grid-template-columns:1fr 1fr}.historyItem>div:last-child{grid-column:2}.resultHeader{display:block}.resultHeader #closeResult{margin-top:10px}}

/* ===================== AYOLES.ID v4.9.1 VISUAL SYSTEM ===================== */
:root{--ink:#12254b;--ink2:#1b3565;--sky:#eaf2ff;--gold:#ffbd22;--mint:#e9fbf3;--mint2:#19a968;--violet:#eee9ff;--orange:#fff0df;--cream:#fffaf0;--shadow:0 20px 60px rgba(18,37,75,.10)}
body{background:#f7f9fd;color:var(--ink)}
.siteNav{height:78px;background:rgba(255,255,255,.94);backdrop-filter:blur(16px);box-shadow:0 1px 0 rgba(18,37,75,.04)}
.siteNav .brand strong{font-size:21px}.siteNav .navlinks{font-size:12px}.siteNav .navbtns .primary{box-shadow:0 8px 20px rgba(255,189,34,.22)}
.btn{transition:transform .18s ease,box-shadow .18s ease,filter .18s ease}.btn:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(18,37,75,.10)}.btnLarge{padding:14px 21px;border-radius:14px}.btn.wa{background:#25D366!important;border-color:#25D366!important;color:#fff!important;box-shadow:0 9px 20px rgba(37,211,102,.20)}.btn.wa:hover{filter:brightness(.95)}.waIcon{width:20px;height:20px}
.homeHero{position:relative;overflow:hidden;padding:70px 0 75px;background:radial-gradient(circle at 85% 10%,#fff4c8 0,transparent 24%),linear-gradient(180deg,#fff 0%,#f5f8ff 100%)}
.homeHeroGrid{display:grid;grid-template-columns:1fr .9fr;gap:56px;align-items:center}.homeHeroCopy{position:relative;z-index:2}.homeHeroCopy h1{font-size:clamp(46px,5.5vw,76px);line-height:.98;letter-spacing:-4px;margin:10px 0 22px;max-width:720px}.homeHeroCopy h1 em,.programHero h1 em{font-style:normal;color:#2866d4}.homeHeroCopy p{font-size:18px;line-height:1.7;color:#65728a;max-width:650px}.trustRow{display:flex;gap:9px;flex-wrap:wrap;margin-top:20px}.trustRow span{padding:8px 11px;border-radius:999px;background:#fff;border:1px solid #e4eaf4;color:#52627c;font-size:11px;font-weight:800}.homeHeroVisual{min-height:530px;position:relative}.heroGlow{position:absolute;width:390px;height:390px;border-radius:50%;background:linear-gradient(135deg,#dce9ff,#fff0b8);right:8%;top:5%;filter:blur(2px)}.heroMainImage,.heroMiniImage{position:absolute;overflow:hidden;border-radius:28px;border:8px solid rgba(255,255,255,.82);box-shadow:var(--shadow)}.heroMainImage{width:72%;height:410px;left:3%;top:30px;transform:rotate(-2deg)}.heroMiniImage{width:42%;height:215px;right:0;bottom:20px;transform:rotate(3deg)}.heroMainImage img,.heroMiniImage img{width:100%;height:100%;object-fit:cover}.heroFloat{position:absolute;left:30%;bottom:5px;background:#fff;border:1px solid #e3e9f3;border-radius:18px;padding:14px 16px;display:flex;gap:10px;align-items:center;box-shadow:0 15px 40px rgba(18,37,75,.14);z-index:3}.floatIcon{width:38px;height:38px;border-radius:12px;background:#fff4cf;display:grid;place-items:center;color:#a66c00;font-weight:900}.heroFloat b{display:block;font-size:13px}.heroFloat small{display:block;color:#738097;font-size:10px}.heroBadge{position:absolute;right:3%;top:30px;width:82px;height:82px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;text-align:center;box-shadow:0 14px 30px rgba(18,37,75,.2);z-index:4}.heroBadge strong{font-size:28px;color:var(--gold);line-height:1}.heroBadge span{font-size:9px;font-weight:800;line-height:1.05}
.statsBand{background:var(--ink);color:#fff;padding:23px 0}.statsBandGrid{display:grid;grid-template-columns:1fr 1fr 1fr 1.5fr;gap:0}.statsBandGrid>div{padding:8px 22px;border-right:1px solid rgba(255,255,255,.12)}.statsBandGrid>div:first-child{padding-left:0}.statsBandGrid>div:last-child{border:0}.statsBandGrid strong{display:block;color:var(--gold);font-size:24px}.statsBandGrid span{display:block;font-weight:850;font-size:13px}.statsBandGrid small{color:#aebbd2;font-size:10px}.statsBandCta{display:flex;flex-direction:column;justify-content:center;align-items:flex-end;text-align:right}.statsBandCta b{font-size:13px}.textLink{display:inline-block;color:#2364d3;font-size:12px;font-weight:900;margin-top:7px}.statsBand .textLink{color:var(--gold)}
.sectionIntro{max-width:760px;margin-bottom:28px}.sectionIntro.center{text-align:center;margin-left:auto;margin-right:auto}.sectionIntro h2{font-size:clamp(32px,4vw,48px);line-height:1.04;letter-spacing:-2px;margin:10px 0 10px}.sectionIntro p{color:#6b7890;font-size:15px;line-height:1.7}.programSection{padding:88px 0;background:#f7f9fd}.programShowcase{display:grid;grid-template-columns:1.35fr .85fr;gap:18px}.programFeature{display:block;background:#fff;border:1px solid #e2e8f2;border-radius:26px;overflow:hidden;box-shadow:0 12px 36px rgba(18,37,75,.06);transition:.2s ease}.programFeature:hover{transform:translateY(-4px);box-shadow:0 20px 50px rgba(18,37,75,.11)}.featureImage{height:330px;position:relative}.featureImage img{width:100%;height:100%;object-fit:cover}.featurePill{position:absolute;left:18px;top:18px;background:#fff;color:#1c58b8;border-radius:999px;padding:8px 11px;font-size:9px;font-weight:900;letter-spacing:.5px}.featureBody{display:flex;justify-content:space-between;gap:18px;padding:24px}.miniTag{display:inline-block;color:#2564cf;background:#eef4ff;padding:6px 9px;border-radius:999px;font-size:9px;font-weight:900}.miniTag.green{background:#eafaf2;color:#138354}.miniTag.orange{background:#fff0df;color:#a95e11}.featureBody h3,.compact h3{font-size:24px;letter-spacing:-.8px;margin:10px 0 7px}.featureBody p,.compact p{color:#6a7790;font-size:13px;line-height:1.65;margin:0}.arrowCircle{width:46px;height:46px;flex:0 0 46px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-size:20px}.sidePrograms{display:grid;gap:18px}.compact{padding:18px;display:grid;grid-template-columns:120px 1fr;gap:18px;align-items:center}.compactImage{height:140px;border-radius:18px;overflow:hidden}.compactImage img{width:100%;height:100%;object-fit:cover}.compact .textLink{margin-top:12px}.coffeeCard{background:linear-gradient(135deg,#fffaf4,#fff)}.coffeeVisual{height:140px;border-radius:18px;background:radial-gradient(circle at 50% 30%,#fff 0,#f8e7d1 48%,#e9c9a4 100%);display:grid;place-items:center;position:relative}.coffeeVisual span{font-size:66px;filter:drop-shadow(0 12px 12px rgba(40,28,16,.18))}.coffeeVisual small{position:absolute;bottom:8px;font-size:7px;font-weight:900;letter-spacing:1px;color:#795235}
.processSection{padding:88px 0;background:#fff}.processGrid{display:grid;grid-template-columns:.75fr 1.25fr;gap:70px}.processIntro h2{font-size:44px;line-height:1.05;letter-spacing:-2px;margin:10px 0 15px}.processIntro p{color:#68758d;line-height:1.75}.processIntro .btn{margin-top:12px}.processSteps{border-top:1px solid #e3e8f1}.processItem{display:grid;grid-template-columns:55px 1fr;gap:20px;padding:22px 0;border-bottom:1px solid #e3e8f1}.processItem>span{font-weight:900;color:#2b68d4;font-size:12px}.processItem h3{margin:0 0 5px;font-size:17px}.processItem p{margin:0;color:#6d7990;font-size:13px}
.whySection{padding:88px 0;background:#f5f8fc}.whyGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:15px}.whyCard{background:#fff;border:1px solid #e2e8f2;border-radius:20px;padding:23px;min-height:190px}.whyCard>span{font-size:25px}.whyCard h3{margin:15px 0 7px;font-size:17px}.whyCard p{margin:0;color:#6c7890;font-size:13px;line-height:1.65}.assessmentBanner{padding:50px 0}.assessmentHero{border-radius:30px;padding:42px;background:linear-gradient(135deg,#10234b 0%,#1f4f9f 100%);color:#fff;display:flex;justify-content:space-between;gap:25px;align-items:center;box-shadow:0 22px 55px rgba(16,35,75,.18)}.assessmentHero h2{font-size:38px;letter-spacing:-1.5px;margin:10px 0}.assessmentHero p{color:#cdd8eb;margin:0;max-width:650px}.assessmentHero .tag{background:#fff3cc;color:#916800}.articleSection{padding:55px 0 85px}.articleSection .sectionHead h2{font-size:34px}.articleSection .sectionHead p{color:#6b7890}
/* Program pages */
.programHero{padding:70px 0 80px;position:relative;overflow:hidden}.programHeroGrid{display:grid;grid-template-columns:1.05fr .95fr;gap:55px;align-items:center}.programHero h1{font-size:clamp(45px,5vw,68px);line-height:1.01;letter-spacing:-3.5px;margin:10px 0 20px}.programHero p{font-size:18px;color:#66748d;line-height:1.75;max-width:650px}.programHeroVisual{position:relative;min-height:480px}.imageFrame{position:absolute;inset:15px 10px 30px 25px;border-radius:30px;overflow:hidden;border:8px solid rgba(255,255,255,.85);box-shadow:var(--shadow);transform:rotate(2deg)}.imageFrame img{width:100%;height:100%;object-fit:cover}.heroProof{display:flex;gap:10px;flex-wrap:wrap;margin-top:23px}.heroProof span{background:#fff;border:1px solid #e2e8f2;border-radius:14px;padding:9px 12px;font-size:10px;color:#69768d}.heroProof b{display:block;color:var(--ink);font-size:12px}.floatingCard{position:absolute;background:#fff;border:1px solid #e3e8f2;border-radius:18px;padding:14px 16px;box-shadow:0 18px 40px rgba(18,37,75,.14);z-index:3}.scoreCard{right:0;top:35px}.scoreCard span{display:block;color:#2d68d4;font-size:9px;font-weight:900}.scoreCard strong{display:block;font-size:28px}.scoreCard small{color:#748198;font-size:10px}.tutorCard{left:0;bottom:25px;display:flex;gap:10px;align-items:center}.tutorCard>span{width:38px;height:38px;border-radius:12px;background:#eef4ff;display:grid;place-items:center}.tutorCard b,.tutorCard small{display:block}.tutorCard b{font-size:12px}.tutorCard small{font-size:10px;color:#748198}.academicHero{background:radial-gradient(circle at 85% 20%,#fff0bd 0,transparent 26%),linear-gradient(135deg,#f7faff,#fff)}.academicHero .imageFrame{box-shadow:0 25px 70px rgba(28,87,170,.18)}.audienceSection{padding:82px 0;background:#fff}.audienceGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.audienceCard{padding:28px;border:1px solid #e2e8f2;border-radius:24px;background:#fff;box-shadow:0 12px 35px rgba(18,37,75,.05)}.audienceCard.featured{background:#f1f6ff;border-color:#d7e5fb;transform:translateY(-7px)}.audienceIcon{width:52px;height:52px;border-radius:16px;background:#edf4ff;display:grid;place-items:center;font-size:27px}.audienceCard h3{font-size:22px;letter-spacing:-.6px;margin:14px 0 8px}.audienceCard p{color:#69768d;font-size:13px;line-height:1.7;min-height:68px}.audienceCard a{color:#2463cc;font-size:12px;font-weight:900}.featureDark,.quranDark,.baristaDark{padding:80px 0;background:var(--ink);color:#fff}.featureDarkGrid{display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;align-items:start}.darkTag{display:inline-block;background:rgba(255,255,255,.1);color:#ffd875;padding:7px 10px;border-radius:999px;font-size:9px;font-weight:900}.featureDark h2{font-size:46px;line-height:1.04;letter-spacing:-2px;margin:13px 0}.featureDark h2 em,.quranDark h2 em,.baristaDark h2 em{font-style:normal;color:var(--gold)}.featureDark p{color:#bdc9dc;line-height:1.75}.featureList{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(255,255,255,.1);border-radius:22px;overflow:hidden}.featureList>div{padding:22px;background:rgba(255,255,255,.035)}.featureList span{display:block;color:#ffd46a;font-size:10px;font-weight:900;margin-bottom:18px}.featureList b{display:block;font-size:14px}.featureList small{display:block;color:#aebbd0;margin-top:5px;font-size:11px;line-height:1.55}.timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid #dfe5ee}.timeline>div{padding:24px 20px 10px;border-right:1px solid #dfe5ee;position:relative}.timeline>div:last-child{border:0}.timeline span{width:34px;height:34px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-size:10px;font-weight:900}.timeline h3{font-size:16px;margin:15px 0 5px}.timeline p{font-size:12px;color:#6d7990;margin:0;line-height:1.6}.testimonialSection{padding:78px 0;background:#f7f9fd}.programCta{padding:65px 0}.programCta>.wrap{border-radius:28px;padding:40px;background:#fff;border:1px solid #e1e7f0;box-shadow:var(--shadow);display:flex;align-items:center;justify-content:space-between;gap:25px}.programCta h2{font-size:34px;letter-spacing:-1.2px;margin:9px 0}.programCta p{margin:0;color:#6b7890;max-width:700px}.programCta .tag{background:#fff4d0;color:#916b08}
/* Quran visual language */
.quranPage{background:#fbfaf6}.quranHero{background:radial-gradient(circle at 15% 10%,#e7f3d9 0,transparent 27%),linear-gradient(135deg,#fffdf6,#f4f7ec)}.quranEyebrow{background:#e9f6d9;color:#3f6f27}.quranFrame{border-color:#fffdf5;box-shadow:0 25px 70px rgba(72,100,45,.15)}.quranQuote{position:absolute;right:-4px;bottom:20px;width:270px;background:#fffef9;border:1px solid #e4e8da;border-radius:20px;padding:17px 19px;box-shadow:0 16px 38px rgba(56,78,40,.13);z-index:4}.quranQuote span{font-size:34px;color:#8aad68;line-height:.7}.quranQuote b{display:block;font-size:15px;line-height:1.35}.quranQuote small{display:block;color:#75826b;margin-top:8px;font-size:9px}.quranProof span{background:#fffef9}.quranTag{background:#edf6e5;color:#537d38}.quranBtn{background:#759d4e;color:#fff;border-color:#759d4e}.quranAudience{background:#fffefb}.quranCard .audienceIcon{background:#edf6e5}.quranDark{background:#274a2b}.quranDark .featureList{background:rgba(255,255,255,.12)}.quranCta>.wrap{background:#f1f7e9;border-color:#d9e8cb}.quranCta .tag{background:#e5f2d8;color:#527a38}
/* Barista visual language */
.baristaPage{background:#fbf8f4}.baristaHeroPage{background:radial-gradient(circle at 85% 10%,#f5d9b8 0,transparent 25%),linear-gradient(135deg,#fffaf5,#f6efe7)}.baristaEyebrow,.baristaTag{background:#fff0df;color:#a75f16}.baristaVisualLarge{min-height:480px;position:relative;display:grid;place-items:center}.coffeeStage{width:360px;height:390px;border-radius:45% 45% 30% 30%;background:linear-gradient(145deg,#efe1d1,#fff9f2);border:8px solid rgba(255,255,255,.8);box-shadow:0 25px 65px rgba(93,59,28,.16);position:relative;display:grid;place-items:center}.coffeeCup{font-size:150px;filter:drop-shadow(0 22px 16px rgba(65,40,19,.2));z-index:2}.coffeeSteam{position:absolute;top:66px;color:#b99472;letter-spacing:5px;font-size:22px;transform:rotate(-8deg)}.coffeeSaucer{position:absolute;bottom:86px;width:220px;height:25px;border-radius:50%;background:#d5b28e;box-shadow:0 8px 10px rgba(77,49,27,.14)}.coffeeLabel{position:absolute;bottom:28px;text-align:center;font-size:10px;font-weight:900;letter-spacing:1px;color:#75451f}.coffeeLabel small{font-size:7px;letter-spacing:2px}.coffeeStat,.coffeeBadge{position:absolute;background:#fff;border:1px solid #e7ded4;border-radius:18px;padding:14px 17px;box-shadow:0 16px 36px rgba(85,56,30,.12)}.coffeeStat{left:0;top:42px}.coffeeStat strong{display:block;font-size:26px;color:#9a551b}.coffeeStat span{font-size:9px;color:#776958}.coffeeBadge{right:0;bottom:30px;font-size:10px;letter-spacing:1px;color:#79502f}.coffeeBadge b{font-size:16px;color:#9b5519}.baristaBtn{background:#9a571c;color:#fff;border-color:#9a571c}.baristaBtn:hover{filter:brightness(.96)}.baristaStats{background:#2b1e16;color:#fff;padding:22px 0}.baristaStats .wrap{display:grid;grid-template-columns:repeat(4,1fr)}.baristaStats .wrap>div{padding:7px 20px;border-right:1px solid rgba(255,255,255,.1)}.baristaStats .wrap>div:last-child{border:0}.baristaStats strong{color:#e7b276;font-size:22px}.baristaStats span,.baristaStats small{display:block}.baristaStats span{font-weight:850;font-size:12px}.baristaStats small{font-size:9px;color:#bbaea4;margin-top:2px}.baristaLevels{background:#fff}.levelGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.levelCard{background:#fffaf5;border:1px solid #e9dfd5;border-radius:24px;padding:27px;position:relative}.levelCard.featured{background:#fff1df;border-color:#e7c9a9;transform:translateY(-7px)}.levelNumber{font-size:42px;font-weight:900;color:#e6c7a8;line-height:1}.levelCard h3{font-size:21px;margin:13px 0 7px}.levelCard p{font-size:13px;color:#766d66;line-height:1.7;min-height:67px}.levelCard ul{list-style:none;padding:0;margin:17px 0 0;display:grid;gap:7px}.levelCard li{font-size:11px;color:#695f58}.levelCard li:before{content:'✓';color:#9a571c;font-weight:900;margin-right:7px}.baristaDark{background:#2b1e16}.baristaCta>.wrap{background:#fff6eb;border-color:#ecd8c0}.baristaCta .tag{background:#fff0df;color:#9a571c}
/* Dashboard and assessment result polish */
.dashboard{padding:42px 0 70px;background:linear-gradient(180deg,#f7f9fd,#eef3fb)}.dashboardHeroCard{position:relative;overflow:hidden;background:linear-gradient(135deg,#10234b,#214f9c);border-radius:28px;padding:34px;color:#fff;box-shadow:0 22px 55px rgba(16,35,75,.17)}.dashboardHeroCard h1{font-size:38px;letter-spacing:-1.5px;margin:10px 0 5px}.dashboardHeroCard p{color:#c8d4e8}.heroQuick{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.heroOrb{position:absolute;right:55px;top:-50px;width:220px;height:220px;border-radius:50%;background:radial-gradient(circle,#f8d776 0,#dcae42 25%,rgba(255,255,255,0) 67%);opacity:.75;font-size:110px;display:grid;place-items:center;color:#fff}.dashboard .card{border-radius:22px;box-shadow:0 12px 32px rgba(18,37,75,.06)}.dashboard #studentView>.card,.dashboard #parentView>.card{border-color:#e2e8f2}.dashboard #history{display:grid;gap:11px}.dashboard .historyItem{background:#fff;border:1px solid #e1e7f0;border-radius:17px;padding:15px;display:flex;align-items:center;justify-content:space-between;gap:15px}.dashboard .historyItem:hover{border-color:#cbd9ef;box-shadow:0 8px 24px rgba(18,37,75,.07)}.dashboardConsult{margin-top:18px;background:linear-gradient(135deg,#effcf5,#fff);border:1px solid #bdebd3!important;border-radius:22px;padding:22px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px}.dashboardConsult .consultIcon{width:56px;height:56px;border-radius:17px;background:#25D366;color:#fff;display:grid;place-items:center}.dashboardConsult .consultIcon .waIcon{width:30px;height:30px}.greenTag{background:#e9faf1!important;color:#118555!important}.dashboardConsult h2{font-size:20px;margin:5px 0}.dashboardConsult p{margin:0;color:#6c7890;font-size:12px}.dashboardConsult .btn.wa{min-width:205px}.resultShowcase{background:#fff;border-radius:24px;padding:24px;border:1px solid #e0e7f0;box-shadow:0 14px 38px rgba(18,37,75,.07)}.resultScoreHero{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px;border-radius:20px;background:linear-gradient(135deg,#eef4ff,#fff);border:1px solid #dbe6f8}.resultScoreHero .scoreNumber{font-size:52px;line-height:1;font-weight:950;color:#1e5bc4}.resultScoreHero .scoreMeta{color:#68758c;font-size:12px}.resultAnswerCard{border:1px solid #e1e7f0!important;border-radius:18px!important;box-shadow:none!important}.resultAnswerCard .correctOption{background:#edfbf3!important;border-color:#8ed7af!important}.resultAnswerCard .wrongOption{background:#fff1f3!important;border-color:#efabb6!important}.assessmentPage{background:linear-gradient(180deg,#f7f9fd,#edf3fb)}
@media(max-width:900px){.homeHeroGrid,.programHeroGrid,.processGrid,.featureDarkGrid{grid-template-columns:1fr}.homeHeroVisual{min-height:470px}.statsBandGrid{grid-template-columns:1fr 1fr}.statsBandGrid>div:nth-child(2){border-right:0}.statsBandCta{align-items:flex-start;text-align:left;grid-column:1/-1;border-top:1px solid rgba(255,255,255,.12);border-right:0;margin-top:10px;padding:16px 0 0}.programShowcase{grid-template-columns:1fr}.whyGrid{grid-template-columns:1fr 1fr}.audienceGrid,.levelGrid{grid-template-columns:1fr}.audienceCard.featured,.levelCard.featured{transform:none}.timeline{grid-template-columns:1fr 1fr}.timeline>div:nth-child(2){border-right:0}.programCta>.wrap{display:block}.programCta .heroBtns{margin-top:18px}.baristaStats .wrap{grid-template-columns:1fr 1fr}.baristaStats .wrap>div:nth-child(2){border-right:0}.featureList{grid-template-columns:1fr}.dashboardConsult{grid-template-columns:auto 1fr}.dashboardConsult .btn{grid-column:1/-1;width:100%}}
@media(max-width:560px){.siteNav{height:auto;min-height:64px}.siteNav .navlinks{display:none}.homeHero{padding:48px 0 50px}.homeHeroGrid{gap:20px}.homeHeroCopy h1{font-size:45px;letter-spacing:-2.5px}.homeHeroCopy p{font-size:16px}.heroBtns .btn{width:100%}.homeHeroVisual{min-height:380px}.heroMainImage{height:285px;width:74%;left:0}.heroMiniImage{height:160px;width:45%;bottom:10px}.heroFloat{left:18%;bottom:0;padding:11px}.heroBadge{width:67px;height:67px;right:0}.statsBandGrid{grid-template-columns:1fr 1fr}.statsBandGrid>div{padding:8px 10px}.sectionIntro h2{font-size:34px}.featureImage{height:230px}.featureBody{padding:18px}.featureBody h3,.compact h3{font-size:20px}.compact{grid-template-columns:90px 1fr;padding:13px}.compactImage,.coffeeVisual{height:115px}.processIntro h2{font-size:35px}.whyGrid{grid-template-columns:1fr}.assessmentHero{padding:25px;display:block}.assessmentHero h2{font-size:30px}.programHero{padding:48px 0}.programHero h1{font-size:43px;letter-spacing:-2.2px}.programHero p{font-size:16px}.programHeroVisual{min-height:350px}.imageFrame{inset:10px 0 20px 0}.scoreCard{right:0;top:18px}.tutorCard{left:0;bottom:10px}.timeline{grid-template-columns:1fr}.timeline>div{border-right:0;border-bottom:1px solid #dfe5ee}.featureDark{padding:55px 0}.featureDark h2{font-size:36px}.quranQuote{width:225px;right:0}.coffeeStage{width:285px;height:320px}.coffeeCup{font-size:115px}.coffeeSteam{top:58px}.coffeeSaucer{bottom:72px;width:180px}.coffeeStat{left:0;top:20px}.coffeeBadge{right:0;bottom:10px}.baristaVisualLarge{min-height:380px}.dashboardHeroCard{padding:25px}.dashboardHeroCard h1{font-size:30px}.heroOrb{right:-80px}.dashboardConsult{grid-template-columns:1fr}.dashboardConsult .consultIcon{display:none}.resultScoreHero{display:block}.resultScoreHero .scoreNumber{margin-top:10px}.dashboard .historyItem{display:block}.dashboard .historyItem .btn{width:100%;margin-top:10px}.baristaStats .wrap{grid-template-columns:1fr 1fr}.programCta>.wrap{padding:25px}.programCta h2{font-size:28px}}
/* Assessment completion screen */
.quizResultHero{background:linear-gradient(135deg,#fff,#f1f6ff);border:1px solid #dfe7f4;border-radius:26px;padding:30px;box-shadow:0 18px 48px rgba(18,37,75,.09);position:relative;overflow:hidden}.quizResultHero:after{content:'✓';position:absolute;right:28px;top:18px;width:74px;height:74px;border-radius:50%;display:grid;place-items:center;background:#eaf8f1;color:#18a263;font-size:35px;font-weight:950}.quizResultHero h2{font-size:44px!important;letter-spacing:-2px;color:#1d5fc7}.quizResultHero p{color:#66748c}.resultActions{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}.resultActions .btn{min-height:48px}.resultActions .btn.primary{background:var(--gold)}
@media(max-width:560px){.quizResultHero{padding:23px}.quizResultHero:after{width:55px;height:55px;right:16px}.quizResultHero h2{font-size:36px!important}.resultActions .btn{width:100%}}

/* AYOLES.ID 4.9.1 — brand yellow, sliders, tutor profiles, floating consultation */
:root{--ui-yellow:#ffcc00;--ui-yellow-soft:#fff6cc;--ui-yellow-deep:#e5ad00;--wa:#25D366}
.homePage{background:#fbfcff}.homePage .homeHero{background:radial-gradient(circle at 8% 0,#fff0a6 0,transparent 27%),linear-gradient(135deg,#fff 0,#fffdf2 48%,#f5f8ff 100%)}
.homePage .homeHeroCopy h1 em{color:#d89f00}.homePage .eyebrow,.homePage .homeTag{background:var(--ui-yellow-soft);color:#856300}.homePage .btn.primary{background:var(--ui-yellow);color:#17223b}.homePage .programSection{background:linear-gradient(180deg,#fffdf2,#f7f9fd)}
.homePage .programFeature:hover{border-color:#f0ce4c}.homePage .featurePill{background:var(--ui-yellow);color:#17223b}.homePage .arrowCircle{background:#17223b;color:var(--ui-yellow)}
.homePage .assessmentBanner{background:linear-gradient(135deg,#fff6c9,#fff)}
.homePage .statsBandGrid strong{color:var(--ui-yellow)}
.testimonialSlider{max-width:940px;margin:0 auto}.testimonialViewport{overflow:hidden;border-radius:24px}.testimonialTrack{display:flex;transition:transform .45s ease;will-change:transform}.testimonialTrack .testimonialCard{flex:0 0 100%;min-width:100%;margin:0;background:#fff;border:1px solid #e1e7f0;border-radius:24px;padding:32px 34px;box-shadow:0 18px 45px rgba(18,37,75,.08)}.testimonialCard .stars{color:#e2ae00;letter-spacing:3px;font-size:16px}.testimonialCard>p{font-size:20px;line-height:1.65;color:#273754;margin:16px 0 25px;min-height:70px}.testimonialPerson{display:flex;flex-direction:column;gap:2px}.testimonialPerson strong{font-size:14px}.testimonialPerson span{font-size:11px;color:#718098}.sliderControls{display:flex;align-items:center;justify-content:center;gap:15px;margin-top:18px}.sliderBtn{width:42px;height:42px;border-radius:50%;border:1px solid #dbe2ed;background:#fff;cursor:pointer;font-weight:900;font-size:18px}.sliderBtn:hover{border-color:var(--ui-yellow-deep);background:var(--ui-yellow-soft)}.sliderDots{display:flex;gap:7px}.sliderDots button{width:8px;height:8px;border:0;border-radius:50%;background:#cdd5e2;padding:0;cursor:pointer}.sliderDots button.active{width:24px;border-radius:99px;background:#e0ad00}.homeTestimonials{background:#fff}
.tutorSection{padding:78px 0;background:#fff}.tutorGrid{display:grid;grid-template-columns:repeat(5,1fr);gap:15px}.tutorCard{background:#fff;border:1px solid #e1e7f0;border-radius:22px;overflow:hidden;box-shadow:0 12px 32px rgba(18,37,75,.06);transition:.2s ease}.tutorCard:hover{transform:translateY(-4px);box-shadow:0 18px 42px rgba(18,37,75,.1)}.tutorCard>img{width:100%;height:210px;object-fit:cover;display:block;background:#eef2f8}.tutorBody{padding:16px}.tutorBody h3{font-size:17px;margin:9px 0 7px;letter-spacing:-.4px}.tutorBody p{font-size:11px;line-height:1.65;color:#6c7890;margin:0}.tutorBody .miniTag{font-size:8px;line-height:1.3}.quranAudience.tutorSection{background:#fffefb}.baristaLevels.tutorSection{background:#fffaf5}
.floatingWhatsApp{position:fixed;right:22px;bottom:22px;z-index:1000;display:inline-flex;align-items:center;gap:9px;background:var(--wa);color:#fff;padding:13px 17px;border-radius:999px;box-shadow:0 12px 30px rgba(37,211,102,.28);font-size:12px;font-weight:900;border:2px solid #fff}.floatingWhatsApp .waIcon{width:23px;height:23px}.floatingWhatsApp:hover{filter:brightness(.95);transform:translateY(-2px)}
@media(max-width:1000px){.tutorGrid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:700px){.testimonialTrack .testimonialCard{padding:24px}.testimonialCard>p{font-size:17px}.tutorGrid{grid-template-columns:repeat(2,1fr)}.tutorCard>img{height:190px}.floatingWhatsApp{right:14px;bottom:14px;padding:13px}.floatingWhatsApp b{display:none}.floatingWhatsApp .waIcon{width:27px;height:27px}.floatingWhatsApp{width:52px;height:52px;justify-content:center}}
@media(max-width:430px){.tutorGrid{grid-template-columns:1fr}.tutorCard>img{height:250px}}

/* v4.9.2 UX refinement */
.homePage .homeHero{background:linear-gradient(135deg,#fff0b8 0%,#ffd35a 48%,#fff6d6 100%);}
.homePage .homeHero:after{content:"";position:absolute;inset:auto -10% -38% 42%;height:280px;border-radius:50%;background:rgba(255,255,255,.24);pointer-events:none;}
.homePage .homeHeroGrid{position:relative;z-index:1;}
.statsBandGrid .statTrust{transition:transform .25s ease,box-shadow .25s ease,background .25s ease;transform-origin:center;}
.statsBandGrid .statTrust:hover{transform:scale(1.06);background:rgba(255,255,255,.055);box-shadow:0 12px 30px rgba(0,0,0,.12);border-radius:16px;z-index:2;}
.statsBandGrid .statTrust strong{font-variant-numeric:tabular-nums;min-width:4ch;}
.processCtas{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px;}
.processCtas .btn{margin-top:0;}
.tutorSection .tutorCard{position:static;left:auto;bottom:auto;display:block;}
.tutorSection .tutorCard>span{display:inline-flex;}
.tutorSection .tutorBody{display:block;visibility:visible;opacity:1;color:var(--text);background:#fff;}
.tutorSection .tutorBody h3,.tutorSection .tutorBody p{visibility:visible;opacity:1;}
@media(max-width:560px){.processCtas .btn{width:100%;}.homePage .homeHero{background:linear-gradient(160deg,#ffefb0 0%,#ffd04b 55%,#fff5cf 100%);}}

/* v4.10.0 UX refinement */
.homePage .homeHero{background:linear-gradient(135deg,#ffd83d 0%,#ffc928 48%,#ffe47a 100%);}
.homePage .homeHero:after{background:rgba(255,255,255,.18);}
.homePage .homeHeroCopy h1 em{color:#17315f;}
.statsBandGrid{grid-template-columns:repeat(4,1fr) 1.45fr;align-items:stretch;}
.statsBandGrid>div{min-width:0;}
.statsBandGrid .statTrust{display:flex;flex-direction:column;justify-content:center;min-height:82px;}
.statsBandGrid .statTrust strong{font-size:27px;line-height:1.1;}
.statsBandGrid .statTrust span{margin-top:3px;}
.statsBandCta{gap:7px;}
.statsBandCta .btn{margin-top:2px;padding:10px 14px;font-size:11px;}
.loginRecovery{display:block;text-align:center;color:var(--blue);font-size:12px;font-weight:800;padding:4px 0 2px;}
.loginRecovery:hover{text-decoration:underline;}
.loginRecoveryHelp{text-align:center;color:var(--muted);font-size:12px;padding-top:2px;}
.inlineRecovery{font-size:11px;margin-top:5px;}
.mobileNav{display:none;position:relative;z-index:60;}
.mobileNav>summary{list-style:none;cursor:pointer;width:44px;height:44px;border:1px solid var(--line);border-radius:12px;background:#fff;display:grid;place-items:center;font-size:21px;font-weight:900;color:var(--navy);}
.mobileNav>summary::-webkit-details-marker{display:none;}
.mobileNavPanel{position:absolute;right:0;top:51px;width:min(310px,calc(100vw - 32px));background:#fff;border:1px solid var(--line);border-radius:17px;padding:10px;box-shadow:0 18px 45px rgba(16,35,75,.18);}
.mobileNavSource{display:grid;gap:3px;}
.mobileNavSource>.navDropdown{position:static;}
.mobileNavSource .navDropdown summary{padding:11px 12px;border-radius:10px;}
.mobileNavSource>a,.mobileNavSource .navDropdown>a{display:block;padding:11px 12px;border-radius:10px;font-size:13px;font-weight:800;}
.mobileNavSource a:hover,.mobileNavSource .navDropdown summary:hover{background:#f5f7fb;}
.mobileNavSource .dropdownMenu{position:static;width:auto;box-shadow:none;border:0;border-radius:10px;padding:2px 0 4px;background:#f7f9fc;}
.mobileNavSource .dropdownMenu a{padding:10px 12px;}
.mobileNavLogin{display:block;margin-top:8px;padding:11px 12px;border-top:1px solid var(--line);color:var(--blue);font-size:13px;font-weight:900;}
@media(max-width:900px){
  .siteNav .mobileNav{display:block;}
  .siteNav .navlinks{display:none;}
  .siteNav .navbtns .light{display:none;}
  .siteNav .navbtns{margin-left:auto;}
  .statsBandGrid{grid-template-columns:1fr 1fr;}
  .statsBandGrid>div:nth-child(2){border-right:0;}
  .statsBandGrid>div:nth-child(4){border-right:0;}
  .statsBandCta{grid-column:1/-1;align-items:flex-start;text-align:left;border-top:1px solid rgba(255,255,255,.12);border-right:0;margin-top:10px;padding:16px 0 0;}
}
@media(max-width:560px){
  .siteNav .wrap{gap:7px;}
  .siteNav .navbtns .primary{padding-left:13px;padding-right:13px;font-size:12px;}
  .siteNav .mobileNav{margin-left:auto;}
  .statsBandGrid{grid-template-columns:1fr 1fr;}
  .statsBandGrid .statTrust{min-height:90px;padding:10px 8px;}
  .statsBandGrid .statTrust strong{font-size:24px;}
  .statsBandGrid .statTrust span{font-size:11px;}
  .statsBandGrid .statTrust small{font-size:9px;line-height:1.35;}
  .statsBandCta{grid-column:1/-1;}
  .statsBandCta .btn{width:100%;}
}

/* v4.11.0 — clearer program cards + account avatar */
.optionalLabel{font-size:10px;color:var(--muted);font-weight:600}
.accountProfileHead{display:flex;align-items:center;justify-content:space-between;gap:20px}.accountProfileHead h2{margin:7px 0 3px}.accountProfileHead p{margin:0;color:var(--muted);font-size:12px}.accountAvatar{width:82px;height:82px;border-radius:24px;background:linear-gradient(135deg,#eef4ff,#dce9ff);border:1px solid #cfdcf2;display:grid;place-items:center;overflow:hidden;font-size:32px;flex:0 0 82px}.accountAvatar img{width:100%;height:100%;object-fit:cover}.accountProfileActions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:16px}.uploadPhotoBtn{position:relative}.profileHero .avatarCircle{overflow:hidden}.profileHero .avatarCircle img{width:100%;height:100%;object-fit:cover}.homePage .programSection .programShowcase{grid-template-columns:repeat(3,1fr);gap:20px;align-items:stretch}.homePage .programSection .programFeature{height:100%;border:2px solid #dfe6f2;box-shadow:0 14px 36px rgba(18,37,75,.07)}.homePage .programSection .programFeature.academic{border-color:#f0c43d;background:linear-gradient(180deg,#fffdf4,#fff)}.homePage .programSection .programFeature[href*="program-mengaji"]{border-color:#9ed9bd;background:linear-gradient(180deg,#f7fff9,#fff)}.homePage .programSection .programFeature[href*="program-barista"]{border-color:#e5bf94;background:linear-gradient(180deg,#fffaf5,#fff)}.homePage .programSection .featureImage{height:240px}.homePage .programSection .featureBody{min-height:175px}.homePage .programSection .sidePrograms{display:contents}.homePage .programSection .compact{display:block;padding:0}.homePage .programSection .compactImage,.homePage .programSection .coffeeVisual{height:240px;border-radius:0}.homePage .programSection .compact>div:last-child{padding:24px}.homePage .programSection .compact h3{font-size:24px}.homePage .programSection .featurePill{display:none}.homePage .programSection .programFeature:hover{transform:translateY(-5px)}
@media(max-width:900px){.homePage .programSection .programShowcase{grid-template-columns:1fr}.homePage .programSection .sidePrograms{display:grid;grid-template-columns:1fr 1fr;gap:20px}.homePage .programSection .compactImage,.homePage .programSection .coffeeVisual{height:200px}}
@media(max-width:560px){.accountProfileHead{align-items:flex-start}.accountAvatar{width:68px;height:68px;flex-basis:68px;border-radius:20px}.homePage .programSection .sidePrograms{grid-template-columns:1fr}.homePage .programSection .featureImage,.homePage .programSection .compactImage,.homePage .programSection .coffeeVisual{height:220px}.homePage .programSection .featureBody{min-height:0}.homePage .programSection .programFeature{border-width:1.5px}}


/* v4.12.0 — Assessment page redesign + robust selection UX */
.assessmentPage{background:linear-gradient(180deg,#f4f7fc 0%,#eef3fa 100%);min-height:100vh}.assessmentNav{position:sticky;top:0}.assessmentShell{padding-top:34px;padding-bottom:70px}.assessmentIntroCard{position:relative;overflow:hidden;background:linear-gradient(135deg,#fff7d6 0%,#ffd85a 48%,#fff 100%);border:1px solid #eadcae;border-radius:30px;padding:42px;display:grid;grid-template-columns:1.15fr .85fr;gap:30px;align-items:center;box-shadow:0 18px 50px rgba(16,35,75,.08)}.assessmentIntroCopy{position:relative;z-index:2}.assessmentIntroCopy h1{font-size:clamp(38px,5vw,58px);line-height:1.02;letter-spacing:-2.7px;margin:14px 0 16px;color:var(--navy)}.assessmentIntroCopy h1 em{font-style:normal;color:#6b4f00}.assessmentIntroCopy p{max-width:650px;color:#5e687b;font-size:16px;margin:0}.assessmentTrust{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}.assessmentTrust span{background:#ffffffb8;border:1px solid #fff;border-radius:999px;padding:7px 11px;font-size:11px;font-weight:850;color:#4e5668}.assessmentVisual{min-height:250px;position:relative;display:grid;place-items:center}.assessmentOrb{position:absolute;border-radius:50%;filter:blur(.2px)}.orbOne{width:220px;height:220px;background:rgba(255,255,255,.42);right:10%;top:2px}.orbTwo{width:110px;height:110px;background:rgba(255,190,24,.28);left:6%;bottom:10px}.assessmentVisualCard{position:relative;z-index:2;width:min(300px,100%);background:#fff;border:1px solid #fff;border-radius:24px;padding:25px;box-shadow:0 20px 45px rgba(16,35,75,.15);transform:rotate(-2deg)}.visualIcon{width:48px;height:48px;border-radius:16px;background:var(--navy);color:var(--yellow);display:grid;place-items:center;font-size:23px;margin-bottom:15px}.assessmentVisualCard strong{display:block;font-size:19px}.assessmentVisualCard small{display:block;color:var(--muted);font-size:11px;line-height:1.6;margin-top:5px}.visualScore{position:absolute;z-index:3;right:0;bottom:0;background:var(--navy);color:#fff;border-radius:18px;padding:12px 16px;box-shadow:0 12px 25px rgba(16,35,75,.2);transform:rotate(3deg)}.visualScore b{font-size:28px;line-height:1}.visualScore span{font-size:10px;margin-left:3px;color:#d9e1f2}.assessmentCard{background:#fff;border:1px solid #e1e7f0;border-radius:26px;margin-top:20px;padding:30px;box-shadow:0 12px 35px rgba(16,35,75,.06)}.assessmentCardHead,.quizTop{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:24px}.stepBadge{display:inline-block;font-size:9px;font-weight:900;letter-spacing:.8px;color:var(--blue);background:#edf3ff;border-radius:999px;padding:6px 9px}.assessmentCardHead h2,.quizTop h2{margin:8px 0 3px;font-size:27px;letter-spacing:-.8px}.assessmentCardHead p,.quizTop p{margin:0;color:var(--muted);font-size:12px}.stepProgress{display:flex;gap:6px;padding-top:8px}.stepProgress span{width:28px;height:5px;border-radius:99px;background:#dfe5ee}.stepProgress span.active{background:var(--yellow)}.assessmentForm{display:grid;gap:15px;max-width:850px}.assessmentForm label{display:grid;gap:7px;font-size:11px;font-weight:850}.assessmentForm label>span{color:#34425c}.assessmentForm select{width:100%;min-height:50px;padding:13px 14px;border:1px solid #dce3ed;border-radius:14px;background:#fff;color:#1b2943;outline:none}.assessmentForm select:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(29,95,209,.09)}.assessmentForm select:disabled{background:#f6f8fb;color:#5d687a;cursor:not-allowed}.assessmentFieldGrid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.assessmentStartBtn{width:100%;min-height:54px;border-radius:15px;justify-content:space-between;padding:0 18px;font-size:13px}.assessmentStartBtn strong{font-size:20px}.selectionSummary{display:flex;align-items:center;gap:11px;background:#f7fafc;border:1px solid #e2e9f2;border-radius:14px;padding:12px 14px}.summaryIcon{width:30px;height:30px;border-radius:10px;background:#eaf8f2;color:var(--green);display:grid;place-items:center;font-weight:900}.selectionSummary b{display:block;font-size:12px}.selectionSummary small{display:block;color:var(--muted);font-size:10px;margin-top:2px}.quizTop{align-items:center}.timerBox{min-width:100px;text-align:center;background:var(--navy);color:#fff;border-radius:17px;padding:10px 14px}.timerBox span{display:block;font-size:24px;font-weight:900;line-height:1.1;font-variant-numeric:tabular-nums}.timerBox small{font-size:9px;color:#cbd5e8}.assessmentQuiz{display:grid;gap:13px}.questionCard,.questionPreview{background:#f9fbfd;border:1px solid #e3e9f1;border-radius:18px;padding:18px}.questionHeader{display:grid;grid-template-columns:34px 1fr;gap:10px;align-items:start}.questionHeader>span,.questionNo{width:34px;height:34px;border-radius:11px;background:#fff0b8;color:#755500;display:grid;place-items:center;font-size:10px;font-weight:900}.questionHeader strong{font-size:14px;line-height:1.55}.questionOptions{display:grid;gap:8px;margin-top:14px}.questionOptions label{display:grid;grid-template-columns:20px 30px 1fr;align-items:center;gap:8px;padding:11px 12px;border:1px solid #e0e6ef;border-radius:12px;background:#fff;cursor:pointer;font-size:12px}.questionOptions label:hover{border-color:#c4d2e6;background:#f9fbff}.questionOptions input{margin:0}.optionLetter{width:27px;height:27px;border-radius:9px;background:#eef3fa;display:grid;place-items:center;font-size:10px;font-weight:900}.questionPreview{display:grid;grid-template-columns:34px 1fr;gap:11px}.questionPreview strong{font-size:13px}.optionPreview{display:grid;gap:6px;margin-top:12px}.optionPreview div{display:grid;grid-template-columns:24px 1fr;gap:7px;font-size:11px;color:#5f6b7e}.optionPreview b{color:var(--blue)}.quizResultHero{background:linear-gradient(135deg,#fff8d8,#fff);border:1px solid #ecdca8;border-radius:22px;padding:28px}.quizResultHero h2{font-size:42px;letter-spacing:-1.5px;margin:8px 0}.quizResultHero p{color:var(--muted);margin:4px 0;font-size:12px}.resultActions{display:flex;flex-wrap:wrap;gap:9px;margin-top:20px}.resultActions .btn{font-size:11px}.resultProcessing{margin-top:20px}.assessmentPage .notice{margin:0}.assessmentPage .hidden{display:none!important}
@media(max-width:800px){.assessmentIntroCard{grid-template-columns:1fr;padding:30px}.assessmentVisual{min-height:205px}.assessmentCard{padding:22px}.assessmentFieldGrid{grid-template-columns:1fr}.assessmentCardHead,.quizTop{display:block}.stepProgress{margin-top:15px}.timerBox{margin-top:15px;width:110px}.resultActions .btn{width:100%}}
@media(max-width:520px){.assessmentShell{padding-top:16px}.assessmentIntroCard{border-radius:22px;padding:24px}.assessmentIntroCopy h1{font-size:39px;letter-spacing:-2px}.assessmentIntroCopy p{font-size:14px}.assessmentVisual{min-height:190px}.assessmentVisualCard{padding:20px;width:245px}.visualScore{right:5px}.assessmentCard{border-radius:20px;padding:18px}.assessmentCardHead h2,.quizTop h2{font-size:24px}.assessmentTrust span{font-size:10px}.questionCard,.questionPreview{padding:14px}.questionHeader{grid-template-columns:30px 1fr}.questionHeader>span,.questionNo{width:30px;height:30px}.questionHeader strong{font-size:13px}.questionOptions label{grid-template-columns:18px 27px 1fr;padding:10px;font-size:11px}.quizResultHero h2{font-size:35px}}

/* AYOLES.ID v4.12.0 — professional account profile */
.accountProfileCard{padding:0!important;margin-top:16px;overflow:hidden;border:1px solid #dbe4f2;box-shadow:0 18px 50px rgba(18,37,75,.09)}
.accountProfileTop{padding:26px;display:flex;align-items:center;justify-content:space-between;gap:24px;background:linear-gradient(135deg,#f7faff 0%,#eef5ff 55%,#fff9e9 100%);border-bottom:1px solid #e1e8f3}
.accountIdentity{display:flex;align-items:center;gap:20px;min-width:0}
.accountAvatarLarge{width:108px;height:108px;flex:0 0 108px;border-radius:30px;border:4px solid #fff;box-shadow:0 12px 28px rgba(18,37,75,.14);background:linear-gradient(135deg,#142f63,#244c91);font-size:38px}
.accountIdentityText h2{margin:8px 0 3px;font-size:27px;letter-spacing:-.02em}
.accountRole{margin:0 0 10px;color:var(--muted);font-size:13px;font-weight:700}
.accountEmailRow{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:11px;background:#fff;border:1px solid #dbe4f2;color:var(--ink);font-size:13px;max-width:100%}
.emailIcon{display:grid;place-items:center;width:24px;height:24px;border-radius:8px;background:#edf4ff;color:#1764df;font-size:13px}
.accountProfileBadge{padding:10px 14px;border-radius:13px;background:#fff;border:1px solid #d8e3f3;text-align:center;font-size:11px;font-weight:900;letter-spacing:.04em;color:#1764df;line-height:1.45;white-space:nowrap}
.accountProfileBadge small{font-weight:600;color:var(--muted);letter-spacing:0}
.accountInfoGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;padding:18px 26px 4px}
.accountInfoGrid>div{padding:13px 15px;border:1px solid #e0e7f1;border-radius:14px;background:#fff}
.accountInfoGrid small{display:block;color:var(--muted);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.accountInfoGrid strong{display:block;margin-top:4px;font-size:14px}
.accountPhotoPanel{margin:14px 26px 0;padding:16px 18px;display:flex;align-items:center;justify-content:space-between;gap:18px;border-radius:16px;background:#f8faff;border:1px solid #e0e8f5}
.accountPhotoPanel p{margin:3px 0 0;color:var(--muted);font-size:12px}
.accountPhotoPanel .accountProfileActions{margin-top:0}
.accountProfileCard>.fieldHint{display:block;padding:10px 26px 20px}
.accountProfileActions .btn{min-height:44px}
@media(max-width:700px){
 .accountProfileTop{padding:20px;align-items:flex-start}
 .accountIdentity{gap:14px}
 .accountAvatarLarge{width:82px;height:82px;flex-basis:82px;border-radius:24px;font-size:30px}
 .accountIdentityText h2{font-size:21px}
 .accountProfileBadge{display:none}
 .accountInfoGrid{padding:14px 20px 2px}
 .accountPhotoPanel{margin:12px 20px 0;display:block}
 .accountPhotoPanel .accountProfileActions{margin-top:12px}
 .accountProfileCard>.fieldHint{padding:9px 20px 18px}
}


/* AYOLES.ID v4.13.0 — responsive professional dashboards */
.dashboardPage{background:#f5f7fb}.dashboardNav{background:rgba(255,255,255,.94);backdrop-filter:blur(14px)}.dashboardNavRight{display:flex;align-items:center;gap:12px}.navStatus{font-size:11px;color:#68758c;font-weight:750}.navStatusDot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#22a66f;margin-right:6px;box-shadow:0 0 0 4px #e7f8ef}.dashboardWrap{padding-top:30px;padding-bottom:70px}.dashboardWelcome{min-height:220px;border-radius:28px;padding:34px 36px;display:flex;align-items:center;justify-content:space-between;gap:28px;background:linear-gradient(135deg,#10234b 0%,#214f9c 68%,#315fa8 100%);color:#fff;box-shadow:0 20px 55px rgba(16,35,75,.17);position:relative;overflow:hidden}.dashboardWelcome:after{content:"";position:absolute;width:300px;height:300px;right:-80px;top:-120px;border-radius:50%;background:radial-gradient(circle,rgba(255,205,65,.52),rgba(255,205,65,0) 68%)}.welcomeCopy,.welcomeProfile{position:relative;z-index:2}.welcomeCopy h1{font-size:38px;letter-spacing:-1.6px;line-height:1.08;margin:10px 0 5px}.welcomeCopy p{margin:0;color:#cfdaec;font-size:14px;max-width:650px}.welcomeCopy .tag{background:rgba(255,255,255,.12);color:#ffe38a;border:1px solid rgba(255,255,255,.14)}.welcomeCopy .heroQuick{margin-top:20px}.welcomeCopy .btn.primary{box-shadow:0 10px 24px rgba(255,189,24,.18)}.welcomeProfile{display:flex;align-items:center;gap:12px;padding:10px 13px 10px 10px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);border-radius:18px;min-width:205px}.welcomeProfile small,.welcomeProfile span{display:block;color:#c8d4e8;font-size:10px}.welcomeProfile strong{display:block;font-size:14px;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.welcomeAvatar{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:#fff;color:var(--navy);font-size:18px;font-weight:900;overflow:hidden;flex:0 0 52px}.welcomeAvatar img{width:100%;height:100%;object-fit:cover}.dashboardStatsPanel{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:18px 0}.statCard{min-height:116px;background:#fff;border:1px solid var(--line);border-radius:19px;padding:18px;display:flex;align-items:center;gap:13px;box-shadow:0 9px 28px rgba(16,35,75,.055)}.statIcon{width:48px;height:48px;border-radius:16px;display:grid;place-items:center;font-size:22px;flex:0 0 48px}.statCard small,.statCard em{display:block;font-style:normal}.statCard small{font-size:10px;color:#5e6b82;font-weight:800}.statCard strong{display:block;font-size:27px;line-height:1.05;margin:4px 0 3px;letter-spacing:-.7px}.statCard em{font-size:10px;color:var(--muted)}.statBlue{background:linear-gradient(145deg,#fff,#f7fbff)}.statBlue .statIcon{background:#e5f1ff;color:#1764df}.statGreen{background:linear-gradient(145deg,#fff,#f7fff9)}.statGreen .statIcon{background:#e4f8ec;color:#16845b}.statPurple{background:linear-gradient(145deg,#fff,#fbf8ff)}.statPurple .statIcon{background:#f0e7ff;color:#6840bd}.statGold{background:linear-gradient(145deg,#fff,#fffaf0)}.statGold .statIcon{background:#fff0bd;color:#a77700}.dashboardMainGrid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(300px,.85fr);gap:18px;margin-top:18px}.dashboardPrimary,.dashboardAside{min-width:0;display:grid;gap:18px;align-content:start}.sectionCard{background:#fff;border:1px solid #e0e7f0;border-radius:22px;padding:24px;box-shadow:0 10px 30px rgba(16,35,75,.055)}.sectionCardHead{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:18px}.sectionCardHead h2{margin:5px 0 3px;font-size:24px;letter-spacing:-.7px}.sectionCardHead p{margin:0;color:var(--muted);font-size:12px}.sectionEyebrow{font-size:9px;font-weight:900;letter-spacing:.9px;color:var(--blue);background:#edf3ff;border-radius:999px;padding:6px 9px;display:inline-block}.textLink{border:0;background:none;color:var(--blue);font-size:11px;font-weight:850;cursor:pointer;padding:5px 0}.childrenList{display:grid;gap:11px}.childCard{display:grid;grid-template-columns:58px minmax(0,1fr) 145px;align-items:center;gap:15px;padding:15px;border:1px solid #e2e8f1;border-radius:17px;background:#fff;transition:.18s ease}.childCard:hover{transform:translateY(-2px);border-color:#cbd9ed;box-shadow:0 10px 25px rgba(16,35,75,.07)}.childAvatar{width:58px;height:58px;border-radius:18px;background:linear-gradient(135deg,#dceaff,#edf4ff);display:grid;place-items:center;color:#1d5fd1;font-size:18px;font-weight:900}.childNameRow{display:flex;align-items:center;gap:8px}.childInfo h3{margin:0;font-size:17px}.childInfo p{margin:3px 0 8px;color:#68758c;font-size:11px}.childInfo p span{margin:0 4px;color:#a3adbd}.activeBadge{font-size:9px;font-weight:850;color:#13845a;background:#eaf8f1;border-radius:999px;padding:5px 8px;white-space:nowrap}.childTags{display:flex;gap:6px;flex-wrap:wrap}.childTags span{font-size:9px;font-weight:750;padding:5px 8px;border-radius:999px;background:#f4f7fb;color:#52627b}.childScore{text-align:right}.childScore small,.childScore em{display:block;color:var(--muted);font-size:9px;font-style:normal}.childScore strong{display:block;font-size:24px;line-height:1.05;margin:2px 0;color:var(--navy)}.childScore em{color:#16845b;font-weight:800;margin-bottom:8px}.childScore .btn{font-size:10px;padding:8px 10px}.addChildPanel{width:100%;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:12px;margin-top:12px;padding:15px 16px;border:1.5px dashed #cbd7e8;border-radius:17px;background:#fbfcfe;color:var(--navy);cursor:pointer;text-align:left}.addChildPanel>span{width:36px;height:36px;border-radius:12px;background:#edf3ff;color:var(--blue);display:grid;place-items:center;font-size:22px}.addChildPanel strong,.addChildPanel small{display:block}.addChildPanel strong{font-size:12px}.addChildPanel small{color:var(--muted);font-size:10px;margin-top:2px}.addChildPanel>b{font-size:18px}.activityList{display:grid}.activityItem{display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:10px;align-items:center;padding:12px 0;border-bottom:1px solid #edf0f5}.activityItem:first-child{padding-top:0}.activityItem:last-child{border-bottom:0;padding-bottom:0}.activityIcon{width:36px;height:36px;border-radius:12px;background:#f1f5fb;display:grid;place-items:center;font-size:15px}.activityBody{min-width:0}.activityBody strong,.activityBody b,.activityBody small{display:block}.activityBody strong{font-size:10px}.activityBody strong span{font-weight:600;color:#68758c}.activityBody b{font-size:11px;margin:2px 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.activityBody b small{display:inline;color:var(--muted);font-size:9px}.activityBody>small{font-size:9px;color:var(--muted)}.activityScore{font-size:10px;font-weight:900;padding:6px 8px;border-radius:9px;white-space:nowrap}.scoreGood{color:#13845a;background:#e9f8ef}.scoreMid{color:#a46600;background:#fff4d9}.scoreLow{color:#bd4050;background:#fdecef}.tipCard{display:grid;grid-template-columns:48px 1fr;gap:14px;padding:20px;border-radius:20px;border:1px solid #cfe1fa;background:linear-gradient(135deg,#eef7ff,#f8fbff)}.tipIcon{width:48px;height:48px;border-radius:15px;background:#fff;display:grid;place-items:center;font-size:22px;box-shadow:0 8px 20px rgba(16,35,75,.07)}.tipCard>div:last-child>span{font-size:9px;font-weight:900;color:#1d5fd1;letter-spacing:.7px}.tipCard h3{font-size:15px;margin:5px 0}.tipCard p{font-size:11px;color:#58708f;margin:0}.programMiniGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.programMini{display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:9px;padding:13px;border-radius:15px;border:1px solid #e1e7f0;transition:.18s ease}.programMini:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(16,35,75,.06)}.programMini .miniIcon{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;font-size:19px}.programMini strong,.programMini small{display:block}.programMini strong{font-size:12px}.programMini small{font-size:9px;color:var(--muted);line-height:1.4;margin-top:2px}.programMini>b{font-size:15px}.academicMini{background:#fffaf0;border-color:#f2dfab}.academicMini .miniIcon{background:#ffefb9}.quranMini{background:#f5fff8;border-color:#cfead9}.quranMini .miniIcon{background:#dff5e7}.coffeeMini{background:#fff9f4;border-color:#ead8c7}.coffeeMini .miniIcon{background:#f5e4d2}.studentDashboard{display:grid;gap:18px;margin-top:18px}.studentProfileHero{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:24px 26px;background:linear-gradient(135deg,#fff,#f5f9ff);}.studentHeroIdentity{display:flex;align-items:center;gap:17px;min-width:0}.studentHeroAvatar{width:76px;height:76px;flex:0 0 76px;border-radius:24px;background:linear-gradient(135deg,#dceaff,#f0f6ff);color:var(--blue);display:grid;place-items:center;font-size:25px;font-weight:900;overflow:hidden}.studentHeroAvatar img{width:100%;height:100%;object-fit:cover}.studentProfileHero h2{font-size:26px;margin:5px 0 2px;letter-spacing:-.7px}.studentProfileHero p{margin:0;color:var(--muted);font-size:11px}.studentTags{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}.studentTags span{font-size:9px;padding:5px 8px;border-radius:999px;background:#f1f5fb;color:#52627b}.studentGrid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(300px,.85fr);gap:18px}.studentDataGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.studentDataGrid>div,.childDetailGrid>div{padding:13px 14px;border:1px solid #e1e7ef;border-radius:14px;background:#fbfcfe}.studentDataGrid small,.studentDataGrid strong,.childDetailGrid small,.childDetailGrid strong{display:block}.studentDataGrid small,.childDetailGrid small{font-size:9px;color:var(--muted);font-weight:750;text-transform:uppercase;letter-spacing:.05em}.studentDataGrid strong,.childDetailGrid strong{font-size:12px;margin-top:3px}.linkParentBox{margin-top:17px;padding:17px;border-radius:16px;background:#f8faff;border:1px solid #e0e8f5}.linkParentBox h3{font-size:14px;margin:0 0 3px}.linkParentBox p{font-size:10px;color:var(--muted);margin:0 0 11px}.linkFormRow{display:grid;grid-template-columns:1fr auto;gap:8px}.linkFormRow input{min-height:44px;padding:10px 12px;border:1px solid #dce3ed;border-radius:11px}.historyCard{margin-top:0}.historySummary{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:13px}.historySummary>div{padding:12px;border-radius:14px;background:#f8faff;border:1px solid #e2e8f2}.historySummary span,.historySummary b,.historySummary small{display:block}.historySummary span{font-size:15px}.historySummary b{font-size:20px;line-height:1.1}.historySummary small{font-size:9px;color:var(--muted);margin-top:3px}.historyGrid{display:grid;gap:9px}.dashboard .historyItem{background:#fff;border:1px solid #e1e7f0;border-radius:15px;padding:12px;display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:10px}.dashboard .historyItem:hover{border-color:#cbd9ef;box-shadow:0 8px 20px rgba(18,37,75,.06)}.dashboard .historyItemMain strong,.dashboard .historyItemMain small{display:block}.dashboard .historyItemMain strong{font-size:12px}.dashboard .historyItemMain small{font-size:9px;color:var(--muted);margin-top:2px}.historyItemScore{text-align:right}.historyItemScore>b{display:block;margin-bottom:5px}.historyItemScore .btn{font-size:9px;padding:7px 9px}.emptyState{text-align:center;padding:26px 15px;border:1px dashed #d3dce9;border-radius:16px;background:#fbfcfe}.emptyState>span{display:block;font-size:25px;margin-bottom:5px}.emptyState strong{display:block;font-size:13px}.emptyState p,.emptyState small{display:block;color:var(--muted);font-size:10px;margin:4px 0 12px}.emptyState.compact{padding:20px 10px;border:0;background:transparent}.detailCard{margin-top:18px}.childDetailGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:18px 0}.subHeading{font-size:16px;margin:22px 0 10px}.childHistoryList{display:grid;gap:9px}.childHistoryItem{display:grid;grid-template-columns:36px minmax(0,1fr) auto;align-items:center;gap:10px;padding:12px;border:1px solid #e1e7f0;border-radius:14px}.childHistoryItem strong,.childHistoryItem small{display:block}.childHistoryItem strong{font-size:11px}.childHistoryItem small{font-size:9px;color:var(--muted);margin-top:2px}.childHistoryItem>div:last-child{text-align:right}.childHistoryItem .btn{font-size:9px;padding:7px 9px;margin-left:7px}.formActions{display:flex;gap:8px;flex-wrap:wrap}.dashboardConsult{margin-top:18px}.studentTip{margin-top:0}.dashboardPage .notice{font-size:10px}.dashboardPage .form{gap:11px}.dashboardPage .form label{font-size:11px}.dashboardPage .form input,.dashboardPage .form select{min-height:44px}

.learningOverviewCard{margin-top:18px;background:linear-gradient(135deg,#fff,#f8fbff)}
.learningStatsGrid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin:14px 0 18px}.learningStat{display:flex;align-items:center;gap:10px;padding:13px;border:1px solid #e1e7f0;border-radius:14px;background:#fff}.learningStat>span{width:36px;height:36px;border-radius:11px;background:#f1f5fb;display:grid;place-items:center;font-size:16px;flex:0 0 36px}.learningStat strong,.learningStat small{display:block}.learningStat strong{font-size:18px}.learningStat small{font-size:8px;color:var(--muted);margin-top:2px}.learningProgramsList{display:grid;gap:8px}.learningProgram{display:grid;grid-template-columns:42px minmax(0,1fr) auto auto;gap:10px;align-items:center;padding:12px;border:1px solid #e1e7f0;border-radius:14px;background:#fff}.learningProgramIcon,.learningItemIcon{width:42px;height:42px;border-radius:13px;background:#eef5ff;display:grid;place-items:center;font-size:17px}.learningProgramMain strong,.learningProgramMain span{display:block}.learningProgramMain strong{font-size:12px}.learningProgramMain span{font-size:9px;color:var(--muted);margin-top:3px}.learningQuota{text-align:right}.learningQuota b,.learningQuota small{display:block}.learningQuota b{font-size:17px}.learningQuota small{font-size:8px;color:var(--muted)}.statusPill{font-size:8px;font-weight:850;padding:5px 8px;border-radius:999px;background:#edf5ff;color:#2861a7;white-space:nowrap}.learningColumns{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}.learningSubHeading{margin:0 0 9px}.learningList{display:grid;gap:8px}.learningItem{display:grid;grid-template-columns:38px minmax(0,1fr) auto;gap:9px;align-items:center;padding:10px;border:1px solid #e5eaf2;border-radius:13px;background:#fff}.learningItemIcon{width:38px;height:38px;border-radius:11px;font-size:15px}.learningItem strong,.learningItem small{display:block}.learningItem strong{font-size:10px}.learningItem small{font-size:8px;color:var(--muted);margin-top:2px;line-height:1.35}.learningScore{font-size:11px;font-weight:900;white-space:nowrap}
@media(max-width:980px){.learningStatsGrid{grid-template-columns:repeat(3,1fr)}.learningColumns{grid-template-columns:1fr}}
@media(max-width:600px){.learningStatsGrid{grid-template-columns:repeat(2,1fr)}.learningProgram{grid-template-columns:38px minmax(0,1fr);}.learningProgram .learningQuota,.learningProgram .statusPill{grid-column:2;text-align:left}.learningItem{grid-template-columns:34px minmax(0,1fr)}.learningItem>.statusPill,.learningItem>.learningScore,.learningItem>.textLink{grid-column:2;justify-self:start}.learningItemIcon{width:34px;height:34px}.learningStat{padding:10px}.learningStat>span{width:32px;height:32px;flex-basis:32px}.learningStat strong{font-size:16px}}
@media(max-width:980px){.dashboardMainGrid,.studentGrid{grid-template-columns:1fr}.dashboardStatsPanel{grid-template-columns:repeat(2,1fr)}.welcomeProfile{display:none}.childCard{grid-template-columns:58px minmax(0,1fr) 125px}.dashboardAside{grid-template-columns:1fr 1fr}.dashboardAside .tipCard{height:max-content}.programMiniGrid{grid-template-columns:1fr 1fr}.programMini:last-child{grid-column:1/-1}.childDetailGrid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.dashboardWrap{padding-top:18px}.dashboardNavRight .navStatus{display:none}.dashboardWelcome{padding:24px;border-radius:22px;min-height:0}.welcomeCopy h1{font-size:29px}.welcomeCopy p{font-size:12px}.welcomeCopy .heroQuick{display:grid;grid-template-columns:1fr 1fr}.welcomeCopy .heroQuick .btn{width:100%;padding:10px 8px;font-size:10px}.dashboardStatsPanel{gap:9px}.statCard{min-height:96px;padding:13px 11px;gap:9px;border-radius:16px}.statIcon{width:39px;height:39px;flex-basis:39px;border-radius:12px;font-size:17px}.statCard strong{font-size:21px}.statCard small,.statCard em{font-size:8px}.sectionCard{padding:18px;border-radius:18px}.sectionCardHead h2{font-size:20px}.sectionCardHead p{font-size:10px}.childCard{grid-template-columns:46px minmax(0,1fr);gap:10px;padding:12px}.childAvatar{width:46px;height:46px;border-radius:14px;font-size:14px}.childInfo h3{font-size:14px}.childInfo p{font-size:9px}.childScore{grid-column:1/-1;text-align:left;display:flex;align-items:center;gap:8px;padding-top:4px;border-top:1px solid #edf0f5}.childScore small,.childScore em{font-size:8px}.childScore strong{font-size:18px}.childScore .btn{margin-left:auto}.dashboardAside{grid-template-columns:1fr}.programMiniGrid{grid-template-columns:1fr}.programMini:last-child{grid-column:auto}.programMini{padding:12px}.studentProfileHero{display:block;padding:18px}.studentProfileHero>.btn{width:100%;margin-top:14px}.studentHeroAvatar{width:62px;height:62px;flex-basis:62px;border-radius:19px}.studentProfileHero h2{font-size:21px}.studentDataGrid{grid-template-columns:1fr}.linkFormRow{grid-template-columns:1fr}.linkFormRow .btn{width:100%}.historySummary{grid-template-columns:1fr 1fr}.dashboard .historyItem{grid-template-columns:34px minmax(0,1fr)}.historyItemScore{grid-column:2;text-align:left;display:flex;align-items:center;gap:8px}.historyItemScore>b{margin:0}.historyItemScore .btn{margin-left:auto}.childDetailGrid{grid-template-columns:1fr 1fr}.childHistoryItem{grid-template-columns:34px minmax(0,1fr)}.childHistoryItem>div:last-child{grid-column:2;text-align:left}.childHistoryItem .btn{margin-left:8px}.dashboardConsult{grid-template-columns:1fr!important}.dashboardConsult .consultIcon{display:none!important}}
@media(max-width:430px){.welcomeCopy .heroQuick{grid-template-columns:1fr}.dashboardStatsPanel{grid-template-columns:1fr 1fr}.statCard{min-height:88px}.statIcon{width:34px;height:34px;flex-basis:34px}.statCard strong{font-size:19px}.statCard em{display:none}.sectionCardHead{gap:10px}.textLink{font-size:9px}.historySummary{gap:7px}.historySummary>div{padding:10px}.historySummary b{font-size:17px}.historySummary small{font-size:8px}}

/* v4.13.0 account profile tools */
.accountProfileCardV13{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(220px,.7fr) minmax(0,1.2fr);align-items:center;gap:18px;padding:18px 20px!important;margin-top:16px}.accountProfileIdentityV13{display:flex;align-items:center;gap:13px;min-width:0}.accountAvatarV13{width:62px;height:62px;flex:0 0 62px;border-radius:18px;background:linear-gradient(135deg,#dceaff,#f1f6ff);color:var(--blue);display:grid;place-items:center;font-size:21px;font-weight:900;overflow:hidden}.accountAvatarV13 img{width:100%;height:100%;object-fit:cover}.accountProfileIdentityV13 h2{margin:4px 0 1px;font-size:18px;letter-spacing:-.4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.accountProfileIdentityV13 p{margin:0 0 5px;color:var(--muted);font-size:10px}.accountEmailV13{display:inline-flex;align-items:center;gap:6px;max-width:100%;padding:5px 8px;border-radius:9px;background:#f7f9fc;border:1px solid #e4e9f1;font-size:9px}.accountEmailV13 span{color:var(--blue)}.accountEmailV13 strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.accountProfileMetaV13{display:grid;grid-template-columns:1fr 1fr;gap:8px}.accountProfileMetaV13>div{padding:10px 11px;border-radius:12px;background:#f8faff;border:1px solid #e3e9f2}.accountProfileMetaV13 small,.accountProfileMetaV13 strong{display:block}.accountProfileMetaV13 small{font-size:8px;color:var(--muted);text-transform:uppercase;font-weight:800}.accountProfileMetaV13 strong{font-size:10px;margin-top:2px}.accountPhotoV13{padding:11px 12px;border-radius:13px;background:#fbfcfe;border:1px solid #e4e9f1}.accountPhotoV13 strong,.accountPhotoV13 small{display:block}.accountPhotoV13 small{font-size:8px;color:var(--muted);margin-top:2px}.accountPhotoActionsV13{display:flex;align-items:center;gap:7px;margin-top:8px}.accountPhotoActionsV13 .btn{min-height:34px;padding:7px 10px;font-size:9px}.accountPhotoMsgV13{font-size:8px;color:var(--green);min-width:0}.dashboardPage .accountProfileCardV13 .sectionEyebrow{font-size:8px;padding:4px 7px}
@media(max-width:980px){.accountProfileCardV13{grid-template-columns:1fr 1fr}.accountPhotoV13{grid-column:1/-1}.accountProfileMetaV13{align-self:stretch}}
@media(max-width:560px){.accountProfileCardV13{grid-template-columns:1fr;padding:15px!important}.accountPhotoV13{grid-column:auto}.accountProfileMetaV13{grid-template-columns:1fr 1fr}.accountPhotoActionsV13{flex-wrap:wrap}.accountProfileIdentityV13 h2{font-size:16px}}


/* =========================================================
   AYOLES.ID v4.13.1 — Homepage Visual Finishing
   Scoped to .homePage so dashboard/app screens remain stable.
   ========================================================= */
.homePage{
  --home-section-gap: 0;
  --home-heading:#10234b;
  --home-body:#64738d;
  background:#fbfcff;
}
.homePage .wrap{max-width:1180px}
.homePage .siteNav{height:74px;box-shadow:0 1px 0 rgba(16,35,75,.03)}
.homePage .siteNav .brand strong{font-size:21px}
.homePage .siteNav .navlinks{gap:26px}
.homePage .siteNav .navbtns{gap:10px}
.homePage .siteNav .navbtns .btn{min-height:50px;padding:12px 19px}

/* Clear, predictable typography hierarchy */
.homePage h1,.homePage h2,.homePage h3{
  color:var(--home-heading);
  text-wrap:balance;
}
.homePage p{color:var(--home-body)}
.homePage .sectionIntro{max-width:780px;margin-bottom:34px}
.homePage .sectionIntro h2{
  font-size:clamp(34px,4vw,50px);
  line-height:1.06;
  letter-spacing:-2px;
  margin:10px 0 12px;
}
.homePage .sectionIntro p{
  font-size:16px;
  line-height:1.65;
  margin:0;
}
.homePage .tag{
  font-size:9px;
  letter-spacing:.45px;
  line-height:1;
  padding:8px 10px;
}

/* Hero: slightly tighter and calmer */
.homePage .homeHero{
  padding:66px 0 68px;
}
.homePage .homeHeroGrid{
  gap:48px;
}
.homePage .homeHeroCopy h1{
  font-size:clamp(48px,5.25vw,72px);
  line-height:.99;
  letter-spacing:-3.6px;
  margin:12px 0 20px;
  max-width:680px;
}
.homePage .homeHeroCopy p{
  font-size:17px;
  line-height:1.65;
  max-width:630px;
  margin:0;
}
.homePage .heroBtns{margin-top:22px;gap:10px}
.homePage .heroBtns .btn{min-height:52px}
.homePage .trustRow{margin-top:18px;gap:8px}
.homePage .trustRow span{
  padding:8px 11px;
  font-size:10px;
}
.homePage .heroBadge{display:none!important}
.homePage .heroMainImage{box-shadow:0 20px 50px rgba(16,35,75,.14)}
.homePage .heroMiniImage{box-shadow:0 16px 38px rgba(16,35,75,.13)}
.homePage .heroFloat{box-shadow:0 16px 40px rgba(16,35,75,.13)}

/* Statistics: stronger hierarchy, less visual noise */
.homePage .statsBand{padding:20px 0}
.homePage .statsBandGrid>div{padding:8px 22px}
.homePage .statsBandGrid strong{font-size:27px;line-height:1.1}
.homePage .statsBandGrid span{font-size:12px;margin-top:3px}
.homePage .statsBandGrid small{font-size:10px;line-height:1.4;margin-top:2px}
.homePage .statsBandCta b{font-size:12px;line-height:1.4}
.homePage .statsBandCta .btn{margin-top:9px;min-height:44px}

/* Program section */
.homePage .programSection{
  padding:82px 0 88px;
}
.homePage .programShowcase{gap:20px}
.homePage .programFeature{
  border-radius:22px;
  box-shadow:0 10px 30px rgba(18,37,75,.055);
}
.homePage .featureImage{
  height:300px;
  background:#f1f4f8;
}
.homePage .featureImage img{object-position:center top}
.homePage .featureBody{padding:22px 23px 24px}
.homePage .featureBody h3,.homePage .compact h3{
  font-size:22px;
  line-height:1.2;
  letter-spacing:-.65px;
  margin:9px 0 8px;
}
.homePage .featureBody p,.homePage .compact p{
  font-size:13px;
  line-height:1.62;
}
.homePage .miniTag{
  font-size:8px;
  letter-spacing:.35px;
}
.homePage .sidePrograms{gap:20px}
.homePage .compact{
  grid-template-columns:116px 1fr;
  gap:17px;
  padding:17px;
}
.homePage .compactImage,.homePage .coffeeVisual{height:132px}
.homePage .compactImage img{object-position:center top}

/* Process */
.homePage .processSection{padding:82px 0}
.homePage .processGrid{gap:62px}
.homePage .processIntro h2{
  font-size:clamp(36px,3.5vw,46px);
  line-height:1.05;
  letter-spacing:-1.8px;
  margin:10px 0 14px;
}
.homePage .processIntro p{
  font-size:15px;
  line-height:1.7;
  margin:0;
}
.homePage .processCtas{margin-top:18px}
.homePage .processItem{
  grid-template-columns:48px 1fr;
  gap:18px;
  padding:20px 0;
}
.homePage .processItem h3{font-size:16px;margin-bottom:4px}
.homePage .processItem p{font-size:12px;line-height:1.55}

/* Why AYOLES */
.homePage .whySection{padding:82px 0}
.homePage .whyGrid{gap:14px}
.homePage .whyCard{
  min-height:180px;
  border-radius:18px;
  padding:21px;
  box-shadow:0 5px 20px rgba(16,35,75,.025);
}
.homePage .whyIcon{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:13px;
  background:#eef4ff;
  color:#1d5fd1;
  font-size:24px;
  font-weight:800;
  line-height:1;
}
.homePage .whyCard h3{margin:13px 0 7px;font-size:17px}
.homePage .whyCard p{font-size:12px;line-height:1.6}

/* Testimonials: compact the large empty space */
.homePage .testimonialSection{padding:76px 0 70px}
.homePage .homeTestimonials .sectionIntro{margin-bottom:28px}
.homePage .homeTestimonials .sectionIntro h2{max-width:760px;margin-left:auto;margin-right:auto}
.homePage .testimonialSlider{max-width:940px}
.homePage .testimonialTrack .testimonialCard{
  border-radius:20px;
  padding:28px 32px;
  box-shadow:0 12px 34px rgba(18,37,75,.055);
}
.homePage .testimonialCard>p{
  font-size:18px;
  line-height:1.6;
  min-height:58px;
  margin:14px 0 22px;
}
.homePage .sliderControls{margin-top:15px}

/* Assessment CTA */
.homePage .assessmentBanner{padding:44px 0}
.homePage .assessmentHero{
  border-radius:26px;
  padding:36px 40px;
  gap:30px;
}
.homePage .assessmentHero h2{
  font-size:clamp(32px,3.4vw,42px);
  line-height:1.05;
  letter-spacing:-1.6px;
  margin:9px 0 9px;
}
.homePage .assessmentHero p{font-size:15px;line-height:1.6}

/* Articles */
.homePage .articleSection{padding:62px 0 78px}
.homePage .articleSection .sectionHead{
  margin-bottom:28px;
  align-items:center;
}
.homePage .articleSection .sectionHead h2{
  font-size:clamp(32px,3.2vw,40px);
  line-height:1.08;
  letter-spacing:-1.5px;
  margin:9px 0 8px;
}
.homePage .articleSection .sectionHead p{font-size:15px;margin:0}
.homePage .articleGrid{gap:18px}
.homePage .articleCard{
  border-radius:20px;
  box-shadow:0 10px 28px rgba(18,37,75,.05);
}
.homePage .articleCard>img{
  height:190px;
  object-fit:cover;
  object-position:center;
  background:#eef2f7;
}
.homePage .articleCard .cardBody{padding:20px}
.homePage .articleCard h3{font-size:18px;line-height:1.35;margin:9px 0 8px}
.homePage .articleCard p{font-size:13px;line-height:1.6;margin-bottom:15px}

/* Floating WhatsApp: visible, but no longer competing with CTA sections */
.homePage .floatingWhatsApp{
  right:22px;
  bottom:20px;
  padding:11px 16px;
  font-size:11px;
  box-shadow:0 9px 24px rgba(37,211,102,.22);
}
.homePage .floatingWhatsApp .waIcon{width:21px;height:21px}

/* Footer rhythm */
.homePage .footer{margin-top:0}
.homePage .footerGrid{row-gap:28px}
.homePage .footer .copyright{padding-top:18px}

/* Avoid accidental horizontal overflow from decorative elements */
.homePage,.homePage main,.homePage section,.homePage header{max-width:100%;overflow-x:clip}

@media(max-width:900px){
  .homePage .homeHero{padding:56px 0 60px}
  .homePage .homeHeroGrid{gap:30px}
  .homePage .homeHeroCopy h1{font-size:clamp(44px,7vw,60px)}
  .homePage .programSection,.homePage .processSection,.homePage .whySection{padding:68px 0}
  .homePage .processGrid{gap:42px}
  .homePage .statsBandGrid>div{padding:8px 16px}
  .homePage .assessmentHero{padding:32px}
}

@media(max-width:560px){
  .homePage .siteNav{min-height:66px}
  .homePage .homeHero{padding:44px 0 46px}
  .homePage .homeHeroGrid{gap:16px}
  .homePage .homeHeroCopy h1{
    font-size:clamp(40px,11vw,48px);
    line-height:1.0;
    letter-spacing:-2.4px;
    margin:10px 0 16px;
  }
  .homePage .homeHeroCopy p{font-size:15.5px;line-height:1.62}
  .homePage .heroBtns{margin-top:18px}
  .homePage .heroBtns .btn{min-height:50px}
  .homePage .trustRow{margin-top:15px}
  .homePage .trustRow span{font-size:9px;padding:7px 9px}
  .homePage .homeHeroVisual{min-height:360px}
  .homePage .heroMainImage{height:270px;width:76%}
  .homePage .heroMiniImage{height:150px;width:44%}
  .homePage .heroFloat{left:16%;padding:10px}
  .homePage .heroFloat small{font-size:9px}
  .homePage .statsBand{padding:16px 0}
  .homePage .statsBandGrid>div{padding:8px 10px}
  .homePage .statsBandGrid strong{font-size:22px}
  .homePage .statsBandGrid span{font-size:11px}
  .homePage .statsBandGrid small{font-size:9px}
  .homePage .statsBandCta{padding-top:14px}
  .homePage .sectionIntro{margin-bottom:25px}
  .homePage .sectionIntro h2{
    font-size:32px;
    letter-spacing:-1.2px;
    line-height:1.08;
  }
  .homePage .sectionIntro p{font-size:14px}
  .homePage .programSection,.homePage .processSection,.homePage .whySection{padding:58px 0}
  .homePage .featureImage{height:235px}
  .homePage .featureBody{padding:18px}
  .homePage .featureBody h3,.homePage .compact h3{font-size:20px}
  .homePage .compact{grid-template-columns:88px 1fr;gap:13px;padding:13px}
  .homePage .compactImage,.homePage .coffeeVisual{height:112px}
  .homePage .processGrid{gap:34px}
  .homePage .processIntro h2{font-size:34px}
  .homePage .processItem{grid-template-columns:38px 1fr;gap:12px;padding:18px 0}
  .homePage .processItem p{font-size:12px}
  .homePage .whyCard{min-height:0;padding:19px}
  .homePage .testimonialSection{padding:58px 0 54px}
  .homePage .testimonialTrack .testimonialCard{padding:22px}
  .homePage .testimonialCard>p{font-size:16px;min-height:0}
  .homePage .assessmentBanner{padding:30px 0}
  .homePage .assessmentHero{padding:25px;border-radius:22px}
  .homePage .assessmentHero h2{font-size:30px}
  .homePage .articleSection{padding:50px 0 62px}
  .homePage .articleSection .sectionHead{display:block}
  .homePage .articleSection .sectionHead .btn{margin-top:16px}
  .homePage .articleCard>img{height:180px}
  .homePage .floatingWhatsApp{right:14px;bottom:14px;padding:10px 14px}
}


/* =========================================================
   AYOLES.ID v4.13.2 — UI FINISHING MICRO-POLISH
   Direction: clean EdTech spacing + navy/yellow emphasis + clear typography.
   No D1/schema/data changes.
   ========================================================= */
.homePage .sectionIntro{margin-bottom:28px}

/* Consistent vertical rhythm: use the statistics-to-program gap as the visual benchmark. */
.homePage .programSection{padding:54px 0 58px}
.homePage .processSection{padding:58px 0}
.homePage .whySection{padding:58px 0}
.homePage .testimonialSection{padding:56px 0 54px}
.homePage .assessmentBanner{padding:34px 0}
.homePage .articleSection{padding:54px 0 66px}

/* Keep section transitions compact without making the page feel cramped. */
.homePage .programSection .sectionIntro{margin-bottom:26px}
.homePage .processGrid{gap:54px}
.homePage .homeTestimonials .sectionIntro{margin-bottom:24px}
.homePage .articleSection .sectionHead{margin-bottom:24px}

/* Assessment CTA: high-contrast text on navy gradient. */
.homePage .assessmentHero h2{color:#fff}
.homePage .assessmentHero p{color:#e8eef8}
.homePage .assessmentHero .tag{background:#fff3cc;color:#765700}
.homePage .assessmentHero{box-shadow:0 18px 44px rgba(16,35,75,.15)}

/* Home navigation: make the return-to-home action explicit and easy to scan. */
.siteNav .navlinks .homeNavLink{font-weight:850}
.siteNav .navlinks .homeNavLink:hover{color:var(--blue)}
.mobileNavSource .homeNavLink{font-weight:850}

@media(max-width:900px){
  .homePage .programSection,.homePage .processSection,.homePage .whySection{padding:52px 0}
  .homePage .testimonialSection{padding:50px 0 48px}
  .homePage .assessmentBanner{padding:30px 0}
  .homePage .articleSection{padding:48px 0 58px}
}

@media(max-width:560px){
  .homePage .sectionIntro{margin-bottom:22px}
  .homePage .programSection,.homePage .processSection,.homePage .whySection{padding:46px 0}
  .homePage .processGrid{gap:34px}
  .homePage .testimonialSection{padding:44px 0 42px}
  .homePage .assessmentBanner{padding:24px 0}
  .homePage .assessmentHero{padding:24px;border-radius:22px}
  .homePage .assessmentHero h2{color:#fff;font-size:30px;line-height:1.08}
  .homePage .assessmentHero p{color:#e8eef8;font-size:14px;line-height:1.6}
  .homePage .articleSection{padding:44px 0 54px}
}


/* =========================================================
   v4.13.3 GLOBAL PUBLIC UI FINISHING
   Scope: public/marketing pages only. No D1/backend changes.
   ========================================================= */
.globalPublicNav .navlinks{align-items:center;gap:20px}
.globalPublicNav .navlinks>a,.globalPublicNav .navlinks>details>summary{white-space:nowrap}
.globalPublicNav .homeNavLink{display:inline-flex!important;visibility:visible!important;opacity:1!important;font-weight:850!important}
.globalPublicNav .homeNavLink:hover{color:var(--blue)}
.globalPublicNav .navbtns{flex-shrink:0}
.globalPublicNav .mobileNav{display:none}

/* Consistent section rhythm for the public pages. */
.homePage section:not(.statsBand),
.homePage .assessmentBanner{padding-top:58px;padding-bottom:58px}
.homePage .programSection{padding-top:58px;padding-bottom:64px}
.homePage .processSection{padding-top:58px;padding-bottom:58px}
.homePage .whySection{padding-top:58px;padding-bottom:58px}
.homePage .testimonialSection{padding-top:54px;padding-bottom:50px}
.homePage .articleSection{padding-top:54px;padding-bottom:60px}
.homePage .sectionIntro{margin-bottom:24px}
.homePage .processGrid{gap:46px}
.homePage .processItem{padding:15px 0;gap:15px}
.homePage .whyCard{min-height:166px}
.homePage .assessmentBanner{padding-top:46px;padding-bottom:46px}
.homePage .assessmentHero{background:linear-gradient(135deg,#132d61 0%,#2456a7 100%);color:#fff;border-radius:24px;padding:28px 32px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:22px;box-shadow:0 18px 45px rgba(16,35,75,.12)}
.homePage .assessmentHero .tag{background:#fff4c9;color:#805d00}
.homePage .assessmentHero h2{color:#fff!important;margin:10px 0 8px;font-size:clamp(28px,3.2vw,42px);line-height:1.05;letter-spacing:-1.5px}
.homePage .assessmentHero p{color:rgba(255,255,255,.82)!important;max-width:680px;margin:0;line-height:1.6}
.homePage .assessmentHero .heroBtns{margin-top:0;display:flex;flex-direction:column;align-items:stretch;min-width:210px}
.homePage .assessmentHero .heroBtns .btn{width:100%}
.homePage .assessmentHero .btn.primary{color:var(--navy)}
.homePage .articleSection .sectionHead{margin-bottom:20px}

/* Public inner pages: same visual rhythm as the homepage. */
.publicPage section{padding-top:54px;padding-bottom:54px}
.publicPage .pageTop{padding-top:48px;padding-bottom:54px}
.catalogHero{padding-top:52px!important;padding-bottom:18px!important}
.catalogHero + section{padding-top:38px!important}
.programHero{padding-top:54px!important;padding-bottom:54px!important}
.programHero + section{padding-top:52px!important}
.articleDetail{padding-top:48px;padding-bottom:60px}
.articleDetail h1{color:var(--navy);line-height:1.08;letter-spacing:-1.8px;max-width:900px}
.articleDetail .lead{color:var(--muted);font-size:17px;line-height:1.65;max-width:820px}
.articleHero{display:block;width:100%;max-height:520px;object-fit:cover;border-radius:22px;margin:28px 0 32px}
.articleBody{max-width:820px;margin:0 auto}
.articleBody p{font-size:16px;line-height:1.8;color:#4f5e76}

/* Make the global nav usable and visually consistent across desktop sizes. */
@media(max-width:1080px){
  .globalPublicNav .navlinks{gap:14px;font-size:12px}
  .globalPublicNav .navbtns .btn{padding:10px 13px}
}
@media(max-width:900px){
  .globalPublicNav .navlinks{display:none}
  .globalPublicNav .mobileNav{display:block}
  .homePage .assessmentHero{grid-template-columns:1fr}
  .homePage .assessmentHero .heroBtns{min-width:0;max-width:280px}
  .homePage section:not(.statsBand),.homePage .assessmentBanner{padding-top:48px;padding-bottom:48px}
}
@media(max-width:560px){
  .globalPublicNav .mobileNavPanel{right:-8px}
  .homePage section:not(.statsBand),.homePage .assessmentBanner{padding-top:42px;padding-bottom:42px}
  .homePage .programSection,.homePage .processSection,.homePage .whySection{padding-top:42px;padding-bottom:42px}
  .homePage .testimonialSection{padding-top:40px;padding-bottom:38px}
  .homePage .articleSection{padding-top:40px;padding-bottom:46px}
  .homePage .assessmentHero{padding:22px 20px;border-radius:20px}
  .homePage .assessmentHero h2{font-size:29px}
  .homePage .assessmentHero .heroBtns{max-width:none}
  .publicPage section{padding-top:42px;padding-bottom:42px}
  .catalogHero{padding-top:42px!important}
  .programHero{padding-top:42px!important;padding-bottom:42px!important}
  .articleDetail{padding-top:36px;padding-bottom:46px}
  .articleDetail h1{font-size:34px}
  .articleDetail .lead{font-size:15px}
}

/* =========================================================
   v4.13.5 PREMIUM UI POLISH — GLOBAL PUBLIC FINISHING
   Scope: visitor-facing/public pages. CSS/HTML only.
   No D1, schema, assessment data, auth logic, or Worker changes.
   ========================================================= */
:root{
  --ui-section:52px;
  --ui-section-mobile:38px;
  --ui-content-gap:20px;
}

/* ---------- Global public navigation ---------- */
.globalPublicNav .navlinks{display:flex;align-items:center;gap:18px}
.globalPublicNav .navlinks .homeNavLink{order:-1;display:inline-flex!important;align-items:center;font-weight:850!important}
.globalPublicNav .navlinks .homeNavLink::before{content:'⌂';font-size:.95em;margin-right:6px;opacity:.72}
.globalPublicNav .navlinks>a,.globalPublicNav .navlinks>details>summary{line-height:1.2;white-space:nowrap}
.globalPublicNav .navbtns{flex-shrink:0;gap:8px}
.globalPublicNav .navbtns .btn{min-height:42px;padding:10px 15px;border-radius:11px}
.globalPublicNav .homeNavLink:hover{color:var(--blue)}

/* ---------- Shared public-page rhythm ---------- */
.publicPage main section{padding-top:var(--ui-section);padding-bottom:var(--ui-section)}
.publicPage .pageTop{padding-top:42px;padding-bottom:48px}
.publicPage .sectionHead,.publicPage .sectionIntro{margin-bottom:var(--ui-content-gap)}
.publicPage h1,.publicPage h2,.publicPage h3{letter-spacing:-.8px;text-wrap:balance}
.publicPage p{line-height:1.65}
.publicPage .catalogHero{padding-top:46px!important;padding-bottom:24px!important}
.publicPage .catalogHero + section{padding-top:28px!important}
.publicPage .programHero{padding-top:48px!important;padding-bottom:48px!important}
.publicPage .programHero + section{padding-top:34px!important}
.publicPage .articleDetail{padding-top:42px;padding-bottom:52px}

/* ---------- Homepage: tighter premium hero ---------- */
.homePage .wrap{max-width:1180px}
.homePage .siteNav{height:68px}
.homePage .siteNav .brand strong{font-size:20px}
.homePage .siteNav .navlinks{gap:18px}
.homePage .siteNav .navbtns .btn{min-height:42px;padding:10px 15px}
.homePage .homeHero{padding:48px 0 54px}
.homePage .homeHeroGrid{gap:38px}
.homePage .homeHeroCopy h1{font-size:clamp(46px,5vw,68px);line-height:1;letter-spacing:-3.2px;margin:10px 0 16px;max-width:650px}
.homePage .homeHeroCopy p{font-size:16px;line-height:1.62;max-width:610px}
.homePage .heroBtns{margin-top:19px}
.homePage .heroBtns .btn{min-height:48px}
.homePage .trustRow{margin-top:15px;gap:7px}
.homePage .trustRow span{padding:7px 10px;font-size:10px}
.homePage .homeHeroVisual{min-height:455px}
.homePage .heroGlow{width:340px;height:340px}
.homePage .heroMainImage{height:360px;top:24px;border-width:7px}
.homePage .heroMiniImage{height:190px;bottom:18px;border-width:7px}
.homePage .heroFloat{padding:12px 14px;border-radius:16px}

/* ---------- Stats band ---------- */
.homePage .statsBand{padding:16px 0}
.homePage .statsBandGrid .statTrust{min-height:74px;padding:7px 18px}
.homePage .statsBandGrid strong{font-size:25px;line-height:1.05}
.homePage .statsBandGrid span{font-size:11px}
.homePage .statsBandGrid small{font-size:9px;line-height:1.35}
.homePage .statsBandCta b{font-size:11px}
.homePage .statsBandCta .btn{min-height:40px;padding:9px 13px;margin-top:6px;font-size:10px}

/* ---------- Program showcase ---------- */
.homePage .programSection{padding:48px 0 54px}
.homePage .sectionIntro{max-width:760px;margin-bottom:20px}
.homePage .sectionIntro h2{font-size:clamp(32px,3.6vw,44px);line-height:1.08;letter-spacing:-1.6px;margin:8px 0 9px}
.homePage .sectionIntro p{font-size:14px;line-height:1.6}
.homePage .programShowcase{gap:18px}
.homePage .programFeature{border-radius:20px;box-shadow:0 9px 28px rgba(18,37,75,.055)}
.homePage .programFeature:hover{transform:translateY(-3px);box-shadow:0 16px 34px rgba(18,37,75,.09)}
.homePage .programSection .featureImage,.homePage .programSection .compactImage,.homePage .programSection .coffeeVisual{height:220px}
.homePage .programSection .featureBody{min-height:154px;padding:18px 19px 20px}
.homePage .programSection .compact>div:last-child{padding:19px}
.homePage .programSection .featureBody h3,.homePage .programSection .compact h3{font-size:20px;line-height:1.18;margin:8px 0 7px}
.homePage .programSection .featureBody p,.homePage .programSection .compact p{font-size:12px;line-height:1.55}
.homePage .programSection .sidePrograms{gap:18px}

/* ---------- Process: editorial two-column rhythm ---------- */
.homePage .processSection{padding:52px 0;background:#fff}
.homePage .processGrid{gap:48px}
.homePage .processIntro h2{font-size:clamp(34px,3.35vw,44px);line-height:1.06;letter-spacing:-1.7px;margin:8px 0 12px}
.homePage .processIntro p{font-size:14px;line-height:1.65;margin:0}
.homePage .processCtas{margin-top:16px;gap:9px}
.homePage .processItem{grid-template-columns:42px 1fr;gap:14px;padding:14px 0}
.homePage .processItem>span{font-size:11px}
.homePage .processItem h3{font-size:15px;margin-bottom:3px}
.homePage .processItem p{font-size:11px;line-height:1.55}

/* ---------- Why section ---------- */
.homePage .whySection{padding:50px 0;background:#f5f8fc}
.homePage .whyGrid{gap:12px}
.homePage .whyCard{min-height:154px;border-radius:16px;padding:18px;box-shadow:0 5px 18px rgba(16,35,75,.025)}
.homePage .whyIcon{width:38px;height:38px;border-radius:11px;font-size:21px}
.homePage .whyCard h3{margin:11px 0 6px;font-size:16px}
.homePage .whyCard p{font-size:11px;line-height:1.55}

/* ---------- Testimonials: compact, centered, more premium ---------- */
.homePage .testimonialSection{padding:46px 0 44px;background:#fff}
.homePage .homeTestimonials .sectionIntro{margin-bottom:18px}
.homePage .homeTestimonials .sectionIntro h2{max-width:650px}
.homePage .testimonialSlider{max-width:860px}
.homePage .testimonialViewport{border-radius:20px}
.homePage .testimonialTrack .testimonialCard{border-radius:20px;padding:22px 26px;box-shadow:0 10px 30px rgba(18,37,75,.055)}
.homePage .testimonialCard .stars{font-size:14px;letter-spacing:2px}
.homePage .testimonialCard>p{font-size:15px;line-height:1.58;margin:12px 0 18px;min-height:0}
.homePage .testimonialPerson strong{font-size:13px}
.homePage .testimonialPerson span{font-size:10px}
.homePage .sliderControls{margin-top:11px;gap:12px}
.homePage .sliderBtn{width:36px;height:36px;font-size:15px}

/* ---------- Final conversion block ---------- */
.homePage .assessmentBanner{padding:34px 0;background:linear-gradient(180deg,#fffdf3 0%,#fff 100%)}
.homePage .assessmentHero{border-radius:22px;padding:24px 28px;gap:22px;box-shadow:0 16px 40px rgba(16,35,75,.13)}
.homePage .assessmentHero h2{font-size:clamp(27px,3vw,38px);line-height:1.06;letter-spacing:-1.3px;margin:8px 0 7px;color:#fff!important}
.homePage .assessmentHero p{font-size:13px;line-height:1.55;color:rgba(255,255,255,.86)!important;max-width:620px}
.homePage .assessmentHero .heroBtns{min-width:195px;gap:8px}
.homePage .assessmentHero .heroBtns .btn{min-height:42px;border-radius:11px;font-size:11px}
.homePage .assessmentHero .tag{background:#fff4c9!important;color:#765700!important}

/* ---------- Articles ---------- */
.homePage .articleSection{padding:46px 0 54px}
.homePage .articleSection .sectionHead{margin-bottom:18px}
.homePage .articleSection .sectionHead h2{font-size:clamp(30px,3vw,38px);line-height:1.08;letter-spacing:-1.4px;margin:8px 0 7px}
.homePage .articleSection .sectionHead p{font-size:13px}
.homePage .articleGrid{gap:15px}
.homePage .articleCard{border-radius:17px;box-shadow:0 8px 24px rgba(18,37,75,.045)}
.homePage .articleCard>img{height:172px}
.homePage .articleCard .cardBody{padding:17px}
.homePage .articleCard h3{font-size:16px;line-height:1.3;margin:8px 0 6px}
.homePage .articleCard p{font-size:11px;line-height:1.55;margin-bottom:12px}

/* ---------- Footer / floating contact ---------- */
.homePage .footerGrid{row-gap:22px}
.homePage .footer .copyright{padding-top:15px}
.homePage .floatingWhatsApp{right:20px;bottom:18px;padding:10px 14px;font-size:10px}
.homePage .floatingWhatsApp .waIcon{width:20px;height:20px}
.homePage,.homePage main,.homePage section,.homePage header{max-width:100%;overflow-x:clip}

/* ---------- Visitor utility pages ---------- */
.utilityNav .wrap,.assessmentNav .wrap{display:flex;align-items:center;gap:14px}
.utilityNav .brand{margin-right:auto}
.utilityNav .utilityHomeNav{display:inline-flex;align-items:center;font-weight:850;color:var(--navy);padding:8px 4px}
.utilityNav .utilityHomeNav::before,.assessmentNav .utilityHomeNav::before{content:'⌂';margin-right:5px;opacity:.72}
.assessmentNav .utilityHomeNav{margin-left:auto;color:var(--navy);font-weight:850}
.utilityHomeNav:hover{color:var(--blue)}

@media(max-width:900px){
  .globalPublicNav .navlinks{display:none}
  .globalPublicNav .mobileNav{display:block}
  .homePage .homeHero{padding:44px 0 48px}
  .homePage .homeHeroGrid{gap:26px}
  .homePage .homeHeroVisual{min-height:430px}
  .homePage .heroMainImage{height:340px}
  .homePage .heroMiniImage{height:180px}
  .homePage .programSection,.homePage .processSection,.homePage .whySection{padding-top:44px;padding-bottom:44px}
  .homePage .testimonialSection{padding-top:42px;padding-bottom:40px}
  .homePage .assessmentBanner{padding-top:30px;padding-bottom:30px}
  .homePage .assessmentHero{grid-template-columns:1fr;padding:24px}
  .homePage .assessmentHero .heroBtns{min-width:0;max-width:280px}
  .homePage .articleSection{padding-top:42px;padding-bottom:48px}
  .publicPage main section{padding-top:46px;padding-bottom:46px}
}

@media(max-width:560px){
  .globalPublicNav .mobileNavPanel{right:-8px}
  .homePage .siteNav{height:auto;min-height:62px}
  .homePage .homeHero{padding:34px 0 38px}
  .homePage .homeHeroGrid{gap:18px}
  .homePage .homeHeroCopy h1{font-size:42px;letter-spacing:-2.4px;line-height:1.01}
  .homePage .homeHeroCopy p{font-size:15px;line-height:1.6}
  .homePage .heroBtns .btn{width:100%}
  .homePage .homeHeroVisual{min-height:350px}
  .homePage .heroMainImage{height:260px;width:76%;top:18px}
  .homePage .heroMiniImage{height:145px;width:44%;bottom:8px}
  .homePage .heroFloat{left:16%;bottom:0;padding:9px 11px}
  .homePage .heroFloat b{font-size:11px}
  .homePage .heroFloat small{font-size:8px}
  .homePage .statsBand{padding:13px 0}
  .homePage .statsBandGrid .statTrust{min-height:78px;padding:8px 9px}
  .homePage .statsBandGrid strong{font-size:22px}
  .homePage .statsBandGrid span{font-size:10px}
  .homePage .statsBandGrid small{font-size:8px}
  .homePage .programSection,.homePage .processSection,.homePage .whySection{padding-top:38px;padding-bottom:38px}
  .homePage .sectionIntro{margin-bottom:18px}
  .homePage .sectionIntro h2{font-size:31px;letter-spacing:-1.2px}
  .homePage .programSection .featureImage,.homePage .programSection .compactImage,.homePage .programSection .coffeeVisual{height:205px}
  .homePage .programSection .featureBody{min-height:0}
  .homePage .programSection .sidePrograms{grid-template-columns:1fr}
  .homePage .processGrid{gap:28px}
  .homePage .processIntro h2{font-size:33px}
  .homePage .whyGrid{grid-template-columns:1fr 1fr}
  .homePage .whyCard{min-height:140px;padding:15px}
  .homePage .whyCard p{font-size:10px}
  .homePage .testimonialSection{padding-top:36px;padding-bottom:34px}
  .homePage .testimonialTrack .testimonialCard{padding:19px 20px}
  .homePage .testimonialCard>p{font-size:14px}
  .homePage .assessmentBanner{padding-top:24px;padding-bottom:24px}
  .homePage .assessmentHero{padding:20px 18px;border-radius:18px}
  .homePage .assessmentHero h2{font-size:28px}
  .homePage .assessmentHero p{font-size:12px}
  .homePage .assessmentHero .heroBtns{max-width:none}
  .homePage .articleSection{padding-top:36px;padding-bottom:42px}
  .homePage .articleSection .sectionHead{display:block}
  .homePage .articleSection .sectionHead .btn{margin-top:11px;width:auto}
  .homePage .articleCard>img{height:165px}
  .homePage .articleCard .cardBody{padding:15px}
  .homePage .floatingWhatsApp{right:14px;bottom:14px;width:50px;height:50px;padding:0;justify-content:center}
  .homePage .floatingWhatsApp b{display:none}
  .publicPage main section{padding-top:38px;padding-bottom:38px}
  .publicPage .pageTop{padding-top:32px;padding-bottom:40px}
  .publicPage .catalogHero,.publicPage .programHero{padding-top:36px!important;padding-bottom:28px!important}
  .publicPage .articleDetail{padding-top:34px;padding-bottom:44px}
  .utilityNav .wrap,.assessmentNav .wrap{gap:9px}
  .utilityNav .utilityHomeNav,.assessmentNav .utilityHomeNav{font-size:12px}
}



/* ---------- v4.13.6 AUTH NAV + REGISTER SPACING FIX ---------- */
.utilityNav .wrap,.assessmentNav .wrap{display:flex;align-items:center;justify-content:space-between;gap:18px}
.utilityNav .brand,.assessmentNav .brand{margin-right:auto;flex:0 0 auto}
.utilityNav .brand small,.assessmentNav .brand small{display:block;color:var(--muted);font-size:10px;font-weight:500;line-height:1.2}
.utilityActions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex:0 0 auto}
.utilityActions .btn{min-height:42px;padding:10px 15px;border-radius:11px}
.utilityNav .utilityHomeNav,.assessmentNav .utilityHomeNav{display:inline-flex;align-items:center;font-weight:850;color:var(--navy);padding:8px 4px;white-space:nowrap}
.utilityNav .utilityHomeNav::before,.assessmentNav .utilityHomeNav::before{content:'⌂';margin-right:5px;opacity:.72}
.utilityHomeNav:hover{color:var(--blue)}
.registerPage{padding-top:28px;padding-bottom:58px}
.registerIntro{margin-bottom:20px}
.registerIntro h1{font-size:clamp(36px,4.5vw,50px);margin:10px 0 6px}
.registerIntro p{font-size:15px}
.registerPage>.roleCards{padding:0;margin-top:0}
.roleCards{gap:16px;max-width:900px}
.roleCard{padding:23px 24px;border-radius:20px}
.roleIcon{width:52px;height:52px;border-radius:16px;font-size:25px;margin-bottom:14px}
.roleCard h2{font-size:23px;margin:8px 0 6px}
.roleCard p{font-size:13px;min-height:58px}
.roleAction{margin-top:16px}
.registerForm{max-width:900px;margin:20px auto 0;padding:24px;border-radius:22px}
.formSection{padding:22px 2px}
.formSection>.grid2{gap:13px 16px}
.registerForm label{display:block;font-size:12px;font-weight:800;color:#273651}
.registerForm input,.registerForm select{width:100%;min-height:44px;padding:11px 12px;border:1px solid #dce3ee;border-radius:12px;background:#fff;outline:none;transition:border-color .16s ease,box-shadow .16s ease}
.registerForm input:focus,.registerForm select:focus{border-color:var(--blue);box-shadow:0 0 0 4px rgba(29,95,209,.08)}
.registerForm .fieldHint{font-size:10px;font-weight:500}
.registerForm .submitArea{padding-top:20px}
main.wrap.panel{margin-top:28px;margin-bottom:58px}
@media(max-width:700px){
  .utilityNav .wrap,.assessmentNav .wrap{gap:10px}
  .utilityActions{gap:7px}
  .utilityActions .btn{min-height:40px;padding:9px 12px;font-size:11px}
  .utilityNav .utilityHomeNav,.assessmentNav .utilityHomeNav{font-size:12px}
  .registerPage{padding-top:24px;padding-bottom:44px}
  .registerIntro{margin-bottom:16px}
  .registerIntro h1{font-size:34px}
  .roleCard{padding:20px}
  .registerForm{margin-top:16px;padding:18px}
  .formSection{padding:19px 0}
}
@media(max-width:560px){
  .utilityNav .brand strong,.assessmentNav .brand strong{font-size:18px}
  .utilityNav .brand small,.assessmentNav .brand small{display:block;font-size:8px}
  .utilityActions .btn{padding:8px 10px}
  .registerIntro h1{font-size:32px}
  .registerIntro p{font-size:13px}
  .registerPage>.roleCards{gap:12px}
  .roleCard p{min-height:0}
}


/* ---------- v4.14.2 LEARNING OPERATIONS DASHBOARD ---------- */
.opsPage{padding:34px 0 70px}.opsHero{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:22px}.opsHero h1{margin:8px 0 6px;font-size:clamp(30px,4vw,46px)}.opsHero p{margin:0;color:var(--muted)}.opsActions{display:flex;gap:9px;flex-wrap:wrap}.opsStats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}.opsStat{background:#fff;border:1px solid #dfe5ef;border-radius:18px;padding:18px;box-shadow:0 12px 30px rgba(20,35,70,.05)}.opsStat small{display:block;color:#687892;font-weight:800;font-size:11px;text-transform:uppercase;letter-spacing:.05em}.opsStat strong{display:block;font-size:30px;margin-top:5px;color:#142b59}.opsTabs{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 14px}.opsTab{border:1px solid #dfe5ef;background:#fff;border-radius:12px;padding:10px 14px;font-weight:850;cursor:pointer}.opsTab.active{background:#142b59;color:#fff;border-color:#142b59}.opsPanel{display:none;background:#fff;border:1px solid #dfe5ef;border-radius:20px;padding:22px;box-shadow:0 14px 36px rgba(20,35,70,.05)}.opsPanel.active{display:block}.opsPanelHead{display:flex;justify-content:space-between;gap:15px;align-items:flex-start;margin-bottom:17px}.opsPanelHead h2{margin:4px 0}.opsGrid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.opsGrid .full{grid-column:1/-1}.opsGrid label{display:block;font-size:12px;font-weight:850;color:#263653}.opsGrid input,.opsGrid select,.opsGrid textarea{display:block;width:100%;margin-top:7px;border:1px solid #dce3ee;border-radius:11px;padding:11px 12px;font:inherit;background:#fff;color:#172744}.opsGrid textarea{min-height:100px;resize:vertical}.opsList{display:grid;gap:10px}.opsRow{border:1px solid #e1e7f0;border-radius:15px;padding:14px;display:flex;justify-content:space-between;gap:15px;align-items:center}.opsRowMain strong,.opsRowMain span{display:block}.opsRowMain span{font-size:12px;color:#687892;margin-top:4px}.opsPill{display:inline-flex;border-radius:999px;padding:5px 9px;font-size:11px;font-weight:850;background:#eef7f1;color:#23734b}.opsPill.gray{background:#f0f2f5;color:#5d6777}.opsPill.red{background:#fff0f0;color:#a52a2a}.opsTableWrap{overflow:auto;border:1px solid #e1e7f0;border-radius:15px}.opsTable{width:100%;border-collapse:collapse;min-width:720px}.opsTable th,.opsTable td{padding:11px 12px;border-bottom:1px solid #edf0f5;text-align:left;font-size:12px}.opsTable th{background:#f8faff;color:#52627b}.opsTable tr:last-child td{border-bottom:0}.opsNotice{padding:12px 14px;border-radius:12px;background:#f5f8fd;color:#52627b;font-size:12px;margin-bottom:14px}.opsMsg{min-height:20px;margin-top:10px;font-size:12px;font-weight:800}.opsMsg.ok{color:#23734b}.opsMsg.bad{color:#a52a2a}.opsEmpty{padding:24px;text-align:center;color:#718099;border:1px dashed #dce3ee;border-radius:14px}.opsAttendanceTools{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 13px}.opsFooterNote{margin-top:16px;color:#78869c;font-size:11px}@media(max-width:850px){.opsStats{grid-template-columns:1fr 1fr}.opsHero{align-items:flex-start;flex-direction:column}}@media(max-width:650px){.opsStats,.opsGrid{grid-template-columns:1fr}.opsGrid .full{grid-column:auto}.opsPanel{padding:16px}.opsRow{align-items:flex-start;flex-direction:column}.opsActions{width:100%}.opsActions .btn{flex:1}.opsHero h1{font-size:32px}}
/* ---------- v4.14.8 TEACHER RECRUITMENT ---------- */
.recruitPage{padding:34px 0 70px}.recruitHero{max-width:850px;margin-bottom:22px}.recruitHero h1{font-size:clamp(34px,5vw,54px);margin:7px 0}.recruitHero p{color:var(--muted);max-width:720px}.recruitForm{background:#fff;border:1px solid #dfe5ef;border-radius:22px;box-shadow:0 16px 42px rgba(20,35,70,.06);overflow:hidden}.recruitSection{padding:25px;border-bottom:1px solid #edf0f5}.recruitSection:last-child{border-bottom:0}.recruitSection h2{margin:0 0 15px;font-size:21px}.recruitGrid{display:grid;grid-template-columns:1fr 1fr;gap:14px 16px}.recruitGrid label,.otherCompetency{display:block;font-size:12px;font-weight:850;color:#263653}.recruitGrid .full,.recruitSection>.full{grid-column:1/-1}.recruitGrid input,.recruitGrid select,.recruitGrid textarea,.otherCompetency input,.areaRow select{display:block;width:100%;margin-top:7px;border:1px solid #dce3ee;border-radius:11px;padding:11px 12px;background:#fff;color:#172744;font:inherit}.recruitGrid textarea{min-height:105px;resize:vertical}.recruitHint{font-size:11px;color:#718099}.checkGrid{display:grid;gap:12px}.competencyGroup{border:1px solid #e1e7f0;border-radius:15px;padding:14px}.competencyGroup>strong{display:block;margin-bottom:9px}.competencyGroup label{display:inline-flex;align-items:center;gap:7px;width:calc(50% - 8px);margin:5px 0;font-size:12px;font-weight:650}.competencyGroup input{accent-color:#142b59}.otherCompetency{margin-top:13px}.areaHeader{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:18px}.areaRow{display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:8px;align-items:end;margin-top:9px}.areaRow select{margin-top:0}.docNotice{padding:13px 15px;border-radius:13px;background:#f5f8fd;color:#52627b;font-size:11px;margin-bottom:15px}.consent{display:flex;gap:9px;align-items:flex-start;font-size:12px;font-weight:700;margin:17px 0}.consent input{margin-top:2px}.recruitSubmit{margin-top:8px}.recruitMsg{min-height:20px;font-size:12px;font-weight:800}.recruitMsg.ok{color:#23734b}.recruitMsg.bad{color:#a52a2a}.recruitEmpty{padding:16px;border:1px dashed #dce3ee;border-radius:12px;color:#718099}.recruitAdminGrid{display:grid;grid-template-columns:1.35fr .9fr;gap:18px}.recruitDetailGrid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.recruitDetailGrid>div{padding:14px;border:1px solid #e1e7f0;border-radius:14px}.recruitDetailGrid .full{grid-column:1/-1}.recruitTag{display:inline-block;padding:5px 8px;border-radius:999px;background:#f0f4fa;margin:3px;font-size:11px}.recruitAdminGrid .opsPanel{display:block}.rowBtns{display:flex;gap:8px;align-items:center}.danger{border:1px solid #efcaca!important;background:#fff5f5!important;color:#a52a2a!important}@media(max-width:900px){.recruitAdminGrid{grid-template-columns:1fr}.areaRow{grid-template-columns:1fr 1fr}.areaRow select:nth-child(3){grid-column:1/2}.areaRow .removeArea{grid-column:2/3}.recruitDetailGrid{grid-template-columns:1fr}.recruitDetailGrid .full{grid-column:auto}}@media(max-width:650px){.recruitGrid{grid-template-columns:1fr}.recruitGrid .full,.recruitSection>.full{grid-column:auto}.competencyGroup label{width:100%}.areaRow{grid-template-columns:1fr}.areaRow select:nth-child(3),.areaRow .removeArea{grid-column:auto}.recruitSection{padding:19px}.areaHeader{align-items:flex-start;flex-direction:column}}

/* v4.14.10 registration / teacher dashboard polish */
.passwordField{position:relative;display:flex;align-items:center}.passwordField input{padding-right:48px!important}.passwordToggle{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:34px;height:34px;border:0;background:transparent;color:#5c6c85;cursor:pointer;font-size:16px;border-radius:9px}.passwordToggle:hover{background:#eef4ff;color:var(--blue)}
.teacherRoleCard{grid-column:1/-1;max-width:calc(50% - 10px);justify-self:center}.teacherJoinPage{padding:54px 0 80px}.teacherJoinHero{position:relative;overflow:hidden;background:linear-gradient(135deg,#102957,#173d7c);color:#fff;border-radius:30px;padding:54px;box-shadow:0 24px 70px rgba(16,41,87,.18)}.teacherJoinHero:after{content:"";position:absolute;width:300px;height:300px;border-radius:50%;right:-90px;top:-100px;background:rgba(255,193,45,.14)}.teacherJoinHero h1{max-width:780px;font-size:clamp(38px,5vw,62px);line-height:1.02;letter-spacing:-2.6px;margin:12px 0 14px;position:relative;z-index:1}.teacherJoinHero p{max-width:730px;color:#dce8fb;font-size:17px;line-height:1.7;position:relative;z-index:1}.teacherJoinActions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px;position:relative;z-index:1}.teacherJoinActions .btn.light{background:#fff}.teacherJoinGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:18px}.teacherJoinCard{background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px;box-shadow:0 12px 35px rgba(16,35,75,.06)}.joinNo{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:#eef5ff;color:var(--blue);font-weight:900;font-size:12px}.teacherJoinCard h2{margin:16px 0 7px;font-size:20px}.teacherJoinCard p{margin:0;color:var(--muted);font-size:13px;line-height:1.6}.teacherJoinNote{margin-top:16px;padding:16px 18px;border:1px solid #dfe6f1;border-radius:16px;background:#f6f9fd;color:#52627b;font-size:12px}.teacherProfilePage{padding:38px 0 70px}.teacherProfileHero{max-width:820px;margin-bottom:22px}.teacherProfileHero h1{font-size:clamp(34px,5vw,52px);letter-spacing:-2px;margin:8px 0}.teacherProfileHero p{max-width:700px;color:var(--muted);line-height:1.7}.areaItem{margin-top:10px;padding:12px;border:1px solid #e2e8f1;border-radius:16px;background:#fbfcfe}.areaRowActions{display:flex;justify-content:space-between;gap:8px;margin-top:9px}.areaRowActions .btn{font-size:11px}.teacherDash{padding:42px 0 70px}.teacherDashHero{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:20px}.teacherDashHero h1{font-size:clamp(34px,5vw,52px);letter-spacing:-2px;margin:7px 0}.teacherDashHero p{max-width:720px;color:var(--muted);line-height:1.65}.teacherDashAvatar{width:76px;height:76px;border-radius:24px;display:grid;place-items:center;background:#eef5ff;color:var(--blue);font-size:30px;font-weight:900;border:1px solid #dbe5f4}.teacherDashGrid{display:grid;grid-template-columns:1.45fr .75fr;gap:18px}.profileProgress{padding:16px 0 20px}.profileProgress>div:first-child{display:flex;align-items:baseline;gap:8px}.profileProgress strong{font-size:30px}.profileProgress span{color:var(--muted);font-size:12px}.progressTrack{height:9px;background:#edf1f7;border-radius:999px;overflow:hidden;margin-top:8px}.progressTrack i{display:block;height:100%;width:0;background:var(--yellow);border-radius:999px}.teacherSummary{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:4px 0 20px}.teacherSummary>div{padding:13px;border:1px solid #e5eaf2;border-radius:13px}.teacherSummary small,.docItem small{display:block;color:var(--muted);font-size:10px;margin-bottom:4px}.teacherSummary strong{font-size:12px}.teacherQuick{background:#102957;color:#fff}.teacherQuick h2{margin:8px 0}.teacherQuick p{color:#dbe6f7;font-size:13px;line-height:1.6}.quickList{display:grid;gap:10px;margin-top:18px}.quickList div{display:flex;gap:9px;align-items:center;font-size:12px}.quickList b{color:#ffd14b}.teacherVerified{background:#eaf8ef!important;color:#207346!important}.teacherDocuments{margin-top:18px}.docsList{display:grid;gap:8px;margin-bottom:14px}.docItem{display:flex;align-items:center;gap:10px;padding:11px 13px;border:1px solid #e5eaf2;border-radius:13px}.docItem>span{font-size:18px}.docItem>div{flex:1}.docItem strong{display:block;font-size:12px}.docItem em{font-style:normal;color:var(--muted);font-size:10px}.docUploadForm{display:grid;grid-template-columns:190px 1fr auto;gap:9px;align-items:center}.docUploadForm select,.docUploadForm input{min-height:43px;border:1px solid #dce3ee;border-radius:11px;padding:10px 11px;background:#fff}.docUploadForm span{grid-column:1/-1;font-size:11px;color:#4d6384}@media(max-width:900px){.teacherDashGrid,.teacherJoinGrid{grid-template-columns:1fr}.teacherRoleCard{grid-column:auto;max-width:none}.teacherJoinHero{padding:34px 25px}.teacherSummary{grid-template-columns:1fr}.docUploadForm{grid-template-columns:1fr}.docUploadForm button{width:100%}}@media(max-width:650px){.teacherDashHero{align-items:flex-start}.teacherDashAvatar{width:58px;height:58px;border-radius:18px;font-size:22px}.teacherProfilePage,.teacherDash,.teacherJoinPage{padding-top:25px}.teacherJoinHero h1{font-size:38px}.teacherJoinActions .btn{width:100%}.areaRowActions{flex-direction:column}.areaRowActions .btn{width:100%}}


/* v4.14.12 — Global UI/UX refinement */
:root{--ui-shadow:0 18px 48px rgba(16,35,75,.08);--ui-radius:22px}
.nav,.utilityNav{box-shadow:0 1px 0 rgba(16,35,75,.03)}
.globalPublicNav .mobileNavPanel{right:0;top:calc(100% + 8px);width:min(340px,calc(100vw - 24px));padding:12px;border-radius:20px;box-shadow:0 22px 60px rgba(16,35,75,.18)}
.globalPublicNav .mobileNavPanel .mobileNavSource{gap:4px}.globalPublicNav .mobileNavPanel a,.globalPublicNav .mobileNavPanel summary{min-height:44px;display:flex;align-items:center}.globalPublicNav .mobileNavPanel .dropdownMenu a{display:block;min-height:0}.globalPublicNav .mobileNavLogin{margin-top:10px;padding:13px 12px;border-top:1px solid var(--line)}
@media(max-width:700px){.wrap{padding-left:16px;padding-right:16px}.nav{height:68px}.brand strong{font-size:18px}.brand small{font-size:8px}.globalPublicNav .navbtns .primary{padding:10px 11px;font-size:10px}.globalPublicNav .mobileNav>summary{width:42px;height:42px}.utilityNav .wrap{padding-left:16px;padding-right:16px}.utilityActions .utilityHomeNav{display:none}.utilityActions .btn{min-height:40px;padding:9px 12px;font-size:11px}.dashboardNav .wrap{padding-left:16px;padding-right:16px}.dashboardNavRight .btn{min-height:40px;padding:9px 12px}.dashboardWelcome{padding:22px 18px;border-radius:20px}.dashboardWelcome .welcomeProfile{min-width:0}.dashboardWelcome .welcomeProfile strong{max-width:120px}.dashboard .sectionCard{padding:19px}.accountProfileCardV13{grid-template-columns:1fr!important;align-items:start!important}.accountProfileMetaV13{grid-template-columns:1fr 1fr}.accountPhotoActionsV13{flex-wrap:wrap}.addChildPanel{padding:14px}.childFormCard{scroll-margin-top:82px}}
@media(max-width:430px){.globalPublicNav .navbtns .primary{font-size:9px;padding:9px 10px}.globalPublicNav .mobileNavPanel{right:-2px}.accountProfileMetaV13{grid-template-columns:1fr}.dashboardWelcome .welcomeProfile{width:100%}}

/* All profile forms: make answer fields visibly sit beneath each question. */
.recruitGrid label,.formSection label,.childFormCard label,.profileForm label,.dashboardForm label{display:flex;flex-direction:column;align-items:stretch;gap:7px}
.recruitGrid label>input,.recruitGrid label>select,.recruitGrid label>textarea,.formSection label>input,.formSection label>select,.formSection label>textarea,.childFormCard label>input,.childFormCard label>select,.childFormCard label>textarea{margin-top:0;width:100%;min-height:46px}
.recruitGrid label>textarea{min-height:112px}.fieldHint{display:block;color:var(--muted);font-size:10px;font-weight:600;line-height:1.45}.addressHint{margin-top:1px}

/* Registration / account choice premium layout */
.registerPage{padding-top:54px;padding-bottom:90px}.registerIntro{text-align:center;max-width:720px;margin:0 auto 30px}.registerIntro h1{font-size:clamp(38px,5vw,58px);letter-spacing:-2.2px;line-height:1.04;margin:10px 0}.registerIntro p{font-size:14px;color:var(--muted);margin:0 auto;max-width:590px}.roleCards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:1040px;margin:0 auto}.roleCard{position:relative;min-height:300px;text-align:left;padding:25px;border:1px solid #dfe6f0;border-radius:24px;background:linear-gradient(180deg,#fff 0%,#fbfcff 100%);box-shadow:0 14px 38px rgba(16,35,75,.07);cursor:pointer;transition:.2s ease;display:flex;flex-direction:column;align-items:flex-start}.roleCard:hover{transform:translateY(-5px);border-color:#c9d8ee;box-shadow:0 22px 50px rgba(16,35,75,.11)}.roleIcon{width:52px;height:52px;border-radius:17px;display:grid;place-items:center;background:#edf4ff;font-size:25px;margin-bottom:18px}.roleCard .tag{margin-bottom:9px}.roleCard h2{margin:0;font-size:22px;letter-spacing:-.7px}.roleCard p{font-size:12px;color:var(--muted);line-height:1.65;max-width:260px}.roleAction{margin-top:auto;display:flex;align-items:center;justify-content:space-between;width:100%;padding-top:18px;color:var(--blue);font-size:12px;font-weight:900}.roleAction b{font-size:20px}.teacherRoleCard{grid-column:auto;max-width:none;justify-self:stretch}.registerForm{max-width:860px;margin:0 auto;background:#fff;border:1px solid #dfe6f0;border-radius:24px;box-shadow:var(--ui-shadow);padding:26px}.registerTopbar{display:flex;align-items:flex-start;justify-content:space-between;gap:15px;padding-bottom:20px;border-bottom:1px solid #edf0f5}.registerTopbar h2{margin:7px 0 3px;font-size:28px}.registerTopbar p{margin:0;color:var(--muted);font-size:12px}.formSection{padding:22px 0}.formSection+.formSection{border-top:1px solid #edf0f5}.formSection .grid2{gap:16px}.formSection label{font-size:12px;font-weight:850;color:#263653}.formSection input{border:1px solid #d7e0ec;border-radius:13px;background:#fff;padding:13px 14px;outline:none;box-shadow:inset 0 1px 0 rgba(16,35,75,.02)}.formSection input:focus{border-color:#8eb0df;box-shadow:0 0 0 4px rgba(29,95,209,.08)}.passwordField{position:relative;width:100%}.passwordField input{padding-right:50px}.passwordToggle{position:absolute;right:7px;top:7px;width:36px;height:36px;border:0;border-radius:10px;background:#f2f5fa;color:#52627b;cursor:pointer}.submitArea{padding-top:10px}.submitArea .submitBtn{min-height:50px}.submitArea p{font-size:10px;color:var(--muted)}
@media(max-width:800px){.registerPage{padding-top:30px}.roleCards{grid-template-columns:1fr}.roleCard{min-height:225px}.registerForm{padding:19px;border-radius:20px}.registerTopbar{align-items:stretch;flex-direction:column}.backBtn{align-self:flex-start}.formSection .grid2{grid-template-columns:1fr}}

/* Teacher recruitment premium */
.teacherJoinPage{padding-top:42px}.teacherJoinHero{min-height:440px;padding:48px;display:grid;grid-template-columns:minmax(0,1fr) 260px;align-items:center;gap:35px;border-radius:30px}.teacherJoinHero p{max-width:650px}.teacherJoinHeroSide{position:relative;z-index:2;align-self:stretch;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:24px;border-radius:24px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(8px)}.heroSideIcon{width:94px;height:94px;border-radius:30px;display:grid;place-items:center;background:#fff;color:#102957;font-size:45px;box-shadow:0 18px 40px rgba(0,0,0,.12);margin-bottom:18px}.teacherJoinHeroSide strong{font-size:18px}.teacherJoinHeroSide span{font-size:11px;color:#d8e5fa;margin-top:6px;line-height:1.5}.teacherSecondaryCta{color:var(--navy)!important;font-weight:900!important}.teacherJoinGrid{margin-top:22px}.teacherJoinCard{min-height:190px}.teacherJoinNote{box-shadow:0 8px 25px rgba(16,35,75,.04)}
@media(max-width:800px){.teacherJoinHero{grid-template-columns:1fr;padding:28px 22px;min-height:0}.teacherJoinHeroSide{display:none}.teacherJoinHero h1{font-size:40px}.teacherJoinHero p{font-size:14px}.teacherJoinGrid{grid-template-columns:1fr}.teacherJoinCard{min-height:0}}

/* Teacher profile / area actions */
.teacherProfilePage{max-width:1100px}.teacherProfilePage .recruitForm{box-shadow:0 18px 50px rgba(16,35,75,.07)}.teacherProfilePage .recruitSection{padding:28px 30px}.teacherProfilePage .recruitSection h2{font-size:23px}.areaItem{padding:14px 15px}.areaRowActions{justify-content:flex-start!important;align-items:center;gap:8px!important}.areaRowActions .btn{width:auto!important;min-width:110px}.areaRowActions .addAreaHere{margin-left:0}.areaRowActions .removeArea{order:0}.areaRowActions .addAreaHere{order:1}.areaRow{grid-template-columns:repeat(3,1fr)}
@media(max-width:650px){.teacherProfilePage .recruitSection{padding:20px 17px}.areaRow{grid-template-columns:1fr}.areaRowActions{flex-direction:row!important;flex-wrap:wrap}.areaRowActions .btn{flex:0 0 auto!important;width:auto!important}.areaRowActions .addAreaHere{margin-left:0}}

/* Teacher dashboard premium */
.teacherDash{padding-top:32px}.teacherDashHero{padding:28px 30px;border-radius:26px;background:linear-gradient(135deg,#102957 0%,#1c478d 100%);color:#fff;box-shadow:0 22px 55px rgba(16,35,75,.14);position:relative;overflow:hidden}.teacherDashHero:after{content:"";position:absolute;width:280px;height:280px;right:-90px;top:-140px;border-radius:50%;background:rgba(255,193,45,.14)}.teacherDashHero h1{color:#fff}.teacherDashHero p{color:#d9e4f6}.teacherDashHero .sectionEyebrow{background:rgba(255,255,255,.12);color:#ffe08a}.teacherDashPhoto{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:7px;min-width:110px}.teacherDashAvatar{width:100px;height:100px;border-radius:30px;background:#fff;color:var(--blue);font-size:34px;box-shadow:0 14px 30px rgba(0,0,0,.14);overflow:hidden}.teacherDashAvatar img{width:100%;height:100%;object-fit:cover}.teacherPhotoBtn,.teacherPhotoRemove{font-size:10px;font-weight:900;padding:7px 10px;border-radius:9px;cursor:pointer;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.1);color:#fff}.teacherPhotoRemove{background:rgba(255,255,255,.16)}.teacherPhotoMsg{font-size:9px;color:#dce7f8;text-align:center;min-height:15px}.teacherDashGrid{margin-top:18px}.teacherProfileStatus,.teacherQuick,.teacherDocuments{box-shadow:0 12px 35px rgba(16,35,75,.06)}.teacherQuick{border:0!important}.teacherDocuments{padding:26px 30px}.docsList{grid-template-columns:repeat(2,1fr)}
@media(max-width:700px){.teacherDashHero{padding:24px 19px;align-items:center}.teacherDashHero h1{font-size:31px}.teacherDashHero p{font-size:12px}.teacherDashPhoto{min-width:80px}.teacherDashAvatar{width:70px;height:70px;border-radius:22px;font-size:25px}.docsList{grid-template-columns:1fr}}

/* Assessment answer circles */
.questionOptions label{grid-template-columns:26px 32px minmax(0,1fr);min-height:50px}.questionOptions input{position:absolute;opacity:0;pointer-events:none}.questionOptions .optionLetter{width:30px;height:30px;border-radius:50%;background:#f0f4f9;border:1.5px solid #cfd8e6;color:#52627b;transition:.15s ease}.questionOptions label:has(input:checked){border-color:#7da3da;background:#f5f9ff;box-shadow:0 0 0 3px rgba(29,95,209,.07)}.questionOptions label:has(input:checked) .optionLetter{background:var(--blue);border-color:var(--blue);color:#fff}.questionOptions label:hover .optionLetter{border-color:#91acd0}.questionOptions label>span:last-child{line-height:1.5}
@media(max-width:520px){.questionOptions label{grid-template-columns:26px 30px minmax(0,1fr);padding:11px 10px}.questionOptions .optionLetter{width:28px;height:28px}}

/* Child form focus and answer boxes */
#addChildForm{scroll-margin-top:84px}.childFormCard{border:1px solid #dce5f1!important;border-radius:22px!important;background:#fff!important;box-shadow:0 16px 40px rgba(16,35,75,.07)!important}.childFormCard label{font-size:12px;font-weight:850;color:#263653}.childFormCard input,.childFormCard select,.childFormCard textarea{border:1px solid #d7e0ec;border-radius:13px;background:#fff;padding:12px 13px;outline:none}.childFormCard input:focus,.childFormCard select:focus{border-color:#8eb0df;box-shadow:0 0 0 4px rgba(29,95,209,.08)}
/* v4.14.12 teacher profile/dashboard improvements */
.profileEditNotice{margin-top:14px;padding:12px 15px;border:1px solid #f1df9b;border-radius:13px;background:#fff9e6;color:#715a13;font-size:11px;font-weight:750}.teacherStatusTimeline{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:8px 0 20px}.statusStep{padding:12px 9px;border:1px solid #e4e9f1;border-radius:13px;background:#fafbfd;min-height:72px}.statusStep>span{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#e8edf5;color:#71809a;font-size:10px;font-weight:900;margin-bottom:7px}.statusStep strong,.statusStep small{display:block}.statusStep strong{font-size:10px}.statusStep small{font-size:8px;color:var(--muted);line-height:1.35;margin-top:2px}.statusStep.done{border-color:#cfe8d9;background:#f6fcf8}.statusStep.done>span{background:#22a66f;color:#fff}.statusStep.active{box-shadow:0 0 0 2px rgba(255,193,45,.18);border-color:#f1c54e}.statusRejected{padding:12px 14px;border:1px solid #f2c8ce;background:#fff6f7;border-radius:13px;color:#9d3947}.statusRejected strong,.statusRejected span{display:block}.statusRejected strong{font-size:11px}.statusRejected span{font-size:10px;margin-top:3px}.teacherDetailsCard{margin-top:18px}.teacherDetailGrid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.teacherDetailGrid h3{font-size:14px;margin:0 0 10px}.teacherChipList{display:flex;flex-wrap:wrap;gap:7px}.teacherChipList span{padding:7px 10px;border-radius:999px;background:#eef4ff;color:#2458a9;font-size:10px;font-weight:800;border:1px solid #dbe7fa}.teacherAreaList{display:grid;gap:8px}.teacherAreaList>div{padding:10px 12px;border:1px solid #e4e9f1;border-radius:12px;background:#fbfcfe}.teacherAreaList strong,.teacherAreaList small{display:block}.teacherAreaList strong{font-size:11px}.teacherAreaList small{font-size:9px;color:var(--muted);margin-top:2px}.docsChecklist{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:15px}.docCheck{display:flex;align-items:center;gap:8px;padding:10px;border:1px solid #e3e8f0;border-radius:12px;background:#fbfcfe}.docCheck>span{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:900}.docCheck.uploaded{border-color:#cce8d7;background:#f7fcf9}.docCheck.uploaded>span{background:#22a66f;color:#fff}.docCheck.missing>span{background:#edf1f6;color:#8190a6}.docCheck strong,.docCheck small{display:block}.docCheck strong{font-size:9px}.docCheck small{font-size:8px;color:var(--muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.docUploadForm{grid-template-columns:190px 1fr auto}.docUploadForm span{color:#45617f}.teacherDocuments{margin-top:18px}@media(max-width:900px){.teacherStatusTimeline{grid-template-columns:repeat(2,1fr)}.teacherDetailGrid{grid-template-columns:1fr}.docsChecklist{grid-template-columns:repeat(2,1fr)}}@media(max-width:650px){.teacherStatusTimeline{grid-template-columns:1fr}.docsChecklist{grid-template-columns:1fr}.teacherDetailGrid{grid-template-columns:1fr}}

/* v4.14.13 mobile navigation hardening */
@media(max-width:900px){.globalPublicNav .wrap{position:relative}.globalPublicNav .mobileNav{display:block;margin-left:auto}.globalPublicNav .mobileNavPanel{right:0;top:48px;width:min(330px,calc(100vw - 24px));max-height:calc(100vh - 90px);overflow:auto;padding:8px}.globalPublicNav .mobileNavSource{display:grid!important}.globalPublicNav .mobileNavSource>a,.globalPublicNav .mobileNavSource .navDropdown summary{display:block!important;padding:12px}.globalPublicNav .mobileNavSource .dropdownMenu{display:block}.globalPublicNav .navbtns{margin-left:0}.globalPublicNav .navbtns .light{display:none}.learningSelector{background:#fff;border:1px solid var(--line);border-radius:16px;padding:14px;margin:14px 0;display:flex;align-items:center;justify-content:space-between;gap:14px}.learningSelector small{display:block;color:var(--muted);font-weight:800;font-size:10px}.learningSelector strong{display:block;margin-top:2px}.learningChildTabs{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}.learningChildTabs button{border:1px solid var(--line);background:#fff;border-radius:999px;padding:9px 12px;font-weight:800;cursor:pointer}.learningChildTabs button.active{background:var(--navy);color:#fff;border-color:var(--navy)}}@media(max-width:560px){.globalPublicNav .brand strong{font-size:17px}.globalPublicNav .navbtns .primary{padding:10px 12px;font-size:12px}.globalPublicNav .mobileNavPanel{right:-2px}.learningSelector{display:block}.learningChildTabs{justify-content:flex-start;margin-top:10px;overflow-x:auto;flex-wrap:nowrap;padding-bottom:2px}.learningChildTabs button{white-space:nowrap}.globalPublicNav .mobileNav>summary{width:44px;height:44px}}
.teacherOpsStats{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:15px}.teacherOpsStats>div{background:#f7f9fc;border:1px solid var(--line);border-radius:12px;padding:10px;text-align:center}.teacherOpsStats strong{display:block;font-size:20px}.teacherOpsStats small{color:var(--muted);font-size:10px}.teacherSessionList{display:grid;gap:8px}.teacherSessionRow{width:100%;border:1px solid var(--line);background:#fff;border-radius:14px;padding:14px;display:flex;align-items:center;justify-content:space-between;gap:15px;text-align:left;cursor:pointer}.teacherSessionRow:hover,.teacherSessionRow.selected{border-color:var(--blue);box-shadow:0 8px 22px rgba(16,35,75,.08)}.teacherSessionRow span,.teacherSessionRow small{display:block;color:var(--muted);margin-top:3px}.teacherSessionRow b{font-size:10px}.teacherWorkGrid{display:grid;grid-template-columns:1.2fr .8fr;gap:22px}.teacherTeacherAttendance{display:flex;align-items:center;gap:12px;background:#f7f9fc;border:1px solid var(--line);padding:12px;border-radius:14px;margin-bottom:20px}.teacherTeacherAttendance h3{margin:0 auto 0 0}.assessmentRow{display:grid;grid-template-columns:1.5fr .7fr .7fr 1fr auto;gap:8px;align-items:center;padding:9px 0;border-bottom:1px solid var(--line)}.assessmentRow input{width:100%;padding:9px;border:1px solid var(--line);border-radius:9px}.teacherChipList{margin-bottom:14px}.teacherChipList span{display:inline-block;background:#edf3ff;color:#244b93;border-radius:999px;padding:7px 10px;margin:3px;font-size:11px;font-weight:800}.teacherAreaList>div{display:inline-block;background:#f7f9fc;border:1px solid var(--line);border-radius:12px;padding:9px 11px;margin:3px}.teacherAreaList strong,.teacherAreaList small{display:block}.teacherAreaList small{color:var(--muted);font-size:10px}@media(max-width:700px){.teacherOpsStats{grid-template-columns:repeat(2,1fr)}.teacherWorkGrid{grid-template-columns:1fr}.assessmentRow{grid-template-columns:1fr 1fr}.assessmentRow strong{grid-column:1/-1}.assessmentRow .btn{width:100%}.teacherSessionRow{align-items:flex-start}.teacherSessionRow b{white-space:nowrap}}


/* v4.14.13 FINAL MOBILE NAV FIX — panel is anchored to the viewport, never the nav flow */
@media(max-width:900px){
  .globalPublicNav .mobileNavPanel{
    position:fixed !important;
    top:68px !important;
    right:12px !important;
    left:auto !important;
    width:min(340px,calc(100vw - 24px)) !important;
    max-width:calc(100vw - 24px) !important;
    max-height:calc(100vh - 80px) !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
    z-index:1000 !important;
    box-sizing:border-box !important;
  }
  .globalPublicNav .mobileNavPanel .dropdownMenu{
    position:static !important;
    width:auto !important;
    max-width:100% !important;
  }
}
@media(max-width:560px){
  .globalPublicNav .mobileNavPanel{
    top:68px !important;
    right:12px !important;
    width:min(340px,calc(100vw - 24px)) !important;
    max-width:calc(100vw - 24px) !important;
  }
}

/* =========================================================
   AYOLES.ID v4.14.14 — Dashboard Premium UI/UX
   Yellow-first brand system, blue as supporting accent.
   ========================================================= */
.dashboardPage{--dash-yellow:#ffbd18;--dash-yellow-soft:#fff7dc;--dash-yellow-pale:#fffaf0;--dash-blue:#1d5fd1;--dash-navy:#10234b;--dash-border:#e6eaf1}
.dashboardPage .btn.primary{background:linear-gradient(135deg,#ffbd18,#ffd45d);color:#17233d;box-shadow:0 7px 18px rgba(255,189,24,.22);transition:transform .18s ease,box-shadow .18s ease,filter .18s ease}
.dashboardPage .btn.primary:hover{transform:translateY(-2px);box-shadow:0 11px 24px rgba(255,189,24,.3);filter:saturate(1.05)}
.dashboardPage .btn.light{transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease}
.dashboardPage .btn.light:hover{transform:translateY(-2px);border-color:#f1c54e;background:#fffaf0;box-shadow:0 8px 18px rgba(16,35,75,.07)}
.dashboardPage .sectionCard,.dashboardPage .dashboardWelcome,.dashboardPage .statCard,.dashboardPage .learningProgram,.dashboardPage .learningItem,.dashboardPage .childCard,.dashboardPage .programMini,.dashboardPage .activityItem{transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
.dashboardPage .sectionCard:hover{box-shadow:0 16px 38px rgba(16,35,75,.08)}
.dashboardPage .learningOverviewCard{border:1px solid #eadfb9;background:linear-gradient(145deg,#fffdf7 0%,#fff 44%,#f8fbff 100%);position:relative;overflow:hidden}
.dashboardPage .learningOverviewCard:before{content:"";position:absolute;left:0;top:0;width:7px;height:100%;background:linear-gradient(180deg,#ffbd18,#ffd969);opacity:.95}
.dashboardPage .learningOverviewCard>.sectionCardHead{padding-bottom:18px;border-bottom:1px solid #eee7d1}
.dashboardPage .learningOverviewCard .sectionEyebrow{background:#fff2bf;color:#805d00}
.dashboardPage .learningOverviewCard .activeBadge{background:#fff3c9;color:#8a6500;border:1px solid #f2d67c}
.dashboardPage .learningSelector{margin:18px 0 12px;padding:13px 15px;border:1px solid #ecdca8;background:#fffdf6;border-radius:17px;display:flex;align-items:center;justify-content:space-between;gap:15px}
.dashboardPage .learningSelector>div:first-child{display:flex;align-items:center;gap:10px}.dashboardPage .learningSelector>div:first-child:before{content:"👨‍👩‍👧";width:34px;height:34px;border-radius:11px;background:#fff0b5;display:grid;place-items:center;font-size:16px}
.dashboardPage .learningSelector small{font-size:8px;color:#9a7411;font-weight:900;letter-spacing:.7px}.dashboardPage .learningSelector strong{font-size:13px}
.dashboardPage .learningChildTabs{display:flex;gap:7px;flex-wrap:wrap;justify-content:flex-end}.dashboardPage .learningChildTabs button{border:1px solid #e1e6ee;background:#fff;border-radius:999px;padding:8px 12px;font-size:10px;font-weight:850;color:#40516c;cursor:pointer;transition:.18s ease}.dashboardPage .learningChildTabs button:hover{transform:translateY(-1px);border-color:#e9c54e;background:#fff9e7}.dashboardPage .learningChildTabs button.active{background:#ffbd18;color:#17233d;border-color:#ffbd18;box-shadow:0 6px 15px rgba(255,189,24,.2)}
.dashboardPage .learningStatsGrid{gap:11px;margin:14px 0 20px}.dashboardPage .learningStat{min-height:76px;border:1px solid #e5e8ee;border-radius:16px;background:#fff;box-shadow:0 5px 16px rgba(16,35,75,.035);position:relative;overflow:hidden}.dashboardPage .learningStat:after{content:"";position:absolute;left:0;bottom:0;width:100%;height:3px;background:#ffbd18;transform:scaleX(.25);transform-origin:left;transition:transform .25s ease}.dashboardPage .learningStat:hover{transform:translateY(-3px);border-color:#efd176;box-shadow:0 12px 25px rgba(16,35,75,.08)}.dashboardPage .learningStat:hover:after{transform:scaleX(1)}.dashboardPage .learningStat>span{background:#fff4c9;color:#7b5a00}.dashboardPage .learningStat strong{font-size:21px;color:#182b4f}.dashboardPage .learningStat small{font-size:8px;font-weight:800}
.dashboardPage .learningProgram{grid-template-columns:48px minmax(0,1fr) 100px auto;padding:15px;border:1px solid #e3e7ee;border-radius:17px;box-shadow:0 5px 16px rgba(16,35,75,.035)}.dashboardPage .learningProgram:hover{transform:translateY(-3px);border-color:#efcf68;box-shadow:0 14px 30px rgba(16,35,75,.09)}.dashboardPage .learningProgramIcon{width:48px;height:48px;border-radius:15px;background:#fff2bd;box-shadow:inset 0 0 0 1px #f4dc87}.dashboardPage .learningProgramMain strong{font-size:13px}.dashboardPage .learningProgramMain span{font-size:9px}.dashboardPage .learningProgress{height:7px;border-radius:999px;background:#edf0f4;overflow:hidden;margin-top:9px}.dashboardPage .learningProgress span{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#ffbd18,#ffd85d);transition:width .6s ease}.dashboardPage .learningProgressText{display:block;color:#7a8494;font-size:8px;margin-top:4px}.dashboardPage .learningQuota b{color:#1d5fd1}.dashboardPage .statusPill{background:#fff5d2;color:#826000;border:1px solid #f1db91}
.dashboardPage .learningColumns{gap:20px}.dashboardPage .learningColumns>div{padding:15px;border:1px solid #e5e8ee;border-radius:17px;background:rgba(255,255,255,.78)}.dashboardPage .learningSubHeading{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:900;margin:0 0 12px;color:#182b4f}.dashboardPage .learningSubHeading:before{content:"";width:6px;height:18px;border-radius:99px;background:#ffbd18}.dashboardPage .learningItem{border-color:#e7eaf0}.dashboardPage .learningItem:hover{transform:translateX(3px);border-color:#cfdcf2;box-shadow:0 8px 20px rgba(16,35,75,.06)}.dashboardPage .learningItemIcon{background:#f0f5ff;color:#1d5fd1}
.dashboardPage .childrenCard,.dashboardPage .dashboardPrograms,.dashboardPage .activityCard,.dashboardPage .historyCard{border-color:#e3e7ee}.dashboardPage .childrenCard .sectionEyebrow,.dashboardPage .dashboardPrograms .sectionEyebrow,.dashboardPage .activityCard .sectionEyebrow,.dashboardPage .historyCard .sectionEyebrow{background:#fff4c9;color:#866100}

/* Parent child cards */
.dashboardPage .childCard{border:1px solid #e1e6ed;background:linear-gradient(135deg,#fff 0%,#fffdf7 100%)}.dashboardPage .childCard:hover{transform:translateY(-3px);border-color:#e8c85e;box-shadow:0 14px 28px rgba(16,35,75,.08)}.dashboardPage .childAvatar{background:#fff0b5;color:#765500}.dashboardPage .childScore strong{color:#1d5fd1}.dashboardPage .addChildPanel{border:1px dashed #e4c95f;background:#fffaf0;transition:.18s ease}.dashboardPage .addChildPanel:hover{transform:translateY(-2px);background:#fff5d7;border-color:#ffbd18}

/* Student learning identity */
.dashboardPage .studentProfileHero{border:1px solid #e8dfbf;background:linear-gradient(135deg,#fff9e5,#fff 55%,#f5f9ff);overflow:hidden;position:relative}.dashboardPage .studentProfileHero:after{content:"✦";position:absolute;right:28px;top:18px;font-size:55px;color:#ffbd18;opacity:.22;transition:transform .3s ease}.dashboardPage .studentProfileHero:hover:after{transform:rotate(12deg) scale(1.08)}.dashboardPage .studentHeroAvatar{background:#fff0b5;color:#765500;box-shadow:0 8px 20px rgba(255,189,24,.16)}.dashboardPage .studentTags span{border-color:#f0d57e!important;background:#fff7dd!important;color:#806000!important}

/* Teacher dashboard: operational workspace */
.teacherDash{padding-bottom:70px}.teacherDash .teacherDashHero{background:linear-gradient(135deg,#fff8df 0%,#fff 58%,#f4f8ff 100%);color:var(--dash-navy);border:1px solid #ecdca9;box-shadow:0 18px 48px rgba(16,35,75,.08)}.teacherDash .teacherDashHero:after{background:rgba(255,189,24,.22)}.teacherDash .teacherDashHero h1{color:#10234b}.teacherDash .teacherDashHero p{color:#647189}.teacherDash .teacherDashHero .sectionEyebrow{background:#fff0b5;color:#7b5a00}.teacherDash .teacherDashAvatar{border:4px solid #fff2bd;box-shadow:0 12px 25px rgba(16,35,75,.1)}
.teacherDash .teacherProfileStatus,.teacherDash .teacherQuick,.teacherDash .teacherSessions,.teacherDash .teacherWorkspace,.teacherDash .teacherDocuments{border-color:#e2e6ed;box-shadow:0 12px 32px rgba(16,35,75,.055)}.teacherDash .teacherProfileStatus:hover,.teacherDash .teacherQuick:hover,.teacherDash .teacherSessions:hover,.teacherDash .teacherWorkspace:hover,.teacherDash .teacherDocuments:hover{border-color:#e9cf72}
.teacherDash .teacherQuick{background:#10234b;color:#fff;border:0!important;position:relative;overflow:hidden}.teacherDash .teacherQuick:before{content:"";position:absolute;left:-50px;bottom:-70px;width:190px;height:190px;border-radius:50%;background:rgba(255,189,24,.12)}.teacherDash .teacherQuick .sectionEyebrow{background:#fff0b5;color:#765500}.teacherDash .teacherQuick h2{position:relative;font-size:26px}.teacherDash .teacherQuick p{position:relative;color:#dbe4f4}.teacherDash .teacherOpsStats{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.teacherDash .teacherOpStat{min-height:105px;background:#fff;border:1px solid rgba(255,255,255,.55);border-radius:15px;padding:11px 8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;transition:.2s ease}.teacherDash .teacherOpStat:hover{transform:translateY(-4px);border-color:#ffbd18;box-shadow:0 12px 22px rgba(0,0,0,.12)}.teacherDash .teacherOpStat>span{width:34px;height:34px;border-radius:11px;background:#fff0b5;color:#765500;display:grid;place-items:center;font-size:15px}.teacherDash .teacherOpStat strong,.teacherDash .teacherOpStat small{display:block;text-align:center}.teacherDash .teacherOpStat strong{font-size:21px;color:#10234b}.teacherDash .teacherOpStat small{font-size:8px;color:#66748c;line-height:1.3}
.teacherDash .teacherSessions .sectionEyebrow,.teacherDash .teacherWorkspace .sectionEyebrow,.teacherDash .teacherDocuments .sectionEyebrow{background:#fff4c9;color:#806000}.teacherDash .teacherSessionList{gap:11px}.teacherDash .teacherSessionRow{border:1px solid #e1e6ee;border-radius:17px;padding:16px;background:#fff;box-shadow:0 4px 14px rgba(16,35,75,.025);position:relative;overflow:hidden}.teacherDash .teacherSessionRow:before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:#ffbd18;opacity:.65}.teacherDash .teacherSessionRow:hover,.teacherDash .teacherSessionRow.selected{transform:translateY(-2px);border-color:#e4c75f;box-shadow:0 13px 28px rgba(16,35,75,.09);background:#fffdf6}.teacherDash .teacherSessionRow b{padding:6px 9px;border-radius:999px;background:#fff4c9;color:#7a5a00}.teacherDash .teacherSessionRow span{color:#365f9f;font-weight:800}
.teacherDash .teacherWorkspace{margin-top:18px;border-top:5px solid #ffbd18;background:linear-gradient(180deg,#fffdf7,#fff 30%)}.teacherDash .teacherTeacherAttendance{background:#fff8df;border:1px solid #efdb91}.teacherDash .teacherTeacherAttendance h3{font-size:13px}.teacherDash .teacherWorkGrid{gap:18px}.teacherDash .teacherWorkGrid>div,.teacherDash .teacherAssessmentPanel{border:1px solid #e4e8ee;border-radius:17px;padding:17px;background:#fff}.teacherDash .teacherWorkGrid>div>h3,.teacherDash .teacherAssessmentPanel>h3{display:flex;align-items:center;gap:8px;margin:0 0 13px;font-size:14px;color:#182b4f}.teacherDash .teacherWorkGrid>div>h3:before,.teacherDash .teacherAssessmentPanel>h3:before{content:"";width:6px;height:18px;border-radius:99px;background:#ffbd18}.teacherDash .opsAttendanceTools{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}.teacherDash .opsAttendanceTools .btn.dark{background:#10234b}.teacherDash .opsTableWrap{border:1px solid #e5e8ee;border-radius:13px;overflow:auto}.teacherDash .opsTable th{background:#fff8df;color:#6e570f}.teacherDash .opsTable tr:hover td{background:#fffdf7}.teacherDash .assessmentRow{padding:12px 0}.teacherDash .assessmentRow input:focus{border-color:#e8c75c;box-shadow:0 0 0 3px rgba(255,189,24,.14);outline:none}.teacherDash .docUploadForm{background:#fffaf0;border:1px dashed #e5ca67;padding:12px;border-radius:13px}.teacherDash .opsList{margin-top:10px}

/* Teacher document center */
.teacherDash .teacherDocuments{margin-top:18px}.teacherDash .teacherProfileBlocks{display:grid;grid-template-columns:.9fr 1.5fr;gap:20px}.teacherDash .teacherProfileBlocks>div{border:1px solid #e5e8ee;border-radius:17px;padding:17px;background:#fff}.teacherDash .teacherBlockTitle{margin:0 0 10px;font-size:14px;color:#182b4f}.teacherDash .teacherDocsBlock{background:linear-gradient(135deg,#fffdf7,#fff)}.teacherDash .teacherDocsBlockHead{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:12px}.teacherDash .teacherDocsBlockHead small{color:#788398;font-size:9px}.teacherDash .docsProgressBadge{display:inline-flex;align-items:center;padding:7px 10px;border-radius:999px;background:#fff0b5;color:#785800;font-size:9px;font-weight:900;white-space:nowrap}.teacherDash .teacherDocsGrid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.teacherDash .teacherDocCard{display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:9px;padding:11px;border:1px solid #e2e6ed;border-radius:14px;background:#fff;transition:.2s ease}.teacherDash .teacherDocCard:hover{transform:translateY(-2px);border-color:#e5c65b;box-shadow:0 9px 20px rgba(16,35,75,.07)}.teacherDash .teacherDocCard.isUploaded{border-color:#d7eadf;background:#fbfffc}.teacherDash .teacherDocCard.isMissing{background:#fffdf8}.teacherDash .teacherDocIcon{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:#fff1bd;font-size:17px}.teacherDash .teacherDocInfo strong,.teacherDash .teacherDocInfo small,.teacherDash .teacherDocInfo span{display:block}.teacherDash .teacherDocInfo strong{font-size:10px}.teacherDash .teacherDocInfo small{font-size:8px;color:#738097;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}.teacherDash .teacherDocStatus{font-size:8px;font-weight:900;color:#8b6500;margin-top:4px}.teacherDash .isUploaded .teacherDocStatus{color:#16845b}.teacherDash .teacherDocUpload{font-size:8px!important;padding:7px 9px!important;min-height:32px!important}.teacherDash .teacherDocMsg{min-height:18px;margin-top:8px;color:#16845b;font-size:9px;font-weight:800}

/* Profile edit actions and document manager */
.teacherProfilePage .profileFormActions{display:flex;align-items:center;gap:9px;flex-wrap:wrap}.teacherProfilePage .profileFormActions .recruitSubmit{margin:0}.teacherProfilePage .teacherProfileDocumentsSection{margin-top:0;border-top:1px solid #edf0f5}.teacherProfilePage .teacherProfileDocumentsSection .sectionCardHead{display:flex;align-items:flex-start;justify-content:space-between}.teacherProfilePage .docsProgressBadge{display:inline-flex;padding:7px 10px;border-radius:999px;background:#fff0b5;color:#785800;font-size:9px;font-weight:900}.teacherProfilePage .teacherDocsGrid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.teacherProfilePage .teacherDocCard{display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:9px;padding:11px;border:1px solid #e2e6ed;border-radius:14px;background:#fff;transition:.2s ease}.teacherProfilePage .teacherDocCard:hover{transform:translateY(-2px);border-color:#e5c65b;box-shadow:0 9px 20px rgba(16,35,75,.07)}.teacherProfilePage .teacherDocCard.isUploaded{border-color:#d7eadf;background:#fbfffc}.teacherProfilePage .teacherDocCard.isMissing{background:#fffdf8}.teacherProfilePage .teacherDocIcon{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:#fff1bd;font-size:17px}.teacherProfilePage .teacherDocInfo strong,.teacherProfilePage .teacherDocInfo small,.teacherProfilePage .teacherDocInfo span{display:block}.teacherProfilePage .teacherDocInfo strong{font-size:10px}.teacherProfilePage .teacherDocInfo small{font-size:8px;color:#738097;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}.teacherProfilePage .teacherDocStatus{font-size:8px;font-weight:900;color:#8b6500;margin-top:4px}.teacherProfilePage .isUploaded .teacherDocStatus{color:#16845b}.teacherProfilePage .teacherDocUpload{font-size:8px!important;padding:7px 9px!important;min-height:32px!important}.teacherProfilePage .teacherDocMsg{min-height:18px;margin-top:8px;color:#16845b;font-size:9px;font-weight:800}

@media(max-width:900px){.dashboardPage .learningSelector{align-items:flex-start;flex-direction:column}.dashboardPage .learningChildTabs{justify-content:flex-start}.teacherDash .teacherOpsStats{grid-template-columns:repeat(3,1fr)}.teacherDash .teacherProfileBlocks{grid-template-columns:1fr}.teacherDash .teacherDocsGrid,.teacherProfilePage .teacherDocsGrid{grid-template-columns:1fr}}
@media(max-width:650px){.dashboardPage .learningProgram{grid-template-columns:42px minmax(0,1fr)}.dashboardPage .learningProgram .learningQuota,.dashboardPage .learningProgram .statusPill{grid-column:2;text-align:left}.dashboardPage .learningColumns>div{padding:13px}.teacherDash .teacherOpsStats{grid-template-columns:repeat(2,1fr)}.teacherDash .teacherOpStat{min-height:90px}.teacherDash .teacherDocCard,.teacherProfilePage .teacherDocCard{grid-template-columns:34px minmax(0,1fr)}.teacherDash .teacherDocUpload,.teacherProfilePage .teacherDocUpload{grid-column:2;justify-self:start}.teacherDash .teacherDocIcon,.teacherProfilePage .teacherDocIcon{width:34px;height:34px}.teacherDash .teacherDocsBlockHead,.teacherProfilePage .teacherProfileDocumentsSection .sectionCardHead{display:block}.teacherDash .docsProgressBadge,.teacherProfilePage .docsProgressBadge{margin-top:8px}.teacherProfilePage .profileFormActions{display:grid;grid-template-columns:1fr}.teacherProfilePage .profileFormActions .btn{width:100%}}