:root{--green-700:#0b6b3a;--green-500:#17a05a;--gold:#f3b400;--white:#ffffff}
/* Login / Admin */
html,body{height:100%;margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,'Helvetica Neue',Arial}
body.login-bg{background:linear-gradient(180deg,var(--green-700) 0%, #0e5b33 60%);display:flex;align-items:center;justify-content:center;color:#072613}
.login-wrap{width:100%;max-width:920px;margin:2rem;padding:2rem;display:flex;gap:2rem;align-items:stretch}
.panel-left{flex:1;background:linear-gradient(180deg,#ffffff 0%, rgba(255,255,255,0.95) 100%);border-radius:12px;padding:36px;box-shadow:0 10px 30px rgba(0,0,0,0.12)}
.panel-right{width:420px;background:linear-gradient(180deg,var(--green-500),var(--green-700));border-radius:12px;padding:36px;color:var(--white);display:flex;flex-direction:column;justify-content:center}
h1{margin:0 0 8px;font-size:28px}
p.lead{margin:0 0 20px;color:#6b6b6b}
label{display:block;font-weight:600;font-size:13px;margin-bottom:6px}
input[type=text],input[type=email],input[type=password]{width:100%;padding:10px 12px;border:1px solid #e6e6e6;border-radius:8px;margin-bottom:12px;font-size:15px}
.btn-primary{background:var(--gold);color:#0b3b20;border:none;padding:12px 16px;border-radius:10px;font-weight:700;cursor:pointer;width:100%}
.muted{color:#9aa29a;font-size:13px}
.brand{display:flex;align-items:center;gap:12px;margin-bottom:18px}
.brand-logo{width:56px;height:56px;border-radius:8px;background:var(--white);display:inline-flex;align-items:center;justify-content:center;color:var(--green-700);font-weight:800;font-size:18px}
.brand-image{width:100%;height:100%;object-fit:contain;border-radius:8px;background:transparent;display:block}
.footer-links{position:absolute;left:24px;bottom:18px;color:rgba(255,255,255,0.85);font-size:13px}
.helper{display:flex;gap:12px;align-items:center;justify-content:space-between;margin-top:8px}
.remember{display:flex;gap:8px;align-items:center}
.remember-label{margin:0;font-weight:500}
.errors{background:#fdecea;color:#7a1f1f;padding:10px;border-radius:8px;margin-bottom:12px}
.login-panel-right-content{max-width:320px}
.login-panel-right-content h2{color:var(--white);margin:0 0 8px}
.login-panel-right-content p{opacity:0.95;margin:0 0 16px}
.login-panel-right-content ul{margin:0 0 16px; padding-left:18px}
.login-panel-right-content .actions{display:flex;gap:8px}
.login-panel-right-content .actions a{background:transparent;border:1px solid rgba(255,255,255,0.15);color:rgba(255,255,255,0.95);padding:8px 12px;border-radius:8px;text-decoration:none}
@media (max-width:900px){.login-wrap{flex-direction:column}.panel-right{width:100%}}

/* Landing */
:root{--landing-green:#0b3d1a;--landing-gold:#D4AF37;--landing-text:#ffffff}
.hero{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(180deg,var(--landing-green) 0%, #073017 100%);color:var(--landing-text)}
.card{max-width:1100px;width:100%;padding:48px 32px;background:rgba(255,255,255,0.03);border-radius:12px;box-shadow:0 6px 30px rgba(2,6,23,0.4);display:flex;gap:28px;align-items:center}
.brand-row{display:flex;align-items:center;gap:18px}
.brand-row img{height:64px;width:auto;border-radius:8px}
/* Ensure landing .brand images are constrained */
/* Slightly smaller logo for landing to avoid oversized crop */
.brand img, .brand-image{height:48px;width:auto;border-radius:8px}
.app-name{font-size:32px;color:var(--landing-gold);font-weight:800;letter-spacing:0.6px}
h1.hero-heading{font-size:48px;margin:18px 0 0}
.institution{font-size:18px;margin-top:6px;color:rgba(255,255,255,0.95);font-weight:600}
p.lead{font-size:18px;margin:8px 0 0 0;color:rgba(255,255,255,0.9)}
.cta{margin-top:18px;display:flex;gap:12px}
.btn{background:var(--landing-gold);color:#062214;padding:10px 16px;border-radius:8px;text-decoration:none;font-weight:600}
.muted{color:rgba(255,255,255,0.6);font-size:14px}
.hero-copy h2{color:var(--landing-text);margin:0 0 8px}
.hero-copy p{color:rgba(255,255,255,0.95);max-width:680px}
.hero-copy ul{margin:12px 0 0 18px;color:rgba(255,255,255,0.95);max-width:720px}
.hero-image{flex:0 0 360px;display:flex;align-items:center;justify-content:center}
.hero-image img{max-width:100%;height:auto;border-radius:10px;box-shadow:0 10px 30px rgba(2,6,23,0.6)}
@media(max-width:800px){.card{flex-direction:column;text-align:center}.brand-row img{height:40px}.hero{padding:24px}}