/* Blog (listado, archivo y artículo) — estilos propios, independientes del Tailwind compilado */
.th3b { background: #050505; color: #e4e4e7; min-height: 100vh; padding: 9rem 1.5rem 6rem; position: relative; z-index: 40; }
.th3b-wrap { max-width: 78rem; margin: 0 auto; }
.th3b-eyebrow { font-family: ui-monospace, monospace; font-size: .75rem; letter-spacing: .25em; text-transform: uppercase; color: #991914; display: block; margin-bottom: 1rem; }
.th3b-title { font-size: clamp(2.5rem, 9vw, 7rem); line-height: .9; font-weight: 900; letter-spacing: -.05em; text-transform: uppercase; color: #fff; margin: 0 0 1.5rem; }
.th3b-title span { color: transparent; -webkit-text-stroke: 1px rgba(255,255,255,.3); }
.th3b-lead { color: #71717a; font-size: 1.125rem; max-width: 40rem; margin: 0 0 4rem; font-weight: 300; }

.th3b-grid { display: grid; gap: 1.5rem; grid-template-columns: 1fr; }
@media (min-width: 700px) { .th3b-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .th3b-grid { grid-template-columns: repeat(3, 1fr); } }
.th3b-card { display: flex; flex-direction: column; justify-content: space-between; min-height: 18rem; padding: 2rem; border: 1px solid #27272a; border-radius: 1.25rem; background: #09090b; color: inherit; text-decoration: none; transition: border-color .4s, transform .4s, box-shadow .4s; }
.th3b-card:hover { border-color: #991914; transform: translateY(-6px); box-shadow: 0 30px 60px rgba(153,25,20,.15); }
.th3b-cat { font-family: ui-monospace, monospace; font-size: .65rem; letter-spacing: .2em; text-transform: uppercase; color: #a1a1aa; border: 1px solid #3f3f46; border-radius: 99px; padding: .35rem .8rem; align-self: flex-start; }
.th3b-card h2 { font-size: 1.5rem; line-height: 1.15; font-weight: 800; letter-spacing: -.02em; color: #fff; margin: 1.5rem 0 .75rem; }
.th3b-card p { color: #71717a; font-size: .95rem; line-height: 1.55; margin: 0 0 1.5rem; font-weight: 300; }
.th3b-meta { font-family: ui-monospace, monospace; font-size: .65rem; letter-spacing: .2em; text-transform: uppercase; color: #52525b; }
.th3b-empty { color: #71717a; font-family: ui-monospace, monospace; padding: 4rem 0; }
.th3b-nav { margin-top: 4rem; font-family: ui-monospace, monospace; font-size: .75rem; letter-spacing: .2em; text-transform: uppercase; display: flex; gap: 1.5rem; flex-wrap: wrap; }
.th3b-nav a, .th3b-nav span { color: #a1a1aa; text-decoration: none; padding: .5rem 1rem; border: 1px solid #27272a; border-radius: 99px; }
.th3b-nav .current { color: #fff; border-color: #991914; }
.th3b-nav a:hover { color: #fff; border-color: #fff; }

/* Artículo */
.th3b-post { max-width: 46rem; margin: 0 auto; }
.th3b-post h1 { font-size: clamp(2rem, 6vw, 3.75rem); line-height: 1.02; font-weight: 900; letter-spacing: -.04em; color: #fff; margin: 1rem 0 1.5rem; }
.th3b-post .th3b-excerpt { font-size: 1.25rem; color: #a1a1aa; font-weight: 300; line-height: 1.5; margin-bottom: 2rem; }
.th3b-body { border-top: 1px solid #27272a; padding-top: 2.5rem; margin-top: 2rem; }
.th3b-body p, .th3b-body li { font-size: 1.125rem; line-height: 1.75; color: #a1a1aa; font-weight: 300; }
.th3b-body p { margin: 0 0 1.5rem; max-width: none; }
.th3b-body h2 { font-size: 1.75rem; line-height: 1.15; font-weight: 800; letter-spacing: -.02em; text-transform: none; color: #fff; margin: 3rem 0 1rem; }
.th3b-body h3 { font-size: 1.3rem; font-weight: 700; color: #fff; margin: 2rem 0 .75rem; }
.th3b-body ul, .th3b-body ol { padding-left: 1.5rem; margin: 0 0 1.5rem; }
.th3b-body ul { list-style: disc; } .th3b-body ol { list-style: decimal; }
.th3b-body li { margin-bottom: .5rem; }
.th3b-body strong { color: #e4e4e7; font-weight: 600; }
.th3b-body a { color: #818cf8; border-bottom: 1px solid #818cf8; text-decoration: none; }
.th3b-body a:hover { color: #fff; border-color: #fff; }
.th3b-tags { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 2.5rem; }
.th3b-tags a { font-family: ui-monospace, monospace; font-size: .65rem; letter-spacing: .15em; text-transform: uppercase; color: #71717a; border: 1px solid #27272a; border-radius: 99px; padding: .3rem .8rem; text-decoration: none; }
.th3b-tags a:hover { color: #fff; border-color: #fff; }
.th3b-cta { margin-top: 4rem; padding: 2.5rem; border: 1px solid #991914; border-radius: 1.25rem; background: rgba(153,25,20,.08); }
.th3b-cta h2 { font-size: 1.75rem; font-weight: 900; color: #fff; margin: 0 0 .75rem; letter-spacing: -.02em; }
.th3b-cta p { color: #a1a1aa; margin: 0 0 1.5rem; font-weight: 300; }
.th3b-cta a { display: inline-block; padding: .9rem 2rem; border-radius: 99px; background: #991914; color: #fff; text-transform: uppercase; letter-spacing: .2em; font-size: .7rem; font-weight: 700; text-decoration: none; }
.th3b-cta a:hover { background: #fff; color: #991914; }
.th3b-back { font-family: ui-monospace, monospace; font-size: .7rem; letter-spacing: .2em; text-transform: uppercase; color: #71717a; text-decoration: none; }
.th3b-back:hover { color: #fff; }

/* Imágenes */
.th3b-figure { margin: 2.5rem 0; }
.th3b-figure img, .th3b-body img { width: 100%; height: auto; display: block; border-radius: 1rem; border: 1px solid #27272a; margin: 0; }
.th3b-card { padding: 0; overflow: hidden; justify-content: flex-start; }
.th3b-card-img { width: 100%; height: auto; aspect-ratio: 1200 / 630; object-fit: cover; display: block; border-bottom: 1px solid #27272a; }
.th3b-card-body { padding: 1.75rem 2rem 2rem; display: flex; flex-direction: column; justify-content: space-between; flex: 1; }
.th3b-card h2 { margin-top: 1.25rem; }
.th3b-crumbs { font-family: ui-monospace, monospace; font-size: .65rem; letter-spacing: .15em; text-transform: uppercase; color: #52525b; }
.th3b-crumbs a { color: #71717a; text-decoration: none; } .th3b-crumbs a:hover { color: #fff; }
.th3b-related { margin-top: 6rem; padding-top: 3rem; border-top: 1px solid #27272a; }
.th3b-related-title { font-size: 1.75rem; font-weight: 900; color: #fff; margin: 0 0 2rem; letter-spacing: -.02em; }
.th3b-figure figcaption { margin-top: .6rem; font-family: ui-monospace, monospace; font-size: .6rem; letter-spacing: .15em; text-transform: uppercase; color: #52525b; }
.th3b-figure figcaption a { color: #71717a; border: 0; text-decoration: none; } .th3b-figure figcaption a:hover { color: #fff; }
