:root{
    /*--background_dark:#17211b; */
   /* --background_dark: var(--background_dark); */
    --muted:#68736c;
    --paper:#f7f7f2;
    --white:#fff;
    --accent:#dcebd6;
    --line:#e5e8e1;
    /* --background_dark:#1c2b22; */
    /* --background_dark:var(--background_dark); */
    --serif:"Playfair Display",Georgia,serif;--sans:"DM Sans",Arial,sans-serif
}

*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);line-height:1.65}a{color:inherit;text-decoration:none}img{display:block;width:100%;object-fit:cover}.container{width:min(1160px,calc(100% - 40px));margin:auto}.site-header{background:rgba(247,247,242,.94);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50}.nav-wrap{height:78px;display:flex;align-items:center;gap:32px}.brand{display:flex;align-items:center;gap:11px;line-height:1}

.brand-mark{
    width:42px;
    height:42px;
    /* border-radius:12px; */
    /* background:var(--background_dark); */
    color:#fff;
    display:grid;
    place-items:center;
    font-weight:700;
    font-size:13px;
}

.brand-mark a{
    width:100%;
    height:100%;
    object-fit: contain;
}

.brand-mark a img{
    width:100%;
    height:100%;
    object-fit: contain;
}

.brand strong,.brand small{display:block}.brand strong{font-size:16px}.brand small{font-size:11px;color:var(--muted);margin-top:4px}

.main-nav{display:flex;align-items:center;gap:26px;margin-left:auto}

