:root{
  --paper:#f7f4ec;
  --paper-2:#efeadd;
  --ink:#1c1a17;
  --ink-soft:#43403a;
  --muted:#867e70;
  --line:#ddd5c5;
  --accent:#d6452b;
  --maxw:42rem;
  --wide:64rem;
}

*{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:"Newsreader", Georgia, serif;
  font-size:1.18rem;
  line-height:1.72;
  font-optical-sizing:auto;
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}
body::before{
  content:""; position:fixed; inset:0; pointer-events:none; z-index:0;
  background:
    radial-gradient(circle at 12% 8%, rgba(214,69,43,.05), transparent 38%),
    radial-gradient(circle at 92% 88%, rgba(40,42,80,.035), transparent 44%);
}
.site-header,.site-main,.site-footer{ position:relative; z-index:1; }

/* ---------- header ---------- */
.site-header{
  max-width:var(--wide); margin:0 auto;
  padding:1.7rem 1.5rem 1.4rem;
  display:flex; align-items:baseline; justify-content:space-between;
  gap:1rem; flex-wrap:wrap; border-bottom:1px solid var(--line);
}
.brand{
  font-family:"Fraunces", serif; font-weight:900; font-size:1.5rem;
  letter-spacing:-.01em; color:var(--ink); text-decoration:none;
  display:inline-flex; align-items:center;
}
.cursor{
  display:inline-block; width:.5em; height:.5em; margin-left:.28em;
  background:var(--accent); transform:translateY(.02em);
  animation:blink 1.1s steps(1) infinite;
}
@keyframes blink{ 50%{ opacity:0; } }
.site-nav{ display:flex; gap:1.4rem; }
.site-nav a, .foot-nav a{
  font-family:"Space Mono", monospace; font-size:.74rem;
  text-transform:uppercase; letter-spacing:.12em;
  color:var(--muted); text-decoration:none; transition:color .18s;
}
.site-nav a:hover, .foot-nav a:hover{ color:var(--accent); }

/* ---------- main ---------- */
.site-main{ max-width:var(--wide); margin:0 auto; padding:0 1.5rem; }

/* ---------- hero ---------- */
.hero{ padding:4.5rem 0 3rem; border-bottom:1px solid var(--line); }
.kicker{
  font-family:"Space Mono", monospace; font-size:.76rem;
  text-transform:uppercase; letter-spacing:.16em; color:var(--accent);
  margin:0 0 1.2rem;
}
.hero-title{
  font-family:"Fraunces", serif; font-weight:900;
  font-size:clamp(3rem,9vw,5.5rem); line-height:.95; letter-spacing:-.025em;
  margin:0; display:flex; align-items:center; flex-wrap:wrap;
}
.hero-title .cursor{ width:.42em; height:.42em; margin-left:.2em; }
.hero-intro{ max-width:34rem; margin-top:1.6rem; color:var(--ink-soft); font-size:1.22rem; }
.hero-intro p{ margin:.4rem 0; }
.hero-intro a{ color:var(--accent); }

/* ---------- feed (home) ---------- */
.feed{ padding:2.5rem 0 1rem; }
.feed-label{
  font-family:"Space Mono", monospace; font-size:.74rem;
  text-transform:uppercase; letter-spacing:.16em; color:var(--muted); margin:0 0 .3rem;
}
.entry{
  border-bottom:1px solid var(--line);
  opacity:0; transform:translateY(12px);
  animation:rise .6s cubic-bezier(.2,.7,.2,1) forwards;
  animation-delay:calc(var(--i,0) * 70ms + 80ms);
}
@keyframes rise{ to{ opacity:1; transform:none; } }
.entry-link{ display:block; text-decoration:none; color:inherit; padding:2rem 0; transition:padding-left .25s ease; }
.entry-link:hover{ padding-left:.7rem; }
.entry-date{
  font-family:"Space Mono", monospace; font-size:.72rem;
  text-transform:uppercase; letter-spacing:.13em; color:var(--muted);
}
.entry-title{
  font-family:"Fraunces", serif; font-weight:600;
  font-size:clamp(1.7rem,3.6vw,2.4rem); line-height:1.08; letter-spacing:-.015em;
  margin:.5rem 0 .4rem; transition:color .2s;
}
.entry-link:hover .entry-title{ color:var(--accent); }
.entry-desc{ margin:.2rem 0 .7rem; color:var(--ink-soft); font-size:1.08rem; max-width:40rem; }
.empty{ color:var(--muted); padding:2rem 0; }

