
:root{

--primary:#166534;
--primary2:#0F5132;
--yellow:#F7C948;
--orange:#F28C28;
--blue:#2196D3;
--light:#F8FAFC;

}

body{

font-family:'Poppins',sans-serif;
background:#fff;
overflow-x:hidden;

}
.navbar{

padding:18px 0;

background:#fff;

}

.logo-img{

width:70px;
height:70px;
object-fit:contain;
flex-shrink:0;

}

.logo-text {
	line-height: 1;
}
.logo-title{

font-size:22px;
font-weight:800;
color:#166534;
text-transform:uppercase;

}

.logo-subtitle {
	font-size: 26px;
	font-weight: 700;
	color: #d4a017;
	text-transform: uppercase;
	font-style: italic;
}

.logo-address{

font-size:12px;
color:#777;
letter-spacing:.8px;
text-transform:uppercase;

}

.navbar-nav .nav-link{

font-weight:600;
font-size:17px;
color:#222 !important;
margin-left:18px;
transition:.3s;

}

.navbar-nav .nav-link:hover,
.navbar-nav .nav-link.active{

color:#198754 !important;

}
.page-content{

padding-top:90px;

}

.teacher-card{

background:#fff;

border-radius:25px;

overflow:hidden;

transition:.4s;

box-shadow:0 15px 35px rgba(0,0,0,.08);

height:100%;

}

.teacher-card:hover{

transform:translateY(-12px);

box-shadow:0 25px 60px rgba(0,0,0,.15);

}

.teacher-img{

position:relative;

overflow:hidden;

}

.teacher-img img{

width:100%;

height:360px;

object-fit:cover;

transition:.5s;

}

.teacher-card:hover img{

transform:scale(1.08);

}

.teacher-social{

position:absolute;

bottom:15px;

left:50%;

transform:translateX(-50%);

display:flex;

gap:10px;

opacity:0;

transition:.3s;

}

.teacher-card:hover .teacher-social{

opacity:1;

}

.teacher-social a{

width:42px;

height:42px;

display:flex;

align-items:center;

justify-content:center;

background:#198754;

color:#fff;

border-radius:50%;

text-decoration:none;

}

.teacher-body{

padding:25px;

text-align:center;

}

.teacher-body h4{

font-weight:700;

margin-bottom:8px;

}

.teacher-body span{

color:#198754;

font-weight:600;

}

.hero{

position:relative;
height:auto;

}

.carousel-item{

height:100vh;
min-height:700px;
background-size:cover;
background-position:center;
position:relative;

}

.carousel-item::before{

content:'';
position:absolute;
left:0;
top:0;
width:100%;
height:100%;
}

.hero-caption{

position:absolute;
left:50%;
top:50%;
transform:translate(-50%,-50%);
text-align:center;
color:#fff;
z-index:20;
width:900px;
max-width:90%;

}

.hero-caption h1{

font-size:68px;
font-weight:800;
line-height:1.2;

}

.hero-caption p{

font-size:22px;
margin-top:25px;
opacity:.95;

}

.btn-daftar{

background:var(--yellow);
color:#222;
font-weight:700;
padding:15px 35px;
border-radius:50px;
margin-right:15px;

}

.btn-profil{

border:2px solid #fff;
color:#fff;
padding:15px 35px;
border-radius:50px;

}

.btn-profil:hover{

background:#fff;
color:#222;

}

.wave{

position:absolute;
bottom:-1px;
width:100%;
z-index:50;

}

.statistik{
position:relative;
z-index:99;

}

.stat-card{

background:#fff;
padding:35px;
border-radius:25px;
text-align:center;
box-shadow:0 20px 50px rgba(0,0,0,.08);
transition:.3s;

}

.stat-card:hover{

transform:translateY(-10px);

}

.stat-card h2{

font-size:42px;
font-weight:700;
color:var(--primary);

}

.stat-card span{

color:#777;

}
.gallery-item{
    position:relative;
    overflow:hidden;
    border-radius:25px;
    box-shadow:0 15px 35px rgba(0,0,0,.12);
    transition:.35s;
}

.gallery-item img{
    width:100%;
    height:280px;
    object-fit:cover;
    transition:.5s;
}

.gallery-item:hover img{
    transform:scale(1.1);
}

.gallery-item::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(to top,
        rgba(0,0,0,.75),
        rgba(0,0,0,.15));
    opacity:0;
    transition:.35s;
}