.main-nav a{font-size:14px;color:#58625c;padding:8px 0}
.main-nav a:hover,.main-nav a.active{color:var(--ink);font-weight:700}.search-btn,.nav-toggle{border:0;background:none;font-size:26px;cursor:pointer}.nav-toggle{display:none}.hero{padding:74px 0 62px;background:linear-gradient(135deg,#eef4e9 0%,#f7f7f2 58%)}.hero-grid{display:grid;grid-template-columns:.88fr 1.12fr;gap:70px;align-items:center}.eyebrow{font-size:11px;letter-spacing:2px;text-transform:uppercase;font-weight:700;color:#71806f}

.hero h1{
    font:700 clamp(42px,5vw,68px)/1.06 var(--serif);
    letter-spacing:-2px;
    margin:15px 0 22px;
    color: var(--background_dark);
}

.hero h1 em{font-style:italic}.hero-copy p{font-size:17px;color:var(--muted);max-width:570px;margin-bottom:30px}.btn{display:inline-flex;gap:18px;align-items:center;border:0;border-radius:7px;padding:14px 19px;font-weight:700;cursor:pointer}.btn-dark{background:var(--background_dark);color:white}.featured-hero{position:relative;border-radius:16px;overflow:hidden;min-height:470px;box-shadow:0 25px 60px #2533261a}.featured-hero img{height:470px}.featured-hero:after{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(transparent,#101a13e8)}.hero-card-content{position:absolute;z-index:2;bottom:0;padding:34px;color:white}.hero-card-content h2{font:700 31px/1.15 var(--serif);margin:10px 0}.hero-card-content p{color:#e4ebe4;margin:0 0 14px}.category-pill{display:inline-block;background:#e8f1e2;color:#263a2a;border-radius:30px;padding:5px 10px;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.8px}.featured-hero .category-pill{background:white}.light{color:white}.category-strip{background:white;border-bottom:1px solid var(--line)}.category-scroll{display:flex;align-items:center;gap:28px;overflow:auto;white-space:nowrap;padding:17px 0}.category-scroll a{font-size:13px;color:#566058}.strip-label{font-size:11px;text-transform:uppercase;letter-spacing:1.5px;font-weight:700}.section{padding:82px 0}.section-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:30px}.section-heading h2,.page-banner h1{font:700 42px/1.1 var(--serif);margin:9px 0 0}.text-link{font-size:13px;font-weight:700}.post-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:45px 26px}.post-card{background:white;border:1px solid var(--line);border-radius:13px;overflow:hidden;transition:.25s}.post-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px #18251c0c}.card-image{height:265px;position:relative;display:block;overflow:hidden}.card-image img{height:100%;transition:.4s}.post-card:hover .card-image img{transform:scale(1.03)}.card-image .category-pill{position:absolute;top:16px;left:16px}.card-body{padding:24px}.post-meta{font-size:11px;color:#788179;text-transform:uppercase;letter-spacing:.6px}.post-meta span{margin:0 5px}.card-body h3{font:700 25px/1.22 var(--serif);margin:10px 0}.card-body p{font-size:14px;color:var(--muted);margin-bottom:17px}

.newsletter{
    padding:55px 0;
    /* background:#e8f0e4; */
    /* background:  var(--main_color_shade2); */
    background: color-mix(in srgb, var(--main_color_shade2) 50%, transparent);
}

.newsletter-inner{display:flex;align-items:center;justify-content:space-between;gap:40px}.newsletter h2{font:700 32px var(--serif);margin:7px 0}.newsletter p{margin:0;color:var(--muted)}.newsletter-form{display:flex;gap:9px;min-width:440px}.newsletter-form input{flex:1;border:1px solid #ccd4c9;border-radius:7px;padding:14px;background:white;font:inherit}

.site-footer {
    background: var(--background_dark);
    color:#e9eee9;
    padding:60px 0 20px
}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:60px;padding-bottom:45px}.footer-brand{margin-bottom:20px}.footer-grid p{color:#aeb8b0;font-size:13px}.footer-grid h4{margin:0 0 15px}.footer-grid>div>a:not(.brand){display:block;color:#aeb8b0;font-size:13px;margin:8px 0}.footer-bottom{border-top:1px solid #ffffff17;padding-top:18px;color:#87928a;font-size:11px}.page-banner{padding:85px 0 75px;background:#e8f0e4}.page-banner h1{font-size:56px;max-width:760px}.page-banner p{color:var(--muted);max-width:650px}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:90px}.about-grid h2{font:700 42px/1.15 var(--serif);margin-top:10px}.about-grid p{color:var(--muted);font-size:16px}.article{padding-bottom:90px}.article-head{padding:65px 0 42px;max-width:930px}.back-link{font-size:12px;color:var(--muted);display:inline-block;margin-bottom:35px}.article-head h1{font:700 clamp(42px,6vw,70px)/1.08 var(--serif);letter-spacing:-1.5px;margin:15px 0}.article-excerpt{font-size:19px;color:var(--muted);max-width:790px}.author-row{display:flex;align-items:center;gap:12px;margin-top:26px}.avatar{width:43px;height:43px;border-radius:50%;display:grid;place-items:center;background:var(--accent);font-size:12px;font-weight:700}.author-row small,.author-row strong{display:block}.author-row small{font-size:11px;color:var(--muted)}.article-cover{max-width:1120px}.article-cover img{height:min(610px,55vw);border-radius:15px}.article-layout{display:grid;grid-template-columns:minmax(0,730px) 280px;gap:85px;justify-content:center;padding-top:60px}.article-content{font-family:Georgia,serif;font-size:18px;line-height:1.85}.article-content h2{font:700 31px var(--serif);margin-top:42px}.article-content blockquote{font:italic 23px/1.5 var(--serif);border-left:3px solid #93a98c;padding:8px 0 8px 25px;margin:38px 0}.tag-list{display:flex;flex-wrap:wrap;gap:8px;margin:35px 0}.tag-list span{background:#edf2ea;border-radius:30px;padding:5px 11px;font:600 11px var(--sans)}.share-row{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:20px 0;display:flex;align-items:center;gap:8px;font-family:var(--sans);font-size:12px}.share-row strong{margin-right:auto}.share-row button{border:1px solid var(--line);background:white;border-radius:5px;padding:8px 11px;cursor:pointer}.stat-box{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;background:white;border:1px solid var(--line);border-radius:10px;padding:16px;margin-bottom:25px}.stat-box div{text-align:center}.stat-box strong,.stat-box span{display:block}.stat-box strong{font-size:16px}.stat-box span{font-size:9px;color:var(--muted);text-transform:uppercase}.aside-card{background:white;border:1px solid var(--line);padding:20px;border-radius:10px}.mini-post{display:grid;grid-template-columns:72px 1fr;gap:11px;margin-top:18px}.mini-post img{height:65px;border-radius:6px}.mini-post small,.mini-post strong{display:block}.mini-post small{font-size:9px;text-transform:uppercase;color:var(--muted)}.mini-post strong{font:700 13px/1.25 var(--serif)}.empty-state{text-align:center;padding:80px 20px;background:white;border:1px solid var(--line);border-radius:12px;grid-column:1/-1}.search-modal{position:fixed;inset:0;background:#152019cc;z-index:100;display:none;align-items:flex-start;justify-content:center;padding:100px 20px}.search-modal.open{display:flex}.search-box{width:min(650px,100%);background:white;border-radius:14px;padding:30px;position:relative}.close-search{position:absolute;right:18px;top:14px;border:0;background:none;font-size:28px;cursor:pointer}.search-box input{width:100%;padding:15px 0;border:0;border-bottom:1px solid var(--line);font:20px var(--sans);outline:0;margin:20px 0}.search-result{display:grid;grid-template-columns:65px 1fr;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}.search-result img{height:55px;border-radius:6px}.search-result small,.search-result strong{display:block}.search-result small{font-size:9px;color:var(--muted);text-transform:uppercase}.search-result strong{font:700 15px var(--serif)}

.brand span strong {
    color: var(--main_color);
}

@media(max-width:850px){.container{width:min(100% - 28px,700px)}.nav-wrap{height:68px}.nav-toggle{display:block;order:3}.search-btn{order:2;margin-left:auto}

.main-nav{
    position:absolute;
    top:68px;
    left:0;
    right:0;
    background:var(--paper);
    border-bottom:1px solid var(--line);
    display:none;
    padding:15px 20px;
    flex-direction:column;
    align-items:flex-start;
    gap:7px
}

.main-nav.open{display:flex}.hero{padding:45px 0}.hero-grid,.about-grid,.article-layout{grid-template-columns:1fr;gap:35px}.featured-hero,.featured-hero img{min-height:390px;height:390px}.post-grid{grid-template-columns:1fr}.newsletter-inner{display:block}.newsletter-form{min-width:0;margin-top:25px}.footer-grid{grid-template-columns:1fr 1fr;gap:30px}.article-aside{display:none}.article-head{padding-top:40px}.page-banner h1{font-size:43px}.section{padding:60px 0}}
@media(max-width:500px){.hero h1{font-size:43px}.hero-card-content{padding:22px}.hero-card-content h2{font-size:25px}.card-image{height:220px}.section-heading{display:block}.section-heading .text-link{display:inline-block;margin-top:15px}.newsletter-form{display:block}.newsletter-form input,.newsletter-form .btn{width:100%}.newsletter-form .btn{justify-content:center;margin-top:8px}.footer-grid{grid-template-columns:1fr}.article-content{font-size:17px}.share-row{flex-wrap:wrap}.share-row strong{width:100%;margin-bottom:8px}}


/* LIKE AND COMMENT SECTION */

/* =========================================================
POST ENGAGEMENT
========================================================= */

.post-engagement {
margin-top: 35px;
padding: 25px 0;
border-top: 1px solid #eee;
border-bottom: 1px solid #eee;
}

.like-btn {
display: inline-flex;
align-items: center;
gap: 9px;
padding: 11px 18px;
border: 1px solid #ddd;
border-radius: 30px;
background: #fff;
color: #444;
font-size: 15px;
font-weight: 600;
cursor: pointer;
transition: all .2s ease;
}

.like-btn:hover {
border-color: var(--main_color);
color: var(--main_color);
}

.like-btn.liked {
background: var(--main_color);
border-color: var(--main_color);
color: #fff;
}

.like-btn i {
font-size: 16px;
}

.like-count {
min-width: 24px;
}

/* =========================================================
COMMENTS
========================================================= */



.comments-header {
margin: 40px 0 20px 0;
}

.comments-header h2 {
margin: 0 0 7px;
font-size: 28px;
font-weight: 700;
}

.comments-header h2 span {
font-size: 15px;
font-weight: 600;
background: #f1f1f1;
padding: 4px 9px;
border-radius: 20px;
vertical-align: middle;
}

.comments-header p {
margin: 0;
color: #777;
}

/* Comment form */

.comment-form-box {
padding: 25px 0;
background: #f8f8f8;
border-radius: 12px;
/* margin-bottom: 35px; */
}

.comment-form-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 20px;
}

.form-group {
margin-bottom: 18px;
}

.form-group label {
display: block;
margin-bottom: 7px;
font-size: 14px;
font-weight: 600;
}

.form-group input,
.form-group textarea {
width: 100%;
padding: 12px 14px;
border: 1px solid #ddd;
border-radius: 7px;
background: #fff;
font-family: inherit;
font-size: 15px;
outline: none;
box-sizing: border-box;
}

.form-group input:focus,
.form-group textarea:focus {
border-color: var(--main_color);
}

.comment-submit-btn {
border: 0;
padding: 12px 22px;
border-radius: 7px;
background: var(--main_color);
color: #fff;
font-weight: 600;
cursor: pointer;
}

.comment-submit-btn:hover {
opacity: .9;
}

/* Comments */

.comments-list {
margin-top: 20px;
}

.comment-item {
display: flex;
gap: 15px;
padding: 22px 0;
border-bottom: 1px solid #eee;
}

.comment-avatar {
flex: 0 0 45px;
width: 45px;
height: 45px;
border-radius: 50%;
display: flex;
align-items: center;
justify-content: center;
background: var(--main_color);
color: #fff;
font-weight: 700;
}

.comment-body {
flex: 1;
}

.comment-top {
display: flex;
align-items: center;
gap: 12px;
margin-bottom: 7px;
}

.comment-top strong {
font-size: 15px;
}

.comment-top small {
color: #888;
font-size: 12px;
}

.comment-body p {
margin: 0;
line-height: 1.7;
color: #555;
}

.no-comments {
text-align: center;
padding: 35px 20px;
color: #888;
}

.no-comments i {
font-size: 28px;
margin-bottom: 10px;
}

/* Mobile */


@media (max-width: 768px) {

    .nav-toggle {
        display: block;
        background: none;
        border: none;
        font-size: 28px;
        cursor: pointer;
    }

    .main-nav {
        display: none;
        width: 100%;
        flex-direction: column;
    }

    .main-nav.show {
        display: flex;
    }

}


.nav-toggle {
    margin-left: auto;
    display: none;
    background: none;
    border: none;
    font-size: 28px;
    cursor: pointer;
}

@media (max-width: 768px) {
    .nav-toggle {
        display: block;
        margin-left: auto;
    }
}


@media(max-width: 600px) {


        .comment-form-grid {
            grid-template-columns: 1fr;
            gap: 0;
        }

        .comment-form-box {
            padding: 20px;
        }

        .comments-header h2 {
            font-size: 24px;
        }




}


