:root{--green-deep:#0a3d1f;--green-dark:#0f5c2e;--green-mid:#1a7a3e;--green-light:#2ecc71;--gold-deep:#7d5a00;--gold-mid:#c49a1a;--gold-bright:#e8c040;--gold-light:#f5e090;--white-80:#fffc;--white-40:#fff6;--font-display:"Cinzel", serif;--font-body:"Nunito", sans-serif;--ease:cubic-bezier(.4, 0, .2, 1);--radius-card:24px;--radius-input:12px;--a11y-subtitle:#d4a820;--a11y-footer-text:#ffffffa6;--a11y-footer-link:#d4aa2e}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;background-color:#071f0e;background-image:radial-gradient(80% 80% at 10% 10%,#0e4623e6 0%,#0000 60%),radial-gradient(60% 60% at 90% 90%,#c49a1a4d 0%,#0000 55%),radial-gradient(100% 100%,#071f0e 0%,#0a3d1f 100%);background-size:cover;background-attachment:fixed;min-height:100%}body{min-height:100%;font-family:var(--font-body);color:var(--white-80);background:0 0;line-height:1.6;overflow-x:hidden}img{max-width:100%;display:block}a{text-decoration:none}body:before{content:"";pointer-events:none;z-index:-2;background-image:repeating-linear-gradient(45deg,#e8c04009 0 1px,#0000 1px 40px),repeating-linear-gradient(-45deg,#e8c04009 0 1px,#0000 1px 40px);position:fixed;inset:0}body:after{content:"";pointer-events:none;z-index:-2;background:radial-gradient(300px at 0 0,#2ecc710d 0%,#0000 70%),radial-gradient(400px at 100% 100%,#e8c04012 0%,#0000 70%);position:fixed;inset:0}.orb{filter:blur(48px);pointer-events:none;z-index:-1;will-change:transform;border-radius:50%;animation:8s ease-in-out infinite alternate floatOrb;position:fixed}.orb-1{background:radial-gradient(circle,#1a7a3e38 0%,#0000 70%);width:min(360px,65vw);height:min(360px,65vw);top:-80px;left:-80px}.orb-2{background:radial-gradient(circle,#c49a1a2e 0%,#0000 70%);width:min(280px,55vw);height:min(280px,55vw);animation-delay:-3s;bottom:-60px;right:-60px}@keyframes floatOrb{0%{transform:translate(0)scale(1)}to{transform:translate(20px,14px)scale(1.06)}}@media (prefers-reduced-motion:reduce){.orb,.page-content,.banner-slide,.slider-track{transition:none!important;animation:none!important}.page-content{opacity:1}html{scroll-behavior:auto}}.brand-title{font-family:var(--font-display);letter-spacing:3px;text-transform:uppercase;background:linear-gradient(135deg,#f5e090 0%,#c49a1a 40%,#e8c040 70%,#f5e090 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-weight:700}.glass-panel{border-radius:var(--radius-card);-webkit-backdrop-filter:blur(10px);background:linear-gradient(135deg,#ffffff17 0%,#ffffff08 100%);border:1px solid #e8c04038;box-shadow:0 24px 56px #0000007a,inset 0 0 0 1px #ffffff0d}.section-title{text-align:center;margin-bottom:32px;font-size:clamp(20px,4vw,28px)}.insider-title-wrap{background:#0006;border:1px solid #e8c04026;border-radius:40px;margin:0 auto 40px;padding:12px 36px;display:inline-block;box-shadow:inset 0 3px 12px #000c,0 1px #ffffff1a}.btn-primary{cursor:pointer;font-family:var(--font-display);letter-spacing:1.5px;text-transform:uppercase;text-align:center;color:#fff;transition:transform .25s var(--ease), box-shadow .25s var(--ease);background:linear-gradient(135deg,#1a7a3e 0%,#2ecc71 100%);border:none;border-radius:999px;padding:12px 26px;font-size:13px;font-weight:600;display:inline-block;position:relative;overflow:hidden;box-shadow:0 4px 18px #00000061,0 0 28px #1a7a3e40}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 28px #0000007a,0 0 38px #2ecc7166}.btn-outline{cursor:pointer;font-family:var(--font-display);letter-spacing:1.5px;text-transform:uppercase;text-align:center;color:#fff;transition:transform .25s var(--ease), background .25s var(--ease);background:#ffffff14;border:1px solid #fff6;border-radius:999px;padding:12px 26px;font-size:13px;font-weight:600;display:inline-block}.btn-outline:hover{background:#ffffff29;transform:translateY(-2px)}.navbar{z-index:100;-webkit-backdrop-filter:blur(12px);background:#0a3d1fb3;border:1px solid #e8c04033;border-radius:50px;justify-content:space-between;align-items:center;width:calc(100% - clamp(16px,4vw,48px));max-width:1800px;margin:16px auto;padding:10px 24px;display:flex;position:sticky;top:16px;box-shadow:0 8px 32px #0000004d}.nav-logo-wrap{flex:1;justify-content:flex-start;align-items:center;display:flex}.nav-logo{cursor:pointer;background:0 0;border:none;align-items:center;gap:12px;display:flex}.nav-logo img{border:2px solid var(--gold-mid);object-fit:contain;background:#fff;border-radius:50%;width:40px;height:40px}.nav-logo .brand-title{letter-spacing:2px;white-space:nowrap;margin:0;font-size:18px}.title-break{display:inline}.nav-center{flex:2;justify-content:center;align-items:center;display:flex;position:relative}.nav-links{justify-content:center;align-items:center;gap:24px;list-style:none;display:flex}.nav-item{color:var(--white-80);cursor:pointer;font:inherit;background:0 0;border:none;justify-content:center;align-items:center;padding:8px;display:flex;position:relative}.nav-item svg{width:24px;height:24px;transition:transform .3s var(--ease), color .3s var(--ease)}.nav-item:hover svg,.nav-item.active-link svg{color:var(--gold-bright);transform:scale(1.15)}.nav-text{display:none}.nav-tooltip{color:var(--gold-light);white-space:nowrap;pointer-events:none;opacity:0;visibility:hidden;transition:.3s var(--ease);font-size:12px;font-family:var(--font-body);z-index:101;background:#0a3d1ff2;border:1px solid #e8c0404d;border-radius:8px;padding:6px 14px;font-weight:600;position:absolute;bottom:-38px;left:50%;transform:translate(-50%)translateY(-5px);box-shadow:0 4px 12px #0000004d}.nav-item:hover .nav-tooltip,.nav-item:focus .nav-tooltip{opacity:1;visibility:visible;transform:translate(-50%)translateY(0)}.nav-right{flex:1;justify-content:flex-end;align-items:center;display:flex}.btn-login{color:#fff;font-family:var(--font-display);letter-spacing:1.5px;text-transform:uppercase;text-align:center;white-space:nowrap;background:linear-gradient(135deg,#1a7a3e 0%,#2ecc71 100%);border:none;border-radius:999px;padding:10px 24px;font-size:clamp(12px,3vw,14px);font-weight:700;transition:transform .25s,box-shadow .25s;display:inline-block;box-shadow:0 4px 15px #0000004d}.btn-login:hover{transform:translateY(-2px);box-shadow:0 6px 20px #0006,0 0 18px #2ecc7166}.menu-toggle{color:var(--gold-bright);cursor:pointer;background:0 0;border:none;padding:0;font-size:28px;line-height:1;display:none}.page-content{opacity:0;animation:.4s forwards fadeIn}@keyframes fadeIn{to{opacity:1}}.container{max-width:1800px;margin:0 auto;padding:20px clamp(16px,3vw,40px) 80px}section{margin-bottom:60px;scroll-margin-top:120px}.section-divider{background:linear-gradient(90deg,#0000 0%,#e8c04066 50%,#0000 100%);justify-content:center;align-items:center;width:80%;max-width:600px;height:1px;margin:0 auto 80px;display:flex;position:relative}.section-divider:after{content:"✦";color:var(--gold-bright);text-shadow:0 0 10px #e8c040cc;background:#071f0e;padding:0 12px;font-size:18px}.banner-wrapper{border-radius:var(--radius-card);width:100%;height:clamp(320px,50vw,500px);margin-bottom:80px;position:relative;overflow:hidden;box-shadow:0 24px 56px #0000007a}.banner-slide{opacity:0;transition:opacity 1s var(--ease);text-align:center;background-position:50%;background-size:cover;flex-direction:column;justify-content:center;align-items:center;padding:20px;display:flex;position:absolute;inset:0}.banner-slide:before{content:"";background:linear-gradient(#00000073 0%,#0a3d1feb 100%);position:absolute;inset:0}.banner-slide.active{opacity:1;z-index:2}.banner-content{z-index:3;max-width:800px;position:relative}.banner-content h2{font-family:var(--font-display);color:#fff;text-shadow:0 4px 10px #000c;margin-bottom:16px;font-size:clamp(24px,5vw,46px)}.banner-content p{color:#ffffffe6;margin-bottom:24px;font-size:clamp(14px,2vw,18px)}.slider-container{padding:20px 0;position:relative;overflow:hidden}.slider-track{transition:transform .5s var(--ease);display:flex}.slider-item{flex:none;padding:0 10px}.pengurus-item-container{text-align:center;flex-direction:column;align-items:center;display:flex}.pengurus-circle{aspect-ratio:1;border-radius:50%;justify-content:center;align-items:center;width:100%;max-width:200px;margin:0 auto 16px;display:flex}.pengurus-item-container .logo-ring{background:radial-gradient(circle,#1a7a3e4d 0%,#0a3d1f99 100%);border-radius:50%;justify-content:center;align-items:center;width:80%;height:80%;display:inline-flex;position:relative;box-shadow:0 0 20px #c49a1a3d}.pengurus-item-container .logo-ring:before{content:"";z-index:-1;background:conic-gradient(#c49a1a 0deg,#f5e090 90deg,#c49a1a 180deg,#7d5a00 270deg,#c49a1a 360deg);border-radius:50%;position:absolute;inset:-3px}.pengurus-avatar{width:calc(100% - 12px);height:calc(100% - 12px);font-family:var(--font-display);color:var(--gold-light);z-index:1;letter-spacing:1px;background:linear-gradient(135deg,#0f5c2e 0%,#0a3d1f 100%);border-radius:50%;justify-content:center;align-items:center;margin:6px;font-size:clamp(28px,6vw,44px);font-weight:700;display:flex;position:relative}.pengurus-item-container h3{color:var(--gold-light);font-size:clamp(16px,2.5vw,20px);font-family:var(--font-display);margin-bottom:4px}.pengurus-item-container p{color:var(--a11y-subtitle);font-size:clamp(13px,1.8vw,15px);font-weight:600}.kartu-card{aspect-ratio:86/54;background:linear-gradient(135deg,#0f5c2e 0%,#0a3d1f 60%,#07331a 100%);border:1px solid #e8c0404d;border-radius:14px;flex-direction:column;justify-content:space-between;padding:16px;display:flex;position:relative;overflow:hidden;box-shadow:0 10px 20px #00000080}.kartu-card:after{content:"";pointer-events:none;background:radial-gradient(circle,#e8c0402e 0%,#0000 70%);width:70%;height:160%;position:absolute;top:-40%;right:-20%}.kartu-top{z-index:1;justify-content:space-between;align-items:center;display:flex;position:relative}.kartu-top .brand-title{letter-spacing:1.5px;font-size:12px}.kartu-chip{background:linear-gradient(135deg,#f5e090,#c49a1a);border-radius:5px;width:34px;height:26px}.kartu-name{z-index:1;font-family:var(--font-display);color:#fff;font-size:clamp(14px,2vw,17px);position:relative}.kartu-no{z-index:1;color:var(--gold-light);letter-spacing:2px;font-size:13px;position:relative}.grid-container{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;display:grid}.kegiatan-card{border-radius:16px;align-items:stretch;display:flex;overflow:hidden}.kegiatan-date{text-align:center;background:linear-gradient(135deg,#1a7a3e 0%,#0a3d1f 100%);border-right:1px solid #e8c04033;flex-direction:column;justify-content:center;min-width:90px;padding:20px;display:flex}.kegiatan-date span.tgl{color:var(--gold-light);font-size:28px;font-weight:700;font-family:var(--font-display)}.kegiatan-date span.bln{text-transform:uppercase;letter-spacing:1px;font-size:12px}.kegiatan-info{flex:1;padding:20px}.kegiatan-info h3{color:var(--gold-bright);margin-bottom:8px;font-size:16px}.kegiatan-info p{color:var(--white-80);align-items:center;gap:8px;margin-bottom:4px;font-size:13px;display:flex}.contact-wrapper{grid-template-columns:1fr 1fr;align-items:start;gap:40px;display:grid}.contact-info h3{color:var(--gold-light);font-size:20px;font-family:var(--font-display);margin-bottom:20px}.info-card{background:#0003;border:1px solid #e8c0401a;border-radius:16px;gap:16px;margin-bottom:24px;padding:20px;display:flex}.info-icon{font-size:24px;line-height:1.2}.info-detail h4{color:var(--gold-bright);margin-bottom:4px;font-size:15px}.info-detail p{color:var(--white-80);font-size:14px;line-height:1.5}.form-group{margin-bottom:20px}.form-label{letter-spacing:1.4px;text-transform:uppercase;color:#dbb830;margin-bottom:8px;font-size:11px;font-weight:700;display:block}.form-input{border-radius:var(--radius-input);width:100%;font-family:var(--font-body);color:var(--white-80);background:#00000047;border:1px solid #e8c04029;outline:none;padding:14px 16px;font-size:14px;transition:border-color .25s,box-shadow .25s}.form-input:focus{background:#1a7a3e1c;border-color:#2ecc71eb;box-shadow:0 0 0 3px #2ecc7138}textarea.form-input{resize:vertical;min-height:120px}.page-head{text-align:center;margin-top:20px;margin-bottom:60px}.page-head h1{margin-bottom:16px;font-size:clamp(28px,5vw,42px)}.page-head p{color:var(--a11y-subtitle);max-width:600px;margin:0 auto}.organigram-container{justify-content:center;padding:20px 0 60px;display:flex;overflow-x:auto}.tree{flex-direction:column;align-items:center;display:inline-flex}.tree ul{justify-content:center;padding-top:20px;list-style-type:none;display:flex;position:relative}.tree li{text-align:center;padding:20px 10px 0;position:relative}.tree li:before,.tree li:after{content:"";border-top:2px solid var(--gold-mid);width:50%;height:20px;position:absolute;top:0;right:50%}.tree li:after{border-left:2px solid var(--gold-mid);left:50%;right:auto}.tree li:only-child:after,.tree li:only-child:before{display:none}.tree li:only-child{padding-top:0}.tree li:first-child:before,.tree li:last-child:after{border:0}.tree li:last-child:before{border-right:2px solid var(--gold-mid);border-radius:0 5px 0 0}.tree li:first-child:after{border-radius:5px 0 0}.tree ul:before{content:"";border-left:2px solid var(--gold-mid);width:0;height:20px;position:absolute;top:0;left:50%;transform:translate(-50%)}.tree-node{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);color:var(--gold-light);font-weight:700;font-family:var(--font-display);text-align:center;background:linear-gradient(135deg,#1a7a3e66 0%,#0a3d1fcc 100%);border:1px solid #e8c04066;border-radius:12px;min-width:140px;padding:12px 24px;transition:transform .3s;display:inline-block;box-shadow:0 4px 15px #0000004d}.tree-node:hover{border-color:var(--gold-bright);transform:scale(1.05)}.tree-node span{color:var(--white-80);font-size:12px;font-family:var(--font-body);margin-top:4px;font-weight:400;display:block}.table-wrapper{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(135deg,#ffffff0f 0%,#ffffff05 100%);border:1px solid #e8c04033;border-radius:16px;margin-top:40px;overflow-x:auto}.glass-table{border-collapse:collapse;text-align:left;width:100%}.glass-table th{color:var(--gold-light);font-family:var(--font-display);letter-spacing:1px;background:#0a3d1f99;padding:18px 24px}.glass-table td{color:var(--white-80);border-bottom:1px solid #e8c0401a;padding:16px 24px}.glass-table tr:last-child td{border-bottom:none}.glass-table tr:hover td{background:#ffffff0d}footer{background:#0006;border-top:1px solid #e8c0401a;margin-top:40px;padding:30px clamp(16px,3vw,40px) 18px}.footer-grid{grid-template-columns:1.6fr 1.2fr 1fr;align-items:start;gap:18px 40px;max-width:1800px;margin:0 auto;display:grid}.footer-brand-col{align-items:center;gap:12px;display:flex}.footer-brand-col img{object-fit:contain;background:#fff;border-radius:50%;flex-shrink:0;width:48px;height:48px}.footer-brand-col .brand-title{letter-spacing:1.5px;font-size:16px}.footer-brand-col p{color:var(--a11y-footer-text);margin-top:2px;font-size:12px}.footer-col h4{color:var(--gold-bright);font-size:13px;font-family:var(--font-display);letter-spacing:1px;text-transform:uppercase;margin-bottom:8px}.footer-col p,.footer-col a{color:var(--a11y-footer-text);font-size:13px;line-height:1.5;display:block}.footer-col a:hover{color:var(--gold-bright)}.footer-social{gap:10px;display:flex}.footer-social a{width:38px;height:38px;color:var(--gold-light);transition:transform .25s var(--ease), background .25s, border-color .25s, color .25s;background:#ffffff0d;border:1px solid #e8c04040;border-radius:50%;justify-content:center;align-items:center;display:flex}.footer-social a:hover{color:#fff;background:#e8c04026;border-color:#e8c04099;transform:translateY(-2px)}.footer-social svg{width:18px;height:18px}.footer-bottom{text-align:center;max-width:1800px;color:var(--a11y-footer-text);border-top:1px solid #e8c0401a;margin:16px auto 0;padding-top:14px;font-size:12px}@media (width<=768px){.footer-grid{text-align:center;grid-template-columns:1fr;gap:22px}.footer-brand-col,.footer-social{justify-content:center}}@media (width<=992px){.contact-wrapper{grid-template-columns:1fr}.title-break{display:block}.nav-logo .brand-title{letter-spacing:1.5px;font-size:14px;line-height:1.2}.nav-item svg{width:22px;height:22px}.nav-links{gap:14px}.btn-login{padding:8px 16px;font-size:12px}}@media (width<=768px){.navbar{padding:10px 16px}.nav-logo-wrap,.nav-center,.nav-right{flex:1}.nav-logo .brand-title{letter-spacing:1px;text-align:left;margin-top:2px;font-size:12px;display:block}.nav-logo img{width:36px;height:36px}.nav-logo{gap:8px}.menu-toggle{transition:transform .3s var(--ease), color .3s var(--ease);margin:0 auto;display:block}.menu-toggle.open{color:var(--gold-light);transform:rotate(90deg)}.nav-links{-webkit-backdrop-filter:blur(16px);pointer-events:none;opacity:0;transform-origin:top;transition:opacity .28s var(--ease), transform .28s var(--ease), visibility .28s;visibility:hidden;background:#082d16f7;border:1px solid #e8c0404d;border-radius:20px;flex-direction:column;align-items:stretch;padding:8px 16px 16px;position:absolute;top:calc(100% + 12px);left:0;right:0;transform:translateY(-12px)scaleY(.92);box-shadow:0 20px 48px #0000008c,inset 0 0 0 1px #ffffff0a}.nav-links.active{pointer-events:auto;opacity:1;visibility:visible;transform:translateY(0)scaleY(1)}.nav-links li{border-bottom:1px solid #e8c0401f;width:100%}.nav-links li:last-child{border-bottom:none}.nav-item{border-radius:12px;justify-content:flex-start;width:100%;padding:14px 12px}.nav-item:hover{background:#2ecc7112}.nav-text{font-size:14px;font-family:var(--font-body);margin-left:14px;display:inline-block}.nav-item:hover .nav-text,.nav-item.active-link .nav-text{color:var(--gold-light)}.nav-tooltip{display:none!important}.btn-login{padding:8px 14px;font-size:11px}}
