/* Experience 2026 — shared public theme and one progressive motion layer. */
:root{--exp-gold:#e6c582;--exp-ink:#081c17;--exp-cream:#f6f2e8;--exp-line:rgba(205,222,205,.17)}
html{scroll-behavior:smooth;scroll-padding-top:104px}body{overflow-x:clip}main:focus{outline:none}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}a,button{touch-action:manipulation}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--exp-gold)!important;outline-offset:5px!important}img{max-width:100%}.skip-content{position:fixed;top:-90px;left:18px;padding:14px 22px;z-index:99999;background:var(--exp-gold);color:#071b15;border-radius:8px}.skip-content:focus{top:12px}header.site{border-bottom:1px solid var(--exp-line)!important}nav.tabs a{transition:color .2s,background .2s}.page-progress{position:fixed;left:0;top:0;width:100%;height:3px;background:var(--exp-gold);transform:scaleX(0);transform-origin:left;z-index:99998;pointer-events:none}.back-top{position:fixed;right:22px;bottom:22px;width:45px;height:45px;border:1px solid #668477;border-radius:50%;background:#102d24;color:var(--exp-cream);z-index:90;cursor:pointer;opacity:0;visibility:hidden;transition:opacity .2s}.back-top.shown{opacity:1;visibility:visible}.data-unavailable{padding:24px;color:#c3d4cc;border:1px solid var(--exp-line);border-radius:16px;grid-column:1/-1}

/* V6: original style.css owns hero geometry, typography, cards and sections. */
#beranda .hero-media img{animation:none!important;transform:scale(1.06) translateY(var(--hero-y,0px))!important}
#beranda .hero-feature-card.reveal{transform:perspective(1000px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg))!important;transition:transform .35s ease!important}
#beranda .hero-feature-image-wrap img{position:absolute;inset:0;object-fit:cover;width:100%;height:100%;opacity:0;transition:opacity 1.3s ease}
#beranda .hero-feature-image-wrap img.is-current{opacity:1;animation:campus-drift 12s ease-in-out both}
#beranda .hero-image-caption{right:112px}
.scene-controls{position:absolute;right:14px;bottom:16px;z-index:4;display:flex;gap:6px}
.scene-controls button{width:27px;height:27px;border:1px solid #fff8;border-radius:50%;background:#10281dbb;color:white;cursor:pointer;font-size:10px}
.scene-controls button[aria-pressed=true]{background:#D9B56A;color:#092219;border-color:#D9B56A}
.experience-tools{max-width:1164px;margin:28px auto 32px;display:flex;justify-content:center;position:relative;z-index:2;padding:0 20px}
.explore-link{font:10px Manrope,sans-serif;color:#AFC1BB;letter-spacing:.12em;text-transform:uppercase}.explore-link span{display:inline-block;margin-right:10px;font-size:18px}
.values-ribbon{overflow:hidden;border-block:1px solid var(--exp-line);padding:20px 0;background:#11271e;transform:rotate(-1.5deg);width:104%;margin-left:-2%}
.values-ribbon>div{display:flex;width:max-content;animation:values-travel 38s linear infinite}
.values-ribbon span{white-space:nowrap;font-family:Spectral,Georgia,serif;font-size:25px;letter-spacing:.11em;color:#b9c6ae}
.values-ribbon i{font-size:20px;font-style:normal;color:#D9B56A;margin:0 40px}
/* Preserve the green / light / green section rhythm, with original card shapes. */
#beranda .home-overview{background:#f0eee3;color:#17362a;margin-top:48px}
#beranda .overview-copy h2{color:#163629;text-shadow:none}#beranda .overview-copy h2 em{color:#667846}
#beranda .overview-copy p,#beranda .overview-points small{color:#526257}
#beranda .overview-copy .eyebrow{color:#647347}
#beranda .overview-points>div{border-color:#17362a25;background:#ffffff65}
#beranda .overview-points b{color:#17362a}#beranda .overview-points span{color:#72764d}
#beranda .overview-image-float img{aspect-ratio:4/3;height:auto}
#beranda .home-stats-visual{background:#06120E}
/* Three landscape gallery cards; the tall portrait has been removed. */
#beranda .moments-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:280px 320px}
#beranda .moment-card-wide{grid-column:1/-1}
#beranda .moment-card:hover img{transform:scale(1.045)!important}
.moment-open{position:absolute;inset:0;width:100%;height:100%;z-index:3;background:transparent;border:0;cursor:zoom-in}
.moment-open::after{content:'↗';position:absolute;right:18px;top:18px;border:1px solid #fff7;border-radius:50%;width:36px;height:36px;display:grid;place-items:center;color:white;background:#10281d55;font-size:18px}
.discovery-heading{display:flex;justify-content:space-between;gap:40px;align-items:end;margin-bottom:32px}.discovery-heading h2{font:500 clamp(32px,4vw,52px)/1.15 Spectral,Georgia,serif;color:var(--exp-cream);margin:12px 0}.discovery-heading h2 em{color:var(--exp-gold)}.discovery-heading p{max-width:355px;font-size:14px;line-height:1.9;color:#b1c4b8}.discovery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.discovery-grid>a{border:1px solid var(--exp-line);padding:28px;display:flex;flex-direction:column;gap:32px;min-height:250px;background:linear-gradient(135deg,#20392b,#0b2219);transition:transform .25s,border-color .25s}.discovery-grid>a:hover{transform:translateY(-7px);border-color:var(--exp-gold)}.discovery-index{font-size:10px;letter-spacing:.14em;color:#afbe9e}.discovery-grid h3{font:500 27px/1.3 Spectral,Georgia,serif;color:var(--exp-cream);margin:0}.discovery-grid>a>span:last-child{font-size:12px;color:var(--exp-gold);display:flex;justify-content:space-between;margin-top:auto}.photo-dialog{max-width:min(1000px,94vw);width:1000px;padding:0;background:#0b2018;border:1px solid #a6b89a;border-radius:16px;color:#f6f2e8}.photo-dialog::backdrop{background:#020c09e8;backdrop-filter:blur(6px)}.photo-dialog img{display:block;width:100%;height:70vh;object-fit:contain;background:#05110d}.photo-dialog p{padding:18px 24px;margin:0}.photo-close{position:absolute;right:12px;top:12px;background:#f4efdf;color:#0b2417;border:0;border-radius:50%;width:44px;height:44px;font-size:25px;cursor:pointer}

/* One reveal layer. Base content remains visible if JavaScript is unavailable. */
#beranda .reveal{opacity:1!important;visibility:visible!important;filter:none!important}
.exp-ready #beranda [data-exp-reveal]{transition:opacity .75s ease,translate .75s cubic-bezier(.2,.8,.2,1)!important}
.exp-ready #beranda [data-exp-reveal]:not(.exp-visible){opacity:0!important;translate:0 24px}
.exp-ready #beranda [data-exp-reveal].exp-visible{opacity:1!important;translate:0 0}
@keyframes values-travel{to{transform:translateX(-50%)}}
@keyframes campus-drift{from{transform:scale(1.02)}to{transform:scale(1.10)}}
@media(max-width:760px){
.experience-tools{margin:26px 18px 30px}.values-ribbon span{font-size:19px}.values-ribbon i{margin:0 24px}
#beranda .home-overview{margin-top:36px}#beranda .moments-grid{grid-template-columns:1fr;grid-template-rows:none;grid-auto-rows:auto}
#beranda .moment-card{height:auto;aspect-ratio:4/3;min-height:0}#beranda .moment-card-wide{grid-column:auto;aspect-ratio:4/3}
.discovery-heading{display:block}.discovery-grid{grid-template-columns:1fr;gap:12px}.discovery-grid>a{min-height:0;gap:22px;padding:26px}.discovery-grid h3{font-size:28px}
.back-top{right:14px;bottom:14px}nav.tabs:not(.open){visibility:hidden!important;pointer-events:none!important}nav.tabs.open{visibility:visible!important;max-height:calc(100dvh - 100px);overflow:auto}.menu-open{overflow:hidden}
.photo-dialog img{height:55vh}.photo-dialog p{font-size:13px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
.exp-ready #beranda [data-exp-reveal]{opacity:1!important;translate:none!important}
#beranda .hero-feature-card.reveal,#beranda .moment-card:hover img,#beranda .hero-media img{transform:none!important}}

/* V7 — accessible palette, readable type and isolated mobile navigation. */
:root{--school-bg:#071c16;--school-surface:#123329;--school-text:#f8f5e9;--school-muted:#c3d4cc;--school-accent:#efd18f;--school-paper:#f5f2e8;--school-paper-text:#163b2d;--school-paper-muted:#405d50;--exp-gold:var(--school-accent)}
body{font-family:Manrope,system-ui,-apple-system,"Segoe UI",sans-serif;line-height:1.65;color:var(--school-text);background-color:var(--school-bg);-webkit-text-size-adjust:100%;text-size-adjust:100%}
h1,h2,h3,.brand .name,.hero-image-caption b{font-family:Spectral,Georgia,"Times New Roman",serif;font-weight:600;font-synthesis:none}
button,input,select,textarea{font-family:Manrope,system-ui,-apple-system,"Segoe UI",sans-serif}
.hero-stat strong,.visual-stat-card strong,.public-stat-card .num,.dashboard-stat .num,.grade-top b,.province-mini-top b,.province-count,.class-card .top b,.program-card .count{color:var(--school-accent)!important;font-variant-numeric:tabular-nums;opacity:1!important;-webkit-text-fill-color:currentColor;text-shadow:none}
.hero-stat,.visual-stat-card,.visual-panel,.public-stat-card{background:var(--school-surface)!important;border-color:#6f93815c!important}
.hero-stat .stat-label,.hero-stat small,.visual-stat-label,.visual-stat-card small,.visual-caption,.public-stat-card .kicker,.public-stat-card .label,.micro-label,.province-rank,.province-mini-top,.grade-top,.discovery-index{color:var(--school-muted)!important;opacity:1;font-weight:600}
.hero-feature-top .eyebrow,.hero-location,.hero-image-caption span,.eyebrow{color:var(--school-accent)!important}
.section-head p,.tagline,.final-cta-card p,.discovery-heading p,.person-role,.news-meta,.agenda-meta,.prestasi-meta{color:var(--school-muted)!important}
.hero-feature-bottom b,.hero-image-caption b,.moment-overlay b{color:var(--school-text)!important}.moment-overlay span{color:#d9e4de!important}
.hero-image-caption{padding:8px 10px;border-radius:9px;background:#061a13c9}.scene-controls button{background:#123329;color:#fff;border-color:#adc3b7}
#beranda .home-overview{background:var(--school-paper)!important;color:var(--school-paper-text)}
#beranda .home-overview .overview-copy h2,#beranda .overview-points b{color:var(--school-paper-text)!important}
#beranda .home-overview .overview-copy h2 em,#beranda .home-overview .overview-copy .eyebrow,#beranda .overview-points span{color:#36543e!important}
#beranda .overview-copy p,#beranda .overview-points small{color:var(--school-paper-muted)!important}
#beranda .overview-points>div{background:#fffdf7!important;border-color:#78908080!important}
#beranda .overview-quote{background:#123329!important;color:#efd18f!important}
#beranda .overview-image-float span{color:#f8f5e9!important;background:#123329!important}
.btn-gold,.btn-ppdb{color:#102d22!important;background:#efd18f!important}.btn-gold span,.btn-ppdb span{color:inherit!important}
.btn-ghost{color:#f8f5e9!important;border-color:#9ab4a7!important;background:#123329!important}
input,textarea,select{color:#173b2d!important;background:#fffdf7!important;border-color:#769181!important}
input::placeholder,textarea::placeholder{color:#536b5e!important;opacity:1}select option{color:#173b2d;background:#fffdf7}
label{color:inherit}a:focus-visible,button:focus-visible{outline-color:#efd18f!important}#beranda .home-overview a:focus-visible{outline-color:#163b2d!important}
@media(max-width:920px){
 html{scroll-padding-top:92px;scroll-behavior:auto}
 header.site{z-index:20003!important;transform:none!important;filter:none!important;background:#071c16!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;overflow:visible!important}
 .nav-row{width:calc(100% - 20px)!important;margin:0 10px!important;box-sizing:border-box;min-height:64px!important;padding:8px 10px!important;gap:8px!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;transform:none!important;filter:none!important;background:#123329!important;box-shadow:none!important}
 .brand{min-width:0!important;gap:7px!important;flex:1 1 auto}.brand-mark{width:48px!important;height:48px!important;flex:0 0 48px!important}.brand-mark img{width:44px!important;height:44px!important;object-fit:contain}.brand .name{font-size:15px!important;line-height:1.2!important}.brand .name small{font-size:9px!important;letter-spacing:.025em!important;line-height:1.4}
 .nav-actions{flex:0 0 auto;gap:6px!important}.menu-toggle{display:flex!important;min-width:44px!important;width:44px!important;height:44px!important;background:#1c4436!important;border-color:#a3baae!important;z-index:auto!important}.menu-toggle span{background:#fffdf3!important;height:2px!important}
 .btn-ppdb{min-height:44px!important;padding:0 10px!important;font-size:12px!important}.nav-divider{display:none!important}
 body>nav.tabs,body>nav.tabs.open{position:fixed!important;inset:88px 12px auto!important;width:auto!important;margin:0!important;z-index:20004!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;gap:4px!important;padding:10px!important;background:#123329!important;border:1px solid #8ba998!important;border-radius:18px!important;box-shadow:0 15px 40px #0005!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;filter:none!important;max-height:calc(100vh - 106px)!important;max-height:calc(100dvh - 106px)!important;overflow-y:auto!important;overscroll-behavior:contain;transition:opacity .16s ease,transform .16s ease!important}
 body>nav.tabs:not(.open){opacity:0!important;visibility:hidden!important;pointer-events:none!important;transform:translateY(-8px)!important}
 body>nav.tabs.open{opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:translateY(0)!important}
 body>nav.tabs a,body>nav.tabs.open a{display:flex!important;align-items:center!important;justify-content:flex-start!important;min-height:46px!important;width:100%!important;box-sizing:border-box!important;padding:12px 16px!important;margin:0!important;font-family:Manrope,system-ui,sans-serif!important;font-size:15px!important;font-weight:600!important;line-height:1.4!important;letter-spacing:0!important;color:#f8f5e9!important;background:transparent!important;opacity:1!important;visibility:visible!important;transform:none!important;filter:none!important;transition:none!important;text-shadow:none!important;-webkit-text-fill-color:currentColor!important}
 body>nav.tabs a span{color:inherit!important;opacity:1!important;visibility:visible!important}
 body>nav.tabs a.active,body>nav.tabs a:hover,body>nav.tabs a:focus-visible{background:#efd18f!important;color:#102d22!important}
 body>nav.tabs a.active::after{background:#163b2d!important}
 body>.mobile-backdrop{position:fixed!important;inset:0!important;z-index:20002!important;display:block!important;background:#0009!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;opacity:0!important;visibility:hidden!important;pointer-events:none!important;transition:opacity .16s ease!important}
 body.menu-open>.mobile-backdrop{opacity:1!important;visibility:visible!important;pointer-events:auto!important}
 body.menu-open{overflow:hidden!important}.page-progress{z-index:20005}
 /* Keep the marquee; avoid expensive filter/blur/3D layers while scrolling. */
 body::before,body::after{display:none!important}
 #beranda .hero-feature-card.reveal{transform:none!important;transition:none!important}
 #beranda .hero-media img{transform:none!important;filter:none!important}
 #beranda .hero-feature-image-wrap img.is-current{animation:none!important}
 #beranda .hero-overlay-glow,#beranda .hero-grid{display:none!important}
 .hero-feature-card,.hero-stat,.visual-panel,.visual-stat-card,.final-cta-card,.overview-quote{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;box-shadow:none!important}
 .moment-card img,.overview-visual img,.hero-feature-image-wrap img{filter:none!important}
 .photo-dialog::backdrop{backdrop-filter:none!important}.values-ribbon>div{animation-duration:42s;will-change:transform}
 .exp-ready #beranda [data-exp-reveal]{transition:opacity .35s ease,translate .35s ease!important}
 .exp-ready #beranda [data-exp-reveal]:not(.exp-visible){translate:0 10px}
 .hero-stat .stat-label,.hero-stat small,.visual-stat-label,.visual-stat-card small,.micro-label,.discovery-index,.visual-caption{font-size:12px!important;letter-spacing:.025em!important;line-height:1.5!important}
 .hero-stat strong,.visual-stat-card strong,.public-stat-card .num{font-size:clamp(29px,8vw,38px)!important;line-height:1.2!important}
 .grade-top,.province-mini-top,.province-mini-top b{font-size:13px!important}
 .overview-points small{font-size:12px!important;line-height:1.65!important}.overview-points span{font-size:12px!important}
 .overview-copy p,.tagline,.home-section-head p,.discovery-heading p,.final-cta-card p{font-size:15px!important;line-height:1.8!important}
 .hero-kicker,.hero-badge{font-size:11px!important;letter-spacing:.04em!important;line-height:1.5!important}
 .scene-controls{gap:4px;right:8px;bottom:10px}.scene-controls button{width:44px;height:44px;font-size:12px}.hero-image-caption{right:160px!important;left:10px!important}.hero-image-caption b{font-size:17px!important}.hero-image-caption span{font-size:10px!important;letter-spacing:.02em!important}
 input,textarea,select{font-size:16px!important;min-height:44px}
}
@media(max-width:360px){.brand .name{font-size:13px!important}.brand .name small{font-size:8px!important}.brand-mark{width:38px!important;flex-basis:38px!important}.brand-mark img{width:36px!important}.btn-ppdb{padding:0 8px!important}.hero-image-caption b{font-size:15px!important}}
@media(prefers-reduced-motion:reduce){.values-ribbon>div{animation:none!important}.exp-ready #beranda [data-exp-reveal]{opacity:1!important;translate:none!important;transition:none!important}body>nav.tabs{transition:none!important}}
main .view h1,main .view h2,main .view h3{color:var(--school-text)}
#beranda .home-overview h2{color:var(--school-paper-text)!important}
@media(max-width:920px){.overlay{z-index:21000!important}.toast{z-index:22000!important}}