/* ==========================================================
   HARDIYANTO THEME
   LAYOUT
========================================================== */

:root{

    --primary:#0F766E;
    --primary-hover:#115E59;

    --heading:#111827;
    --text:#374151;
    --light:#6B7280;

    --white:#ffffff;
    --border:#E5E7EB;

    --bg:#F8FAFC;

    --radius:18px;

    --shadow:
        0 8px 30px rgba(15,23,42,.06);

    --transition:.28s;

}

/*==========================================================
BODY
==========================================================*/

body{

    background:var(--bg);

}

/*==========================================================
CONTAINER
==========================================================*/

.container{

    width:1320px;

    max-width:calc(100% - 48px);

    margin:auto;

}

/*==========================================================
MAIN LAYOUT
==========================================================*/

.home-layout,

.single-layout{

    display:grid;

    grid-template-columns:minmax(0,860px) 360px;

    gap:48px;

    align-items:start;

    padding:50px 0 80px;

}

/*==========================================================
CONTENT
==========================================================*/

.content-area{

    min-width:0;

}

/*==========================================================
CARD
==========================================================*/

.post-item,

.featured-post,

.sidebar-widget,

.single-post{

    background:#fff;

    border:1px solid var(--border);

    border-radius:var(--radius);

    box-shadow:var(--shadow);

}

/*==========================================================
SECTION
==========================================================*/

.section-title{

    margin:0 0 36px;

    font-size:38px;

}

/*==========================================================
BUTTON
==========================================================*/

.button{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:14px 28px;

    border-radius:12px;

    background:var(--primary);

    color:#fff;

    font-weight:600;

    transition:var(--transition);

}

.button:hover{

    background:var(--primary-hover);

    transform:translateY(-2px);

}

/*==========================================================
ARCHIVE
==========================================================*/

.archive-header{

    margin-bottom:45px;

}

.archive-title{

    margin-bottom:16px;

    font-size:48px;

}

.archive-description{

    color:var(--light);

    font-size:18px;

    line-height:1.8;

}

/*==========================================================
NO POST
==========================================================*/

.no-post{

    padding:70px;

    text-align:center;

}