:root{--blue:#0b2d63;--primary:#1769e0;--gold:#e7a31b;--bg:#f6f8fc;--text:#172033;--muted:#667085}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--text);background:#fff;line-height:1.6}a{text-decoration:none;color:inherit}.container{width:92%;max-width:1180px;margin:auto}
.site-header{position:sticky;top:0;z-index:50;background:#fff;box-shadow:0 2px 14px #00000012}.nav{min-height:76px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;gap:12px;align-items:center}.brand b{display:block;color:var(--blue);font-size:20px}.brand small{display:block;color:#9a6b0b;font-size:9px;letter-spacing:1px}.logo-placeholder{width:48px;height:48px;border:2px dashed var(--primary);border-radius:9px;display:grid;place-items:center;color:var(--primary);font-size:10px}.navlinks{display:flex;align-items:center;gap:20px}.navlinks a{font-size:14px}.btn{background:var(--primary);color:#fff;padding:12px 18px;border-radius:7px;display:inline-block;border:0;cursor:pointer}.btn.gold{background:var(--gold)}.btn.small{padding:9px 13px}.menu{display:none;border:0;background:none;font-size:26px}
main{min-height:70vh}.hero{padding:100px 0;background:linear-gradient(120deg,#071d49ee,#1769e0cc),url('https://images.unsplash.com/photo-1523240795612-9a054b0db644?auto=format&fit=crop&w=1800&q=80') center/cover;color:#fff}.hero h1{font-size:52px;line-height:1.1;max-width:750px;margin:10px 0}.hero h1 span{color:#f2b331}.hero p{max-width:650px;color:#e5ebf7}.actions{display:flex;gap:12px;margin-top:24px}.section{padding:75px 0}.section.alt{background:var(--bg)}.title{text-align:center;margin-bottom:38px}.title span{font-size:12px;letter-spacing:2px;color:var(--gold);font-weight:bold}.title h2{font-size:34px;color:var(--blue);margin:6px 0}.title p{color:var(--muted)}
.stats{margin-top:-35px;position:relative}.statsgrid{background:#fff;border-radius:12px;box-shadow:0 12px 35px #00000015;display:grid;grid-template-columns:repeat(4,1fr);overflow:hidden}.stat{text-align:center;padding:25px;border-right:1px solid #eee}.stat:last-child{border:0}.stat b{font-size:28px;color:var(--primary);display:block}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:30px}.card{background:#fff;border:1px solid #e7ebf2;border-radius:12px;padding:24px;box-shadow:0 5px 20px #00000008}.card h3{margin-top:0;color:var(--blue)}.muted{color:var(--muted);font-size:14px}.course-card{padding:0;overflow:hidden}.course-card .body{padding:20px}.badge{display:inline-block;background:#edf4ff;color:var(--primary);padding:4px 9px;border-radius:20px;font-size:11px}.course-card img{width:100%;height:170px;object-fit:cover}
.formbox{max-width:760px;margin:auto;background:#fff;padding:30px;border-radius:14px;box-shadow:0 8px 30px #00000010}.formgrid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.field{margin-bottom:14px}.field label{display:block;font-size:13px;font-weight:bold;margin-bottom:5px}.field input,.field select,.field textarea{width:100%;padding:12px;border:1px solid #d8dee9;border-radius:7px;font:inherit}.field textarea{min-height:110px}.full{grid-column:1/-1}.notice{border-left:4px solid var(--primary);padding:16px 20px;background:#f7f9fc;border-radius:7px;margin-bottom:15px}.notice h3{margin:0;color:var(--blue)}
.tablewrap{overflow:auto}.table{width:100%;border-collapse:collapse;background:#fff}.table th,.table td{padding:12px;border-bottom:1px solid #e7ebf2;text-align:left;font-size:13px}.table th{background:#f3f6fb;color:var(--blue)}.adminnav{background:var(--blue);color:#fff;padding:10px 0}.adminnav .container{display:flex;gap:15px;flex-wrap:wrap}.adminnav a{font-size:13px;padding:7px 10px}.dashboard{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.dash{padding:22px;background:#fff;border-radius:12px;border:1px solid #e6eaf0}.dash b{font-size:30px;color:var(--primary)}
.footer{background:#061a40;color:#fff;padding:55px 0 0}.footergrid{display:grid;grid-template-columns:1.5fr 1fr 1.5fr;gap:40px}.footer a{display:block;color:#c2cce0;margin:8px 0;font-size:13px}.footer p{color:#c2cce0;font-size:13px}.copyright{text-align:center;border-top:1px solid #ffffff18;margin-top:35px;padding:18px;color:#94a3bd;font-size:12px}
.alert{padding:12px 15px;border-radius:7px;margin-bottom:18px;background:#eef7ee}.alert.error{background:#fff0f0;color:#9b1c1c}.center{text-align:center}.right{text-align:right}.danger{color:#b42318}.success{color:#087443}
@media(max-width:850px){.menu{display:block}.navlinks{display:none;position:absolute;top:76px;left:0;width:100%;background:#fff;padding:20px;flex-direction:column;align-items:flex-start}.navlinks.open{display:flex}.hero h1{font-size:39px}.grid3,.dashboard{grid-template-columns:1fr 1fr}.statsgrid{grid-template-columns:1fr 1fr}.footergrid{grid-template-columns:1fr 1fr}}
@media(max-width:600px){.hero{padding:70px 0}.hero h1{font-size:32px}.grid3,.grid2,.dashboard,.formgrid,.footergrid,.statsgrid{grid-template-columns:1fr}.section{padding:55px 0}.actions{flex-direction:column;width:190px}.brand small{display:none}}

/* ===============================
   PROFESSIONAL FOOTER
================================ */

.footer {
    background: linear-gradient(135deg, #03183d, #06275a);
    color: #fff;
    padding: 65px 0 0;
    margin-top: 50px;
}

.footer-main {
    width: 92%;
    max-width: 1250px;
    margin: auto;
    display: grid;
    grid-template-columns: 1.25fr 1fr 1.15fr 1.5fr;
    gap: 45px;
}

/* Brand */
.footer-brand {
    padding-right: 15px;
}

.footer-brand-logo {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-bottom: 20px;
}

.footer-brand-logo img {
    width: 78px;
    height: 78px;
    object-fit: contain;
    background: #fff;
    border-radius: 50%;
    padding: 5px;
}

.footer-brand-logo h2 {
    margin: 0;
    color: #fff;
    font-size: 27px;
    line-height: 1.15;
}

.footer-brand-logo span {
    display: block;
    color: #f2b331;
    font-size: 13px;
    margin-top: 7px;
}

.footer-line {
    width: 55px;
    height: 2px;
    background: #f2b331;
    margin: 20px 0;
}

.footer-brand p {
    color: #d0d9e8;
    font-size: 14px;
    line-height: 1.8;
}

/* Headings */
.footer-column h3 {
    color: #fff;
    font-size: 20px;
    margin: 0 0 22px;
    position: relative;
}

.footer-column h3::before {
    content: "";
    display: inline-block;
    width: 5px;
    height: 20px;
    background: #f2b331;
    margin-right: 10px;
    vertical-align: -3px;
    border-radius: 3px;
}

/* Links */
.footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-links li {
    margin: 11px 0;
}

.footer-links a {
    color: #cbd5e5;
    font-size: 14px;
    transition: .25s;
}

.footer-links a::before {
    content: "›";
    color: #f2b331;
    font-size: 20px;
    margin-right: 9px;
}

.footer-links a:hover {
    color: #fff;
    padding-left: 5px;
}

/* Contact */
.footer-contact-item {
    display: flex;
    gap: 14px;
    margin-bottom: 20px;
    align-items: flex-start;
}

.footer-icon {
    width: 42px;
    height: 42px;
    min-width: 42px;
    border: 1px solid #3477d8;
    background: #092d63;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}

.footer-contact-item p {
    margin: 0;
    color: #d3dceb;
    font-size: 14px;
    line-height: 1.6;
}

.footer-contact-item a {
    color: #fff;
}

.footer-contact-item a:hover {
    color: #f2b331;
}

.whatsapp {
    color: #4ade80 !important;
    font-size: 12px;
}

/* Social icons */
.footer-social {
    display: flex;
    gap: 12px;
    margin-top: 25px;
}

.footer-social a {
    width: 43px;
    height: 43px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #123d78;
    color: #fff;
    font-size: 18px;
    transition: .3s;
}

.footer-social a:hover {
    background: #1769e0;
    transform: translateY(-4px);
}

/* Map */
.footer-map {
    margin-top: 20px;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid #28548b;
    height: 210px;
}

.footer-map iframe {
    width: 100%;
    height: 100%;
    border: 0;
}

/* Features */
.footer-features {
    width: 92%;
    max-width: 1250px;
    margin: 55px auto 0;
    padding: 28px 0;
    border-top: 1px solid #ffffff18;
    border-bottom: 1px solid #ffffff18;
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 20px;
}

.footer-feature {
    display: flex;
    align-items: center;
    gap: 13px;
    border-right: 1px solid #ffffff20;
    padding-right: 15px;
}

.footer-feature:last-child {
    border-right: 0;
}

.feature-icon {
    width: 52px;
    height: 52px;
    min-width: 52px;
    border-radius: 50%;
    background: #1769e0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 23px;
}

.footer-feature strong {
    display: block;
    color: #fff;
    font-size: 20px;
}

.footer-feature span {
    color: #c4d0e2;
    font-size: 12px;
}

/* Newsletter */
.footer-newsletter {
    width: 92%;
    max-width: 1000px;
    margin: 0 auto;
    padding: 38px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 30px;
}

.newsletter-text h3 {
    margin: 0 0 5px;
    color: #fff;
    font-size: 21px;
}

.newsletter-text p {
    margin: 0;
    color: #c4d0e2;
    font-size: 13px;
}

.newsletter-form {
    display: flex;
    min-width: 450px;
}

.newsletter-form input {
    flex: 1;
    padding: 14px 17px;
    background: #102f5d;
    color: #fff;
    border: 1px solid #31598c;
    border-radius: 7px 0 0 7px;
    outline: none;
}

.newsletter-form input::placeholder {
    color: #aab8ce;
}

.newsletter-form button {
    padding: 14px 25px;
    border: 0;
    background: #1769e0;
    color: #fff;
    font-weight: bold;
    border-radius: 0 7px 7px 0;
    cursor: pointer;
}

/* Bottom */
.footer-bottom {
    border-top: 1px solid #ffffff15;
    padding: 20px 4%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.footer-bottom p {
    margin: 0;
    color: #aebbd0;
    font-size: 13px;
}

.footer-bottom strong {
    color: #f2b331;
}

.footer-bottom-links {
    display: flex;
    gap: 22px;
}

.footer-bottom-links a {
    color: #aebbd0;
    font-size: 13px;
}

.footer-bottom-links a:hover {
    color: #fff;
}

/* Mobile */
@media (max-width: 950px) {

    .footer-main {
        grid-template-columns: 1fr 1fr;
    }

    .footer-features {
        grid-template-columns: 1fr 1fr;
    }

    .footer-feature:nth-child(2),
    .footer-feature:nth-child(4) {
        border-right: 0;
    }

    .footer-newsletter {
        flex-direction: column;
        align-items: flex-start;
    }

    .newsletter-form {
        width: 100%;
        min-width: 0;
    }
}

@media (max-width: 600px) {

    .footer {
        padding-top: 45px;
    }

    .footer-main {
        grid-template-columns: 1fr;
        gap: 35px;
    }

    .footer-features {
        grid-template-columns: 1fr;
    }

    .footer-feature {
        border-right: 0;
    }

    .footer-newsletter {
        width: 90%;
    }

    .newsletter-form {
        flex-direction: column;
    }

    .newsletter-form input,
    .newsletter-form button {
        border-radius: 6px;
        width: 100%;
    }

    .newsletter-form button {
        margin-top: 8px;
    }

    .footer-bottom {
        flex-direction: column;
        text-align: center;
    }

    .footer-bottom-links {
        flex-wrap: wrap;
        justify-content: center;
    }
}

<link rel="stylesheet"
      href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css">
      
    

/* =========================
   SOCIAL MEDIA ICONS
========================= */

.footer-social {
    display: flex;
    gap: 14px;
    margin-top: 25px;
}

.footer-social a {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: #123f7c;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .3s ease;
    text-decoration: none;
}

.footer-social svg {
    width: 21px;
    height: 21px;
    fill: #ffffff;
    display: block;
}

.footer-social a:hover {
    transform: translateY(-5px);
}

.social-facebook:hover {
    background: #1877f2 !important;
}

.social-instagram:hover {
    background: #e4405f !important;
}

.social-youtube:hover {
    background: #ff0000 !important;
}

.social-linkedin:hover {
    background: #0a66c2 !important;
}

/* Instagram outline */
.social-instagram svg rect,
.social-instagram svg circle {
    fill: none;
    stroke: #fff;
    stroke-width: 2;
}

.social-instagram svg .instagram-dot {
    fill: #fff;
    stroke: none;
}

/* YouTube */
.social-youtube svg .youtube-play {
    fill: #ff0000;
}

.social-youtube:hover svg .youtube-play {
    fill: #fff;
}

/* ================================
   RESULT PAGE - MOBILE FIX
================================ */

.tablewrap {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.tablewrap .table {
    min-width: 850px;
}

/* Result subject input fields */
.tablewrap input {
    width: 100%;
    min-width: 100px;
    padding: 9px 10px;
    border: 1px solid #d8dee9;
    border-radius: 6px;
    font-size: 13px;
    box-sizing: border-box;
}

.tablewrap th {
    white-space: nowrap;
}

.tablewrap td {
    vertical-align: middle;
}

/* Mobile */
@media (max-width: 600px) {

    .formbox {
        width: 94%;
        padding: 18px;
        box-sizing: border-box;
    }

    .title h2 {
        font-size: 27px;
    }

    .title p {
        font-size: 13px;
    }

    .formgrid {
        grid-template-columns: 1fr;
    }

    .field.full {
        grid-column: auto;
    }

    /* Subject table becomes horizontally scrollable */
    .tablewrap {
        border: 1px solid #e5eaf2;
        border-radius: 8px;
        background: #fff;
    }

    .tablewrap .table {
        min-width: 850px;
    }

    .tablewrap input {
        min-width: 110px;
    }

    /* Result records table */
    .section .tablewrap {
        overflow-x: auto;
    }

    /* Admin navigation */
    .adminnav .container {
        overflow-x: auto;
        flex-wrap: nowrap;
        white-space: nowrap;
    }

    .adminnav a {
        flex-shrink: 0;
    }
}

/* ==========================================
   PUBLIC WEBSITE MEGA MENU
   PUBLIC HEADER ONLY
========================================== */
.public-header-nav{gap:18px;align-items:center;position:relative;z-index:1002}
.public-header-nav .nav-dropdown{position:relative;height:76px;display:flex;align-items:center;flex:0 0 auto}
.public-header-nav .nav-dropdown-link{display:flex;align-items:center;gap:5px;font-size:14px;color:var(--text);white-space:nowrap;height:100%;padding:0 2px}
.public-header-nav .nav-dropdown-link:hover{color:var(--primary)}
.nav-chevron{font-size:15px;line-height:1;position:relative;top:-1px}

/* IMPORTANT: dropdowns stay hidden unless their own menu is hovered */
.public-header-nav .mega-menu{
  display:none !important;
  position:absolute !important;
  top:76px !important;
  left:50% !important;
  transform:translateX(-50%) !important;
  z-index:1005 !important;
  background:#fff;
  border:1px solid #e1e6ee;
  border-radius:0 0 9px 9px;
  box-shadow:0 14px 32px rgba(11,45,99,.16);
  padding:22px 24px;
  gap:28px;
}
.public-header-nav .nav-dropdown:hover>.mega-menu{
  display:grid !important;
}
.public-header-nav .mega-menu::before{content:"";position:absolute;top:-8px;left:50%;width:15px;height:15px;background:#fff;border-left:1px solid #e1e6ee;border-top:1px solid #e1e6ee;transform:rotate(45deg)}

.about-mega{width:min(1080px,92vw);grid-template-columns:1.2fr 1.15fr 1fr 1.35fr;column-gap:34px;row-gap:20px}
.about-mega .mega-bottom{grid-row:2}
.about-mega .mega-bottom:nth-of-type(5){grid-column:1}
.about-mega .mega-bottom:nth-of-type(6){grid-column:2}

.mega-column{display:flex;flex-direction:column;min-width:0}
.mega-column h4{margin:0 0 9px;color:#1749a1;font-size:14px;font-weight:600;line-height:1.3}
.mega-column a{color:#303a4a;font-size:13.5px;line-height:1.35;padding:4px 0;text-decoration:none;white-space:nowrap}
.mega-column a:hover{color:var(--primary)}

.simple-mega{grid-template-columns:1fr;min-width:300px}
.courses-mega{min-width:310px}
.verification-mega{min-width:335px}
.admission-mega{width:min(760px,92vw);min-width:650px;grid-template-columns:1.15fr 1.05fr 1.4fr}
.notices-mega{min-width:315px}

@media(max-width:1100px){
  .public-header-nav{gap:12px}
  .public-header-nav .nav-dropdown{height:76px}
  .public-header-nav .mega-menu{left:auto !important;right:0 !important;transform:none !important;top:76px !important}
  .about-mega{width:760px;max-width:92vw;grid-template-columns:1fr 1fr}
}

@media(max-width:850px){
  .public-header-nav{display:none;position:absolute;top:76px;left:0;width:100%;background:#fff;padding:15px 4%;box-shadow:0 10px 25px rgba(0,0,0,.08);flex-direction:column;align-items:flex-start;gap:0}
  .public-header-nav.open{display:flex}
  .public-header-nav>a,.public-header-nav .nav-dropdown{width:100%}
  .public-header-nav .nav-dropdown{display:block;height:auto}
  .public-header-nav .nav-dropdown-link{height:auto;width:100%;padding:11px 0;justify-content:space-between}
  .public-header-nav .mega-menu{position:static !important;display:none !important;transform:none !important;width:100%;max-width:none;min-width:0;box-shadow:none;border:0;border-top:1px solid #edf0f5;border-radius:0;padding:12px 15px;margin-bottom:5px;grid-template-columns:1fr;gap:16px}
  .public-header-nav .nav-dropdown:hover>.mega-menu{display:none !important}
  .public-header-nav .mega-menu.mobile-open{display:grid !important}
  .about-mega{grid-template-columns:1fr;row-gap:15px}
  .about-mega .mega-bottom,.about-mega .mega-bottom:nth-of-type(5),.about-mega .mega-bottom:nth-of-type(6){grid-column:auto;grid-row:auto}
  .mega-column a{white-space:normal}
  .public-header-nav .btn,.public-header-nav .admin-login-btn{margin:7px 0;width:100%;text-align:center}
}


/* ==========================================
   MENU POSITION FIX - ONLY DROPDOWN POSITION
   ========================================== */

/* Each normal dropdown opens directly below its own menu item */
.public-header-nav .simple-mega{
  left:0 !important;
  right:auto !important;
  transform:none !important;
}

/* Keep the large About mega menu centered */
.public-header-nav .about-mega{
  left:50% !important;
  right:auto !important;
  transform:translateX(-50%) !important;
}

/* Arrow of normal dropdowns sits below its own menu item */
.public-header-nav .simple-mega::before{
  left:22px !important;
}

/* About arrow remains centered */
.public-header-nav .about-mega::before{
  left:50% !important;
}

/* Keep the dropdown attached to its trigger on desktop */
@media (min-width:851px){
  .public-header-nav .simple-mega{
    top:76px !important;
  }
  .public-header-nav .about-mega{
    top:76px !important;
  }
}

/* Preserve the existing mobile behavior */
@media(max-width:850px){
  .public-header-nav .simple-mega,
  .public-header-nav .about-mega{
    left:auto !important;
    right:auto !important;
    transform:none !important;
  }
  .public-header-nav .simple-mega::before,
  .public-header-nav .about-mega::before{
    display:none;
  }
}