:root{--navy:#0a3154;--blue:#0b4f87;--sky:#8dbbf0;--ice:#eef5fb;--ink:#152538;--muted:#6d7c8b;--gold:#be9634;--green:#0c5a42;--radius:22px;--shadow:0 16px 45px rgba(10,49,84,.10)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;background:#f4f7fb;color:var(--ink);overflow-x:hidden}
a{text-decoration:none}
img{max-width:100%;height:auto;display:block}
.app-navbar{background:linear-gradient(110deg,var(--navy),var(--blue));box-shadow:0 8px 24px rgba(3,25,45,.18)}
.navbar-brand{display:flex;align-items:center;gap:.85rem;min-width:0;white-space:normal}
.brand-logo{width:40px!important;height:40px!important;min-width:40px;max-width:40px;object-fit:cover;border-radius:50%;background:#fff;border:2px solid rgba(255,255,255,.16);box-shadow:0 8px 20px rgba(0,0,0,.18)}
.brand-text-wrap{display:flex;flex-direction:column;line-height:1.05;min-width:0}
.brand-title{font-size:1rem;font-weight:800;color:#fff;white-space:normal}
.brand-subtitle{font-size:.78rem;color:rgba(255,255,255,.78);font-weight:500}
.app-shell{max-width:1800px;padding-inline:1.15rem}
.card{border:0;border-radius:var(--radius);box-shadow:var(--shadow);background:#fff}
.metric-card{position:relative;overflow:hidden}.metric-card:after{content:"";position:absolute;width:90px;height:90px;border-radius:50%;right:-22px;top:-24px;background:rgba(255,255,255,.18)}
.metric-icon{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:rgba(255,255,255,.2);font-size:1.3rem}
.bg-grad-blue{background:linear-gradient(135deg,#0b4f87,#438bc8);color:#fff}.bg-grad-green{background:linear-gradient(135deg,#0c5a42,#319576);color:#fff}.bg-grad-gold{background:linear-gradient(135deg,#8b6c1f,#caa949);color:#fff}.bg-grad-slate{background:linear-gradient(135deg,#34495e,#65788a);color:#fff}
.section-title{font-weight:800;letter-spacing:-.03em}
.department-card{transition:.2s ease;height:100%}.department-card:hover{transform:translateY(-4px)}
.department-logo{height:84px;width:100%;object-fit:contain;background:#07111f;border-radius:16px;padding:12px}
.mini-dept-card{height:100%;display:flex;flex-direction:column;gap:.65rem;padding:1rem;border-radius:18px;background:#f6f9fd;border:1px solid rgba(11,79,135,.08);text-align:center;font-weight:700;color:var(--ink)}
.form-section{background:#fff;border-radius:20px;box-shadow:var(--shadow);padding:1.25rem;margin-bottom:1rem}
.matrix-wrap{overflow:auto}.matrix-table{min-width:1150px}.matrix-table th{font-size:.78rem;vertical-align:middle;background:#eaf2fb}.matrix-table td:first-child{min-width:280px;font-weight:600}.matrix-table input{min-width:70px}
.btn-primary{background:var(--blue);border-color:var(--blue)}
.admin-tabs .nav-link{border-radius:14px;color:var(--ink);font-weight:700}.admin-tabs .nav-link.active{background:var(--blue);color:#fff}
.landing-body{background:#f7f9fc}
.hero{min-height:100svh;padding:4rem 0;background:radial-gradient(circle at 85% 10%,rgba(141,187,240,.35),transparent 28%),linear-gradient(145deg,#fff 0%,#eef5fb 60%,#dbeaf8 100%);display:flex;align-items:center}
.hero-container{width:min(100%,1600px)}
.hero-title{font-size:clamp(2.85rem,6vw,6rem);line-height:.95;letter-spacing:-.06em;font-weight:800;margin:0}
.text-blue{color:var(--blue)}
.hero-copy{max-width:690px;font-size:1.08rem}
.hero-card{background:#fff;border-radius:32px;padding:1rem;box-shadow:0 30px 80px rgba(10,49,84,.18);position:relative;overflow:hidden}
.compact-hero-card{max-width:640px;margin-inline:auto}
.hero-main-image{width:100%;border-radius:24px;aspect-ratio:1/1;object-fit:cover}
.hero-summary{padding:.95rem .35rem .25rem}
.hero-summary-head{display:flex;align-items:center;gap:1rem;margin-bottom:1rem}
.hero-summary-logo{width:52px;height:52px;object-fit:cover;border-radius:50%;flex:0 0 auto}
.hero-summary-title{font-size:1.08rem;font-weight:800;line-height:1.15}
.hero-summary-subtitle{font-size:.92rem;color:var(--muted)}
.pill{display:inline-flex;align-items:center;gap:.5rem;padding:.55rem .95rem;border-radius:999px;background:#e5f0fb;color:var(--blue);font-weight:700}
.feature-icon{width:54px;height:54px;border-radius:18px;background:#e5f0fb;color:var(--blue);display:grid;place-items:center;font-size:1.4rem}
.login-screen{background:radial-gradient(circle at top right,#cfe2f4,transparent 40%),#f4f7fb}
.login-card{max-width:470px;margin:auto}.login-logo{width:88px;height:88px;object-fit:contain;border-radius:50%;background:#fff;padding:6px;box-shadow:0 12px 26px rgba(10,49,84,.12)}
.table>thead th{white-space:nowrap}.status-dot{width:9px;height:9px;border-radius:50%;display:inline-block;margin-right:.35rem}
@media (min-width:1400px){.app-shell{padding-inline:2rem}.hero-card{padding:1.25rem}.department-logo{height:96px}.hero-copy{font-size:1.14rem}.hero .container{max-width:1500px}}
@media (min-width:1920px){body{font-size:18px}.hero{padding:5.25rem 0}.hero-title{font-size:6.4rem}.app-shell{max-width:1920px}.card{border-radius:26px}.feature-icon{width:62px;height:62px;font-size:1.5rem}.brand-logo{width:42px!important;height:42px!important}}
@media (max-width:1199.98px){.hero{padding:3rem 0}.hero-title{font-size:clamp(2.7rem,8vw,4.8rem)}.hero-main-image{aspect-ratio:5/4}}
@media (max-width:991.98px){.app-shell{padding-inline:.95rem}.navbar-brand{max-width:80%}.brand-title{font-size:.93rem}.brand-subtitle{font-size:.74rem}.hero{min-height:auto;padding:2.4rem 0 3rem}.hero-copy{max-width:100%}.hero-card{padding:.9rem;border-radius:26px}.hero-main-image{aspect-ratio:4/3}.department-logo{height:76px}}
@media (max-width:767.98px){.hero{padding-top:2rem}.hero-title{font-size:3rem}.hero-copy{font-size:1rem}.app-shell{padding-left:.75rem;padding-right:.75rem}.card-body{padding:1rem}.department-logo{height:72px}.mini-dept-card{padding:.85rem}.brand-logo{width:38px!important;height:38px!important}.hero-card{border-radius:22px}.hero-main-image{aspect-ratio:1/1}.hero-summary-head{align-items:flex-start}.hero-metrics .fs-3{font-size:1.5rem!important}.login-card{max-width:100%}}
@media (max-width:575.98px){.navbar-brand{gap:.6rem;max-width:82%}.brand-title{font-size:.84rem}.brand-subtitle{display:none}.hero-title{font-size:2.45rem}.pill{font-size:.88rem}.hero-copy{font-size:.97rem}.btn-lg{font-size:1rem;padding:.82rem 1.1rem}.mini-dept-card span{font-size:.94rem}.table{font-size:.92rem}.form-section{padding:1rem}.hero-summary-head{gap:.75rem}.hero-summary-logo{width:46px;height:46px}.login-logo{width:78px;height:78px}}
