/* Canonical KOPSUJANA header, mobile navigation and footer. */
.site-header,.site-footer,.mobile-panel{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.site-header .container,.site-footer .container{width:min(calc(100% - 36px),1320px);margin-inline:auto}
.site-header{position:sticky;top:0;z-index:60;background:#f5f4f0;box-shadow:0 10px 30px rgba(5,14,35,.12)}
.site-header .utility-bar{background:#0d1b3f;color:#fff;font-size:.78rem;font-weight:750}
.site-header .utility-inner{min-height:35px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.site-header .utility-left{display:flex;align-items:center;gap:24px;min-width:0}
.site-header .utility-item{display:flex;align-items:center;gap:7px;color:rgba(255,255,255,.78);white-space:nowrap}
.site-header .utility-icon{width:15px;height:15px;display:grid;place-items:center;color:#dec997;flex:0 0 auto}
.site-header .utility-controls{display:flex;align-items:center;gap:12px;flex:0 0 auto}.site-header .utility-separator{width:1px;height:20px;background:rgba(255,255,255,.2)}
.site-header .lang-inline{display:flex;align-items:center;gap:9px;flex:0 0 auto}
.site-header .lang-inline button{min-width:36px;min-height:35px;padding:5px 4px;border:0;border-radius:7px;background:transparent;color:rgba(255,255,255,.58);font-size:.78rem;font-weight:900}
.site-header .lang-inline button.active{background:rgba(255,255,255,.11);color:#fff}
.site-header .lang-divider{width:1px;height:14px;background:rgba(255,255,255,.25)}
.site-header .main-nav{background:#fbfaf6}
.site-header .nav-inner{min-height:84px;display:grid;grid-template-columns:minmax(240px,280px) minmax(500px,1fr) auto;align-items:center;gap:18px}
.site-header .brand,.mobile-panel .brand{display:flex;align-items:center;gap:12px;min-width:0;color:#112250;text-decoration:none}
.site-header .brand-logo,.mobile-panel .brand-logo{width:50px;height:50px;object-fit:contain;flex:0 0 auto}
.site-header .brand-text strong,.mobile-panel .brand-text strong{display:block;font-family:Georgia,"Times New Roman",serif;font-size:1.45rem;line-height:1;letter-spacing:.035em;color:#112250}
.site-header .brand-text span,.mobile-panel .brand-text span{display:block;margin-top:5px;max-width:215px;font-size:.64rem;line-height:1.35;text-transform:uppercase;letter-spacing:.055em;color:#687286;font-weight:800}
.site-header .nav-links{display:flex;align-items:center;justify-content:center;gap:clamp(12px,1.35vw,22px)}
.site-header .nav-links a{position:relative;padding:12px 0;color:#334158;font-size:.84rem;font-weight:800;white-space:nowrap;text-decoration:none}
.site-header .nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:4px;height:2px;background:#b89962;border-radius:99px;transform:scaleX(0);transition:.2s ease}
.site-header .nav-links a:hover::after,.site-header .nav-links a.active::after{transform:scaleX(1)}
.site-header .nav-dropdown{position:relative;display:flex;align-items:center}
.site-header .nav-dropdown>.dropdown-toggle{width:20px;height:34px;margin-left:-3px;border:0;background:transparent;color:#536077;font-size:.85rem;cursor:pointer}
.site-header .dropdown-menu{position:absolute;top:calc(100% + 8px);left:50%;z-index:20;display:grid;width:215px;padding:9px;border:1px solid #e2ded3;border-radius:13px;background:#fff;box-shadow:0 18px 45px rgba(9,24,55,.17);opacity:0;visibility:hidden;transform:translate(-50%,8px);transition:.18s ease}
.site-header .dropdown-menu::before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px}
.site-header .dropdown-menu a{padding:11px 12px;border-radius:8px;font-size:.82rem}
.site-header .dropdown-menu a::after{display:none}
.site-header .dropdown-menu a:hover,.site-header .dropdown-menu a.active{background:#f2eee4;color:#8c692f}
.site-header .nav-dropdown:hover .dropdown-menu,.site-header .nav-dropdown:focus-within .dropdown-menu{opacity:1;visibility:visible;transform:translate(-50%,0)}
.site-header .nav-dropdown:hover>.dropdown-toggle,.site-header .nav-dropdown:focus-within>.dropdown-toggle{transform:rotate(180deg)}
.site-header .nav-actions{display:flex;align-items:center;gap:8px}
.site-header .site-search-link{position:relative;width:46px;height:46px;display:grid!important;place-items:center;flex:0 0 46px;border:1px solid #ccd2dc;border-radius:50%;background:#fff;color:#112250;text-decoration:none;box-shadow:0 7px 18px rgba(11,24,57,.08);font-size:0;transition:background .2s ease,color .2s ease,transform .2s ease}
.site-header .site-search-link svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.site-header .site-search-link:hover{background:#112250;color:#fff;transform:translateY(-2px)}
.site-header .search-tooltip{position:absolute;right:0;top:calc(100% + 9px);width:max-content;max-width:230px;padding:8px 10px;border-radius:7px;background:#0b1839;color:#fff;font-size:.68rem;font-weight:750;line-height:1.35;opacity:0;visibility:hidden;transform:translateY(-3px);transition:.16s ease;pointer-events:none}
.site-header .site-search-link:hover .search-tooltip,.site-header .site-search-link:focus-visible .search-tooltip{opacity:1;visibility:visible;transform:translateY(0)}
.site-header .nav-actions .btn{min-width:auto;min-height:44px;padding:0 14px;border-radius:11px;font-size:.8rem;white-space:nowrap}
.site-header .login-dropdown{position:relative}.site-header .login-trigger{display:flex;align-items:center;gap:7px;min-height:30px;padding:4px 10px;border:1px solid rgba(222,201,151,.58);border-radius:99px;background:rgba(255,255,255,.07);color:#fff;font-size:.76rem;font-weight:850}.site-header .login-trigger svg{width:17px;height:17px;fill:none;stroke:#dec997;stroke-width:1.8;stroke-linecap:round}.site-header .login-trigger b{font-size:.7rem;transition:transform .18s ease}.site-header .login-dropdown.open .login-trigger b{transform:rotate(180deg)}.site-header .login-menu{position:absolute;top:calc(100% + 10px);right:0;z-index:80;width:300px;padding:9px;border:1px solid #ded9cd;border-radius:15px;background:#fff;box-shadow:0 20px 50px rgba(5,14,35,.22);opacity:0;visibility:hidden;transform:translateY(7px);transition:.18s ease}.site-header .login-menu::before{content:"";position:absolute;top:-12px;right:0;width:100%;height:12px}.site-header .login-dropdown.open .login-menu,.site-header .login-dropdown:focus-within .login-menu{opacity:1;visibility:visible;transform:translateY(0)}.site-header .login-option{display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:10px;padding:12px;border-radius:10px;color:#112250;text-decoration:none}.site-header .login-option+.login-option{border-top:1px solid #ece8df}.site-header .login-option:not(.is-disabled):hover{background:#f5f1e7}.site-header .login-option-icon{display:grid;place-items:center;width:36px;height:36px;border-radius:9px;background:#eee7d8;color:#9a7438;font-size:1rem}.site-header .login-option strong,.site-header .login-option small{display:block}.site-header .login-option strong{font-size:.84rem}.site-header .login-option small{margin-top:2px;color:#687286;font-size:.7rem;line-height:1.35}.site-header .login-option>b{color:#9a7438}.site-header .login-option.is-disabled{opacity:.55;cursor:not-allowed}
.site-header .menu-toggle{display:none;width:44px;height:44px;border:1px solid #cfd4dd;border-radius:11px;background:#fff;color:#112250;align-items:center;justify-content:center;font-size:1.25rem}

.mobile-panel{display:none;position:fixed;inset:0;z-index:100;padding:24px;overflow:auto;background:#fbfaf6;transform:translateX(100%);transition:.25s ease}
.mobile-panel.open{transform:translateX(0)}
.mobile-panel .mobile-top{display:flex;align-items:center;justify-content:space-between;gap:20px}
.mobile-panel .mobile-close{width:44px;height:44px;border:1px solid #d8dce3;border-radius:10px;background:#fff;color:#112250;font-size:1.25rem}
.mobile-panel .mobile-links{display:grid;margin-top:34px}
.mobile-panel .mobile-links a{padding:16px 4px;border-bottom:1px solid #e5e2d9;color:#112250;font-weight:850;text-decoration:none}
.mobile-panel .mobile-links a.active{color:#9a7438}
.mobile-panel .mobile-nav-row{display:grid;grid-template-columns:1fr 48px;border-bottom:1px solid #e5e2d9}
.mobile-panel .mobile-nav-row>a{border-bottom:0}
.mobile-panel .mobile-nav-row button{border:0;background:transparent;color:#112250;font-size:1rem}
.mobile-panel .mobile-nav-row button[aria-expanded="true"]{transform:rotate(180deg)}
.mobile-panel .mobile-submenu{padding:4px 0 10px 18px;background:#f4f1e9}
.mobile-panel .mobile-submenu a{padding:12px;border-bottom:0;font-size:.82rem}
.mobile-panel .mobile-lang{display:flex;gap:8px;margin-top:24px}
.mobile-panel .mobile-lang>span{align-self:center;margin-right:auto;color:#687286;font-size:.8rem;font-weight:800}
.mobile-panel .mobile-lang button{min-width:44px;min-height:44px;border:1px solid #d7dce5;border-radius:8px;background:#fff;color:#112250;font-size:.72rem;font-weight:900}
.mobile-panel .mobile-lang button.active{background:#112250;color:#fff}
.mobile-panel .mobile-actions{display:grid;gap:10px;margin-top:28px}
.mobile-panel .mobile-login{display:grid;gap:8px;margin-top:24px;padding:16px;border:1px solid #ded9cd;border-radius:14px;background:#fff}.mobile-panel .mobile-login>span{color:#9a7438;font-size:.72rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.mobile-panel .mobile-login>a,.mobile-panel .mobile-login>div{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:11px 0;border-top:1px solid #ece8df;color:#112250}.mobile-panel .mobile-login strong,.mobile-panel .mobile-login small{display:block}.mobile-panel .mobile-login strong{font-size:.92rem}.mobile-panel .mobile-login small{color:#687286;font-size:.76rem}.mobile-panel .mobile-login .is-disabled{opacity:.55}
.mobile-panel .mobile-actions .btn{min-height:48px}
.mobile-panel .mobile-meta{display:grid;gap:10px;margin-top:28px;padding-top:22px;border-top:1px solid #e5e2d9;color:#687286;font-size:.78rem}

.site-footer{background:linear-gradient(145deg,#0c1b3d,#112a56);color:#fff;padding:48px 0 0}
.site-footer .footer-grid{display:grid;grid-template-columns:1.35fr .75fr .8fr 1.05fr;gap:36px}
.site-footer .footer-brand{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.site-footer .footer-brand img{width:50px;height:50px;object-fit:contain}
.site-footer .footer-brand strong{font-family:Georgia,"Times New Roman",serif;font-size:1.45rem;letter-spacing:.035em}
.site-footer .footer-brand span{display:block;margin-top:5px;color:rgba(255,255,255,.58);font-size:.56rem;text-transform:uppercase;letter-spacing:.055em}
.site-footer h4{margin-bottom:13px;font-family:Georgia,"Times New Roman",serif;font-size:1rem}
.site-footer p,.site-footer address,.site-footer a{color:rgba(255,255,255,.69);font-size:.84rem;font-style:normal;line-height:1.75;text-decoration:none}
.site-footer ul{list-style:none;padding:0;margin:0}
.site-footer li+li{margin-top:8px}
.site-footer a:hover{color:#fff}
.site-footer .footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-top:34px;padding:18px 0;border-top:1px solid rgba(255,255,255,.1);color:rgba(255,255,255,.52);font-size:.75rem}
.site-footer .legal-links{display:flex;gap:17px;flex-wrap:wrap}
.site-footer .social-links{display:flex;gap:9px;margin-top:18px}.site-footer .social-links a{display:grid;place-items:center;width:36px;height:36px;border:1px solid rgba(255,255,255,.2);border-radius:50%;background:rgba(255,255,255,.06);transition:.2s ease}.site-footer .social-links a:hover{color:#fff;background:#c49543;border-color:#c49543;transform:translateY(-2px)}.site-footer .social-links svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8}.site-footer .social-links .fill-icon{fill:currentColor;stroke:none}
.whatsapp-float{position:fixed;right:24px;bottom:24px;z-index:75;display:flex;align-items:center;gap:9px;min-height:54px;padding:0 18px 0 13px;border:2px solid rgba(255,255,255,.9);border-radius:99px;background:#25d366;color:#072b18!important;box-shadow:0 14px 34px rgba(5,45,25,.3);font:850 .76rem/1 Inter,ui-sans-serif,system-ui,sans-serif;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease}.whatsapp-float:hover{transform:translateY(-3px);box-shadow:0 18px 38px rgba(5,45,25,.4)}.whatsapp-float svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.55;stroke-linecap:round;stroke-linejoin:round}.whatsapp-float:focus-visible{outline:3px solid #d2a34c;outline-offset:3px}

.include-error{margin:0;padding:14px 18px;background:#fff3cd;color:#5f4800;text-align:center;font:700 .85rem/1.4 sans-serif}
:where(.site-header,.site-footer,.mobile-panel) :where(a,button):focus-visible{outline:3px solid #d2a34c;outline-offset:3px}

@media(max-width:1340px){
  .site-header .container,.site-footer .container{width:min(calc(100% - 32px),1320px)}
  .site-header .nav-inner{grid-template-columns:235px 1fr auto;gap:12px}
  .site-header .nav-links{gap:11px}.site-header .nav-links a{font-size:.75rem}
  .site-header .nav-actions .btn{padding-inline:11px;font-size:.73rem}
}
@media(max-width:1100px){
  .site-header .nav-inner{grid-template-columns:1fr auto}.site-header .nav-links,.site-header .nav-actions{display:none}.site-header .menu-toggle{display:flex}
  .mobile-panel{display:block}
  .site-footer .footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:720px){
  .site-header .container,.site-footer .container{width:min(calc(100% - 28px),1320px)}
  .site-header .utility-left{gap:10px 16px}.site-header .utility-item.hours{display:none}
  .site-header .brand-logo,.mobile-panel .brand-logo{width:43px;height:43px}
  .site-header .brand-text strong,.mobile-panel .brand-text strong{font-size:1.3rem}
  .site-header .brand-text span,.mobile-panel .brand-text span{max-width:165px;font-size:.5rem}
  .site-footer .footer-grid{grid-template-columns:1fr;gap:28px}.site-footer .footer-bottom{align-items:flex-start;flex-direction:column}
}
@media(max-width:480px){.site-header .utility-item.email{display:none}}
@media(max-width:480px){.whatsapp-float{right:16px;bottom:16px;width:54px;padding:0;justify-content:center}.whatsapp-float span{display:none}}
@media(prefers-reduced-motion:reduce){.site-header *,.site-footer *,.mobile-panel{transition:none!important}}

/* Official KOPSUJANA logo presentation */
.site-header .brand-logo,.mobile-panel .brand-logo,.site-footer .footer-brand img{
  box-sizing:border-box;
  background:#fff;
  border:2px solid #c49543;
  border-radius:11px;
  padding:5px;
  box-shadow:0 7px 18px rgba(11,24,57,.14);
}