/* tags */
.tags{ list-style:none; display:flex; flex-wrap:wrap; gap:.5rem; padding:0; margin:.4rem 0 0; }
.tags li{
  font-family:"Space Mono", monospace; font-size:.68rem;
  text-transform:uppercase; letter-spacing:.08em; color:var(--muted);
  border:1px solid var(--line); border-radius:2px; padding:.18rem .5rem;
}
.tags li::before{ content:"#"; opacity:.5; }

/* ---------- post ---------- */
.post{ max-width:var(--maxw); margin:0 auto; padding:3.5rem 0 2rem; }
.post-header{ margin-bottom:2.2rem; }
.post-meta{ margin:0 0 1rem; }
.post-title{
  font-family:"Fraunces", serif; font-weight:900;
  font-size:clamp(2.2rem,6vw,3.4rem); line-height:1.04; letter-spacing:-.02em; margin:.2rem 0 0;
}
.post-lede{
  font-family:"Newsreader", serif; font-style:italic; font-size:1.3rem;
  color:var(--ink-soft); margin:1.1rem 0 1.2rem; line-height:1.5;
}
.post-body{ font-size:1.2rem; }
.post-body > p:first-of-type::first-letter{
  font-family:"Fraunces", serif; font-weight:900; float:left;
  font-size:3.6rem; line-height:.72; padding:.1em .12em 0 0; color:var(--accent);
}
.post-body h2{
  font-family:"Fraunces", serif; font-weight:600; font-size:1.7rem; letter-spacing:-.01em;
  margin:2.6rem 0 .8rem; padding-top:1.2rem; border-top:1px solid var(--line);
}
.post-body h3{ font-family:"Fraunces", serif; font-weight:600; font-size:1.3rem; margin:1.8rem 0 .5rem; }
.post-body a{ color:var(--accent); text-decoration:none; border-bottom:1px solid rgba(214,69,43,.35); }
.post-body a:hover{ background:rgba(214,69,43,.09); border-bottom-color:var(--accent); }
.post-body ul, .post-body ol{ padding-left:1.2rem; }
.post-body li{ margin:.5rem 0; }
.post-body strong{ font-weight:600; }
.post-body hr{ border:none; height:1px; background:var(--line); margin:2.4rem 0; }
.post-body blockquote{ margin:1.6rem 0; padding:.4rem 0 .4rem 1.3rem; border-left:3px solid var(--accent); font-style:italic; color:var(--ink-soft); }
.post-body small{
  display:block; margin-top:2.6rem;
  background:var(--paper-2); border-left:3px solid var(--accent);
  padding:1rem 1.2rem; border-radius:0 4px 4px 0;
  font-family:"Space Mono", monospace; font-size:.78rem; line-height:1.55; color:var(--ink-soft);
}
.post-foot{ max-width:var(--maxw); margin:2.5rem auto 0; padding-top:1.4rem; border-top:1px solid var(--line); }
.back-link{ font-family:"Space Mono", monospace; font-size:.78rem; text-transform:uppercase; letter-spacing:.1em; color:var(--muted); text-decoration:none; }
.back-link:hover{ color:var(--accent); }

/* ---------- page ---------- */
.page{ max-width:var(--maxw); margin:0 auto; padding:3.5rem 0 2rem; }
.page-title{ font-family:"Fraunces", serif; font-weight:900; font-size:clamp(2rem,5vw,3rem); letter-spacing:-.02em; margin:0 0 1.6rem; }
.page-body{ font-size:1.18rem; }
.page-body h2,.page-body h3{ font-family:"Fraunces", serif; font-weight:600; }
.page-body h3{ font-size:1.3rem; margin:1.8rem 0 .5rem; }
.page-body a{ color:var(--accent); }

