/* Vivir con SED — mismo estilo de sebastianrico.me (Fraunces + Public Sans, vino y crema). */
:root{
  --vino:#7A1F2B; --vino-osc:#561521; --crema:#FAF6F1; --papel:#FFFFFF; --tinta:#1F1A17; --suave:#5B524B; --linea:#E7DFD6;
  --navy:#0F2A4A; --verde:#15803D;
  --head:'Fraunces',Georgia,serif; --body:'Public Sans',system-ui,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--crema);color:var(--tinta);font-family:var(--body);line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:inherit}
:focus-visible{outline:3px solid #E0A33A;outline-offset:3px;border-radius:6px}
.saltar{position:absolute;left:-9999px;top:8px;background:#fff;padding:10px 14px;border-radius:8px;z-index:50}
.saltar:focus{left:8px}
.wrap{max-width:1120px;margin:0 auto;padding:0 24px}
.angosto{max-width:760px;margin:0 auto;padding:0 24px}
.wrap.angosto{padding:0 24px}
h1,h2,h3{font-family:var(--head);font-weight:600;line-height:1.12;margin:0;letter-spacing:-.01em}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 22px;border-radius:10px;font-weight:700;font-size:15px;text-decoration:none;border:2px solid transparent;cursor:pointer;font-family:var(--body)}
.btn-vino{background:var(--vino);color:#fff}.btn-vino:hover{background:var(--vino-osc)}
.btn-borde{background:#fff;border-color:var(--vino);color:var(--vino)}.btn-borde:hover{background:#FBEFF0}
.btn-wa{background:var(--verde);color:#fff}.btn-wa:hover{background:#116B32}
.eyebrow{font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--vino);margin:0 0 10px}

/* encabezado */
.barra{position:sticky;top:0;z-index:20;background:rgba(250,246,241,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--linea)}
.barra .wrap{display:flex;align-items:center;justify-content:center;gap:16px;height:56px}
.marca{font-family:var(--head);font-weight:700;font-size:18px;text-decoration:none}
.nav{display:flex;gap:26px;font-size:14px;font-weight:600}
.nav a{text-decoration:none;color:var(--suave);padding:4px 0;border-bottom:2px solid transparent}
.nav a:hover{color:var(--vino)}
.nav a.activo{color:var(--vino);border-bottom-color:var(--vino)}
@media(max-width:560px){.nav{gap:14px;font-size:13px}.marca{font-size:16px}}

/* cabecera de la lista */
.lista-cab{padding:48px 0 8px}
.lista-cab h1{font-size:clamp(34px,6vw,54px);color:var(--vino-osc)}
.lista-cab .sub{font-family:var(--head);font-size:clamp(18px,2.6vw,24px);color:var(--suave);margin:6px 0 18px}
.intro p{font-size:18px;line-height:1.7;color:var(--tinta);margin:0 0 12px;max-width:62ch}
.migas{font-size:13px;color:var(--suave);margin-bottom:16px}
.migas a{text-decoration:none}.migas a:hover{text-decoration:underline}

/* tarjetas */
.lista{padding:26px 0 8px}
.rejilla{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:900px){.rejilla{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.rejilla{grid-template-columns:1fr}}
.tj{display:flex;flex-direction:column;background:#fff;border:1px solid var(--linea);border-radius:18px;overflow:hidden;text-decoration:none;color:inherit;transition:transform .2s,box-shadow .2s}
.tj:hover{transform:translateY(-3px);box-shadow:0 14px 34px rgba(31,26,23,.1)}
.tj-img{display:block;aspect-ratio:1200/627;background:#EBD9DB;overflow:hidden}
.tj-img img{width:100%;height:100%;object-fit:cover;display:block}
.tj-vacia{display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--vino),var(--vino-osc))}
.tj-vacia span{font:700 44px var(--head);color:rgba(255,255,255,.9);letter-spacing:.06em}
.tj-cuerpo{display:flex;flex-direction:column;gap:6px;padding:16px 18px 18px;flex:1}
.tj-fecha{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--vino)}
.tj-titulo{font:600 20px/1.2 var(--head);color:var(--tinta)}
.tj-resumen{font-size:14.5px;color:var(--suave);line-height:1.55}
.tj-mas{margin-top:auto;padding-top:6px;font-weight:700;font-size:14px;color:var(--vino)}
.vacio{background:#fff;border:1px dashed var(--linea);border-radius:16px;padding:34px 20px;text-align:center;color:var(--suave);font-size:17px}
.rss{margin:20px 0 0;font-size:13px;color:var(--suave)}

/* entrada */
.entrada{padding:44px 0 0}
.entrada h1{font-size:clamp(30px,5.2vw,46px);color:var(--vino-osc);margin-bottom:12px}
.entrada .meta{font-size:14px;color:var(--suave);margin:0 0 18px}
.entrada .lead{font:500 clamp(19px,2.4vw,22px)/1.5 var(--head);color:var(--tinta);margin:0 0 24px}
.portada{margin:0 0 28px}
.portada img{width:100%;height:auto;border-radius:18px;display:block;border:1px solid var(--linea)}
.cuerpo{font-size:18.5px;line-height:1.8}
.cuerpo p{margin:0 0 20px}
.cuerpo h2{font-size:clamp(24px,3.4vw,30px);color:var(--vino-osc);margin:38px 0 14px}
.cuerpo h3{font-size:21px;color:var(--vino-osc);margin:30px 0 10px}
.cuerpo ul,.cuerpo ol{margin:0 0 20px;padding-left:24px}
.cuerpo li{margin-bottom:8px}
.cuerpo blockquote{margin:26px 0;padding:6px 0 6px 20px;border-left:4px solid var(--vino);font:italic 500 21px/1.55 var(--head);color:var(--vino-osc)}
.cuerpo blockquote p{margin:0}
.cuerpo a{color:var(--vino);text-decoration-thickness:2px;text-underline-offset:3px}
.aviso{margin:30px 0 0;padding:14px 16px;border-radius:14px;background:#FFFBEB;border:1px solid #F1DFA6;color:#6B4E00;font-size:14.5px;line-height:1.55}
.compartir{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:24px 0 0;font-size:14px;color:var(--suave)}
.compartir .btn{padding:9px 16px;font-size:14px}
.mas{padding:46px 0 0}
.mas h2{font-size:clamp(24px,3.4vw,30px);margin-bottom:18px}
.cta{margin:48px 0 52px;background:#fff;border:1px solid var(--linea);border-radius:20px;padding:28px 24px;text-align:center}
.cta h2{font-size:clamp(22px,3.2vw,28px);color:var(--vino-osc)}
.cta p{color:var(--suave);margin:8px 0 18px}
.cta-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.lista-cab+.lista+.wrap .aviso{margin-top:34px}

footer{border-top:1px solid var(--linea);padding:22px 0;font-size:13.5px;color:var(--suave)}
footer .wrap{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap}

/* lista compacta de entradas + paginación */
.conteo{font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--suave);margin:0 0 12px}
.filas{display:grid;gap:10px}
.fl{display:flex;gap:16px;align-items:center;background:#fff;border:1px solid var(--linea);border-radius:16px;padding:12px;text-decoration:none;color:inherit;transition:box-shadow .2s,transform .2s}
.fl:hover{box-shadow:0 10px 26px rgba(31,26,23,.09);transform:translateY(-1px)}
.fl-img{width:224px;height:auto;aspect-ratio:1200/627;border-radius:12px;flex-shrink:0;overflow:hidden;background:linear-gradient(135deg,var(--vino),var(--vino-osc));display:flex;align-items:center;justify-content:center}
.fl-img img{width:100%;height:100%;object-fit:cover;display:block}
.fl-vacia b{font:700 20px var(--head);color:rgba(255,255,255,.9);letter-spacing:.06em}
.fl-tx{min-width:0;flex:1;display:block}
.fl-fecha{display:block;font-size:11.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--vino)}
.fl-titulo{display:block;font:600 19px/1.2 var(--head);margin:2px 0 4px}
.fl-resumen{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:14px;color:var(--suave);line-height:1.5}
.fl-ir{font-weight:700;font-size:14px;color:var(--vino);white-space:nowrap;padding-right:6px}
@media(max-width:600px){.fl{flex-direction:column;align-items:stretch;gap:10px}.fl-img{width:100%}.fl-ir{display:none}.fl-titulo{font-size:17px}}
.paginas{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:22px 0 0}
.pg-ir{font-weight:700;font-size:14px;color:var(--vino);text-decoration:none;padding:8px 4px}
.pg-ir:hover{text-decoration:underline}
.pg-off{color:#B9AEA6;pointer-events:none}
.pg-nums{display:flex;gap:6px;flex-wrap:wrap;justify-content:center}
.pg-n{min-width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;border:1.5px solid var(--linea);border-radius:10px;background:#fff;font-weight:700;font-size:14px;text-decoration:none;color:var(--tinta)}
a.pg-n:hover{border-color:var(--vino);color:var(--vino)}
.pg-act{background:var(--vino);border-color:var(--vino);color:#fff}
