/*
|--------------------------------------------------------------------------
| PENGUMUMAN
|--------------------------------------------------------------------------
*/

.announcement-page{

padding:60px 0;

}

.announcement-header{

text-align:center;

margin-bottom:45px;

}

.announcement-header h1{

font-size:48px;

color:var(--primary);

margin-bottom:12px;

}

.announcement-header p{

max-width:650px;

margin:auto;

color:#666;

font-size:18px;

}

.announcement-list{

display:flex;

flex-direction:column;

gap:25px;

}

.announcement-card{

display:block;

background:#fff;

padding:28px;

border-radius:22px;

text-decoration:none;

color:#222;

box-shadow:0 10px 35px rgba(0,0,0,.08);

transition:.3s;

border-left:6px solid transparent;

}

.announcement-card:hover{

transform:translateY(-4px);

box-shadow:0 15px 40px rgba(0,0,0,.12);

}

.announcement-card.pinned{

border-left-color:#ffc107;

background:linear-gradient(
135deg,
#fffef8,
#ffffff
);

}

.announcement-pin{

display:inline-flex;

align-items:center;

gap:8px;

background:#ffc107;

color:#222;

padding:6px 14px;

border-radius:50px;

font-size:13px;

font-weight:700;

margin-bottom:18px;

}

.announcement-meta{

display:flex;

gap:18px;

flex-wrap:wrap;

font-size:14px;

color:#777;

margin-bottom:18px;

}

.announcement-category{

background:var(--primary);

color:#fff;

padding:4px 12px;

border-radius:50px;

font-size:13px;

}

.announcement-card h2{

margin:0 0 15px;

font-size:30px;

color:var(--primary);

}

.announcement-card p{

margin:0;

line-height:1.8;

color:#555;

}

.announcement-footer{

margin-top:22px;

display:flex;

justify-content:space-between;

align-items:center;

font-size:15px;

font-weight:600;

color:#777;

}

.announcement-footer span:last-child{

color:var(--secondary);

}

@media(max-width:768px){

.announcement-page{

padding:40px 0;

}

.announcement-header h1{

font-size:34px;

}

.announcement-card{

padding:22px;

}

.announcement-card h2{

font-size:24px;

}

.announcement-footer{

flex-direction:column;

align-items:flex-start;

gap:10px;

}

}
.news-meta{

display:flex;

justify-content:space-between;

align-items:center;

margin-bottom:15px;

font-size:14px;

color:#777;

}

.news-pin{

background:#ffc107;

color:#222;

padding:3px 10px;

border-radius:20px;

font-size:12px;

font-weight:700;

}