/* ---------- archive (entradas) ---------- */
.archive-year{ font-family:"Space Mono", monospace; font-size:.8rem; letter-spacing:.16em; color:var(--accent); border-bottom:1px solid var(--line); padding-bottom:.4rem; margin:2.4rem 0 .3rem; }
.archive-list{ list-style:none; padding:0; margin:0; }
.archive-list li{ border-bottom:1px solid var(--line); }
.archive-list a{ display:flex; gap:1.2rem; align-items:baseline; padding:.95rem 0; text-decoration:none; color:var(--ink); transition:padding-left .2s, color .2s; }
.archive-list a:hover{ padding-left:.5rem; color:var(--accent); }
.archive-date{ font-family:"Space Mono", monospace; font-size:.72rem; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); flex:0 0 7rem; }
.archive-title{ font-family:"Fraunces", serif; font-weight:500; font-size:1.18rem; line-height:1.25; }

/* ---------- footer ---------- */
.site-footer{ max-width:var(--wide); margin:4rem auto 0; padding:2.5rem 1.5rem 3rem; border-top:1px solid var(--line); }
.foot-top{ display:flex; justify-content:space-between; align-items:center; gap:1rem; flex-wrap:wrap; }
.foot-brand{ font-family:"Fraunces", serif; font-weight:900; font-size:1.2rem; display:inline-flex; align-items:center; }
.foot-nav{ display:flex; gap:1.3rem; }
.foot-legal{ font-family:"Space Mono", monospace; font-size:.7rem; line-height:1.6; color:var(--muted); margin:1.4rem 0 0; max-width:42rem; }

/* ---------- responsive ---------- */
@media (max-width:640px){
  body{ font-size:1.1rem; }
  .site-header{ flex-direction:column; align-items:flex-start; gap:.7rem; padding:1.3rem 1.2rem; }
  .hero{ padding:3rem 0 2rem; }
  .site-main{ padding:0 1.2rem; }
  .archive-list a{ flex-direction:column; gap:.15rem; }
  .archive-date{ flex-basis:auto; }
  .post-body > p:first-of-type::first-letter{ font-size:3rem; }
}
@media (prefers-reduced-motion:reduce){
  .entry{ opacity:1; transform:none; animation:none; }
  .cursor{ animation:none; }
}

/* ---------- suscripción ---------- */
.subscribe{ margin:1rem 0 1rem; padding:2.4rem 0 1rem; border-top:1px solid var(--line); }
.subscribe-title{ font-family:"Fraunces", serif; font-weight:600; font-size:clamp(1.6rem,3.5vw,2.2rem); letter-spacing:-.015em; margin:.3rem 0 .4rem; }
.subscribe-text{ color:var(--ink-soft); margin:0 0 1.1rem; }
.sub-form{ display:flex; gap:.6rem; flex-wrap:wrap; align-items:stretch; margin:1rem 0 .4rem; max-width:32rem; }
.sub-input{ flex:1 1 14rem; font-family:"Newsreader", serif; font-size:1.05rem; padding:.7rem .9rem; border:1px solid var(--line); border-radius:4px; background:#fff; color:var(--ink); }
.sub-input:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(214,69,43,.12); }
.sub-btn{ font-family:"Space Mono", monospace; font-size:.78rem; text-transform:uppercase; letter-spacing:.1em; padding:.7rem 1.4rem; border:none; border-radius:4px; background:var(--accent); color:#fff; cursor:pointer; transition:background .2s; }
.sub-btn:hover{ background:#b8381f; }
.sub-ok{ font-family:"Space Mono", monospace; font-size:.92rem; color:var(--accent); margin:.6rem 0; }
.sub-hp{ position:absolute !important; left:-9999px; width:1px; height:1px; overflow:hidden; }
.sub-note{ font-family:"Space Mono", monospace; font-size:.72rem; color:var(--muted); line-height:1.5; margin:.4rem 0 0; max-width:32rem; }
.confirm-box{ padding:1rem 0 2rem; font-size:1.15rem; }
.confirm-title{ font-family:"Fraunces", serif; font-weight:600; color:var(--accent); font-size:1.9rem; letter-spacing:-.01em; margin:.2rem 0 .6rem; }
.confirm-loading{ color:var(--muted); }
