:root{
  --bg: #14100c;
  --bg-alt: #1b1712;
  --ink: #f4ede1;
  --muted: #b8ab99;
  --muted-2: #8a7d6d;
  --green: #7fa640;
  --orange: #e0812c;
  --red: #c23b2d;
  --blue: #3d7fac;
  --wa: #25d366;
  --font-display: "Archivo Black", "Arial Black", Impact, sans-serif;
  --font-body: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --radius: 14px;
}

*,*::before,*::after{ box-sizing: border-box; }
body{
  margin:0; background: var(--bg); color: var(--ink);
  font-family: var(--font-body); font-size:16px; line-height:1.6;
  -webkit-font-smoothing: antialiased;
}
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
h1,h2,h3{ font-family: var(--font-display); line-height:1.15; margin:0 0 .5em; }
p{ margin:0 0 1em; }

.blog-container{ width:100%; max-width: 1020px; margin:0 auto; padding: 0 24px; }

/* header */
.blog-header{ padding: 20px 0; border-bottom: 1px solid rgba(244,237,225,.1); }
.blog-header-inner{ display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; }
.blog-brand{ display:flex; align-items:center; gap:10px; }
.blog-brand img{ border-radius:50%; }
.blog-brand-word{ display:flex; flex-direction:column; line-height:1.15; }
.blog-brand-word strong{ font-family: var(--font-display); font-size:1rem; }
.blog-brand-word span{ font-size:.68rem; color: var(--muted); text-transform:uppercase; letter-spacing:.12em; }
.blog-nav{ display:flex; gap:20px; flex-wrap:wrap; }
.blog-nav a{ font-size:.92rem; font-weight:600; color: var(--muted); }
.blog-nav a:hover{ color: var(--ink); }

/* hero */
.blog-hero{ padding: 56px 24px 32px; }
.blog-eyebrow{ text-transform:uppercase; letter-spacing:.18em; font-size:.78rem; font-weight:700; color: var(--green); margin-bottom:.8em; }
.blog-hero h1{ font-size: clamp(2rem, 4.4vw, 3.2rem); }
.blog-sub{ color: var(--muted); font-size:1.05rem; max-width:56ch; }

/* grid + cards */
.blog-grid{ display:grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap:22px; padding-bottom:64px; }
.blog-card{
  display:flex; flex-direction:column; border-radius: var(--radius);
  background: rgba(244,237,225,.03); border:1px solid rgba(244,237,225,.09);
  overflow:hidden; transition: transform .3s ease, border-color .3s ease;
}
.blog-card:hover{ transform: translateY(-5px); border-color: rgba(244,237,225,.24); }
.blog-card-img{ aspect-ratio: 16/10; overflow:hidden; background: var(--bg-alt); }
.blog-card-img img{ width:100%; height:100%; object-fit:cover; }
.blog-card-img-placeholder{ display:flex; align-items:center; justify-content:center; }
.blog-card-img-placeholder img{ width:72px; height:72px; object-fit:contain; opacity:.4; }
.blog-card-body{ padding:20px 22px 24px; }
.blog-card-date{ font-size:.78rem; color: var(--muted-2); text-transform:uppercase; letter-spacing:.08em; margin-bottom:.6em; }
.blog-card h2{ font-size:1.15rem; margin-bottom:.4em; }
.blog-card-excerpt{ font-size:.92rem; color: var(--muted); margin:0; }

.blog-empty{ padding: 60px 0; color: var(--muted); text-align:center; }

/* single post */
.blog-post{ padding: 48px 24px 80px; max-width: 760px; }
.blog-post h1{ font-size: clamp(1.8rem, 3.6vw, 2.6rem); margin-top:.3em; }
.blog-post-cover{ border-radius: var(--radius); overflow:hidden; margin: 24px 0; }
.blog-post-content{ font-size:1.05rem; color: var(--ink); }
.blog-post-content p{ margin: 0 0 1.2em; }
.blog-post-content h2{ font-size:1.4rem; margin: 1.4em 0 .5em; }
.blog-post-content h3{ font-size:1.15rem; margin: 1.2em 0 .5em; }
.blog-post-content img{ border-radius: var(--radius); margin: 1.2em 0; }
.blog-post-content a{ color: var(--green); text-decoration: underline; }
.blog-post-content ul, .blog-post-content ol{ margin: 0 0 1.2em; padding-left: 1.4em; }
.blog-post-content blockquote{
  margin: 1.4em 0; padding: .4em 1.2em; border-left: 3px solid var(--green);
  color: var(--muted); font-style: italic;
}
.blog-post-cta{ margin: 40px 0; }
.blog-back{ margin-top: 20px; }
.blog-back a{ color: var(--muted); font-size:.92rem; }
.blog-back a:hover{ color: var(--ink); }
.blog-notfound{ padding: 80px 24px; text-align:center; }

.blog-btn-whatsapp{
  display:inline-flex; align-items:center; gap:.5em;
  padding:.9em 1.5em; border-radius:999px; font-weight:700; font-size:.95rem;
  background: var(--wa); color:#08210f;
}
.blog-btn-whatsapp:hover{ background:#2fe273; }

/* footer */
.blog-footer{ border-top:1px solid rgba(244,237,225,.08); padding: 32px 0; margin-top: 40px; }
.blog-footer-inner{ display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.blog-footer-inner p{ margin:0; color: var(--muted); font-size:.85rem; }
.blog-wa-link{ display:inline-flex; align-items:center; gap:.5em; color: var(--wa); font-weight:700; font-size:.88rem; }

@media (max-width: 620px){
  .blog-hero{ padding: 40px 24px 24px; }
  .blog-post{ padding: 32px 24px 60px; }
}