/* =========================================================
   Guayacán — blog y artículos
   ========================================================= */
.blog-banner{min-height:0;padding-bottom:40px}
.blog-tools{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;align-items:center;margin-bottom:34px}
.blog-cats{display:flex;gap:8px;flex-wrap:wrap}
.blog-cats button{height:38px;padding:0 16px;border-radius:99px;border:1px solid var(--stroke);font-size:14px;color:#d8d2c7;transition:all .35s var(--ease-out)}
.blog-cats button:hover{border-color:var(--stroke-gold)}
.blog-cats button[aria-selected="true"]{background:var(--gold-grad);color:#1d1408;border-color:transparent;font-weight:600}
.blog-search{display:flex;align-items:center;gap:8px;height:42px;padding:0 14px;border-radius:12px;border:1px solid var(--stroke);background:rgba(255,255,255,.03);min-width:min(280px,100%)}
.blog-search:focus-within{border-color:rgba(231,189,106,.6)}
.blog-search svg{width:17px;height:17px;fill:none;stroke:var(--gold);stroke-width:1.8;flex:none}
.blog-search input{border:0;background:none;color:var(--ink);font:inherit;font-size:14.5px;outline:none;width:100%}
.feat-post{position:relative;display:grid;grid-template-columns:1.25fr 1fr;border-radius:26px;overflow:hidden;border:1px solid var(--stroke);background:#14151a;margin-bottom:28px;transition:border-color .5s}
.feat-post:hover{border-color:var(--stroke-gold)}
.feat-post .fp-img{position:relative;min-height:380px;overflow:hidden}
.feat-post .fp-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.6s var(--ease-out)}
.feat-post:hover .fp-img img{transform:scale(1.04)}
.feat-post .fp-body{padding:clamp(26px,4vw,52px);display:flex;flex-direction:column;justify-content:center;gap:14px}
.feat-post h2{font-family:var(--serif);font-weight:500;font-size:clamp(26px,3vw,38px);line-height:1.1;margin:0;text-wrap:balance}
.feat-post h2 a::after{content:'';position:absolute;inset:0}
.feat-post p{color:#cfc9bf;line-height:1.65;margin:0}
.post-meta{display:flex;gap:10px;flex-wrap:wrap;align-items:center;font-size:12.5px;color:var(--muted);letter-spacing:.04em}
.post-meta .cat{color:var(--gold);letter-spacing:.2em;text-transform:uppercase;font-size:11.5px}
.post-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr));gap:24px}
.post-card{position:relative;display:flex;flex-direction:column;border-radius:22px;overflow:hidden;border:1px solid var(--stroke);background:#14151a;transition:transform .7s var(--ease-out),border-color .5s;min-width:0}
.post-card:hover{transform:translateY(-4px);border-color:var(--stroke-gold)}
.post-card .pi{aspect-ratio:16/10;overflow:hidden}
.post-card .pi img{width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease-out)}
.post-card:hover .pi img{transform:scale(1.05)}
.post-card .pb{display:flex;flex-direction:column;gap:10px;padding:20px 22px 24px;flex:1}
.post-card h3{font-family:var(--serif);font-weight:500;font-size:21px;line-height:1.2;margin:0}
.post-card h3 a::after{content:'';position:absolute;inset:0}
.post-card p{margin:0;color:#c8c2b7;font-size:14.5px;line-height:1.6}
.post-card .more{margin-top:auto;padding-top:8px;color:var(--gold);font-size:14px;font-weight:500}
.blog-empty{grid-column:1/-1;text-align:center;color:var(--muted);padding:40px 0}

/* ---------- artículo ---------- */
.art-head{position:relative;padding:calc(var(--navh,80px) + 60px) 0 50px;overflow:hidden;isolation:isolate;min-height:min(70vh,640px);display:flex;align-items:flex-end}
.art-cover{position:absolute;inset:0;z-index:-1}
.art-cover img{width:100%;height:100%;object-fit:cover;filter:brightness(.42);transform:scale(1.06);transition:transform 2.4s var(--ease-out)}
.art-cover img.in{transform:none}
.art-cover::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,16,19,.6),rgba(15,16,19,.2) 40%,var(--bg))}
.art-head h1{font-family:var(--serif);font-weight:500;font-size:clamp(34px,5vw,64px);line-height:1.04;letter-spacing:-.02em;margin:16px 0 0;max-width:20ch;text-wrap:balance}
.art-meta{margin:20px 0 0;color:#cfc9bf;font-size:14px;display:flex;gap:14px;flex-wrap:wrap}
.art-body{display:grid;grid-template-columns:minmax(0,720px) 300px;gap:clamp(30px,6vw,90px);justify-content:space-between;padding-top:30px}
.art-content{font-size:18px;line-height:1.8;color:#ddd8ce;min-width:0}
.art-content .lead-p{font-size:21px;line-height:1.6;color:#efe9df;font-family:var(--serif);font-weight:400}
.art-content p{margin:0 0 22px}
.art-content h2{font-family:var(--serif);font-weight:500;font-size:clamp(25px,2.6vw,32px);line-height:1.2;color:var(--ink);margin:46px 0 16px}
.art-content ul,.art-content ol{margin:0 0 24px;padding-left:22px}
.art-content li{margin-bottom:8px}
.art-content li::marker{color:var(--gold)}
.art-content blockquote{margin:34px 0;padding:6px 0 6px 26px;border-left:2px solid var(--gold);font-family:var(--serif);font-style:italic;font-size:24px;line-height:1.45;color:var(--gold-2)}
.art-content figure{margin:34px 0}
.art-content figure img{width:100%;border-radius:18px}
.art-content figcaption{font-size:13.5px;color:var(--muted);margin-top:10px}
.art-content .video{position:relative;aspect-ratio:16/9;border-radius:18px;overflow:hidden;margin:34px 0;border:1px solid var(--stroke)}
.art-content .video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.art-content a{color:var(--gold);text-decoration:underline;text-underline-offset:3px}
.art-side{position:sticky;top:110px;align-self:start;display:grid;gap:18px}
.art-box{padding:24px;border-radius:20px;border:1px solid var(--stroke);background:#14151a}
.art-box h3{font-family:var(--serif);font-weight:500;font-size:21px;margin:0 0 10px}
.art-box p{color:var(--muted);font-size:14.5px;line-height:1.6;margin:0 0 16px}
.art-box .btn{width:100%}
.art-box .btn+.btn{margin-top:8px}
.art-share{display:flex;gap:8px;flex-wrap:wrap}
.art-progress{position:fixed;left:0;top:0;height:2px;width:100%;transform-origin:left;transform:scaleX(0);background:var(--gold-grad);z-index:70;box-shadow:0 0 10px var(--gold)}
@media (max-width:900px){
  .feat-post{grid-template-columns:1fr}
  .feat-post .fp-img{min-height:240px}
  .art-body{grid-template-columns:1fr}
  .art-side{position:static}
  .art-content{font-size:17px}
}