
/* ===== Estilos del blog TISSIA (complementa estilos.css) ===== */
.post-hero{background:var(--verde-900);color:var(--marfil);padding:72px 0 56px}
.post-hero .eyebrow{color:var(--piedra)}
.post-hero h1{font-size:clamp(30px,4.4vw,48px);max-width:20ch;margin:18px 0 20px}
.post-meta{font-family:'IBM Plex Mono',monospace;font-size:13px;letter-spacing:.06em;color:var(--piedra);display:flex;flex-wrap:wrap;gap:8px 18px}
.miga{font-family:'IBM Plex Mono',monospace;font-size:12.5px;padding:14px 0;color:#3a4a43}
.miga a{text-decoration:none}
.miga a:hover{color:var(--verde-700);text-decoration:underline}
.post{max-width:780px;margin:0 auto;padding:56px 28px 30px}
.post>p,.post ul,.post ol{margin-bottom:18px;color:#26362f}
.post ul,.post ol{margin-left:24px}
.post li{margin-bottom:8px}
.post h2{font-size:clamp(24px,3vw,31px);margin:46px 0 16px;color:var(--verde-900)}
.post h3{font-size:20px;margin:30px 0 12px;color:var(--verde-800)}
.post a{color:var(--verde-700);text-decoration:underline;text-underline-offset:3px}
.post a:hover{color:var(--naranja)}
.resumen{border-left:3px solid var(--naranja);background:var(--marfil-2);padding:20px 24px;border-radius:0 var(--radius) var(--radius) 0;margin-bottom:30px}
.resumen p{margin:0;font-size:17.5px;color:var(--tinta)}
.tabla-scroll{overflow-x:auto;margin:26px 0}
.post table{width:100%;border-collapse:collapse;font-size:15.5px;background:#fff;border-radius:var(--radius);overflow:hidden;box-shadow:0 1px 0 var(--linea)}
.post th{background:var(--verde-800);color:var(--marfil);text-align:left;padding:13px 16px;font-family:'IBM Plex Mono',monospace;font-size:12.5px;letter-spacing:.08em;text-transform:uppercase;font-weight:500}
.post td{padding:13px 16px;border-top:1px solid var(--linea);vertical-align:top}
.post tr:nth-child(even) td{background:#faf8f2}
.faq details{border:1px solid var(--linea);border-radius:var(--radius);margin-bottom:12px;background:#fff}
.faq summary{cursor:pointer;padding:16px 20px;font-weight:600;font-family:'Bricolage Grotesque',sans-serif;font-size:17.5px;list-style:none;display:flex;justify-content:space-between;gap:14px;align-items:center}
.faq summary::after{content:'+';font-family:'IBM Plex Mono',monospace;color:var(--naranja);font-size:20px;flex:none}
.faq details[open] summary::after{content:'\2212'}
.faq details p{padding:0 20px 18px;margin:0;color:#26362f}
.autor{display:flex;gap:18px;align-items:flex-start;border:1px solid var(--linea);border-radius:var(--radius);padding:22px 24px;margin:44px 0 0;background:#fff}
.autor .ini{flex:none;width:56px;height:56px;border-radius:50%;background:var(--verde-700);color:var(--marfil);display:flex;align-items:center;justify-content:center;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:20px}
.autor p{margin:0;font-size:15px;color:#3a4a43}
.autor .nom{font-weight:600;color:var(--tinta);font-size:16px;margin-bottom:4px}
.cta-post{background:var(--verde-900);color:var(--marfil);border-radius:var(--radius);padding:38px 34px;margin:50px 0 60px;text-align:left}
.cta-post h2{color:var(--marfil);margin:0 0 12px;font-size:26px}
.cta-post p{color:var(--piedra);margin:0 0 22px;max-width:56ch}
.rel{background:var(--marfil-2);padding:54px 0 64px}
.rel h2{font-size:26px;margin-bottom:24px}
.rel-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.rel-card{background:#fff;border:1px solid var(--linea);border-radius:var(--radius);padding:24px;text-decoration:none;display:block;transition:transform .15s ease}
.rel-card:hover{transform:translateY(-3px)}
.rel-card .eyebrow{color:var(--verde-700);margin-bottom:10px}
.rel-card h3{font-size:19px;margin-bottom:8px}
.rel-card p{font-size:15px;color:#3a4a43;margin:0}
/* Índice del blog */
.blog-hero{background:var(--verde-900);color:var(--marfil);padding:78px 0 62px}
.blog-hero h1{font-size:clamp(34px,5vw,54px);margin:18px 0 16px}
.blog-hero p{color:var(--piedra);max-width:60ch;font-size:18px}
.blog-lista{padding:64px 0 80px}
.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.blog-card{background:#fff;border:1px solid var(--linea);border-radius:var(--radius);padding:28px;text-decoration:none;display:flex;flex-direction:column;gap:12px;transition:transform .15s ease}
.blog-card:hover{transform:translateY(-3px)}
.blog-card h2{font-size:21px;line-height:1.2}
.blog-card p{font-size:15.5px;color:#3a4a43;flex:1}
.blog-card .fecha{font-family:'IBM Plex Mono',monospace;font-size:12.5px;color:#6b7a72}
.blog-card .leer{color:var(--naranja);font-weight:600;font-size:15px}
@media (max-width:920px){.blog-grid{grid-template-columns:1fr}.rel-grid{grid-template-columns:1fr}.post{padding:44px 28px 20px}}
