/* =========================================
   TABLET
========================================= */

@media (max-width:992px){

.container{
    width:94%;
}

.logo-text h2{
    font-size:18px;
}

.logo-text p{
    font-size:12px;
}

.hero-slider{
    height:500px;
}

.hero-content{
    left:7%;
    max-width:480px;
}

.hero-content h1{
    font-size:18px;
}

.hero-content h2{
    font-size:38px;
}

.hero-content p{
    font-size:16px;
}

.sidebar{
    width:300px;
}

}


/* =========================================
   MOBILE
========================================= */

@media (max-width:768px){

.header .container{

height:70px;

}

.logo img{

width:45px;

}

.logo-text h2{

font-size:17px;

}

.logo-text p{

display:none;

}

.menu-btn{

width:42px;
height:42px;

font-size:18px;

}

.hero{

margin-top:70px;

}

.hero-slider{

height:420px;

}

.hero-content{

left:6%;
right:6%;

max-width:none;

}

.hero-content h1{

font-size:15px;

letter-spacing:2px;

}

.hero-content h2{

font-size:30px;

line-height:1.2;

margin:8px 0;

}

.hero-content p{

font-size:15px;

margin:15px 0;

}

.btn{

padding:12px 22px;

font-size:14px;

}

.slider-dot{

bottom:15px;

}

.sidebar{

width:280px;

}

}


/* =========================================
   SMALL MOBILE
========================================= */

@media (max-width:480px){

.hero-slider{

height:360px;

}

.hero-content{

top:52%;

}

.hero-content h1{

font-size:13px;

}

.hero-content h2{

font-size:24px;

}

.hero-content p{

font-size:14px;

}

.btn{

display:inline-block;

padding:10px 18px;

font-size:13px;

}

.logo-text h2{

font-size:15px;

}

.menu-btn{

width:40px;
height:40px;

}

.sidebar{

width:100%;

right:-100%;

}

.sidebar.active{

right:0;

}

}

/*===========================
SAMBUTAN RESPONSIVE
===========================*/

@media(max-width:768px){

.welcome{

padding:60px 0;

}

.welcome-grid{

grid-template-columns:1fr;

gap:30px;

}

.welcome-photo{

text-align:center;

}

.welcome-photo img{

width:260px;

margin:auto;

}

.welcome-text h2{

font-size:28px;

text-align:center;

}

.welcome-text h4{

text-align:center;

}

}

/*==================================
VIDEO RESPONSIVE
==================================*/

@media(max-width:768px){

.section-title h2{

font-size:28px;

}

.social-media{

gap:12px;

}

.social-media a{

width:50px;

height:50px;

font-size:20px;

}

}

/*==================================
BERITA RESPONSIVE
==================================*/

@media(max-width:992px){

.news-track{

grid-template-columns:repeat(2,1fr);

}

}

@media(max-width:768px){

.news-track{

grid-template-columns:1fr;

}

.news-card img{

height:220px;

}

.news-content h3{

font-size:20px;

}

}

/*=================================
PENGUMUMAN RESPONSIVE
=================================*/

@media(max-width:768px){

.info-grid{

grid-template-columns:1fr;

gap:25px;

}

}

/*=================================
GURU RESPONSIVE
=================================*/

@media(max-width:992px){

.teacher-card{
    min-width:250px;
    flex:0 0 250px;
}

}

@media(max-width:768px){

.teacher-slider{
    gap:20px;
    padding:10px 30px;
}

.teacher-card{
    min-width:220px;
    flex:0 0 220px;
}

.teacher-card img{
    height:260px;
}

.teacher-prev,
.teacher-next{
    width:38px;
    height:38px;
    font-size:15px;
}

}

.teacher-prev{
    left:0;
}

.teacher-next{
    right:0;
}

/*=================================
PARTNER RESPONSIVE
=================================*/

@media(max-width:768px){

.partner-item{
    width:130px;
    height:80px;
}

.partner-item img{
    max-width:90px;
    max-height:55px;
}

.partner-track{
    gap:20px;
}

}

/*=================================
GALERI RESPONSIVE
=================================*/

@media(max-width:992px){

.gallery-grid{
    grid-template-columns:repeat(2,1fr);
}

}

@media(max-width:768px){

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

.gallery-item img{
    height:220px;
}

}

@media(max-width:768px){

.back-to-top{

width:45px;
height:45px;

right:15px;
bottom:15px;

font-size:18px;

}

}

/*=================================
MAP RESPONSIVE
=================================*/

@media(max-width:768px){

.map-wrapper iframe{

    height:300px;

}

}







/* ===================================
   KONTAK RESPONSIVE
=================================== */

@media(max-width:768px){

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

    .contact-form-grid{
        grid-template-columns:1fr;
        gap:30px;
    }

    .contact-form-info h2{
        font-size:28px;
    }

    .map-wrapper iframe{
        height:350px;
    }

    .whatsapp-box{
        flex-direction:column;
        text-align:center;
    }

    .whatsapp-btn{
        width:100%;
        text-align:center;
    }

}


@media(max-width:480px){

    .contact-section,
    .map-section,
    .contact-form-section{
        padding:60px 0;
    }

    .contact-card{
        padding:22px;
        gap:15px;
    }

    .contact-icon{
        width:48px;
        height:48px;
        min-width:48px;
        font-size:18px;
    }

    .map-wrapper iframe{
        height:300px;
    }

}