/*
Theme Name: Artha Stable IT Blog
Theme URI: https://artha.web.id
Author: Artha
Description: Stable minimal WordPress theme for IT blog with code block support
Version: 1.0
License: GPLv2
Text Domain: artha
*/

html, body{
max-width:100%;
overflow-x:hidden;
}

/* Judul blog */

.site-title{

font-family: Georgia, "Times New Roman", serif;

font-size:28px;

font-weight:700;

text-decoration:none;

color:#111;

letter-spacing:1px;

}

/* menu */

.menu a{

font-family:-apple-system, BlinkMacSystemFont,
"Segoe UI", Roboto, Helvetica, Arial, sans-serif;

font-size:15px;

font-weight:500;

text-decoration:none;

color:#333;

}
/* container */

.main-container{
max-width:1100px;
width:100%;
margin:auto;
padding-left:15px;
padding-right:15px;
}

/* gambar responsive */

img{
max-width:100%;
height:auto;
}

/* card */

.post-card{
width:100%;
}

/* bootstrap row fix */

.row{
margin-left:0;
margin-right:0;
}

body{
font-family: -apple-system, BlinkMacSystemFont,
"Segoe UI", Roboto, Oxygen,
Ubuntu, Cantarell,
"Helvetica Neue", sans-serif;

background:#fafafa;
color:#222;
}

.main-container{
max-width:1100px;
margin:auto;
}

/* sticky navbar */

/* NAVBAR */

.main-navbar{

position:fixed;

top:0;

left:0;

width:100%;

z-index:999;

background:transparent;

transition:all .3s ease;

}

/* navbar saat scroll */

.main-navbar.scrolled{

background:#111;

box-shadow:0 4px 15px rgba(0,0,0,0.3);

}

/* layout */

.navbar-inner{

display:flex;

justify-content:space-between;

align-items:center;

max-width:1100px;

margin:auto;

padding:15px;

}

/* menu */

.menu{

list-style:none;

display:flex;

gap:25px;

margin:0;

padding:0;

}

.menu a{

text-decoration:none;

color:#222;

font-weight:500;

}

/* saat navbar gelap */

.main-navbar.scrolled a{

color:white;

}

/* memberi jarak konten karena navbar fixed */

.main-container{

margin-top:80px;

}
/* warna text saat gelap */

.main-navbar.scrolled .nav-link,
.main-navbar.scrolled .navbar-brand{

color:white !important;

}

.nav-link{

font-weight:500;

margin-left:20px;

}

.nav-link:hover{

color:#000;

}

/* featured */

.featured-post{
background:white;
border-radius:16px;
padding:30px;
margin-top:40px;
box-shadow:0 4px 20px rgba(0,0,0,0.06);
}

.featured-post img{
border-radius:12px;
width:100%;
}

/* section */

.section-title{
font-size:22px;
font-weight:600;
margin:40px 0 20px;
}

/* grid */

.post-card{
background:white;
border-radius:14px;
overflow:hidden;
transition:0.3s;
box-shadow:0 3px 10px rgba(0,0,0,0.05);
}

.post-card:hover{
transform:translateY(-6px);
box-shadow:0 10px 25px rgba(0,0,0,0.08);
}

.post-card img{
height:200px;
width:100%;
object-fit:cover;
}

.post-title{
font-weight:600;
padding:15px;
font-size:16px;
}

/* button */

.btn-modern{
background:#000;
color:white;
border-radius:30px;
padding:8px 18px;
}

.btn-modern:hover{
background:#333;
color:white;
}

/* GRID POST */

.post-grid{
display:flex;
flex-wrap:wrap;
gap:20px;
}

/* CARD */

.post-card{

display:flex;
flex-direction:column;

height:100%;

background:white;

border-radius:12px;

overflow:hidden;

box-shadow:0 3px 10px rgba(0,0,0,0.06);

}

/* IMAGE */

.post-card img{

width:100%;

height:200px;

object-fit:cover;

}

/* CONTENT */

.post-card .post-title{

padding:15px;

font-size:16px;

font-weight:600;

flex-grow:1;

}