:root{--color-primary:#8b7355;--color-primary-dark:#6b5a45;--color-primary-light:#a68f6f;--color-secondary:#d4c4b0;--color-accent:#f5f5f0;--color-accent-dark:#e8e8e0;--color-white:#ffffff;--color-light:#f8f9fa;--color-gray-100:#f3f4f6;--color-gray-200:#e5e7eb;--color-gray-300:#d1d5db;--color-gray-400:#9ca3af;--color-gray-500:#6b7280;--color-gray-600:#4b5563;--color-gray-700:#374151;--color-gray-800:#1f2937;--color-dark:#111827;--font-serif:'Georgia','Times New Roman',serif;--font-sans:'Poppins',-apple-system,BlinkMacSystemFont,'Segoe UI','Roboto','Helvetica Neue',Arial,sans-serif;--font-size-xs:clamp(0.75rem, 0.5vw + 0.5rem, 0.875rem);--font-size-sm:clamp(0.875rem, 0.5vw + 0.75rem, 1rem);--font-size-base:clamp(1rem, 0.5vw + 0.875rem, 1.125rem);--font-size-lg:clamp(1.125rem, 0.5vw + 1rem, 1.25rem);--font-size-xl:clamp(1.25rem, 0.5vw + 1.125rem, 1.5rem);--font-size-2xl:clamp(1.5rem, 1vw + 1.25rem, 2rem);--font-size-3xl:clamp(2rem, 1.5vw + 1.5rem, 2.5rem);--font-weight-light:300;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--line-height-tight:1.25;--line-height-normal:1.5;--line-height-relaxed:1.75;--letter-spacing-tight:-0.025em;--letter-spacing-normal:0;--letter-spacing-wide:0.025em;--letter-spacing-wider:0.05em;--spacing-xs:0.5rem;--spacing-sm:1rem;--spacing-md:1.5rem;--spacing-lg:2rem;--spacing-xl:3rem;--shadow-sm:0 1px 2px 0 rgba(0, 0, 0, 0.05);--shadow-md:0 4px 6px -1px rgba(0, 0, 0, 0.1),0 2px 4px -1px rgba(0, 0, 0, 0.06);--shadow-lg:0 10px 15px -3px rgba(0, 0, 0, 0.1),0 4px 6px -2px rgba(0, 0, 0, 0.05);--shadow-xl:0 20px 25px -5px rgba(0, 0, 0, 0.1),0 10px 10px -5px rgba(0, 0, 0, 0.04);--radius-sm:0.375rem;--radius-md:0.5rem;--radius-lg:0.75rem;--radius-xl:1rem;--transition-fast:150ms ease-in-out;--transition-base:300ms ease-in-out;--transition-slow:500ms ease-in-out}[data-theme=dark]{--color-white:#1f2937;--color-light:#374151;--color-gray-100:#4b5563;--color-gray-800:#f3f4f6;--color-dark:#f8f9fa}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:var(--font-sans);font-size:16px;line-height:1.6;color:var(--color-gray-800);background-color:var(--color-light);padding-top:120px;min-height:100vh}h1,h2,h3,h4,h5,h6{font-family:var(--font-serif);font-weight:700;line-height:1.2;margin-bottom:var(--spacing-sm);color:var(--color-secondary)}h1{font-size:2.5rem}h2{font-size:2rem}h3{font-size:1.75rem}h4{font-size:1.5rem}h5{font-size:1.25rem}h6{font-size:1rem}p{margin-bottom:var(--spacing-sm);font-size:16px}a{color:var(--color-primary);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--color-primary-dark)}.main-content{min-height:calc(100vh - 200px);padding:var(--spacing-lg) 0}.content-area{padding-right:var(--spacing-lg)}.hero-section{margin-bottom:var(--spacing-xl);border-radius:var(--radius-xl);overflow:hidden;box-shadow:var(--shadow-lg)}.hero-slide{height:400px;background:linear-gradient(135deg,var(--color-primary) 0,var(--color-primary-dark) 100%);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.hero-slide::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:url('data:image/svg+xml,<svg width="100" height="100" xmlns="http://www.w3.org/2000/svg"><defs><pattern id="grid" width="100" height="100" patternUnits="userSpaceOnUse"><path d="M 100 0 L 0 0 0 100" fill="none" stroke="rgba(255,255,255,0.1)" stroke-width="1"/></pattern></defs><rect width="100" height="100" fill="url(%23grid)"/></svg>');opacity:.3}.hero-slide-2{background:linear-gradient(135deg,var(--color-secondary) 0,#34495e 100%)}.hero-content{position:relative;z-index:1;text-align:center;color:var(--color-white);padding:var(--spacing-xl)}.hero-title{font-size:3rem;font-weight:700;margin-bottom:var(--spacing-sm);color:var(--color-white);text-shadow:2px 2px 4px rgba(0,0,0,.2)}.hero-subtitle{font-size:1.25rem;margin-bottom:var(--spacing-lg);opacity:.95}.btn-hero{background:var(--color-accent);color:var(--color-secondary);padding:.875rem 2rem;border-radius:var(--radius-lg);font-weight:600;text-decoration:none;display:inline-block;transition:all var(--transition-base);box-shadow:var(--shadow-md)}.btn-hero:hover{background:var(--color-accent-dark);transform:translateY(-2px);box-shadow:var(--shadow-lg);color:var(--color-secondary)}.carousel-control-next,.carousel-control-prev{width:50px;height:50px;background:rgba(255,255,255,.2);border-radius:50%;top:50%;transform:translateY(-50%);opacity:.8;transition:opacity var(--transition-fast)}.carousel-control-next:hover,.carousel-control-prev:hover{opacity:1;background:rgba(255,255,255,.3)}.carousel-control-prev{left:var(--spacing-md)}.carousel-control-next{right:var(--spacing-md)}section{display:block!important;visibility:visible!important}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing-md);padding-left:0;margin-left:0}.section-title{font-family:var(--font-serif);font-size:1.75rem;color:var(--color-secondary);display:flex;align-items:center;gap:var(--spacing-sm);margin:0}.section-link{color:var(--color-primary);font-weight:500;display:flex;align-items:center;gap:.5rem;transition:gap var(--transition-fast)}.section-link:hover{gap:1rem;color:var(--color-primary-dark)}.card{background:var(--color-white);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);border:none;overflow:hidden;transition:transform var(--transition-base),box-shadow var(--transition-base)}.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}.card-berita{height:100%;display:flex;flex-direction:column}.card-img-wrapper{position:relative;overflow:hidden;height:200px}.card-img-top{width:100%;height:100%;object-fit:cover;transition:transform var(--transition-base)}.card-berita:hover .card-img-top{transform:scale(1.1)}.card-body{padding:var(--spacing-md);flex:1;display:flex;flex-direction:column}.card-date{font-size:.875rem;color:var(--color-gray-500);display:flex;align-items:center;gap:.5rem;margin-bottom:var(--spacing-sm)}.card-title{font-size:1.125rem;margin-bottom:var(--spacing-sm)}.card-title a{color:var(--color-secondary);transition:color var(--transition-fast)}.card-title a:hover{color:var(--color-primary)}.card-text{color:var(--color-gray-600);font-size:.9375rem;flex:1;margin-bottom:var(--spacing-sm)}.card-link{color:var(--color-primary);font-weight:500;display:inline-flex;align-items:center;gap:.5rem;margin-top:auto}.card-pengumuman{margin-bottom:var(--spacing-md)}.pengumuman-list{display:flex;flex-direction:column;gap:var(--spacing-sm)}.pengumuman-item{display:flex;align-items:center;gap:var(--spacing-md);padding:var(--spacing-md);border-radius:var(--radius-md);transition:background var(--transition-fast)}.pengumuman-item:hover{background:var(--color-gray-100)}.pengumuman-featured{background:linear-gradient(135deg,var(--color-primary-light) 0,var(--color-primary) 100%);color:var(--color-white)}.pengumuman-featured .pengumuman-title a{color:var(--color-white)}.pengumuman-featured .pengumuman-date{color:rgba(255,255,255,.9)}.pengumuman-icon{width:48px;height:48px;background:var(--color-primary-light);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--color-white);flex-shrink:0}.pengumuman-featured .pengumuman-icon{background:rgba(255,255,255,.2)}.pengumuman-content{flex:1}.pengumuman-title{font-size:1rem;margin-bottom:.25rem}.pengumuman-date{font-size:.875rem;color:var(--color-gray-500);display:flex;align-items:center;gap:.5rem}.badge{padding:.25rem .75rem;border-radius:var(--radius-sm);font-size:.75rem;font-weight:600}.badge-new{background:var(--color-accent);color:var(--color-secondary)}.card-agenda{margin-bottom:var(--spacing-md)}.agenda-list{display:flex;flex-direction:column;gap:var(--spacing-md)}.agenda-item{display:flex;gap:var(--spacing-md);padding:var(--spacing-md);border-left:4px solid var(--color-primary);border-radius:var(--radius-md);transition:background var(--transition-fast)}.agenda-item:hover{background:var(--color-gray-100)}.agenda-date{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:60px;padding:var(--spacing-sm);background:var(--color-primary);color:var(--color-white);border-radius:var(--radius-md);text-align:center}.agenda-day{font-size:1.5rem;font-weight:700;line-height:1}.agenda-month{font-size:.75rem;text-transform:uppercase;margin-top:.25rem}.agenda-content{flex:1}.agenda-title{font-size:1.125rem;margin-bottom:var(--spacing-xs);color:var(--color-secondary)}.agenda-location,.agenda-time{font-size:.875rem;color:var(--color-gray-600);display:flex;align-items:center;gap:.5rem;margin-bottom:.25rem}.card-faq{margin-bottom:var(--spacing-md)}.accordion-item{border:none;border-bottom:1px solid var(--color-gray-200)}.accordion-item:last-child{border-bottom:none}.accordion-button{background:0 0;border:none;padding:var(--spacing-md);font-weight:600;color:var(--color-secondary);box-shadow:none}.accordion-button:not(.collapsed){background:var(--color-gray-100);color:var(--color-primary)}.accordion-button:focus{box-shadow:none;border-color:transparent}.accordion-body{padding:0 var(--spacing-md) var(--spacing-md);color:var(--color-gray-600);font-size:16px}.site-footer{background:linear-gradient(135deg,var(--color-secondary) 0,var(--color-gray-800) 100%);color:var(--color-white);padding:var(--spacing-xl) 0 var(--spacing-md);margin-top:var(--spacing-xl)}.footer-title{font-family:var(--font-serif);font-size:1.25rem;margin-bottom:var(--spacing-md);color:var(--color-white)}.footer-text{display:flex;align-items:flex-start;gap:var(--spacing-sm);margin-bottom:var(--spacing-sm);color:rgba(255,255,255,.9);font-size:16px}.footer-link{color:var(--color-primary);text-decoration:none;font-size:.9rem;transition:color .3s ease}.footer-link:hover{color:var(--color-primary-dark);text-decoration:underline}.footer-links{list-style:none;padding:0}.footer-links li{margin-bottom:var(--spacing-sm)}.footer-links a{color:rgba(255,255,255,.9);text-decoration:none;transition:color var(--transition-fast);font-size:16px}.footer-links a:hover{color:var(--color-accent)}.social-links{display:flex;gap:var(--spacing-sm);flex-wrap:wrap}.social-link{width:40px;height:40px;background:rgba(255,255,255,.1);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--color-white);font-size:1.125rem;transition:all var(--transition-fast)}.social-link:hover{background:var(--color-accent);color:var(--color-secondary);transform:translateY(-2px)}.footer-divider{border-color:rgba(255,255,255,.2);margin:var(--spacing-lg) 0 var(--spacing-md)}.footer-copyright{text-align:center;color:rgba(255,255,255,.8);font-size:.875rem;margin:0}.footer-copyright{display:inline-block;padding:.35rem .75rem;border-radius:999px;background:rgba(0,0,0,.25)}.footer-links-mobile{background:linear-gradient(135deg,#111827 0,#1f2937 100%);color:#fff;border-top:1px solid rgba(255,255,255,.12)}.footer-links-mobile .footer-link,.footer-links-mobile .footer-links{color:rgba(255,255,255,.92)}.footer-links-mobile .footer-link:hover{color:var(--color-accent,#ffc107)}.footer-links{text-align:center;margin-top:.5rem}.footer-link{color:rgba(255,255,255,.9);text-decoration:none;font-size:.875rem;transition:color .3s ease}.footer-link:hover{color:var(--color-accent,#ffc107);text-decoration:underline}.whatsapp-button{position:fixed;bottom:100px;right:var(--spacing-lg);background:#25d366;color:var(--color-white);width:60px;height:60px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.5rem;box-shadow:var(--shadow-xl);z-index:999;transition:all var(--transition-base);text-decoration:none}.whatsapp-button:hover{transform:scale(1.1);box-shadow:0 0 20px rgba(37,211,102,.5);color:var(--color-white)}.whatsapp-text{position:absolute;right:70px;background:#25d366;color:var(--color-white);padding:.5rem 1rem;border-radius:var(--radius-lg);white-space:nowrap;opacity:0;pointer-events:none;transition:opacity var(--transition-base);font-size:.875rem;font-weight:500}.whatsapp-button:hover .whatsapp-text{opacity:1}.back-to-top{position:fixed;bottom:var(--spacing-lg);right:var(--spacing-lg);background:var(--color-primary);color:var(--color-white);width:50px;height:50px;border:none;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.25rem;box-shadow:var(--shadow-lg);z-index:998;cursor:pointer;opacity:0;visibility:hidden;transition:all var(--transition-base)}.back-to-top.visible{opacity:1;visibility:visible}.back-to-top:hover{background:var(--color-primary-dark);transform:translateY(-4px);box-shadow:var(--shadow-xl)}.alert{padding:var(--spacing-md);border-radius:var(--radius-md);border:1px solid}.alert-info{background:#dbeafe;border-color:#93c5fd;color:#1e40af}a:focus,button:focus,input:focus,select:focus,textarea:focus{outline:3px solid var(--color-accent);outline-offset:2px}.card-footer-actions{display:flex;justify-content:space-between;align-items:center;margin-top:1rem;padding-top:1rem;border-top:1px solid var(--color-gray-200)}.share-buttons{display:flex;gap:.5rem;align-items:center}.share-btn{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;border:none;background:var(--color-gray-100);color:var(--color-gray-600);text-decoration:none;transition:all .3s ease;cursor:pointer;font-size:.875rem}.share-btn:hover{transform:translateY(-2px);box-shadow:0 4px 8px rgba(0,0,0,.1)}.share-btn.share-facebook:hover{background:#1877f2;color:var(--color-white)}.share-btn.share-twitter:hover{background:#1da1f2;color:var(--color-white)}.share-btn.share-whatsapp:hover{background:#25d366;color:var(--color-white)}.share-btn.share-copy:hover{background:var(--color-primary);color:var(--color-white)}.share-btn-small{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;border-radius:50%;background:var(--color-gray-100);color:var(--color-gray-600);text-decoration:none;transition:all .3s ease;font-size:.75rem;margin-left:.5rem}.share-btn-small:hover{background:#25d366;color:var(--color-white);transform:scale(1.1)}.pengumuman-share{display:inline-flex;align-items:center;margin-top:.25rem}.notification-toast{position:fixed;bottom:20px;right:20px;background:var(--color-white);color:var(--color-gray-800);padding:1rem 1.5rem;border-radius:var(--radius-md);box-shadow:var(--shadow-xl);display:flex;align-items:center;gap:.75rem;z-index:10000;opacity:0;transform:translateY(20px);transition:all .3s ease;max-width:350px;border-left:4px solid var(--color-primary)}.notification-toast.show{opacity:1;transform:translateY(0)}.notification-toast i{font-size:1.25rem}.notification-toast.notification-success{border-left-color:#10b981}.notification-toast.notification-success i{color:#10b981}.notification-toast.notification-error{border-left-color:#ef4444}.notification-toast.notification-error i{color:#ef4444}.notification-toast.notification-info{border-left-color:var(--color-primary)}.notification-toast.notification-info i{color:var(--color-primary)}[data-theme=dark] .notification-toast{background:var(--color-gray-800);color:var(--color-white)}.loading-skeleton{background:linear-gradient(90deg,var(--color-gray-200) 25%,var(--color-gray-100) 50%,var(--color-gray-200) 75%);background-size:200% 100%;animation:loading 1.5s ease-in-out infinite;border-radius:var(--radius-sm)}@keyframes loading{0%{background-position:200% 0}100%{background-position:-200% 0}}[data-theme=dark] .loading-skeleton{background:linear-gradient(90deg,var(--color-gray-700) 25%,var(--color-gray-600) 50%,var(--color-gray-700) 75%);background-size:200% 100%}@media (max-width:768px){.card-footer-actions{flex-direction:column;align-items:flex-start;gap:.75rem}.share-buttons{width:100%;justify-content:flex-start}.notification-toast{right:10px;left:10px;max-width:none}}.card-stat{border:none;box-shadow:var(--shadow-md);transition:all var(--transition-base);overflow:hidden}.card-stat:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}.stat-icon{width:80px;height:80px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 1rem;font-size:2rem;color:var(--color-white)}.stat-icon-total{background:linear-gradient(135deg,#10b981,#059669)}.stat-icon-male{background:linear-gradient(135deg,#3b82f6,#2563eb)}.stat-icon-female{background:linear-gradient(135deg,#ec4899,#db2777)}.stat-value{font-size:2.5rem;font-weight:700;color:var(--color-gray-800);margin:.5rem 0;line-height:1.2}.stat-label{font-size:1rem;color:var(--color-gray-600);font-weight:500;margin-bottom:.5rem}.stat-percentage{font-size:.875rem;color:var(--color-primary);font-weight:600;margin-top:.5rem}.stat-detail-item{padding:1rem;background:var(--color-gray-50);border-radius:var(--radius-md);border-left:4px solid var(--color-primary)}.stat-detail-label{font-size:.875rem;color:var(--color-gray-600);margin-bottom:.5rem}.stat-detail-value{font-size:1.5rem;font-weight:700;color:var(--color-gray-800);margin-bottom:.5rem}[data-theme=dark] .stat-detail-value,[data-theme=dark] .stat-value{color:var(--color-white)}[data-theme=dark] .stat-detail-label,[data-theme=dark] .stat-label{color:var(--color-gray-300)}[data-theme=dark] .stat-detail-item{background:var(--color-gray-700)}.section-chart .card{border:none;box-shadow:var(--shadow-md)}.section-chart .card-header{background:var(--gradient-primary);color:var(--color-white);border-bottom:none}.section-chart .card-title{color:var(--color-white);margin:0;font-size:1.25rem;font-weight:600}.section-chart .card-title i{margin-right:.5rem}@media (max-width:768px){.stat-value{font-size:2rem}.stat-icon{width:60px;height:60px;font-size:1.5rem}}.card-faq-category{border:none;box-shadow:var(--shadow-md);transition:all var(--transition-base);text-decoration:none;color:inherit;height:100%;display:block}.card-faq-category:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--color-primary);text-decoration:none;color:inherit}.faq-category-icon{width:64px;height:64px;border-radius:var(--radius-lg);background:var(--gradient-primary);display:flex;align-items:center;justify-content:center;margin-bottom:1rem;color:var(--color-white);font-size:1.75rem;transition:all var(--transition-base)}.card-faq-category:hover .faq-category-icon{transform:scale(1.1) rotate(5deg);box-shadow:var(--shadow-primary)}.faq-category-title{font-size:1.125rem;font-weight:600;color:var(--color-gray-800);margin-bottom:.75rem;line-height:1.4}.card-faq-category:hover .faq-category-title{color:var(--color-primary)}.faq-category-desc{font-size:.875rem;color:var(--color-gray-600);margin-bottom:1rem;line-height:1.6}.faq-category-link{display:inline-flex;align-items:center;gap:.5rem;font-size:.875rem;font-weight:500;color:var(--color-primary);transition:all var(--transition-base)}.card-faq-category:hover .faq-category-link{gap:.75rem;color:var(--color-primary-dark)}.faq-category-link i{transition:transform var(--transition-base)}.card-faq-category:hover .faq-category-link i{transform:translateX(4px)}.section-faq-accordion .accordion-item{border:1px solid var(--color-gray-200);border-radius:var(--radius-md);margin-bottom:.75rem;overflow:hidden}.section-faq-accordion .accordion-button{background:var(--color-white);color:var(--color-gray-800);font-weight:600;padding:1rem 1.5rem;border:none;box-shadow:none}.section-faq-accordion .accordion-button:not(.collapsed){background:var(--gradient-primary);color:var(--color-white);box-shadow:none}.section-faq-accordion .accordion-button:focus{box-shadow:0 0 0 .25rem rgba(196,30,58,.25);border-color:var(--color-primary)}.section-faq-accordion .accordion-body{padding:1.5rem;background:var(--color-gray-50);color:var(--color-gray-700);line-height:1.8}.quicklinks-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:1rem}.quicklink-item{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:1.5rem 1rem;background:var(--color-gray-50);border-radius:var(--radius-md);text-decoration:none;color:var(--color-gray-700);transition:all var(--transition-base);border:2px solid transparent;text-align:center;gap:.75rem}.quicklink-item:hover{background:var(--color-white);border-color:var(--color-primary);color:var(--color-primary);transform:translateY(-4px);box-shadow:var(--shadow-md);text-decoration:none}.quicklink-item i{font-size:2rem;color:var(--color-primary);transition:all var(--transition-base)}.quicklink-item:hover i{transform:scale(1.1);color:var(--color-primary-dark)}.quicklink-item span{font-size:.875rem;font-weight:500}.breadcrumb{background:0 0;padding:0;margin:0;display:flex;flex-wrap:wrap;list-style:none;align-items:center}.breadcrumb-item{display:flex;align-items:center}.breadcrumb-item+.breadcrumb-item::before{content:"/";padding:0 .5rem;color:var(--color-gray-500)}.breadcrumb-item a{color:var(--color-primary);text-decoration:none;transition:color var(--transition-base)}.breadcrumb-item a:hover{color:var(--color-primary-dark);text-decoration:underline}.breadcrumb-item.active{color:var(--color-gray-600)}[data-theme=dark] .faq-category-title{color:var(--color-white)}[data-theme=dark] .faq-category-desc{color:var(--color-gray-300)}[data-theme=dark] .section-faq-accordion .accordion-item{border-color:var(--color-gray-700)}[data-theme=dark] .section-faq-accordion .accordion-button{background:var(--color-gray-800);color:var(--color-white)}[data-theme=dark] .section-faq-accordion .accordion-body{background:var(--color-gray-700);color:var(--color-gray-200)}[data-theme=dark] .quicklink-item{background:var(--color-gray-800);color:var(--color-gray-200)}[data-theme=dark] .quicklink-item:hover{background:var(--color-gray-700)}[data-theme=dark] .breadcrumb-item.active{color:var(--color-gray-400)}@media (max-width:768px){.faq-category-icon{width:56px;height:56px;font-size:1.5rem}.faq-category-title{font-size:1rem}.quicklinks-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:.75rem}.quicklink-item{padding:1rem .75rem}.quicklink-item i{font-size:1.5rem}}.section-tupoksi .card{border:none;box-shadow:var(--shadow-md);margin-bottom:1.5rem;transition:all var(--transition-base)}.section-tupoksi .card:hover{box-shadow:var(--shadow-lg)}.tupoksi-header{background:var(--gradient-primary);color:var(--color-white);padding:1.5rem;display:flex;align-items:center;gap:1.5rem;border:none}.tupoksi-icon-wrapper{flex-shrink:0}.tupoksi-icon{width:80px;height:80px;border-radius:50%;background:rgba(255,255,255,.2);backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;font-size:2rem;color:var(--color-white);border:3px solid rgba(255,255,255,.3)}.tupoksi-title-wrapper{flex:1}.tupoksi-title{font-size:1.75rem;font-weight:700;margin:0 0 .5rem 0;color:var(--color-white)}.tupoksi-subtitle{font-size:1rem;opacity:.9;margin:0;color:var(--color-white)}.tupoksi-content{padding:0}.tupoksi-item{padding:1.5rem;border-bottom:1px solid var(--color-gray-200)}.tupoksi-item:last-child{border-bottom:none}.tupoksi-item-title{font-size:1.25rem;font-weight:600;color:var(--color-primary);margin-bottom:1rem;display:flex;align-items:center;gap:.75rem}.tupoksi-item-title i{font-size:1.5rem}.tupoksi-list{list-style:none;padding:0;margin:0}.tupoksi-list>li{padding:.75rem 0;padding-left:1.5rem;position:relative;line-height:1.8;color:var(--color-gray-700)}.tupoksi-list>li::before{content:'\f00c';font-family:'Font Awesome 6 Free';font-weight:900;position:absolute;left:0;color:var(--color-primary);font-size:.875rem}.tupoksi-list>li strong{color:var(--color-gray-800);font-weight:600}.tupoksi-sublist{list-style:none;padding:.5rem 0 0 1.5rem;margin:.5rem 0 0 0}.tupoksi-sublist li{padding:.5rem 0;padding-left:1.25rem;position:relative;color:var(--color-gray-600);font-size:.9375rem}.tupoksi-sublist li::before{content:'\f054';font-family:'Font Awesome 6 Free';font-weight:900;position:absolute;left:0;color:var(--color-primary);font-size:.75rem}.card-highlight{border:2px solid var(--color-primary);background:linear-gradient(135deg,rgba(196,30,58,.05) 0,rgba(212,165,116,.05) 100%)}.info-box{padding:1.5rem;background:var(--color-white);border-radius:var(--radius-md);border:1px solid var(--color-gray-200);height:100%;transition:all var(--transition-base)}.info-box:hover{border-color:var(--color-primary);box-shadow:var(--shadow-md);transform:translateY(-2px)}.info-box-icon{width:56px;height:56px;border-radius:var(--radius-lg);background:var(--gradient-primary);display:flex;align-items:center;justify-content:center;color:var(--color-white);font-size:1.5rem;margin-bottom:1rem}.info-box h4{font-size:1.125rem;font-weight:600;color:var(--color-gray-800);margin-bottom:.75rem}.info-box p{color:var(--color-gray-600);line-height:1.7;margin:0}[data-theme=dark] .tupoksi-list>li{color:var(--color-gray-200)}[data-theme=dark] .tupoksi-list>li strong{color:var(--color-white)}[data-theme=dark] .tupoksi-sublist li{color:var(--color-gray-300)}[data-theme=dark] .tupoksi-item{border-bottom-color:var(--color-gray-700)}[data-theme=dark] .info-box{background:var(--color-gray-800);border-color:var(--color-gray-700)}[data-theme=dark] .info-box h4{color:var(--color-white)}[data-theme=dark] .info-box p{color:var(--color-gray-300)}@media (max-width:768px){.tupoksi-header{flex-direction:column;text-align:center;gap:1rem}.tupoksi-icon{width:64px;height:64px;font-size:1.5rem}.tupoksi-title{font-size:1.5rem}.tupoksi-item{padding:1rem}}#wilayahTabs .nav-link{color:var(--color-gray-600);border:none;border-bottom:2px solid transparent;padding:.75rem 1.5rem;transition:all var(--transition-base)}#wilayahTabs .nav-link:hover{color:var(--color-primary);border-bottom-color:var(--color-gray-300)}#wilayahTabs .nav-link.active{color:var(--color-primary);background:0 0;border-bottom-color:var(--color-primary);font-weight:600}#wilayahTabs .nav-link i{margin-right:.5rem}.tab-content{padding-top:1rem}.wilayah-progress .progress{height:24px;border-radius:var(--radius-md);background:var(--color-gray-200)}.wilayah-progress .progress-bar{display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.75rem;color:var(--color-white);text-shadow:0 1px 2px rgba(0,0,0,.2)}[data-theme=dark] .wilayah-progress .progress{background:var(--color-gray-700)}.section-statistik{margin-bottom:2rem;display:block!important;visibility:visible!important}.card-statistik{border:none;box-shadow:var(--shadow-md);transition:all var(--transition-base);height:100%;border-radius:var(--radius-lg);overflow:hidden}.card-statistik:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}.statistik-icon{width:80px!important;height:80px!important;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 1rem;font-size:2rem!important;color:var(--color-white)}.statistik-icon.statistik-total{background:linear-gradient(135deg,var(--color-primary) 0,var(--color-primary-dark) 100%)}.statistik-icon.statistik-laki{background:linear-gradient(135deg,#3498db 0,#2980b9 100%)}.statistik-icon.statistik-perempuan{background:linear-gradient(135deg,#e91e63 0,#c2185b 100%)}.statistik-number{font-size:2.5rem;font-weight:700;color:var(--color-gray-800);margin:.5rem 0;line-height:1.2}.statistik-label{font-size:1rem;color:var(--color-gray-600);font-weight:500;margin:0}[data-theme=dark] .statistik-number{color:var(--color-white)}[data-theme=dark] .statistik-label{color:var(--color-gray-300)}.section-layanan{margin-bottom:2rem;display:block!important;visibility:visible!important}.card-layanan{border:none;box-shadow:var(--shadow-md);transition:all var(--transition-base);height:100%;border-radius:var(--radius-lg);text-decoration:none;color:inherit;display:block}.card-layanan:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);text-decoration:none;color:inherit}.card-layanan .layanan-icon,.section-layanan .layanan-icon{width:70px!important;height:70px!important;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;margin:0 auto 1rem;font-size:2rem!important;color:var(--color-white);background:linear-gradient(135deg,var(--color-primary) 0,var(--color-primary-dark) 100%)}.layanan-title{font-size:1rem;font-weight:600;color:var(--color-gray-800);margin:0}[data-theme=dark] .layanan-title{color:var(--color-white)}.section-agenda,.section-berita,.section-faq,.section-galeri,.section-layanan,.section-pengumuman,.section-statistik,.section-video{display:block!important;visibility:visible!important;opacity:1!important}.section-galeri{margin-bottom:2rem;display:block!important;visibility:visible!important}.card-galeri{border:none;box-shadow:var(--shadow-md);transition:all var(--transition-base);height:100%;border-radius:var(--radius-lg);overflow:hidden}.card-galeri:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}.card-galeri .card-img-wrapper{position:relative;overflow:hidden;height:250px;background:var(--color-gray-200)}.card-galeri .card-img-top{width:100%;height:100%;object-fit:cover;transition:transform var(--transition-base)}.card-galeri:hover .card-img-top{transform:scale(1.1)}.card-galeri .card-img-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.4);display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity var(--transition-base)}.card-galeri:hover .card-img-overlay{opacity:1}.card-galeri .card-body{padding:var(--spacing-md)}.card-galeri .card-title{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--color-gray-800);margin-bottom:.5rem}[data-theme=dark] .card-galeri .card-title{color:var(--color-white)}.section-video{margin-bottom:2rem;display:block!important;visibility:visible!important}.card-video{border:none;box-shadow:var(--shadow-md);transition:all var(--transition-base);height:100%;border-radius:var(--radius-lg);overflow:hidden}.card-video:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}.card-video .video-wrapper{position:relative;width:100%;padding-bottom:56.25%;background:var(--color-gray-200);overflow:hidden}.card-video .video-wrapper iframe{position:absolute;top:0;left:0;width:100%;height:100%;border:none}.card-video .video-placeholder{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--color-gray-200);color:var(--color-gray-500)}.card-video .video-placeholder i{font-size:3rem;margin-bottom:.5rem}.card-video .video-placeholder p{margin:0;font-size:var(--font-size-sm)}.card-video .card-body{padding:var(--spacing-md)}.card-video .card-title{font-size:var(--font-size-base);font-weight:var(--font-weight-semibold);color:var(--color-gray-800);margin-bottom:.5rem}.card-video .card-title a{color:inherit;text-decoration:none;transition:color var(--transition-base)}.card-video .card-title a:hover{color:var(--color-primary)}.card-video .card-text{font-size:var(--font-size-sm);color:var(--color-gray-600);margin:0}[data-theme=dark] .card-video .card-title{color:var(--color-white)}[data-theme=dark] .card-video .card-text{color:var(--color-gray-300)}@media (min-width:768px) and (max-width:991px){.navbar-toggler{display:none}.navbar-collapse{display:flex!important}.navbar-nav{flex-direction:row}}@media (min-width:576px) and (max-width:767px){.navbar-toggler{display:block}.navbar-collapse{display:none;width:100%;margin-top:.75rem}.navbar-collapse.show{display:flex!important;flex-direction:column}.navbar-nav{flex-direction:column;width:100%}}@media (max-width:575px){.navbar-toggler{display:block}.navbar-collapse{display:none;width:100%;margin-top:.75rem}.navbar-collapse.show{display:flex!important;flex-direction:column}.navbar-nav{flex-direction:column;width:100%}}@media (max-width:768px){.statistik-number{font-size:2rem}.statistik-icon{width:60px!important;height:60px!important;font-size:1.5rem!important}.card-layanan .layanan-icon,.section-layanan .layanan-icon{width:60px!important;height:60px!important;font-size:1.5rem!important}.card-galeri .card-img-wrapper{height:200px}.card-video .video-wrapper{padding-bottom:56.25%}}@media (min-width:768px){.site-header .container,.site-header .navbar .container,.site-header>nav .container,header.site-header .container{max-width:66.666667%!important;width:66.666667%!important;margin-left:auto!important;margin-right:auto!important}}.content-area{padding-right:var(--spacing-lg)}.content-area>.content-section,.content-area>.hero-section{width:100%;max-width:100%;margin-left:0;margin-right:0}.content-area .hero-section .hero-slide{width:100%}.content-area .hero-content{max-width:100%}.content-area .container-fluid:not(.container),.content-area .container:not(.berita-container){padding-left:0;padding-right:0}.content-area .row:not(.berita-single-row){margin-left:0;margin-right:0}.content-area .row>[class*=col-]{padding-left:calc(var(--bs-gutter-x) * .5);padding-right:calc(var(--bs-gutter-x) * .5)}.content-area .content-section .card,.content-area .content-section .row{width:100%}@media (max-width:991.98px){.content-area{padding-right:0}}@media (min-width:992px){#sidebarRight,.sidebar-right:not(.berita-single-sidebar),.sidebar-widget,.widget-login-warga,.widget-quicklinks,aside.sidebar-right:not(.berita-single-sidebar){display:none!important;visibility:hidden!important;width:0!important;height:0!important;overflow:hidden!important}.content-area:not(.col-lg-8):not(.col-lg-10){max-width:100%!important;flex:0 0 100%!important}.col-lg-8:not(.offset-lg-2){flex:0 0 100%!important;max-width:100%!important}.col-lg-9{flex:0 0 100%!important;max-width:100%!important}}#agendaCarousel .carousel-indicators button[data-bs-slide-to]{min-width:44px!important;min-height:44px!important;width:auto!important;height:auto!important;padding:16px!important;margin:0 8px!important;position:relative;cursor:pointer;display:flex;align-items:center;justify-content:center}#agendaCarousel .carousel-indicators button[data-bs-slide-to]::before{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:12px;height:12px;border-radius:50%;background:inherit;pointer-events:none}#umkmCarousel .carousel-indicators button[data-bs-slide-to]{min-width:auto!important;min-height:auto!important;width:12px!important;height:12px!important;padding:0!important;margin:0 6px!important;border-radius:50%!important;background-color:rgba(255,255,255,.5)!important;border:2px solid rgba(255,255,255,.8)!important;opacity:.5;transition:opacity .3s ease}#umkmCarousel .carousel-indicators button[data-bs-slide-to]:hover{opacity:.8}#umkmCarousel .carousel-indicators button[data-bs-slide-to].active{opacity:1!important;background-color:#fff!important;border-color:#fff!important}#umkmCarousel .carousel-indicators button[data-bs-slide-to]::before{display:none!important}.bottom-nav-item[data-bs-toggle=offcanvas]{min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center}img{width:100%;height:auto;display:block}@font-face{font-display:swap}.carousel-item{min-height:400px;will-change:transform}@media (prefers-reduced-motion:reduce){*,::after,::before{animation-duration:0s!important;animation-iteration-count:1!important;transition-duration:0s!important}}