:root{--primary-color: #0056b3;--secondary-color: #f1c40f;--text-color: #333;--light-bg: #f8f9fa;--dark-bg: #2c3e50;--white: #ffffff;--gray: #777;--box-shadow: 0 5px 15px rgba(0,0,0,.1);--transition: all .3s ease}*{margin:0;padding:0;box-sizing:border-box;font-family:Poppins,sans-serif}html{scroll-behavior:smooth}body{line-height:1.6;color:var(--text-color)}ul{list-style:none}a{text-decoration:none;color:inherit}.container{max-width:1100px;margin:0 auto;padding:0 20px}.btn{display:inline-block;background:var(--secondary-color);color:var(--dark-bg);padding:12px 30px;border-radius:5px;font-weight:600;transition:var(--transition);border:none;cursor:pointer}.btn:hover{background:#d4ac0d;transform:translateY(-2px)}.section-title{text-align:center;margin-bottom:50px}.section-title h2{font-size:2.5rem;color:var(--primary-color);margin-bottom:10px}.section-title p{color:var(--gray)}.navbar{background:var(--white);box-shadow:0 2px 10px #0000001a;position:fixed;top:0;left:0;width:100%;z-index:1000;height:70px;display:flex;align-items:center}.navbar .container{display:flex;justify-content:space-between;align-items:center;width:100%}.logo{font-size:1.5rem;font-weight:700;color:var(--primary-color)}.logo span{color:var(--secondary-color)}.nav-menu{display:flex;gap:30px}.nav-link{font-weight:500;color:var(--dark-bg);transition:var(--transition)}.nav-link:hover{color:var(--primary-color)}.menu-toggle{display:none;cursor:pointer}.bar{display:block;width:25px;height:3px;background:var(--dark-bg);margin:5px auto;transition:var(--transition)}.hero{height:100vh;background:linear-gradient(#0056b3cc,#0056b3cc),url(/assets/foto%20sekolah-Dl0ZBQee.jpg) no-repeat center center/cover;display:flex;align-items:center;justify-content:center;text-align:center;color:var(--white);padding-top:70px}.hero-content h1{font-size:3rem;margin-bottom:20px}.hero-content p{font-size:1.2rem;margin-bottom:30px;max-width:600px;margin-left:auto;margin-right:auto}.info-boxes{padding:50px 0;margin-top:-50px;position:relative;z-index:10}.info-boxes .container{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:30px}.box{background:var(--white);padding:30px;text-align:center;border-radius:10px;box-shadow:var(--box-shadow);transition:var(--transition)}.box:hover{transform:translateY(-10px)}.box i{font-size:2.5rem;color:var(--primary-color);margin-bottom:20px}.box h3{margin-bottom:15px;color:var(--dark-bg)}.box p{color:var(--gray);font-size:.9rem}.about{padding:80px 0;background:var(--light-bg)}.about-content{display:flex;align-items:center;gap:50px}.about-img{flex:1}.about-img img{width:100%;border-radius:10px;box-shadow:var(--box-shadow)}.about-text{flex:1}.about-text h2{font-size:2.5rem;color:var(--primary-color);margin-bottom:20px}.about-text p{margin-bottom:20px;color:var(--gray)}.visi-misi h3{margin-bottom:10px;color:var(--dark-bg)}.visi-misi ul li{margin-bottom:10px;color:var(--gray);display:flex;align-items:center;gap:10px}.visi-misi ul li i{color:var(--secondary-color)}.facilities{padding:80px 0}.facilities-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:20px;text-align:center}.facility-item{background:var(--white);padding:30px 20px;border-radius:10px;box-shadow:0 0 10px #0000000d;border:1px solid #eee;transition:var(--transition)}.facility-item:hover{border-color:var(--primary-color);transform:translateY(-5px)}.facility-item i{font-size:2rem;color:var(--primary-color);margin-bottom:15px}.facility-item h4{color:var(--dark-bg)}.video-section{padding:80px 0;background:var(--light-bg);text-align:center}.video-container{position:relative;padding-bottom:56.25%;height:0;overflow:hidden;max-width:800px;margin:0 auto;border-radius:10px;box-shadow:var(--box-shadow)}.video-container iframe{position:absolute;top:0;left:0;width:100%;height:100%}.documents{padding:80px 0}.documents-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px}.doc-item{background:var(--white);padding:20px;border-radius:10px;box-shadow:0 0 10px #0000000d;border:1px solid #eee;display:flex;align-items:center;gap:20px;transition:var(--transition)}.doc-item:hover{border-color:var(--primary-color);transform:translateY(-5px)}.doc-item i{font-size:2.5rem;color:var(--primary-color)}.doc-info{flex:1}.doc-info h4{color:var(--dark-bg);font-size:1rem;margin-bottom:5px}.doc-info p{color:var(--gray);font-size:.8rem}.btn-sm{display:inline-block;background:var(--secondary-color);color:var(--dark-bg);padding:8px 15px;border-radius:5px;font-size:.8rem;font-weight:600;transition:var(--transition)}.btn-sm:hover{background:#d4ac0d}.drive-embed-note{text-align:center;margin-top:30px;color:var(--gray);font-size:.9rem}.drive-embed-note i{color:#4285f4;margin-right:5px}.gallery{padding:80px 0;background:var(--light-bg)}.gallery-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px}.gallery-item{overflow:hidden;border-radius:10px;box-shadow:var(--box-shadow)}.gallery-item img{width:100%;height:100%;object-fit:cover;transition:var(--transition)}.gallery-item:hover img{transform:scale(1.1)}.ig-frame{width:100%;height:600px;border:0;border-radius:10px;box-shadow:var(--box-shadow)}.contact{padding:80px 0}.contact-wrapper{display:flex;gap:50px}.contact-info{flex:1}.info-item{margin-bottom:30px;display:flex;flex-direction:column;align-items:flex-start}.info-item i{font-size:1.5rem;color:var(--primary-color);margin-bottom:10px}.info-item h4{font-size:1.2rem;margin-bottom:5px}.info-item p{color:var(--gray)}.contact-form{flex:1}.contact-form form{display:flex;flex-direction:column;gap:15px}.contact-form input,.contact-form textarea{padding:15px;border:1px solid #ddd;border-radius:5px;font-size:1rem;outline:none}.contact-form input:focus,.contact-form textarea:focus{border-color:var(--primary-color)}footer{background:var(--dark-bg);color:var(--white);padding:60px 0 20px}.footer-content{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:40px;margin-bottom:40px}.footer-about h3,.footer-links h3,.footer-social h3{margin-bottom:20px;color:var(--secondary-color)}.footer-links ul li{margin-bottom:10px}.footer-links ul li a{color:#ddd;transition:var(--transition)}.footer-links ul li a:hover{color:var(--secondary-color)}.social-icons{display:flex;gap:15px}.social-icons a{width:40px;height:40px;background:#ffffff1a;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:var(--transition)}.social-icons a:hover{background:var(--secondary-color);color:var(--dark-bg)}.footer-bottom{text-align:center;padding-top:20px;border-top:1px solid rgba(255,255,255,.1);font-size:.9rem;color:#aaa}@media(max-width:768px){.menu-toggle{display:block}.menu-toggle.active .bar:nth-child(2){opacity:0}.menu-toggle.active .bar:nth-child(1){transform:translateY(8px) rotate(45deg)}.menu-toggle.active .bar:nth-child(3){transform:translateY(-8px) rotate(-45deg)}.nav-menu{position:fixed;left:-100%;top:70px;gap:0;flex-direction:column;background:var(--white);width:100%;text-align:center;transition:.3s;box-shadow:0 5px 10px #0000001a}.nav-menu.active{left:0}.nav-item{margin:16px 0}.nav-link{display:block;padding:15px}.hero-content h1{font-size:2rem}.about-content,.contact-wrapper{flex-direction:column}}.modal{display:none;position:fixed;z-index:1001;padding-top:100px;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:#000;background-color:#000000e6}.modal-content{margin:auto;display:block;width:80%;max-width:700px;animation-name:zoom;animation-duration:.6s;text-align:center}#modal-image{width:100%;height:auto;border-radius:5px}#modal-caption{margin:auto;display:block;width:80%;max-width:700px;text-align:center;color:#ccc;padding:10px 0;height:150px}.close-modal{position:absolute;top:15px;right:35px;color:#f1f1f1;font-size:40px;font-weight:700;transition:.3s}.close-modal:hover,.close-modal:focus{color:#bbb;text-decoration:none;cursor:pointer}@keyframes zoom{0%{transform:scale(0)}to{transform:scale(1)}}@media only screen and (max-width:700px){.modal-content{width:100%}}