.gallery-item:hover::after{
    opacity:1;
}

.gallery-caption{

    position:absolute;
    left:25px;
    bottom:20px;

    z-index:10;

    color:white;

    opacity:0;

    transition:.35s;

}

.gallery-item:hover .gallery-caption{

opacity:1;

transform:translateY(-8px);

}

.gallery-caption h5{

font-weight:700;

margin-bottom:5px;

}

.gallery-caption i{

font-size:38px;

margin-bottom:10px;

display:block;

}

.gallery-item:hover{
transform:translateY(-8px);
}
.news-card{

background:#fff;

border-radius:25px;

overflow:hidden;

box-shadow:0 15px 35px rgba(0,0,0,.08);

transition:.35s;

height:100%;

}

.news-card:hover{

transform:translateY(-10px);

box-shadow:0 25px 60px rgba(0,0,0,.15);

}

.news-img{

overflow:hidden;

}

.news-img img{

width:100%;

height:250px;

object-fit:cover;

transition:.5s;

}

.news-card:hover img{

transform:scale(1.08);

}

.news-content{

padding:30px;

}

.news-category{

display:inline-block;

background:#198754;

color:#fff;

padding:6px 18px;

border-radius:30px;

font-size:13px;

margin-bottom:15px;

}

.news-date{

color:#999;

font-size:14px;

margin-bottom:15px;

display:block;

}

.news-content h4{

font-weight:700;

line-height:1.5;

margin-bottom:15px;

}

.news-content a{

text-decoration:none;

color:#222;

transition:.3s;

}

.news-content a:hover{

color:#198754;

}

.featured-news{

border-radius:30px;

overflow:hidden;

background:#fff;

box-shadow:0 20px 50px rgba(0,0,0,.08);

}
.article-image{

border-radius:25px;

overflow:hidden;

box-shadow:0 20px 50px rgba(0,0,0,.10);

margin:40px 0;

}

.article-image img{

width:100%;

}

.article-content{

font-size:18px;

line-height:2;

color:#555;

}

.article-content p{

margin-bottom:25px;

}

.article-content h2{

font-weight:700;

margin:40px 0 20px;

}

.article-content blockquote{

background:#198754;

color:#fff;

padding:35px;

border-radius:20px;

font-size:22px;

font-style:italic;

margin:40px 0;

}

.article-meta{

display:flex;

gap:25px;

flex-wrap:wrap;

margin:30px 0;

color:#888;

}

.share-btn{

width:50px;

height:50px;

display:flex;

align-items:center;

justify-content:center;

border-radius:50%;

background:#198754;

color:#fff;

text-decoration:none;

transition:.3s;

}

.share-btn:hover{

transform:translateY(-5px);

background:#ffc107;

color:#222;

}

.related-card{

border-radius:20px;

overflow:hidden;

box-shadow:0 10px 30px rgba(0,0,0,.08);

transition:.3s;

height:100%;

}

.related-card:hover{

transform:translateY(-8px);

}

.related-card img{

width:100%;

height:200px;

object-fit:cover;

}
.article-nav{

margin-top:70px;

padding-top:40px;

border-top:1px solid #e9ecef;

}

.article-nav-card{

display:flex;

align-items:center;

gap:20px;

padding:20px;

background:#fff;

border-radius:20px;

box-shadow:0 10px 25px rgba(0,0,0,.08);

transition:.3s;

text-decoration:none;

color:#222;

height:100%;

}

.article-nav-card:hover{

transform:translateY(-6px);

box-shadow:0 20px 45px rgba(0,0,0,.12);

color:#198754;

}

.article-nav-card img{

width:120px;

height:90px;

object-fit:cover;

border-radius:15px;

flex-shrink:0;

}

.article-nav-label{

font-size:13px;

font-weight:600;

color:#198754;

text-transform:uppercase;

letter-spacing:1px;

margin-bottom:5px;

}

.article-nav-title{

font-size:18px;

font-weight:700;

line-height:1.5;

margin-bottom:0;

}

.article-nav.left{

text-align:left;

}

.article-nav.right{

text-align:right;

}

.article-nav.right .article-nav-card{

flex-direction:row-reverse;

}
@media (max-width: 768px) {
.logo-img {
	width: 50px;
}
.logo-title {
	font-size: 18px;
}
.logo-subtitle {
	font-size: 20px;
}
.navbar {
	padding: 0;
}
}