*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:Arial,Helvetica,sans-serif;color:#222;background:#f6f8fc;line-height:1.6}a{text-decoration:none}.container{width:92%;max-width:1200px;margin:auto}.topbar{background:#082c6c;color:#fff;padding:8px 0;font-size:14px}.topbar .container{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}header{background:#fff;position:sticky;top:0;z-index:1000;box-shadow:0 2px 10px #0002}.navbar{min-height:78px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{display:flex;align-items:center;gap:12px}.logo{width:56px;height:56px;border-radius:50%;background:#123c8c;color:#fff;display:grid;place-items:center;font-weight:bold}.brand h1{font-size:20px;color:#123c8c}.brand small{color:#666}nav ul{display:flex;list-style:none;gap:18px}nav a{color:#222;font-weight:bold}nav a:hover{color:#1877f2}.menu{display:none;font-size:28px;cursor:pointer}.hero{min-height:590px;display:flex;align-items:center;color:#fff;background:linear-gradient(#06265fcc,#06265fcc),url('images/school-campus.jpg') center/cover}.hero-content{max-width:760px}.hero h2{font-size:52px;line-height:1.15;margin-bottom:18px}.hero h2 span{color:#ffd43b}.hero p{font-size:19px;margin-bottom:25px}.btn{display:inline-block;padding:12px 20px;border-radius:7px;font-weight:bold;margin:4px;border:0}.primary{background:#ffb703;color:#111}.blue{background:#1877f2;color:#fff}.green{background:#25d366;color:#fff}.notice{background:#fff;border-bottom:1px solid #ddd}.notice .container{display:flex;gap:18px;align-items:center;padding:12px 0}.notice-title{background:#123c8c;color:#fff;padding:8px 15px;font-weight:bold}section{padding:70px 0}.title{text-align:center;margin-bottom:40px}.title h2{font-size:34px;color:#123c8c}.title p{color:#666}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}.photo{width:100%;height:390px;object-fit:cover;border-radius:15px;box-shadow:0 5px 18px #0002}.card-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.card{background:#fff;padding:25px 18px;border-radius:12px;text-align:center;box-shadow:0 3px 12px #0001;transition:.25s}.card:hover{transform:translateY(-5px)}.icon{font-size:42px;margin-bottom:10px}.card h3{color:#123c8c;margin-bottom:7px}.alt{background:#eef4ff}.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.gallery-grid img{width:100%;height:240px;object-fit:cover;border-radius:12px;cursor:pointer;transition:.3s}.gallery-grid img:hover{transform:scale(1.03)}.admission{background:linear-gradient(#123c8ceb,#123c8ceb),url('images/school.jpg') center/cover;color:#fff;text-align:center}.admission h2{font-size:38px}.form{background:#fff;padding:28px;border-radius:12px;box-shadow:0 3px 15px #0001}.form input,.form select,.form textarea{width:100%;padding:12px;margin:7px 0 12px;border:1px solid #ccc;border-radius:6px;font:inherit}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px}.contact-box{background:#fff;padding:28px;border-radius:12px;box-shadow:0 3px 15px #0001}.contact-box p{margin:14px 0}.map{width:100%;height:390px;border:0;border-radius:12px}footer{background:#071f4d;color:#fff;padding:45px 0 20px}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:35px}.footer-grid ul{list-style:none}.footer-grid a{color:#ddd}.copyright{text-align:center;border-top:1px solid #fff3;margin-top:30px;padding-top:18px}.float{position:fixed;right:18px;width:54px;height:54px;border-radius:50%;display:grid;place-items:center;color:#fff;font-size:25px;z-index:999}.wa{bottom:80px;background:#25d366}.call{bottom:15px;background:#1877f2}.lightbox{display:none;position:fixed;inset:0;background:#000d;z-index:2000;align-items:center;justify-content:center}.lightbox img{max-width:90%;max-height:85%;border-radius:8px}.close{position:absolute;right:30px;top:15px;color:#fff;font-size:45px;cursor:pointer}@media(max-width:900px){.menu{display:block}nav{display:none;width:100%}nav.active{display:block}nav ul{flex-direction:column;padding:15px 0}.navbar{flex-wrap:wrap}.card-grid{grid-template-columns:repeat(2,1fr)}.grid2,.contact-grid{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr}.hero h2{font-size:40px}.gallery-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:550px){.topbar .container{justify-content:center;text-align:center}.brand h1{font-size:16px}.hero{min-height:520px}.hero h2{font-size:32px}.card-grid,.gallery-grid{grid-template-columns:1fr}.gallery-grid img{height:230px}.title h2{font-size:28px}}
