/* ---------- Cuaderno de Campo / Field Notes blog — extends style.css ---------- */
.topnav nav a.current{color:var(--teal-strong); border-color:var(--teal-strong);}
.btn{
  display:inline-flex; align-items:center; gap:8px; cursor:pointer;
  font-family:'IBM Plex Mono',monospace; font-size:.7rem; letter-spacing:.06em; text-transform:uppercase;
  text-decoration:none; color:var(--paper-3); background:var(--teal-strong);
  border:1.5px solid var(--teal-strong); border-radius:22px; padding:8px 15px; transition:background .2s, color .2s;
}
.btn:hover{background:transparent; color:var(--teal-strong);}
.eyebrow{font-family:'IBM Plex Mono',monospace; font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--clay-strong); margin:0 0 14px;}

.blog-hero{max-width:820px; margin:0 auto; padding:56px 32px 28px;}
.blog-hero h1{font-size:clamp(2.2rem,4.6vw,3.2rem); font-weight:600; line-height:1.05; margin-bottom:16px;}
.blog-hero .lede{font-size:1.04rem; line-height:1.7; color:var(--ink-2); max-width:58ch; margin:0;}

.entries{max-width:820px; margin:0 auto; padding:8px 32px 56px; display:grid; gap:22px;}
.entry{display:grid; grid-template-columns:200px 1fr; gap:24px; padding:18px; border:1px solid var(--line); border-radius:6px; background:var(--paper-3); text-decoration:none; transition:border-color .2s, transform .2s;}
.entry:hover{border-color:var(--teal-strong); transform:translateY(-2px);}
.entry .thumb{aspect-ratio:4/3; border-radius:4px; overflow:hidden; border:1px solid var(--line);}
.entry .date{font-family:'IBM Plex Mono',monospace; font-size:.7rem; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-soft); margin:0 0 8px;}
.entry h2{font-size:1.35rem; line-height:1.2; margin:0 0 8px;}
.entry p.ex{margin:0 0 10px; color:var(--ink-2); line-height:1.6; font-size:.95rem;}
.entry .more{font-family:'IBM Plex Mono',monospace; font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; color:var(--teal-strong);}
.empty{max-width:820px; margin:0 auto; padding:0 32px 64px; color:var(--ink-soft);}
@media (max-width:640px){ .entry{grid-template-columns:1fr;} .blog-hero,.entries,.empty{padding-left:20px; padding-right:20px;} }

/* post */
.post{max-width:700px; margin:0 auto; padding:52px 32px 24px;}
.post h1{font-size:clamp(2rem,4.4vw,2.9rem); font-weight:600; line-height:1.08; margin-bottom:14px;}
.post .meta{font-family:'IBM Plex Mono',monospace; font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-soft); margin:0 0 26px;}
.post figure{margin:0 0 30px;}
.post figure .frame{border-radius:6px; overflow:hidden; border:1px solid var(--line); aspect-ratio:4/3;}
.post figcaption{font-family:'IBM Plex Mono',monospace; font-size:.7rem; color:var(--ink-soft); margin-top:8px;}
.post h2{font-size:1.45rem; margin:34px 0 10px;}
.post p{font-size:1.06rem; line-height:1.78; color:var(--ink-2); margin:0 0 18px;}
.post .todo{border-left:3px solid var(--clay); background:color-mix(in srgb, var(--clay) 10%, transparent); padding:10px 14px; font-size:.95rem; color:var(--ink-2); border-radius:0 4px 4px 0;}
.draft-banner{background:var(--clay-strong); color:#fff; text-align:center; font-family:'IBM Plex Mono',monospace; font-size:.72rem; letter-spacing:.08em; text-transform:uppercase; padding:8px 12px;}
.post-nav{max-width:700px; margin:0 auto; padding:8px 32px 56px; display:flex; gap:12px; flex-wrap:wrap;}
.btn.ghost{background:transparent; color:var(--ink-soft); border-color:var(--line);}
.btn.ghost:hover{color:var(--teal-strong); border-color:var(--teal-strong);}
@media (max-width:640px){ .post,.post-nav{padding-left:20px; padding-right:20px;} }

/* Home: "Del cuaderno" teaser */
.entries-more{max-width:820px; margin:-30px auto 56px; padding:0 32px; text-align:right;}
.entries-more a{font-family:'IBM Plex Mono',monospace; font-size:.78rem; letter-spacing:.06em; text-transform:uppercase; color:var(--teal-strong); text-decoration:none;}
.entries-more a:hover{text-decoration:underline;}
@media (max-width:640px){ .entries-more{padding:0 20px; text-align:left;} }
