:root{--ink:#0a1b36;--navy:#071b3b;--blue:#176bff;--blue-2:#4c91ff;--soft:#f3f7fc;--line:#dce5f0;--muted:#637089;--green:#12a875;--purple:#7958e8;--orange:#f28a35}
html,body{margin:0;padding:0}body{font-family:'Manrope',sans-serif;color:var(--ink);overflow-x:clip}body>main{overflow-x:clip}.section-shell,.nav-shell{width:min(1180px,calc(100% - 40px));margin-inline:auto}.section-pad{padding:112px 0}.site-nav{height:68px;margin:0;background:rgba(6,20,44,.97);color:white;position:relative;z-index:1000}.nav-shell{height:100%;display:flex;align-items:center}.brand{display:flex;align-items:center;gap:10px;font-size:21px;font-weight:800;letter-spacing:-.04em;color:inherit}.brand:hover{color:inherit}.brand-mark{width:32px;height:32px;border-radius:9px;background:var(--blue);display:grid;place-items:center;color:#fff;font-size:18px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.2)}.nav-menu{display:flex;align-items:center;gap:5px;margin-left:64px}.nav-link,.nav-trigger{font:600 13px 'Manrope',sans-serif;color:#b8c4d8;padding:23px 13px;background:none;border:0;cursor:pointer;display:inline-flex;align-items:center;gap:5px}.nav-link:hover,.nav-trigger:hover{color:#fff}
/* BUG-UI-001: dulu ikon dropdown memakai glyph teks "⌄" yang duduk jauh di atas
   baseline sehingga tampak tidak sejajar dengan tulisannya. Sekarang SVG chevron
   yang di-center oleh flexbox induknya — sejajar di semua ukuran font. */
.nav-trigger .nav-caret{display:inline-flex;align-items:center;margin:0;flex:none}.nav-trigger .nav-caret svg{display:block;width:11px;height:11px}.nav-group{position:relative}.mega-menu{position:absolute;top:60px;left:-120px;width:720px;background:white;color:var(--ink);border:1px solid var(--line);border-radius:16px;padding:25px;display:grid;grid-template-columns:repeat(3,1fr);gap:24px;box-shadow:0 25px 65px rgba(1,16,39,.22);opacity:0;visibility:hidden;transform:translateY(8px);transition:.2s}.nav-group:hover .mega-menu,.nav-group.open .mega-menu{opacity:1;visibility:visible;transform:none}.mega-menu small{display:block;font-size:10px;color:#8a96aa;font-weight:800;letter-spacing:.1em;margin:0 0 12px 7px}.mega-menu a{display:flex;align-items:center;gap:10px;padding:9px 7px;border-radius:9px;color:var(--ink)}.mega-menu a:hover{background:#f5f8fc}.mega-menu a span{display:flex;flex-direction:column}.mega-menu strong{font-size:12px}.mega-menu em{font-style:normal;font-size:10px;color:#7a879b}.product-dot{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;color:white;font-size:11px;flex:0 0 auto}.product-dot.core{background:var(--blue)}.product-dot.edu{background:var(--purple)}.product-dot.parent{background:var(--green)}.product-dot.office{background:#0d9eba}.product-dot.identity{background:var(--orange)}.product-dot.all{background:var(--ink)}.nav-actions{display:flex;align-items:center;gap:18px;margin-left:auto}.login-link{font-size:13px;font-weight:600;color:#c3cede}.nav-cta,.section-cta{background:var(--blue);color:#fff;border-radius:8px;padding:10px 16px;font-size:12px;font-weight:700}.nav-cta:hover,.section-cta:hover{background:#4085ff;color:#fff}.nav-cta span{padding-left:6px}.menu-toggle{display:none;background:none;border:0;padding:8px}.menu-toggle span{display:block;width:22px;height:2px;background:#fff;margin:5px}
.hero{position:relative;background:var(--navy);color:#fff;min-height:760px;overflow:hidden}.hero-shell{width:min(1260px,calc(100% - 40px));min-height:650px;margin:auto;display:grid;grid-template-columns:46% 54%;align-items:center;position:relative;z-index:2}.hero-grid,.final-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(90,140,210,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(90,140,210,.06) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(to right,#000,transparent 85%)}.hero-glow{position:absolute;border-radius:50%;filter:blur(10px)}.glow-one{width:600px;height:600px;background:rgba(23,107,255,.12);right:-80px;top:-180px}.glow-two{width:350px;height:350px;background:rgba(66,141,255,.08);left:22%;bottom:-200px}.hero-copy{padding-left:40px}.announcement{display:inline-flex;align-items:center;gap:9px;border:1px solid rgba(125,164,222,.28);border-radius:30px;padding:6px 12px 6px 7px;color:#aebed6;font-size:11px;margin-bottom:30px;background:rgba(255,255,255,.035)}.announcement span{font-size:9px;font-weight:800;letter-spacing:.07em;background:var(--blue);color:white;border-radius:20px;padding:4px 7px}.announcement b{color:#fff}.eyebrow,.section-kicker{font-size:10px;font-weight:800;letter-spacing:.17em;color:var(--blue);margin:0 0 20px}.hero h1{color:white;font-size:clamp(45px,4.3vw,67px);letter-spacing:-.055em;line-height:1.04;margin-bottom:25px}.hero h1 span,.section-heading h2 span,.split-heading h2 span,.faq-shell h2 span,.impact-card h2 span{color:#7aaaff}.hero-lead{color:#aab8cc;font-size:16px;line-height:1.75;max-width:600px}.hero-actions{display:flex;gap:12px;margin-top:31px}.button{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:14px 20px;border-radius:9px;font-size:13px;font-weight:700}.button-primary{background:var(--blue);color:white;box-shadow:0 10px 30px rgba(23,107,255,.25)}.button-primary:hover{background:#4085ff;color:white;transform:translateY(-1px)}.button-ghost{border:1px solid rgba(255,255,255,.18);color:white;background:rgba(255,255,255,.03)}.button-ghost:hover{background:rgba(255,255,255,.09);color:#fff}.play{font-size:9px;width:22px;height:22px;display:grid;place-items:center;border:1px solid rgba(255,255,255,.3);border-radius:50%}.hero-proof{display:flex;gap:20px;margin-top:25px;color:#8494aa;font-size:10px}.hero-proof b{color:#5b92e8}.hero-visual{position:relative;padding-left:35px;transform:perspective(1200px) rotateY(-3deg)}.dashboard-frame{width:660px;background:#fff;border:7px solid #172e50;border-radius:16px;box-shadow:0 40px 80px rgba(0,0,0,.35);overflow:hidden}.window-bar{height:31px;background:#edf2f8;display:flex;align-items:center;gap:5px;padding:0 10px}.window-bar i{width:7px;height:7px;border-radius:50%;background:#b9c4d2}.window-bar i:first-child{background:#ff746b}.window-bar i:nth-child(2){background:#ffc75a}.window-bar i:nth-child(3){background:#46cc7d}.window-bar span{margin:auto;background:#fff;border-radius:4px;color:#8b97a8;font-size:7px;padding:4px 70px}.dashboard-body{display:grid;grid-template-columns:134px 1fr;height:405px;color:var(--ink)}.dash-sidebar{background:#f7f9fc;border-right:1px solid #e8edf4;padding:16px 11px}.mini-brand{display:flex;gap:6px;align-items:center;font-size:10px;margin-bottom:18px}.mini-brand b{width:18px;height:18px;background:var(--blue);border-radius:5px;color:#fff;display:grid;place-items:center}.school-chip{display:flex;align-items:center;gap:6px;background:#fff;border:1px solid #e5ebf2;border-radius:5px;padding:7px 5px}.school-chip>span{background:#dce8ff;color:var(--blue);font-size:7px;font-weight:800;width:22px;height:22px;border-radius:4px;display:grid;place-items:center}.school-chip div{display:flex;flex-direction:column}.school-chip b{font-size:6px}.school-chip small{font-size:5px;color:#8b96a6}.dash-sidebar ul{margin-top:16px}.dash-sidebar li{font-size:7px;color:#728096;padding:8px;border-radius:5px;display:flex;gap:8px}.dash-sidebar li.active{background:#e7efff;color:var(--blue);font-weight:700}.dash-main{padding:18px 20px;background:#fbfcfe}.dash-head{display:flex;justify-content:space-between;align-items:center}.dash-head small{font-size:6px;color:#8894a5}.dash-head h3{font-size:13px;margin-top:2px}.avatar{width:25px;height:25px;background:#dce8ff;color:var(--blue);border-radius:50%;display:grid;place-items:center;font-size:7px;font-weight:800}.metric-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:16px 0}.metric-grid>div{background:white;border:1px solid #e9edf3;border-radius:7px;padding:10px;display:grid;grid-template-columns:25px 1fr;column-gap:7px}.metric-icon{width:25px;height:25px;border-radius:6px;display:grid;place-items:center;grid-row:span 2;font-size:9px}.metric-icon.blue{background:#e5efff;color:var(--blue)}.metric-icon.purple{background:#eeeaff;color:var(--purple)}.metric-icon.green{background:#e1f7ef;color:var(--green)}.metric-grid small{font-size:6px;color:#8490a0}.metric-grid strong{font-size:14px}.metric-grid i{grid-column:2;font-size:5px;color:#56a783}.chart-card{background:#fff;border:1px solid #e9edf3;border-radius:8px;padding:13px}.chart-title{display:flex;justify-content:space-between}.chart-title div{display:flex;flex-direction:column}.chart-title b{font-size:8px}.chart-title small{font-size:5px;color:#8a96a6}.chart-title button{border:1px solid #dfe6ef;background:#fff;border-radius:4px;font-size:5px;padding:3px 6px}.chart{height:130px;position:relative;margin-top:8px}.chart svg{position:absolute;inset:0;width:100%;height:100%}.chart .area{fill:url(#area)}.chart .line{fill:none;stroke:var(--blue);stroke-width:2.5}.grid-line{position:absolute;left:0;right:0;border-top:1px dashed #e8edf3}.grid-line.l1{top:25%}.grid-line.l2{top:50%}.grid-line.l3{top:75%}.days{display:flex;justify-content:space-around;color:#97a1af;font-size:5px}.float-card{position:absolute;z-index:4;background:#fff;color:var(--ink);box-shadow:0 15px 35px rgba(2,13,33,.22);border-radius:10px;padding:11px 13px;display:flex;align-items:center;gap:9px;transform:rotateY(3deg)}.float-card div{display:flex;flex-direction:column}.float-card small{font-size:7px;color:#8490a0}.float-card strong{font-size:11px}.float-card i{font-size:7px;color:var(--green);font-style:normal}.float-icon{width:28px;height:28px;border-radius:7px;display:grid;place-items:center;font-size:8px;font-weight:800}.float-icon.green{background:#def6ed;color:var(--green)}.float-icon.orange{background:#fff0e4;color:var(--orange)}.float-attendance{top:67px;right:-22px}.float-payment{bottom:35px;left:2px}.hero-stats{position:relative;z-index:3;min-height:110px;border-top:1px solid rgba(132,165,214,.16);display:grid;grid-template-columns:repeat(4,1fr);width:min(1180px,calc(100% - 40px));margin:auto}.hero-stats>div{padding:25px 40px;border-right:1px solid rgba(132,165,214,.16);display:flex;flex-direction:column}.hero-stats>div:last-child{border:0}.hero-stats strong{font-size:25px;color:#fff;letter-spacing:-.04em}.hero-stats small{font-size:9px;color:#798ba5;margin-top:4px}.section-nav{position:sticky;top:0;z-index:900;height:52px;margin:0;background:rgba(255,255,255,.95);backdrop-filter:blur(15px);border-bottom:1px solid var(--line)}.section-nav>div{width:min(1180px,calc(100% - 40px));height:100%;margin:auto;display:flex;align-items:center}.section-brand{font-weight:800;color:var(--ink);font-size:14px}.section-links{display:flex;margin:auto;gap:30px}.section-links a{font-size:10px;font-weight:700;color:#738096}.section-links a:hover{color:var(--blue)}.section-cta{padding:7px 13px}
.section-heading h2,.split-heading h2,.faq-shell h2{font-size:clamp(34px,4vw,51px);letter-spacing:-.05em;line-height:1.13;margin-bottom:20px}.section-heading.centered{text-align:center;max-width:770px;margin:0 auto}.section-heading p{font-size:15px;line-height:1.8;max-width:590px;margin:0 auto}.intro{background:#fff}.ecosystem-map{width:min(800px,100%);height:480px;margin:50px auto 0;position:relative}.orbit{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);border:1px dashed #b9cae1;border-radius:50%}.orbit-one{width:380px;height:240px}.orbit-two{width:700px;height:420px}.ecosystem-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:160px;height:160px;border-radius:50%;background:var(--navy);box-shadow:0 22px 50px rgba(6,27,60,.22);display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;z-index:2}.ecosystem-center>span{width:41px;height:41px;border-radius:11px;display:grid;place-items:center;background:var(--blue);font-size:22px;font-weight:800}.ecosystem-center strong{font-size:18px;margin-top:8px}.ecosystem-center small{font-size:7px;color:#8ea2bd;letter-spacing:.1em}.orbit-card{position:absolute;background:#fff;border:1px solid var(--line);border-radius:12px;padding:13px 16px;display:flex;align-items:center;gap:11px;box-shadow:0 12px 35px rgba(14,37,72,.09);color:var(--ink);min-width:165px}.orbit-card>b{width:34px;height:34px;display:grid;place-items:center;border-radius:9px;color:#fff;font-size:12px}.orbit-card div{display:flex;flex-direction:column}.orbit-card strong{font-size:11px}.orbit-card span{font-size:8px;color:#8490a1}.card-core{left:7%;top:13%}.card-core>b{background:var(--blue)}.card-edu{right:4%;top:9%}.card-edu>b{background:var(--purple)}.card-parent{right:-1%;bottom:14%}.card-parent>b{background:var(--green)}.card-office{left:0;bottom:13%}.card-office>b{background:#0d9eba}.card-id{left:50%;transform:translateX(-50%);bottom:-4%}.card-id>b{background:var(--orange)}.products{background:var(--soft)}.split-heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:45px}.split-heading h2{margin:0}.split-heading>a{font-size:11px;font-weight:700;color:var(--blue);padding-bottom:10px}.product-tabs{display:flex;border-bottom:1px solid #d7e0eb;gap:5px}.product-tabs button{flex:1;border:0;background:transparent;padding:14px 7px;font:700 11px 'Manrope';color:#8490a2;border-bottom:2px solid transparent;cursor:pointer}.product-tabs button.active{color:var(--blue);border-bottom-color:var(--blue)}.product-panel{display:none;grid-template-columns:40% 60%;min-height:480px;background:#fff;border-radius:0 0 16px 16px;overflow:hidden}.product-panel.active{display:grid}.panel-copy{padding:55px 50px}.panel-icon{display:grid;place-items:center;width:42px;height:42px;color:#fff;border-radius:10px;font-size:13px;font-weight:800;margin-bottom:27px}.panel-icon.core{background:var(--blue)}.panel-icon.edu{background:var(--purple)}.panel-icon.parent{background:var(--green)}.panel-icon.office{background:#0d9eba}.panel-icon.identity{background:var(--orange)}.panel-copy>small{font-size:8px;font-weight:800;letter-spacing:.13em;color:#8793a5}.panel-copy h3{font-size:30px;letter-spacing:-.04em;margin:10px 0 16px}.panel-copy p{font-size:12px;line-height:1.75}.panel-copy ul{margin:22px 0}.panel-copy li{font-size:11px;margin:11px 0;padding-left:22px;position:relative}.panel-copy li:before{content:'✓';position:absolute;left:0;color:var(--blue);font-weight:800}.panel-copy>a{font-size:11px;font-weight:800}.panel-visual{position:relative;display:grid;place-items:center;padding:55px;background:#e9f1ff}.data-card{width:88%;background:#fff;border-radius:12px;box-shadow:0 25px 60px rgba(26,75,145,.18);padding:24px}.data-head{display:flex;justify-content:space-between;font-size:10px}.data-head span{background:var(--blue);color:#fff;border-radius:5px;padding:6px 9px;font-size:7px}.search-bar{border:1px solid #e1e7ef;border-radius:5px;padding:8px;color:#a4adba;font-size:7px;margin:15px 0}.student-row{display:grid;grid-template-columns:1.5fr .7fr .4fr;align-items:center;border-top:1px solid #edf0f4;padding:10px 0;font-size:7px}.student-row.header{color:#9aa4b2;font-size:6px}.student-row>span:first-child{display:flex;align-items:center;gap:8px}.student-row i{width:25px;height:25px;border-radius:50%;background:#e5efff;color:var(--blue);display:grid;place-items:center;font-style:normal;font-weight:800}.student-row b{display:flex;flex-direction:column}.student-row small{font-size:5px;color:#9aa5b4}.student-row em{font-style:normal;color:var(--green);background:#e4f7f0;border-radius:20px;padding:4px;text-align:center}.edu-visual{background:#eeeaff}.learning-card,.finance-card{width:75%;background:#fff;border-radius:15px;padding:35px;box-shadow:0 24px 55px rgba(76,54,146,.17)}.learning-card>span,.finance-card>small{font-size:7px;letter-spacing:.13em;color:#8d97a7;font-weight:800}.learning-card h4{margin-top:8px}.progress-ring{width:130px;height:130px;margin:24px auto;border-radius:50%;background:conic-gradient(var(--purple) 78%,#eeeaf8 0);display:grid;place-items:center;position:relative}.progress-ring:after{content:'';position:absolute;width:98px;height:98px;background:#fff;border-radius:50%}.progress-ring b{z-index:1;font-size:24px;color:var(--purple)}.progress-list i{display:flex;justify-content:space-between;font-style:normal;font-size:8px;padding:9px 0;border-bottom:4px solid #ececf2;position:relative}.progress-list i:after{content:'';position:absolute;bottom:-4px;left:0;width:var(--w);height:4px;background:var(--purple)}.parent-visual{background:#e6f7f1}.phone{width:235px;border:8px solid #173043;border-radius:28px;background:#fff;padding:30px 18px;box-shadow:0 25px 55px rgba(27,92,70,.18);position:relative}.phone-top{position:absolute;top:7px;left:50%;transform:translateX(-50%);width:55px;height:5px;background:#172c3c;border-radius:5px}.phone>small{font-size:8px;color:#8290a2}.phone h4{font-size:17px;margin:3px 0 20px}.notice{background:#f3f6f9;border-radius:8px;padding:12px;font-size:8px;margin:10px 0}.notice.success{background:#e7f8f2;color:#18835e}.score{border:1px solid #e5ebf1;border-radius:9px;padding:14px;display:grid;grid-template-columns:1fr auto}.score span{font-size:7px;color:#8290a2}.score b{font-size:20px}.score i{color:var(--green);font-size:7px;font-style:normal}.office-visual{background:#e5f5f8}.finance-card{color:var(--ink)}.finance-card strong{display:block;font-size:25px;margin-top:12px}.finance-card>span{font-size:8px;color:#8793a5}.bars{height:170px;display:flex;align-items:end;gap:13px;border-bottom:1px solid #dce5ed;margin-top:25px}.bars i{height:var(--h);flex:1;background:linear-gradient(#16a4c1,#bde8ef);border-radius:5px 5px 0 0}.id-visual{background:#fff1e6}.smart-card{width:330px;height:205px;border-radius:18px;padding:25px;background:linear-gradient(145deg,#0b2345,#144c86);box-shadow:0 30px 55px rgba(39,47,71,.3);color:#fff;display:flex;flex-direction:column;transform:rotate(-5deg)}.card-logo{display:flex;align-items:center;gap:6px;font-weight:800}.card-logo b{background:var(--blue);width:23px;height:23px;display:grid;place-items:center;border-radius:5px}.chip{width:37px;height:27px;border-radius:5px;background:linear-gradient(135deg,#f5ca63,#b98524);margin:32px 0 18px}.smart-card strong{font-size:12px;letter-spacing:.08em}.smart-card small{color:#99acc3;font-size:7px}.smart-card>span{align-self:flex-end;font-size:7px}.tap-wave{font-size:24px;color:var(--orange);position:absolute;right:80px;top:80px;transform:rotate(-25deg)}
.workflow{background:var(--navy);color:#fff}.workflow h2{color:#fff}.section-kicker.light{color:#70a5fb}.steps{display:grid;grid-template-columns:repeat(3,1fr);margin-top:70px}.steps article{padding:25px 55px;border-right:1px solid rgba(143,171,210,.18);position:relative}.steps article:last-child{border:0}.steps article>span{position:absolute;right:28px;top:10px;color:rgba(255,255,255,.08);font-size:50px;font-weight:800}.step-icon{width:51px;height:51px;border:1px solid rgba(105,159,242,.45);border-radius:12px;background:rgba(31,103,214,.12);display:grid;place-items:center;color:#7aaaff;font-size:21px}.steps h3{color:white;font-size:18px;margin:22px 0 10px}.steps p{color:#8193ad;font-size:11px;line-height:1.7}.roles{background:#fff}.role-grid{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:15px;overflow:hidden}.role-grid article{min-height:320px;padding:33px 27px;border-right:1px solid var(--line);position:relative;transition:.25s}.role-grid article:last-child{border:0}.role-grid article:hover{background:var(--navy);transform:translateY(-5px)}.role-grid article:hover h3,.role-grid article:hover a{color:#fff}.role-grid article:hover p{color:#8ea0b8}.role-num{position:absolute;right:23px;color:#bcc7d4;font-size:9px;font-weight:800}.role-icon{width:45px;height:45px;border-radius:11px;background:#e7efff;color:var(--blue);display:grid;place-items:center;font-size:19px;margin-top:28px}.role-grid h3{font-size:17px;margin:25px 0 12px}.role-grid p{font-size:10px;line-height:1.75;min-height:75px}.role-grid a{font-size:9px;font-weight:800}.impact{background:var(--soft)}.impact-card{background:linear-gradient(125deg,#0a2450,#0c376e);border-radius:20px;padding:70px;display:grid;grid-template-columns:1.2fr 1fr;gap:70px;color:#fff;position:relative;overflow:hidden}.impact-card:after{content:'';position:absolute;width:330px;height:330px;border:80px solid rgba(47,125,242,.1);border-radius:50%;right:-170px;top:-170px}.impact-card h2{color:#fff;font-size:40px;letter-spacing:-.05em}.impact-card p{color:#9aabc1;font-size:12px;line-height:1.8;max-width:480px}.button-white{background:#fff;color:var(--ink);margin-top:15px}.impact-numbers{display:grid;grid-template-columns:1fr 1fr;position:relative;z-index:1}.impact-numbers>div{padding:22px;border-left:1px solid rgba(255,255,255,.14);border-bottom:1px solid rgba(255,255,255,.14);display:flex;flex-direction:column}.impact-numbers>div:nth-child(n+3){border-bottom:0}.impact-numbers strong{font-size:34px;color:#fff}.impact-numbers span{font-size:9px;color:#8fa2bc;line-height:1.5}.faq-section{background:#fff}.faq-shell{display:grid;grid-template-columns:38% 62%;gap:80px}.faq-shell>div:first-child{padding-top:15px}.faq-shell h2{font-size:39px}.faq-shell>div:first-child p{font-size:11px;margin-top:30px}.faq-shell>div:first-child a{font-size:10px;font-weight:800}.accordion-item{border-bottom:1px solid var(--line)}.accordion-header{padding:22px 0;font:700 13px 'Manrope',sans-serif}.accordion-header span{width:25px;height:25px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;color:var(--blue)}.accordion-body{font-size:11px;line-height:1.8;padding-right:45px}.final-cta{position:relative;background:var(--navy);padding:95px 0;text-align:center;color:#fff;overflow:hidden}.final-cta .section-shell{position:relative}.final-cta h2{font-size:45px;color:#fff;letter-spacing:-.05em;margin-bottom:17px}.final-cta p{color:#91a2ba;font-size:13px}.final-cta .button{margin:15px 5px 0}.button-dark-ghost{border:1px solid rgba(255,255,255,.22);color:#fff}.button-dark-ghost:hover{color:#fff;background:rgba(255,255,255,.08)}.site-footer{background:#06152e;color:#fff;margin:0;padding:70px 0 25px;border-top:1px solid rgba(255,255,255,.08)}.footer-top{display:grid;grid-template-columns:2fr repeat(4,1fr);gap:50px}.footer-brand p{font-size:10px;color:#7588a3;line-height:1.7;max-width:260px;margin:20px 0}.socials{display:flex;gap:8px}.socials a{width:29px;height:29px;border:1px solid #29405e;border-radius:6px;display:grid;place-items:center;color:#8fa1ba;font-size:8px}.footer-top h4{color:#fff;font-size:10px;margin-bottom:18px}.footer-top>div:not(:first-child){display:flex;flex-direction:column}.footer-top>div:not(:first-child) a{color:#788aa4;font-size:9px;margin:6px 0}.footer-top a:hover{color:#fff}.footer-bottom{border-top:1px solid rgba(255,255,255,.08);margin-top:55px;padding-top:22px;display:flex;justify-content:space-between}.footer-bottom p,.footer-bottom span{font-size:8px;color:#586b85;margin:0}
@media(max-width:1100px){.nav-menu{margin-left:25px}.nav-link,.nav-trigger{padding-inline:8px}.hero-shell{grid-template-columns:1fr;padding:80px 0}.hero-copy{padding:0;max-width:700px}.hero-visual{margin:60px auto 0}.hero-stats{margin-top:0}.dashboard-frame{max-width:100%}.role-grid{grid-template-columns:1fr 1fr}.role-grid article:nth-child(2){border-right:0}.role-grid article:nth-child(-n+2){border-bottom:1px solid var(--line)}.footer-top{grid-template-columns:2fr repeat(2,1fr)}.footer-top>div:nth-child(4){grid-column:2}.section-pad{padding:90px 0}}
@media(max-width:760px){.section-shell,.nav-shell{width:min(100% - 28px,1180px)}.site-nav{height:60px;position:sticky;top:0}.menu-toggle{display:block;margin-left:auto}.nav-actions .login-link{display:none}.nav-cta{margin-left:10px;padding:8px 11px}.nav-menu{display:none;position:absolute;top:60px;left:0;right:0;margin:0;background:var(--navy);padding:10px 20px 25px;flex-direction:column;align-items:stretch;border-top:1px solid #253a57}.nav-menu.open{display:flex}.nav-link,.nav-trigger{text-align:left;padding:11px;width:100%}.mega-menu{position:static;width:100%;grid-template-columns:1fr;padding:14px;margin-top:4px;display:none;opacity:1;visibility:visible;transform:none}.nav-group.open .mega-menu{display:grid}.hero{min-height:auto}.hero-shell{width:min(100% - 28px,1260px);padding:70px 0 50px}.hero-copy{text-align:center}.hero h1{font-size:43px}.hero-lead{font-size:14px}.hero-actions,.hero-proof{justify-content:center}.hero-visual{padding:0;margin-top:55px;width:100%;transform:none}.dashboard-frame{width:650px;transform:scale(.78);transform-origin:left top;margin-bottom:-90px}.float-card{display:none}.hero-stats{grid-template-columns:1fr 1fr;width:100%;padding:0 14px}.hero-stats>div{padding:20px;border-bottom:1px solid rgba(132,165,214,.16)}.hero-stats>div:nth-child(2){border-right:0}.section-nav{display:none}.section-pad{padding:72px 0}.section-heading h2,.split-heading h2{font-size:36px}.ecosystem-map{height:auto;display:grid;grid-template-columns:1fr;gap:10px;margin-top:40px}.orbit,.ecosystem-center{display:none}.orbit-card{position:static!important;transform:none!important}.split-heading{display:block}.split-heading>a{display:inline-block;margin-top:20px}.product-tabs{overflow:auto}.product-tabs button{min-width:105px}.product-panel.active{grid-template-columns:1fr}.panel-copy{padding:38px 27px}.panel-visual{min-height:370px;padding:30px 15px}.data-card{width:100%}.steps{grid-template-columns:1fr;margin-top:35px}.steps article{border-right:0;border-bottom:1px solid rgba(143,171,210,.18);padding:30px 20px}.role-grid{grid-template-columns:1fr}.role-grid article{border-right:0!important;border-bottom:1px solid var(--line)!important}.impact-card{grid-template-columns:1fr;padding:45px 25px;gap:35px}.impact-card h2{font-size:34px}.faq-shell{grid-template-columns:1fr;gap:30px}.final-cta h2{font-size:36px}.footer-top{grid-template-columns:1fr 1fr;gap:38px}.footer-brand{grid-column:1/-1}.footer-top>div:nth-child(4){grid-column:auto}.footer-bottom{display:block}.footer-bottom span{display:block;margin-top:10px}}
@media(max-width:480px){.hero-actions{flex-direction:column}.hero-proof{flex-wrap:wrap;gap:8px 13px}.dashboard-frame{transform:scale(.55);margin-bottom:-180px}.hero-stats strong{font-size:21px}.hero-stats>div{padding:18px 10px}.learning-card,.finance-card{width:100%;padding:25px}.smart-card{width:285px;height:180px}.impact-numbers{grid-template-columns:1fr}.impact-numbers>div{border-left:0;border-bottom:1px solid rgba(255,255,255,.14)!important}.footer-top{grid-template-columns:1fr}.footer-brand{grid-column:auto}.final-cta .button{display:flex}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.fade-in-up{opacity:1;transform:none;transition:none}}

/* ASIS Analytics */
.product-dot.analytics,.panel-icon.analytics{background:#d14b8f}.card-analytics{left:50%;transform:translateX(-50%);top:-4%}.card-analytics>b{background:#d14b8f}.analytics-visual{background:#f8eaf2}.analytics-card{width:82%;background:#fff;border-radius:15px;padding:30px;box-shadow:0 24px 55px rgba(115,35,79,.15)}.analytics-head{display:flex;align-items:center;justify-content:space-between}.analytics-head>span{display:flex;flex-direction:column}.analytics-head small{font-size:6px;font-weight:800;letter-spacing:.12em;color:#9b7b8d}.analytics-head strong{font-size:17px;margin-top:4px}.analytics-head em{font-size:6px;font-style:normal;font-weight:800;color:#a42f6c;background:#f9dfed;border-radius:20px;padding:6px 8px}.analytics-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:22px 0}.analytics-metrics span{border:1px solid #eedde6;border-radius:8px;padding:12px;display:flex;flex-direction:column}.analytics-metrics small{font-size:6px;color:#917888}.analytics-metrics b{font-size:17px}.analytics-metrics i{font-size:6px;font-style:normal;color:var(--green)}.analytics-chart{height:145px;display:flex;align-items:end;gap:11px;border-bottom:1px solid #ead9e2}.analytics-chart i{height:var(--h);flex:1;background:linear-gradient(#d14b8f,#f3bfd9);border-radius:5px 5px 0 0}.analytics-note{display:flex;align-items:center;gap:10px;background:#fff2e9;border-radius:8px;padding:11px 13px;margin-top:15px}.analytics-note>b{width:24px;height:24px;border-radius:7px;display:grid;place-items:center;background:#ffe0c8;color:#c96821}.analytics-note>span{display:flex;flex-direction:column}.analytics-note strong{font-size:8px}.analytics-note small{font-size:6px;color:#887a83}
@media(max-width:760px){.analytics-card{width:100%;padding:22px}.analytics-metrics{grid-template-columns:1fr}.analytics-chart{height:110px}}

/* Compact homepage summary */
.seo-content{background:#fff;border-top:1px solid var(--line)}
.seo-intro{display:grid;grid-template-columns:1fr 1fr;gap:90px;align-items:start}
.seo-intro h2{font-size:clamp(31px,3.2vw,44px);line-height:1.16;letter-spacing:-.05em}
.seo-summary{border-left:2px solid var(--blue);padding-left:30px}
.seo-summary p{font-size:12px;line-height:1.85}.seo-summary strong{color:var(--ink)}
.seo-links{margin-top:75px;padding:30px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:30px}
.seo-links>div{display:flex;flex-direction:column}.seo-links strong{font-size:12px}.seo-links>div span{font-size:8px;color:var(--muted);margin-top:3px}
.seo-links nav{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.seo-links a{border:1px solid var(--line);border-radius:7px;padding:8px 11px;font-size:8px;font-weight:700;color:#5d6d83}.seo-links a:hover{border-color:var(--blue);color:var(--blue)}
@media(max-width:760px){.seo-intro{grid-template-columns:1fr;gap:30px}.seo-summary{padding-left:20px}.seo-links{display:block}.seo-links nav{justify-content:flex-start;margin-top:20px}}
@media(max-width:480px){.seo-links a{width:100%;text-align:center}}

/* Secondary homepage navigation state */
.section-links a{position:relative}
.section-links a:hover,.section-links a.active{color:var(--blue)}
.section-links a.active:after{content:'';position:absolute;left:0;right:0;bottom:-17px;height:2px;background:var(--blue);border-radius:2px}
section[id],header[id]{scroll-margin-top:68px}

/* Education coverage */
.education{background:#fff;border-top:1px solid var(--line)}.education-head{display:grid;grid-template-columns:1.1fr .9fr;gap:100px;align-items:end;margin-bottom:55px}.education-head h2{font-size:clamp(35px,4vw,51px);letter-spacing:-.05em;line-height:1.13}.education-head h2 span{color:#7aaaff}.education-head>p{font-size:12px;line-height:1.85}.education-grid{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid var(--line);border-radius:16px;overflow:hidden}.education-grid article{min-height:230px;padding:30px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);position:relative}.education-grid article:nth-child(3n){border-right:0}.education-grid article:nth-child(n+7){border-bottom:0}.education-grid article>b{width:40px;height:40px;border-radius:10px;background:#e8f0ff;color:var(--blue);display:grid;place-items:center;font-size:10px}.education-grid h3{font-size:17px;margin:23px 0 10px}.education-grid p{font-size:9px;line-height:1.75}.education-grid article>span{position:absolute;right:25px;top:32px;font-size:7px;font-weight:800;color:var(--green);background:#e5f7f0;padding:5px 8px;border-radius:20px}.education-grid .education-coming{background:var(--navy);color:#fff}.education-grid .education-coming h3{color:#fff}.education-grid .education-coming p{color:#8ea0b8}.education-grid .education-coming>b{background:rgba(23,107,255,.2);color:#75a7ff}.education-grid .education-coming>span{background:rgba(242,138,53,.15);color:#ffac64}.education-note{display:grid;grid-template-columns:190px 1fr auto;gap:30px;align-items:center;background:#eff5ff;border:1px solid #dce8fa;border-radius:12px;padding:24px 28px;margin-top:20px}.education-note strong{font-size:12px}.education-note>span{font-size:9px;color:var(--muted);line-height:1.7}.education-note a{font-size:9px;font-weight:800}

/* Government dashboard */
.government{background:#edf4ff}.government-layout{display:grid;grid-template-columns:.85fr 1.15fr;gap:80px;align-items:center}.government-copy h2{font-size:clamp(35px,4vw,50px);letter-spacing:-.05em;line-height:1.13;margin-bottom:22px}.government-copy>p{font-size:12px;line-height:1.85}.government-copy ul{margin:25px 0}.government-copy li{font-size:10px;margin:11px 0;padding-left:22px;position:relative}.government-copy li:before{content:'✓';position:absolute;left:0;color:var(--blue);font-weight:800}.government-dashboard{background:#fff;border:7px solid #153057;border-radius:16px;padding:22px;box-shadow:0 28px 65px rgba(21,65,123,.2)}.gov-top{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);padding-bottom:15px}.gov-top>span{font-size:10px;font-weight:800;display:flex;align-items:center;gap:7px}.gov-top b{width:23px;height:23px;background:var(--blue);color:#fff;border-radius:6px;display:grid;place-items:center}.gov-top small{font-size:7px;color:#718097}.gov-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:17px 0}.gov-metrics>div{padding:13px;border:1px solid var(--line);border-radius:8px;display:flex;flex-direction:column}.gov-metrics small{font-size:6px;color:#8190a4}.gov-metrics strong{font-size:19px;margin:3px 0}.gov-metrics i{font-size:5px;color:var(--green);font-style:normal}.gov-content{display:grid;grid-template-columns:1.2fr .8fr;gap:10px}.gov-map,.gov-alerts{height:230px;border:1px solid var(--line);border-radius:9px;padding:15px}.gov-map{position:relative;background:linear-gradient(135deg,#f4f8fd,#e6effa);overflow:hidden}.gov-map:before,.gov-map:after{content:'';position:absolute;border:1px solid #c8d8ea;border-radius:45% 55% 60% 40%;transform:rotate(-15deg)}.gov-map:before{width:210px;height:140px;left:15px;top:55px}.gov-map:after{width:130px;height:90px;right:-20px;bottom:-15px}.gov-map>div{font-size:7px;font-weight:800;position:relative;z-index:2}.gov-map>div small{display:block;color:#8998aa;font-size:5px;margin-top:3px}.map-dot{position:absolute;width:8px;height:8px;border:2px solid #fff;border-radius:50%;background:var(--blue);box-shadow:0 2px 8px rgba(23,107,255,.5);z-index:3}.d1{left:34%;top:45%}.d2{left:57%;top:60%}.d3{left:70%;top:37%}.d4{left:43%;top:75%}.gov-alerts>b{font-size:8px}.gov-alerts>span{display:grid;grid-template-columns:8px 1fr;column-gap:6px;margin:16px 0}.gov-alerts i{width:6px;height:6px;border-radius:50%;margin-top:3px}.gov-alerts i.red{background:#e85f5f}.gov-alerts i.orange{background:var(--orange)}.gov-alerts i.green{background:var(--green)}.gov-alerts em{font-style:normal;font-size:7px;font-weight:800}.gov-alerts small{grid-column:2;font-size:5px;color:#8a97a8}.mockup-note{font-size:6px!important;text-align:right;margin:8px 0 -10px;color:#98a4b3!important}

/* Free, Premium and gifting */
.premium-section{background:var(--navy);color:#fff}.premium-head{text-align:center;max-width:800px;margin:0 auto 55px}.premium-head h2{font-size:clamp(35px,4vw,50px);letter-spacing:-.05em;line-height:1.13;color:#fff}.premium-head h2 span{color:#7aaaff}.premium-head p{font-size:12px;color:#91a3bc;line-height:1.85;max-width:680px;margin:20px auto}.premium-plans{display:grid;grid-template-columns:1fr 1fr;gap:20px;max-width:940px;margin:auto}.premium-plans article{border-radius:16px;padding:42px;position:relative}.free-plan{border:1px solid #294567;background:#0b2449}.premium-plan{background:#fff;color:var(--ink);box-shadow:0 28px 65px rgba(0,0,0,.24)}.plan-ribbon{position:absolute;right:22px;top:22px;background:#fff1df;color:#c66f1e;border-radius:20px;padding:6px 9px;font-size:7px;font-weight:800}.plan-label{font-size:8px;font-weight:800;letter-spacing:.16em;color:#76a8ff}.premium-plan .plan-label{color:var(--orange)}.premium-plans h3{font-size:32px;color:inherit;margin:20px 0 12px}.premium-plans h3 small{font-size:9px;color:#8290a3}.premium-plans p{font-size:10px;line-height:1.75;color:#8495ae;min-height:55px}.premium-plan p{color:#68768b}.premium-plans ul{margin:25px 0}.premium-plans li{font-size:10px;margin:13px 0;padding-left:22px;position:relative;color:#a0aec1}.premium-plan li{color:#56657b}.premium-plans li:before{content:'✓';position:absolute;left:0;color:#66a0ff;font-weight:800}.premium-plan li:before{color:var(--green)}.button-ghost-dark{border:1px solid #446183;color:#fff}.button-ghost-dark:hover{color:#fff;background:#183861}.gift-premium{max-width:940px;margin:20px auto 0;border:1px solid #334f74;border-radius:14px;padding:25px 28px;display:grid;grid-template-columns:50px 1fr auto;align-items:center;gap:22px;background:linear-gradient(110deg,#102c55,#0a2144)}.gift-icon{width:45px;height:45px;border-radius:12px;background:linear-gradient(135deg,#ffb65f,#ed7d27);display:grid;place-items:center;font-size:20px}.gift-premium .section-kicker{font-size:7px;margin-bottom:5px;color:#ffb76d}.gift-premium h3{font-size:15px;color:#fff}.gift-premium p{font-size:8px;color:#8295ae;margin:6px 0 0}.gift-premium>a{color:#fff;border:1px solid #436184;border-radius:8px;padding:10px 13px;font-size:9px;font-weight:800}.cost-clarity{max-width:940px;margin:20px auto 0;padding:20px 25px;border-top:1px solid #294466;display:grid;grid-template-columns:210px 1fr;gap:25px}.cost-clarity strong{font-size:10px;color:#fff}.cost-clarity span{font-size:8px;line-height:1.7;color:#7287a4}

/* Contributor directory */
.directory-preview{background:#fff}.directory-preview .split-heading p{font-size:11px;margin:15px 0 0}.directory-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));gap:15px}.directory-grid article{border:1px solid var(--line);border-radius:12px;padding:22px;display:grid;grid-template-columns:48px 1fr auto;align-items:center;gap:13px;box-shadow:0 9px 25px rgba(15,40,75,.05)}.school-placeholder{width:48px;height:48px;border-radius:11px;background:#e4edff;color:var(--blue);display:grid;place-items:center;font-size:12px;font-weight:800}.purple-school{background:#eeeaff;color:var(--purple)}.green-school{background:#e2f5ed;color:var(--green)}.directory-grid small{font-size:6px;font-weight:800;color:var(--orange);letter-spacing:.08em}.directory-grid h3{font-size:13px;margin:4px 0}.directory-grid p{font-size:8px;margin:0}.directory-grid article>b{width:20px;height:20px;border-radius:50%;background:#e5f7f0;color:var(--green);display:grid;place-items:center;font-size:8px}.directory-disclaimer{text-align:center;font-size:7px;margin:20px 0 0}

@media(max-width:1100px){.section-links{gap:18px}.education-head,.government-layout{gap:50px}.government-layout{grid-template-columns:1fr}.government-dashboard{max-width:680px;width:100%;margin:auto}}
@media(max-width:760px){.education-head{grid-template-columns:1fr;gap:20px}.education-grid{grid-template-columns:1fr}.education-grid article{border-right:0!important;border-bottom:1px solid var(--line)!important}.education-grid article:last-child{border-bottom:0!important}.education-note{grid-template-columns:1fr;gap:10px}.premium-plans{grid-template-columns:1fr}.premium-plans article{padding:34px 25px}.gift-premium{grid-template-columns:50px 1fr}.gift-premium>a{grid-column:1/-1;text-align:center}.cost-clarity{grid-template-columns:1fr;gap:8px}.directory-grid{grid-template-columns:1fr}.government-copy h2,.education-head h2{font-size:36px}}
@media(max-width:480px){.government-dashboard{padding:13px}.gov-metrics{grid-template-columns:1fr}.gov-content{grid-template-columns:1fr}.gov-map,.gov-alerts{height:190px}.premium-head{text-align:left}.premium-head h2{font-size:35px}}

/* Three-tier contribution model */
.premium-plans{grid-template-columns:repeat(3,1fr);max-width:1180px}.premium-plans article{padding:38px 30px}.movement-plan{background:linear-gradient(145deg,#fff8e8,#f5dca2);color:var(--ink);box-shadow:0 28px 65px rgba(0,0,0,.24);border:1px solid #ffe5a7}.movement-plan .plan-label{color:#a86b00}.movement-plan .plan-ribbon{background:#132d54;color:#ffd77c}.movement-plan p,.movement-plan li{color:#645d50}.movement-plan li:before{color:#b87900}.button-movement{background:#102b52;color:#fff;box-shadow:0 10px 25px rgba(10,35,72,.2)}.button-movement:hover{background:#1a3e70;color:#fff;transform:translateY(-1px)}
@media(max-width:1100px){.premium-plans{grid-template-columns:1fr 1fr}.movement-plan{grid-column:1/-1}}
@media(max-width:760px){.premium-plans{grid-template-columns:1fr}.movement-plan{grid-column:auto}}

/* Information-architecture navigation */
.solution-menu .mega-menu{left:-210px}.resource-menu .mega-menu{left:auto;right:-170px}.nav-menu>.nav-link{white-space:nowrap}
@media(max-width:1180px) and (min-width:761px){.nav-menu{margin-left:28px}.nav-link,.nav-trigger{padding-inline:8px;font-size:11px}.nav-actions{gap:10px}.login-link{font-size:11px}.nav-cta{padding:9px 11px}.mega-menu{width:680px}}
@media(max-width:760px){.nav-menu{max-height:calc(100vh - 60px);overflow-y:auto}.solution-menu .mega-menu,.resource-menu .mega-menu{left:auto;right:auto}}

/* ASIS Educator volunteer program */
.educator-program{background:#f6f9fd;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.educator-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:90px;align-items:center}.educator-copy h2{font-size:clamp(38px,4.5vw,56px);letter-spacing:-.055em;line-height:1.1;margin-bottom:25px}.educator-copy h2 span{color:var(--blue)}.educator-copy>p{font-size:11px;line-height:1.9;max-width:530px}.educator-actions{display:flex;align-items:center;gap:22px;margin-top:27px}.educator-actions>a:last-child{font-size:9px;font-weight:800}.educator-journey{background:#fff;border:1px solid var(--line);border-radius:18px;padding:32px;box-shadow:0 22px 55px rgba(17,48,90,.1)}.educator-badge{display:flex;align-items:center;gap:12px;background:linear-gradient(120deg,#0b2449,#123d75);border-radius:12px;padding:18px;color:#fff}.educator-badge>b{width:42px;height:42px;border-radius:10px;background:var(--blue);display:grid;place-items:center;font-size:20px}.educator-badge>span{display:flex;flex-direction:column}.educator-badge strong{font-size:13px}.educator-badge small{font-size:7px;color:#91a7c4;letter-spacing:.07em}.educator-badge i{margin-left:auto;font-style:normal;font-size:7px;font-weight:800;color:#ffbd71;background:rgba(242,138,53,.16);padding:6px 9px;border-radius:20px}.journey-line{height:25px;border-left:1px dashed #a9bdd6;margin-left:21px}.journey-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.journey-steps article{border:1px solid var(--line);border-radius:9px;padding:16px}.journey-steps article>span{font-size:7px;color:var(--blue);font-weight:800}.journey-steps h3{font-size:11px;margin:12px 0 7px}.journey-steps p{font-size:7px;line-height:1.65;margin:0}.educator-note{display:flex;gap:10px;align-items:center;background:#eff5ff;border-radius:8px;padding:12px 15px;margin-top:10px}.educator-note>span{color:var(--orange)}.educator-note p{font-size:7px;margin:0;line-height:1.6}.educator-note strong{color:var(--ink)}
@media(max-width:900px){.educator-layout{grid-template-columns:1fr;gap:45px}.educator-copy>p{max-width:none}}
@media(max-width:600px){.educator-actions{align-items:flex-start;flex-direction:column}.journey-steps{grid-template-columns:1fr}.educator-journey{padding:20px}.educator-badge i{display:none}}

/* Compact problem summary */
.pain-points{background:#fff;border-bottom:1px solid var(--line);padding:76px 0}.pain-points-layout{display:grid;grid-template-columns:.9fr 1.45fr;gap:72px;align-items:center}.pain-points-heading h2{font-size:clamp(30px,3.2vw,43px);letter-spacing:-.05em;line-height:1.18;margin:0}.pain-points-heading h2 span{color:var(--blue)}.pain-points-grid{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#fff;box-shadow:0 18px 45px rgba(14,37,72,.06)}.pain-points-grid article{display:grid;grid-template-columns:30px 1fr;gap:12px;padding:24px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.pain-points-grid article:nth-child(2n){border-right:0}.pain-points-grid article:nth-last-child(-n+2){border-bottom:0}.pain-points-grid article>b{font-size:9px;color:var(--blue);letter-spacing:.08em}.pain-points-grid h3{font-size:13px;margin:0 0 7px}.pain-points-grid p{font-size:9px;line-height:1.7;margin:0}
@media(max-width:900px){.pain-points-layout{grid-template-columns:1fr;gap:35px}}
@media(max-width:600px){.pain-points{padding:60px 0}.pain-points-grid{grid-template-columns:1fr}.pain-points-grid article{border-right:0!important;border-bottom:1px solid var(--line)!important}.pain-points-grid article:last-child{border-bottom:0!important}}

/* Expanded role representation */
.role-grid{grid-template-columns:repeat(3,1fr)}.role-grid article{min-height:285px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.role-grid article:nth-child(3n){border-right:0}.role-grid article:nth-last-child(-n+3){border-bottom:0}
@media(max-width:1100px){.role-grid{grid-template-columns:repeat(2,1fr)}.role-grid article{border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.role-grid article:nth-child(2n){border-right:0}.role-grid article:nth-last-child(-n+2){border-bottom:0}}
@media(max-width:760px){.role-grid{grid-template-columns:1fr}.role-grid article{min-height:auto;border-right:0!important;border-bottom:1px solid var(--line)!important}.role-grid article:last-child{border-bottom:0!important}}

/* Compact ASIS origin */
.asis-origin{margin-top:70px;padding:58px;background:linear-gradient(125deg,#081d3f,#0c376e);border-radius:18px;color:#fff;display:grid;grid-template-columns:.9fr 1.1fr;gap:65px;align-items:center;overflow:hidden;position:relative}.asis-origin:after{content:'';position:absolute;width:280px;height:280px;border:70px solid rgba(77,139,232,.1);border-radius:50%;right:-150px;top:-160px}.asis-origin-copy{position:relative;z-index:1}.asis-origin-copy h2{color:#fff;font-size:clamp(29px,3vw,41px);line-height:1.16;letter-spacing:-.05em}.asis-origin-copy p{color:#9badc5;font-size:10px;line-height:1.85}.asis-origin-copy>a{display:inline-flex;gap:8px;color:#fff;font-size:9px;font-weight:800;margin-top:10px}.asis-origin-grid{position:relative;z-index:1;display:grid;gap:9px}.asis-origin-grid article{display:grid;grid-template-columns:44px 1fr;gap:14px;align-items:center;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);border-radius:11px;padding:15px 18px}.asis-origin-grid article>b{width:38px;height:38px;border-radius:9px;background:var(--blue);display:grid;place-items:center;font-size:10px;color:#fff}.asis-origin-grid small{font-size:6px;color:#7fa7e3;letter-spacing:.12em;font-weight:800}.asis-origin-grid h3{color:#fff;font-size:12px;margin:3px 0}.asis-origin-grid p{font-size:8px;color:#91a4be;margin:0}.seo-content .seo-links{margin-top:55px}
@media(max-width:900px){.asis-origin{grid-template-columns:1fr;gap:38px;padding:45px}}
@media(max-width:600px){.asis-origin{margin-top:50px;padding:34px 22px}.asis-origin-grid article{padding:13px}.seo-content .seo-links{margin-top:45px}}

/* ==========================================================================
   Readability pass — larger content text (desktop & tablet, >=761px).
   Dashboard/app mockup previews are intentionally left small.
   ========================================================================== */
@media (min-width: 761px) {
  /* Labels, section support & secondary nav */
  .eyebrow, .section-kicker { font-size: 12px; }
  .section-heading p { font-size: 17px; }
  .section-links a { font-size: 12.5px; }

  /* Hero */
  .announcement { font-size: 13px; }
  .hero-lead { font-size: 18px; }
  .button { font-size: 15px; }
  .hero-proof { font-size: 13px; }
  .hero-stats strong { font-size: 30px; }
  .hero-stats small { font-size: 12.5px; }

  /* Mega menu */
  .mega-menu small { font-size: 11px; }
  .mega-menu strong { font-size: 14px; }
  .mega-menu em { font-size: 12px; }

  /* Pain points */
  .pain-points-grid article > b { font-size: 11px; }
  .pain-points-grid h3 { font-size: 16px; }
  .pain-points-grid p { font-size: 13px; }

  /* Ecosystem service cards */
  .orbit-card strong { font-size: 13.5px; }
  .orbit-card span { font-size: 11.5px; }

  /* Products */
  .split-heading > a { font-size: 13.5px; }
  .product-tabs button { font-size: 13.5px; }
  .panel-copy > small { font-size: 11.5px; }
  .panel-copy p { font-size: 15px; }
  .panel-copy li { font-size: 14px; }
  .panel-copy > a { font-size: 13.5px; }

  /* Workflow */
  .steps h3 { font-size: 20px; }
  .steps p { font-size: 14px; }

  /* Roles */
  .role-num { font-size: 11px; }
  .role-grid h3 { font-size: 19px; }
  .role-grid p { font-size: 13.5px; }
  .role-grid a { font-size: 12.5px; }

  /* Education */
  .education-head > p { font-size: 15px; }
  .education-grid h3 { font-size: 19px; }
  .education-grid p { font-size: 13px; }
  .education-grid article > span { font-size: 10px; }
  .education-note strong { font-size: 14.5px; }
  .education-note > span { font-size: 13px; }
  .education-note a { font-size: 12.5px; }

  /* Impact */
  .impact-card p { font-size: 15px; }
  .impact-numbers span { font-size: 12.5px; }

  /* Government (copy side only; dashboard preview stays small) */
  .government-copy > p { font-size: 15px; }
  .government-copy li { font-size: 13.5px; }

  /* Premium & gifting */
  .premium-head p { font-size: 15px; }
  .plan-ribbon { font-size: 9.5px; }
  .plan-label { font-size: 10.5px; }
  .premium-plans h3 small { font-size: 11px; }
  .premium-plans p { font-size: 13.5px; }
  .premium-plans li { font-size: 13.5px; }
  .gift-premium .section-kicker { font-size: 10px; }
  .gift-premium h3 { font-size: 17px; }
  .gift-premium p { font-size: 12px; }
  .gift-premium > a { font-size: 12.5px; }
  .cost-clarity strong { font-size: 13px; }
  .cost-clarity span { font-size: 12px; }

  /* Educator */
  .educator-copy > p { font-size: 14.5px; }
  .educator-actions > a:last-child { font-size: 12.5px; }
  .educator-badge strong { font-size: 15px; }
  .educator-badge small { font-size: 10.5px; }
  .educator-badge i { font-size: 10px; }
  .journey-steps article > span { font-size: 10px; }
  .journey-steps h3 { font-size: 13.5px; }
  .journey-steps p { font-size: 11.5px; }
  .educator-note p { font-size: 11.5px; }

  /* Directory preview */
  .directory-preview .split-heading p { font-size: 14px; }
  .directory-grid small { font-size: 9.5px; }
  .directory-grid h3 { font-size: 15.5px; }
  .directory-grid p { font-size: 12px; }
  .directory-disclaimer { font-size: 11px; }

  /* FAQ */
  .faq-shell > div:first-child p { font-size: 14.5px; }
  .faq-shell > div:first-child a { font-size: 13px; }
  .accordion-header { font-size: 15px; }
  .accordion-body { font-size: 14.5px; }

  /* SEO summary & origin */
  .seo-summary p { font-size: 15px; }
  .seo-links strong { font-size: 14px; }
  .seo-links > div span { font-size: 12px; }
  .seo-links a { font-size: 12px; }
  .asis-origin-copy p { font-size: 14px; }
  .asis-origin-copy > a { font-size: 12.5px; }
  .asis-origin-grid small { font-size: 9.5px; }
  .asis-origin-grid h3 { font-size: 14.5px; }
  .asis-origin-grid p { font-size: 12px; }

  /* Final CTA */
  .final-cta p { font-size: 15.5px; }

  /* Footer */
  .footer-brand p { font-size: 13px; }
  .footer-top h4 { font-size: 12.5px; }
  .footer-top > div:not(:first-child) a { font-size: 12.5px; }
  .socials a { font-size: 10px; }
  .footer-bottom p, .footer-bottom span { font-size: 11px; }
  .footer-legal a { font-size: 11px; }
}

/* Scroll-driven product tabs */
.products > .section-shell {
  min-height: 390vh;
}

.product-showcase {
  position: sticky;
  top: 74px;
}

.product-panel {
  opacity: 0;
  transform: translateY(18px) scale(.985);
  transition: opacity .34s ease, transform .34s ease;
}

.product-panel.active {
  opacity: 1;
  transform: translateY(0) scale(1);
}

.product-tabs {
  scroll-behavior: smooth;
  scrollbar-width: none;
}

.product-tabs::-webkit-scrollbar {
  display: none;
}

/* Desktop-only ecosystem card orbit — cards revolve around the hub, upright */
@media (min-width: 761px) {
  .ecosystem-map .orbit-ring {
    position: absolute;
    inset: 0;
    transform-origin: 50% 50%;
    animation: eco-orbit 46s linear infinite;
    will-change: transform;
  }

  .ecosystem-map .orbit-card {
    width: 180px;
    transition: box-shadow .25s ease;
    animation: eco-orbit-reverse 46s linear infinite;
    will-change: transform;
  }

  /* Even hexagon: card centers sit on a circle (r=205) around the hub. */
  .ecosystem-map .card-core     { left: 38.75%; top: 0.8%;  right: auto; bottom: auto; }
  .ecosystem-map .card-edu      { left: 60.94%; top: 22.2%; right: auto; bottom: auto; }
  .ecosystem-map .card-parent   { left: 60.94%; top: 64.9%; right: auto; bottom: auto; }
  .ecosystem-map .card-office   { left: 38.75%; top: 86.2%; right: auto; bottom: auto; }
  .ecosystem-map .card-id       { left: 16.56%; top: 64.9%; right: auto; bottom: auto; transform: none; }
  .ecosystem-map .card-analytics{ left: 16.56%; top: 22.2%; right: auto; bottom: auto; transform: none; }

  /* Freeze the carousel so the cards are readable on hover/focus. */
  .ecosystem-map:hover .orbit-ring,
  .ecosystem-map:hover .orbit-card,
  .ecosystem-map:focus-within .orbit-ring,
  .ecosystem-map:focus-within .orbit-card {
    animation-play-state: paused;
  }

  .ecosystem-map .orbit-card:hover {
    box-shadow: 0 18px 45px rgba(14,37,72,.14);
  }
}

@keyframes eco-orbit {
  to { transform: rotate(360deg); }
}

@keyframes eco-orbit-reverse {
  to { transform: rotate(-360deg); }
}

@media (prefers-reduced-motion: reduce) {
  .ecosystem-map .orbit-ring,
  .ecosystem-map .orbit-card {
    animation: none;
  }
}

/* Mobile hero overflow fix — dashboard mockup must not widen the grid column */
@media (max-width: 760px) {
  /* Collapse the orbit wrapper so cards stack in the map's grid. */
  .orbit-ring { display: contents; }

  .products > .section-shell {
    min-height: 0;
  }
  .product-showcase {
    position: static;
    top: auto;
  }
  .product-tabs {
    position: sticky;
    top: 60px;
    z-index: 800;
    background: var(--soft);
  }
  .product-panel {
    display: grid;
    grid-template-columns: 1fr;
    opacity: 1;
    transform: none;
    border-radius: 16px;
    margin-top: 14px;
  }
  .hero-shell { grid-template-columns: minmax(0, 1fr); }
  .hero-copy, .hero-visual { min-width: 0; }
  .hero-visual {
    overflow: visible;
    margin-inline: auto;
    max-width: 520px;
  }
  .dashboard-frame {
    width: 100%;
    max-width: 100%;
    transform: none;
    margin: 0;
    border-width: 5px;
    border-radius: 14px;
  }
  .window-bar span {
    padding-inline: 18px;
    max-width: 68%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .dashboard-body {
    display: block;
    height: auto;
  }
  .dash-sidebar {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 10px;
    align-items: center;
    border-right: 0;
    border-bottom: 1px solid #e8edf4;
    padding: 10px;
  }
  .mini-brand {
    margin: 0;
    white-space: nowrap;
  }
  .school-chip,
  .school-chip div {
    min-width: 0;
  }
  .school-chip b,
  .school-chip small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .dash-sidebar ul {
    grid-column: 1 / -1;
    display: flex;
    gap: 6px;
    margin-top: 0;
    overflow-x: auto;
    padding-bottom: 2px;
    scrollbar-width: none;
  }
  .dash-sidebar ul::-webkit-scrollbar {
    display: none;
  }
  .dash-sidebar li {
    flex: 0 0 auto;
    padding: 7px 9px;
    white-space: nowrap;
  }
  .dash-main {
    padding: 14px;
  }
  .metric-grid {
    gap: 7px;
    margin: 14px 0;
  }
  .metric-grid > div {
    grid-template-columns: 22px 1fr;
    column-gap: 6px;
    padding: 8px;
  }
  .metric-icon {
    width: 22px;
    height: 22px;
  }
  .chart {
    height: 115px;
  }
}

/* Keep all standard secondary navigation links centered in the viewport. */
@media (min-width: 761px) {
  .section-nav > div {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
    align-items: center;
  }
  .section-brand { justify-self: start; }
  .section-links { margin: 0; justify-content: center; }
  .section-cta { justify-self: end; }
}

@media (min-width: 761px) and (max-width: 900px) {
  .section-links { gap: 8px; }
  .section-links a { font-size: 11px !important; }
  .section-brand { font-size: 13px; }
  .section-cta { font-size: 12px; padding-inline: 11px; }
}


/* Mobile primary navigation: clear brand + text Menu, actions inside drawer. */
.mobile-nav-actions { display: none; }

@media (max-width: 760px) {
  .site-nav .nav-shell { justify-content: space-between; }

  .site-nav .menu-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: auto;
    min-width: 68px;
    min-height: 38px;
    padding: 8px 13px;
    border: 1px solid rgba(255, 255, 255, .2);
    border-radius: 9px;
    background: rgba(255, 255, 255, .06);
    color: #fff;
    font: 700 14px 'Manrope', sans-serif;
    line-height: 1;
    cursor: pointer;
  }

  .site-nav .menu-toggle:hover,
  .site-nav .menu-toggle:focus-visible,
  .site-nav .menu-toggle[aria-expanded="true"] {
    background: rgba(255, 255, 255, .12);
    border-color: rgba(255, 255, 255, .35);
  }

  .site-nav .menu-toggle span { display: none; }
  .site-nav .menu-toggle::before { content: 'Menu'; }
  .site-nav .menu-toggle[aria-expanded="true"]::before { content: 'Tutup'; }

  .site-nav .nav-actions { display: none; }

  .site-nav .nav-menu {
    top: 60px;
    max-height: calc(100vh - 60px);
    max-height: calc(100dvh - 60px);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 14px 14px 20px;
    border-top: 1px solid #253a57;
    box-shadow: 0 20px 45px rgba(0, 0, 0, .28);
  }

  .site-nav .nav-link,
  .site-nav .nav-trigger {
    min-height: 45px;
    padding: 12px;
    border-radius: 8px;
    font-size: 14px;
    line-height: 1.45;
  }

  .site-nav .nav-link:hover,
  .site-nav .nav-trigger:hover,
  .site-nav .nav-current {
    background: rgba(255, 255, 255, .07);
  }

  .site-nav .mega-menu {
    margin: 2px 0 8px;
    border-radius: 11px;
  }

  .site-nav .mega-menu strong { font-size: 13px; }
  .site-nav .mega-menu em { font-size: 11.5px; }

  .site-nav .mobile-nav-actions {
    display: grid;
    gap: 10px;
    margin-top: 10px;
    padding: 18px 4px 2px;
    border-top: 1px solid rgba(255, 255, 255, .13);
  }

  .site-nav .mobile-nav-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 46px;
    padding: 12px 16px;
    border-radius: 9px;
    background: var(--blue);
    color: #fff;
    font-size: 14px;
    font-weight: 800;
  }

  .site-nav .mobile-nav-cta:hover,
  .site-nav .mobile-nav-cta:focus-visible {
    background: #4085ff;
    color: #fff;
  }

  .site-nav .mobile-nav-login {
    display: block;
    padding: 5px 8px;
    color: #93a5bf;
    text-align: center;
    font-size: 12.5px;
  }

  .site-nav .mobile-nav-login strong { color: #fff; }
}

/* Mobile content readability; miniature app/dashboard visuals stay unchanged. */
@media (max-width: 760px) {
  .eyebrow, .section-kicker { font-size: 11px; }
  .section-heading p { font-size: 16px; line-height: 1.75; }
  .announcement { font-size: 12.5px; }
  .hero-lead { font-size: 16px; line-height: 1.75; }
  .button { min-height: 46px; font-size: 14px; }
  .hero-proof { font-size: 12.5px; }
  .hero-stats small { font-size: 12px; }

  .pain-points-grid h3,
  .education-grid h3,
  .role-grid h3 { font-size: 18px; }
  .pain-points-grid p,
  .education-grid p,
  .role-grid p,
  .steps p { font-size: 15px; line-height: 1.75; }
  .role-grid a, .education-note a, .split-heading > a { font-size: 13px; }

  .product-tabs button { min-height: 44px; font-size: 13px; }
  .panel-copy > small { font-size: 11px; }
  .panel-copy h3 { font-size: 27px; }
  .panel-copy p { font-size: 15px; line-height: 1.8; }
  .panel-copy li { font-size: 14px; line-height: 1.7; }
  .panel-copy > a { font-size: 13px; }
  .steps h3 { font-size: 19px; }

  .education-head > p,
  .government-copy > p,
  .premium-head p,
  .educator-copy > p,
  .directory-preview .split-heading p,
  .impact-card p,
  .seo-summary p,
  .asis-origin-copy p,
  .final-cta p { font-size: 15px; line-height: 1.8; }
  .government-copy li,
  .premium-plans li { font-size: 14px; line-height: 1.7; }
  .premium-plans p,
  .directory-grid p,
  .asis-origin-grid p { font-size: 14px; line-height: 1.7; }
  .premium-plans h3 small,
  .directory-grid small,
  .asis-origin-grid small { font-size: 11.5px; }
  .gift-premium h3,
  .directory-grid h3,
  .asis-origin-grid h3 { font-size: 18px; }
  .gift-premium p,
  .cost-clarity span,
  .directory-disclaimer { font-size: 13px; line-height: 1.65; }
  .educator-actions > a:last-child,
  .gift-premium > a,
  .asis-origin-copy > a,
  .seo-links a { font-size: 13px; }
  .journey-steps h3 { font-size: 17px; }
  .journey-steps p,
  .educator-note p { font-size: 14px; line-height: 1.7; }
  .faq-shell > div:first-child p,
  .accordion-body { font-size: 15px; line-height: 1.8; }
  .accordion-header { min-height: 52px; font-size: 15px; }
  .seo-links strong { font-size: 15px; }
  .seo-links > div span { font-size: 13px; }

  .section-nav {
    display: block;
    height: 46px;
    top: 60px;
    overflow: hidden;
  }
  .section-nav > div {
    width: 100%;
    height: 100%;
    padding: 0 14px;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-inline: contain;
    overscroll-behavior-y: auto;
    scrollbar-width: none;
  }
  .section-nav > div::-webkit-scrollbar { display: none; }
  .section-nav .section-brand,
  .section-nav .section-cta { display: none; }
  .section-nav .section-links {
    min-width: max-content;
    margin: 0;
    gap: 4px;
  }
  .section-nav .section-links a {
    display: inline-flex;
    align-items: center;
    position: relative;
    min-height: 44px;
    padding: 0 10px;
    font-size: 12.5px;
    white-space: nowrap;
  }
  .section-nav .section-links a.active:after {
    bottom: 0;
  }
}

/* Secondary nav consistency: horizontal only across public pages. */
.section-nav {
  overflow: hidden;
}

.section-nav > div {
  overflow-y: hidden;
  overscroll-behavior-x: contain;
}

/* Feature discovery — kotak "Cari fitur ASIS" di hero beranda. Form ini hanya
   mengirim ?q= ke /fitur; penyaringannya dikerjakan di sana. */
.hero-feature-search{margin-top:22px;width:min(560px,100%)}
.hero-feature-search label{display:block;margin-bottom:9px;color:#7aaaff;font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}
.hero-feature-search div{display:grid;grid-template-columns:1fr auto;gap:8px;padding:7px;border:1px solid rgba(143,177,231,.28);border-radius:12px;background:rgba(255,255,255,.07);box-shadow:0 18px 40px rgba(4,17,40,.28)}
.hero-feature-search input{min-width:0;border:0;background:#fff;border-radius:8px;padding:13px 14px;color:var(--ink);font:700 13px 'Manrope',sans-serif}
.hero-feature-search input::placeholder{color:#8b98ab;font-weight:600}
.hero-feature-search button{border:0;border-radius:8px;background:var(--blue);color:#fff;padding:0 18px;font:800 12px 'Manrope',sans-serif;cursor:pointer}
.hero-feature-search button:hover{background:#4085ff}
@media(max-width:760px){.hero-feature-search{text-align:left;margin-inline:auto}.hero-feature-search div{grid-template-columns:1fr}.hero-feature-search button{min-height:44px}}

/* Menu "Fitur": empat kolom, jadi lebih lebar dari mega-menu tiga kolom dan
   digeser ke kiri supaya tidak keluar dari viewport. */
.mega-menu.mega-menu-4-cols{width:900px;grid-template-columns:repeat(4,1fr)}
.feature-menu .mega-menu{left:-320px}
@media(max-width:1180px) and (min-width:761px){.mega-menu.mega-menu-4-cols{width:720px}.feature-menu .mega-menu{left:-260px}}
@media(max-width:760px){.mega-menu.mega-menu-4-cols{width:100%;grid-template-columns:1fr}.feature-menu .mega-menu{left:auto;right:auto}}

/* Bertambahnya satu menu utama bikin baris nav mepet; rapatkan padding-nya
   supaya panah dropdown tidak turun ke baris kedua. */
@media(min-width:761px){
  .site-nav .nav-menu{gap:1px}
  .site-nav .nav-group{flex:0 0 auto}
  .site-nav .nav-link,.site-nav .nav-trigger{display:inline-flex;align-items:center;gap:5px;padding-inline:11px;white-space:nowrap;line-height:1}
}
@media(min-width:761px) and (max-width:1180px){
  .site-nav .nav-menu{margin-left:16px}
  .site-nav .nav-link,.site-nav .nav-trigger{padding-inline:6px}
}

/* Navigasi utama kini memuat sepuluh menu (Lembaga, Ekosistem, dan Direktori
   ikut naik ke baris atas). Lebar cangkang nav tetap 1180px berapa pun lebar
   layarnya, jadi jaraknya dirapatkan supaya semuanya muat satu baris tanpa
   membuang menu. */
@media(min-width:1181px){
  .site-nav .nav-menu{margin-left:14px;gap:0}
  .site-nav .nav-link,.site-nav .nav-trigger{padding-inline:7px;font-size:12.5px}
  .site-nav .nav-actions{gap:12px}
}

/* Posisi mega menu per grup: yang di ujung kiri tidak boleh keluar layar, yang
   di ujung kanan ditarik ke kiri agar tidak memotong tepi kanan viewport. */
.institution-menu .mega-menu{left:-40px}
.ecosystem-menu .mega-menu{left:-180px}
.directory-menu .mega-menu{left:auto;right:-120px}
.about-menu .mega-menu{left:auto;right:-40px}
.mega-menu.mega-menu-2-cols{width:520px;grid-template-columns:repeat(2,1fr)}
.mega-menu.mega-menu-about{width:740px}
@media(max-width:1180px) and (min-width:761px){
  .institution-menu .mega-menu{left:-20px}
  .ecosystem-menu .mega-menu{left:-140px}
  .mega-menu.mega-menu-2-cols{width:480px}
  .mega-menu.mega-menu-about{width:680px}
}
@media(max-width:760px){
  .institution-menu .mega-menu,.ecosystem-menu .mega-menu,
  .directory-menu .mega-menu,.about-menu .mega-menu{left:auto;right:auto}
  .mega-menu.mega-menu-2-cols,.mega-menu.mega-menu-about{width:100%;grid-template-columns:1fr}
}

/* Rentang 761–1180px: sepuluh menu + tombol CTA tidak lagi muat dengan jarak
   bawaan, sehingga tombol "Daftar Gratis" sempat terdorong keluar cangkang.
   Dirapatkan sekalian dijaga agar labelnya tidak pernah patah dua baris. */
@media(min-width:1024px) and (max-width:1180px){
  .site-nav .nav-menu{margin-left:6px;gap:0}
  .site-nav .nav-link,.site-nav .nav-trigger{padding-inline:4px;font-size:10.5px}
  .site-nav .nav-trigger .nav-caret svg{width:9px;height:9px}
  .site-nav .brand{font-size:18px}
  .site-nav .nav-actions{gap:8px}
  .site-nav .login-link{font-size:10.5px}
  .site-nav .nav-cta{padding:8px 10px;font-size:10.5px}
  .site-nav .nav-cta span{padding-left:4px}
}
.site-nav .nav-cta{white-space:nowrap}

/* Di bawah 1024px sepuluh menu tidak lagi muat satu baris, jadi navigasi dilipat
   ke tombol hamburger — perlakuan yang sebelumnya baru muncul di 760px. Aturan
   ini menyalin tampilan laci mobile untuk rentang tablet; ambangnya harus sama
   dengan NAV_COMPACT di assets/js/main.js. */
@media(min-width:761px) and (max-width:1023px){
  .site-nav .menu-toggle{display:block;order:3;margin-left:14px}
  .site-nav .nav-menu{
    display:none;position:absolute;top:68px;left:0;right:0;z-index:1001;margin:0;
    background:var(--navy);padding:10px 20px 25px;flex-direction:column;
    align-items:stretch;border-top:1px solid #253a57;
    max-height:calc(100vh - 68px);overflow-y:auto;
  }
  .site-nav .nav-menu.open{display:flex}
  .site-nav .nav-link,.site-nav .nav-trigger{width:100%;text-align:left;padding:11px;font-size:13px}
  .site-nav .nav-actions{margin-left:auto}
  .site-nav .mega-menu{
    position:static;left:auto;right:auto;width:100%;grid-template-columns:repeat(2,1fr);
    padding:14px;margin-top:4px;display:none;opacity:1;visibility:visible;transform:none;
  }
  .site-nav .nav-group.open .mega-menu{display:grid}
  .site-nav .nav-group:hover .mega-menu{display:none}
  .site-nav .nav-group.open:hover .mega-menu{display:grid}
  .site-nav .mega-menu.mega-menu-4-cols,.site-nav .mega-menu.mega-menu-2-cols,
  .site-nav .mega-menu.mega-menu-about,.site-nav .mega-menu.mega-menu-lembaga{
    width:100%;grid-template-columns:repeat(2,1fr);
  }
}

/* Kolom "Pendampingan & SDM" pada menu Fitur kini memuat sembilan tautan, jadi
   panelnya bisa lebih tinggi daripada layar laptop pendek. Beri batas tinggi
   dengan gulir di dalam panel supaya tautan terakhir tetap bisa diraih. */
@media(min-width:1024px){
  .site-nav .mega-menu{max-height:calc(100vh - 96px);overflow-y:auto}
  .mega-menu.mega-menu-lembaga{width:790px}
  .institution-menu .mega-menu{left:-70px}
}

/* Satu kolom mega menu boleh memuat dua kelompok (mis. "Wajah & Penerimaan"
   lalu "Karier & Nonformal"); judul kelompok kedua perlu jarak atas. */
.mega-menu > div > small:not(:first-child){margin-top:20px}

/* Menu utama rata tengah.

   Sebelumnya .nav-menu hanya digeser `margin-left` dari logo, jadi seluruh menu
   menempel ke kiri dan sisa ruangnya menumpuk di kanan — makin terasa setelah
   navbar dipendekkan dari sepuluh tajuk menjadi tujuh. Sekarang menu mengambil
   ruang sisa di antara logo dan tombol aksi, lalu isinya dipusatkan.

   Ditulis di akhir berkas dengan sengaja: beberapa breakpoint di atas masih
   menyetel `margin-left` versi lama, dan aturan terakhir yang menang.
   Batasnya ≥1024px karena di bawah itu .nav-menu bukan lagi baris mendatar,
   melainkan laci vertikal di balik tombol "Menu". */
@media(min-width:1024px){
  .site-nav .nav-shell{gap:14px}
  .site-nav .nav-menu{flex:1 1 auto;justify-content:center;margin-left:0}
  .site-nav .nav-actions{margin-left:0;flex:0 0 auto}
  .site-nav .brand{flex:0 0 auto}
}

/* Mega menu Peran: direktori besar yang tetap terbaca sebagai kelompok kerja. */
.role-menu .mega-menu-role {
  position: fixed;
  top: 68px;
  left: 50%;
  width: min(1480px, calc(100vw - 32px));
  max-height: calc(100vh - 88px);
  overflow-y: auto;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 16px;
  padding: 24px;
  transform: translate(-50%, 8px);
}
.role-menu:hover .mega-menu-role,
.role-menu.open .mega-menu-role {
  transform: translateX(-50%);
}
.mega-menu-role > div {
  min-width: 0;
  padding-right: 5px;
}
.mega-menu-role > div + div {
  border-left: 1px solid #e5ebf4;
  padding-left: 15px;
}
.mega-menu-role a {
  padding: 7px;
}
.mega-menu-role strong {
  font-size: 11.5px;
  line-height: 1.28;
}
.mega-menu-role em {
  margin-top: 2px;
  font-size: 9.5px;
  line-height: 1.35;
}
.mega-menu-role .product-dot {
  width: 29px;
  height: 29px;
  font-size: 9px;
}
.mega-menu-role .role-menu-all {
  margin-top: 8px;
  background: #eef4ff;
}
@media(max-width:1100px) and (min-width:761px) {
  .role-menu .mega-menu-role {
    width: min(1040px, calc(100vw - 24px));
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .mega-menu-role > div:nth-child(4) {
    border-left: 0;
    padding-left: 0;
  }
}
@media(max-width:760px) {
  .role-menu .mega-menu-role {
    position: static;
    top: auto;
    left: auto;
    width: 100%;
    max-height: none;
    grid-template-columns: 1fr;
    padding: 14px;
    transform: none;
  }
  .role-menu:hover .mega-menu-role,
  .role-menu.open .mega-menu-role {
    transform: none;
  }
  .mega-menu-role > div + div {
    border-top: 1px solid #e5ebf4;
    border-left: 0;
    padding-top: 16px;
    padding-left: 0;
  }
}