:root{--blue:#0753a0;--dark:#003d78;--orange:#f47b20;--light:#f5f9fd}
    body{font-family:Arial,Helvetica,sans-serif;color:#333;background:#fff;padding-top:190px}
    a{text-decoration:none}
    .site-header{position:fixed;top:0;left:0;right:0;z-index:1030;width:100%;background:#fff}
    .topbar{background:var(--orange);color:#fff;font-size:13px}
    .topbar a{color:#fff}.brand{background:#fff;padding:10px 0;box-shadow:0 1px 0 rgba(0,0,0,.06)}
    .nav-main{background:var(--blue);box-shadow:0 2px 10px rgba(0,0,0,.08)}
    .logo-mark{width:58px;height:58px;border:2px solid #ddd;border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--orange);font-size:24px;font-weight:800}
    .brand-title{color:var(--blue);font-size:27px;font-weight:800;line-height:1}.brand-sub{font-size:13px;color:#555}
    .nav-main .nav-link{color:#fff;font-size:13px;padding:13px 14px}
    .nav-main .nav-link:hover{background:#06447f}.hero{position:relative;min-height:410px;overflow:hidden;background:linear-gradient(135deg,#fff 0%,#f7fbff 65%,#e9f2f9 100%)}
    .hero:before{content:"";position:absolute;inset:0;background-image:linear-gradient(#dce8f3 1px,transparent 1px),linear-gradient(90deg,#dce8f3 1px,transparent 1px);background-size:35px 35px;opacity:.35}
    .hero-content{position:relative;z-index:1;padding:58px 0}.hero-logo{display:flex;gap:15px;align-items:center;justify-content:center;color:var(--blue)}
    .hero h1{font-size:70px;font-weight:900;color:#0753a0;line-height:.95;margin:20px 0 5px;text-shadow:1px 2px #ddd}
    .hero h2{font-size:28px;font-weight:800;color:#111}.admission{display:inline-block;background:var(--orange);color:#fff;font-weight:900;font-size:28px;padding:20px 32px;border-radius:28px;box-shadow:0 5px 0 #bd5b0c}
    .ticker{background:#1ea5dc;color:#fff;padding:7px;text-align:center;font-size:13px}
    .section-title{color:var(--blue);font-weight:800;text-align:center;margin:22px 0 15px}
    .affiliation{border:1px solid #e2e2e2;border-radius:10px;height:75px;display:flex;align-items:center;justify-content:center;background:#fff;box-shadow:0 2px 8px #ddd;font-weight:700;color:#555}
    .about-img{height:210px;border-radius:12px;background:linear-gradient(135deg,#ddd,#f8f8f8);display:flex;align-items:center;justify-content:center;color:#888;font-size:45px}
    .update-card{border:1px solid #78afe0;border-radius:10px;padding:22px;min-height:180px;position:relative}
    .badge-green{position:absolute;right:0;top:0;background:#1fc69a;color:#fff;border-radius:0 10px 0 10px;padding:6px 14px;font-size:11px}
    .update-card h5{color:var(--blue);font-weight:800;font-size:16px}.update-card p{font-size:13px}
    .award{background:linear-gradient(120deg,#f9fbff,#e8f3ff);padding:28px;border-radius:12px;min-height:190px}
    .achievement{border-radius:12px;overflow:hidden;box-shadow:0 3px 12px #bbb;background:#fff}
    .achievement .fake-img{height:180px;background:linear-gradient(135deg,#ffe0c5,#fff);display:flex;align-items:center;justify-content:center;color:#c66;font-weight:800}
    .advantage{background:#00509e;color:#fff}.adv-box{border:1px solid rgba(255,255,255,.25);padding:20px 8px;min-height:100px;text-align:center}
    .adv-box i{font-size:28px}.adv-box strong{display:block;font-size:14px}.adv-box span{font-size:11px}
    .blog-img{height:105px;border-radius:10px;background:linear-gradient(135deg,#d9e9f7,#8bb3d4);display:flex;align-items:center;justify-content:center;color:#fff;font-size:30px}
    .blog-title{font-size:13px;font-weight:700;margin-top:8px}.blog-date{font-size:11px;color:#777}
    .univ{height:65px;border:1px solid #ddd;border-radius:9px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:#555;background:#fff}
    footer{background:#003d78;color:#fff;font-size:11px}.footer-title{font-weight:800;font-size:12px;margin-bottom:8px}
    .floating{position:fixed;right:0;top:48%;background:var(--orange);color:#fff;padding:15px 7px;writing-mode:vertical-rl;border-radius:8px 0 0 8px;z-index:10;font-weight:700}
    .btn-primary{background:var(--blue);border-color:var(--blue)}.btn-orange{background:var(--orange);color:#fff}
    .modal-content{border-radius:1rem;overflow:hidden}
    .modal-header{border-bottom:none}
    .modal-title{font-weight:800;color:var(--dark)}
    .modal-footer{border-top:none}
    .modal-body.bg-light{background:rgba(240,248,255,.95)}
    .modal-body, .modal-body .form-label, .modal-body .form-control, .modal-body textarea{font-family:inherit;font-weight:400;font-size:0.95rem;color:#333}
    .form-control.form-control-lg{border-radius:.75rem;box-shadow:inset 0 1px 3px rgba(0,0,0,.08)}
    .form-label{font-weight:400;color:#223d78}
        /* Contact section */
        #contact-section{background:#fff}
        /* Ensure anchor targets are visible under fixed header in modern browsers */
        #contact-section{scroll-margin-top:200px}
        /* decorative animated background for contact section */
        #contact-section{position:relative;overflow:hidden}
        #contact-section::before{
            content:"";
            position:absolute;inset:-20% -10% -20% -10%;
            background: radial-gradient(circle at 10% 20%, rgba(7,83,160,0.06) 0%, transparent 18%),
                                    radial-gradient(circle at 80% 70%, rgba(244,123,32,0.04) 0%, transparent 20%),
                                    linear-gradient(120deg, rgba(240,248,255,0.6), rgba(255,255,255,0.6));
            transform:translate3d(0,0,0);
            z-index:0;pointer-events:none;filter:blur(24px);
            animation: contactBgMove 10s linear infinite;
        }
        @keyframes contactBgMove{
            0%{transform:translate3d(-5%,0,0) rotate(0deg)}
            50%{transform:translate3d(5%,2%,0) rotate(4deg)}
            100%{transform:translate3d(-5%,0,0) rotate(0deg)}
        }
        /* ensure content sits above background */
        #contact-section .container, #contact-section .map-frame, #contact-section .contact-form{position:relative;z-index:1}
        .contact-form{background:linear-gradient(180deg,#fff,#f7fbff);}
        /* make form and map equal height */
        #contact-section .row{align-items:stretch}
        .contact-form{height:100%;display:flex;flex-direction:column}
        .contact-form .form-control{border-radius:0.65rem;padding:14px}
        .contact-form h4{color:var(--blue);font-weight:800}
        .contact-form form{flex:1;display:flex;flex-direction:column}
        .contact-form .row.g-3{flex:1}
        .contact-form .row.g-3 .col-12{display:flex;flex-direction:column}
        .contact-form .row.g-3 textarea.form-control{flex:1}
        .map-frame{height:100%}
        .map-frame iframe{height:100%;border:0;min-height:360px}
        /* Scroll-triggered animations */
        .animate-on-scroll{opacity:0;transform:translateY(20px);transition:opacity .6s cubic-bezier(.2,.9,.2,1),transform .6s cubic-bezier(.2,.9,.2,1);will-change:transform,opacity;transition-delay:var(--delay,0ms)}
        .animate-on-scroll.animate-right{transform:translateX(30px)}
        .animate-on-scroll.animate-up{transform:translateY(20px)}
        .animate-on-scroll.in-view{opacity:1;transform:translateX(0) translateY(0);transition-delay:var(--delay,0ms)}
        @media(max-width:767px){
            body{padding-top:140px}
            .contact-form{padding:18px}
        }
    @media(max-width:767px){.hero h1{font-size:45px}.hero h2{font-size:21px}.admission{font-size:20px;padding:14px 20px}.hero{min-height:460px}.nav-main .navbar-nav{max-height:70vh;overflow:auto}.brand-title{font-size:21px}}