  body {
      margin: 0;
      font-family: "Calisto MT", serif;
      background-color: #fff;
    }
    *{margin:0;padding:0;box-sizing:border-box;}
    header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      background: #f8eaff;
      padding: 10px 40px;
    }
    .logo-container { display:flex; align-items:center; }
    .logo-container img { height:80px; margin-right:15px; }
   .logo-container .site-title {
    font-size:32px;
    font-weight:700;
    color:#2e004f;
    margin:0;
    line-height:1.2;
}

.logo-container .site-title a {
    text-decoration:none;
    color:inherit;
}
    nav { flex:1; display:flex; justify-content:center; }
    nav ul { list-style:none; display:flex; gap:20px; padding:0; margin:0; }
    nav ul li a {
      background:#4F2888; color:white; padding:6px 16px; border-radius:20px;
      font-size:16px; text-decoration:none; transition:0.3s;
    }
    nav ul li a:hover { background:#a333f3; }
    /* ✅ Mobile header fix — keeps banner length same */ @media (max-width:768px){ header{padding:12px 40px;} .logo-container img{height:70px;margin-left:-20px;margin-right:8px;} .logo-container h1{font-size:26px;margin:0;margin-left:-3px;} nav ul li a{font-size:14px;padding:5px 12px;} } .menu-toggle{display:none;flex-direction:column;cursor:pointer;position:absolute;top:18px;right:22px;z-index:9999;background:transparent;}
    .menu-toggle { display:none; flex-direction:column; cursor:pointer; position:absolute; top:18px; right:22px; z-index:9999; background:transparent; }
    .menu-toggle span { width:25px; height:3px; background:#4F2888; margin:4px 0; border-radius:3px; }

    @media (max-width:768px) {
      .menu-toggle { display:flex; position:absolute; top:32px; right:22px; z-index:999999; }
      nav { display:none; flex-direction:column; position:absolute; top:70px; right:20px; background: rgba(248,234,255,0.97); padding:20px; border-radius:12px; box-shadow:0 2px 8px rgba(0,0,0,0.25); width:220px; z-index:999998; }
      nav.show { display:flex; }
      nav ul { flex-direction:column; justify-content:space-evenly; align-items:center; gap:18px; width:100%; margin:0; padding:0; }
      nav ul li { width:100%; text-align:center; }
      nav ul li a { display:block; width:100%; background:#4F2888; color:white; padding:10px 0; border-radius:20px; font-size:16px; text-decoration:none; }
      nav ul li a:hover { background:#a333f3; }
    }
    
     #content { min-height:500px; background:white; padding:30px; }

    .banner img { width:100%; height:auto; display:block; }

    .middle-banner { position:absolute; top:50; left:50; width:100%; height:40px; overflow:hidden; background: linear-gradient(90deg, #e65100, #673ab7); z-index:9999; }
    .banner-content { display:flex; width:max-content; animation: scroll-left 20s linear infinite; }
    .banner-item { color:#fff; font-size:30px; padding:0 50px; white-space:nowrap; display:flex; align-items:center; font-weight:bold; }
    @keyframes scroll-left { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } }

    
    /* ================================ */
/* FORCE CALISTO FOR HEADER NAV */
/* ================================ */

nav ul li a {
  font-family: "Calisto MT", serif !important;
  font-weight: 500;
}
.logo-container h1,
.logo-container h1 a {
  font-family: "Calisto MT", serif !important;
  font-weight: 700;
}
