/* Blog con la marca nueva: fondo negro azulado, un acento por mundo.
   Se carga después de base.css y blog-post.css y solo redefine tokens y
   los pocos elementos que los ignoraban. */
:root {
  --bg: #06080d;
  --sand: rgba(255, 255, 255, .05);
  --sand-2: rgba(255, 255, 255, .035);
  --ink: #f2f4f8;
  --muted: rgba(242, 244, 248, .74);
  --coral: #3fa9ff;
  --coral-dark: #7cc5ff;
  --coral-soft: rgba(63, 169, 255, .14);
  --white: rgba(255, 255, 255, .035);
  --line: rgba(255, 255, 255, .1);
  --line-dash: rgba(255, 255, 255, .16);
  --postit: rgba(255, 255, 255, .06);
  --shadow: 0 10px 30px rgba(0, 0, 0, .45);
  --shadow-lg: 0 24px 60px rgba(0, 0, 0, .55);
  --shadow-coral: 0 8px 24px rgba(63, 169, 255, .25);
  --head: Inter, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --nav: #070b16;
}
body.blog-dev { --coral: #ff3b5c; --coral-dark: #ff7a90; --coral-soft: rgba(255, 59, 92, .14); --shadow-coral: 0 8px 24px rgba(255, 59, 92, .25); }
html, body { background: var(--bg); color: var(--ink); }
::selection { background: var(--coral-soft); }

/* Cabecera y pie compactos, mismo azul casi negro que business */
.site-header { background: var(--nav); border-bottom: 1px solid rgba(63, 169, 255, .14); box-shadow: none; }
.site-header .nav { min-height: 52px; }
.nav-links a { color: var(--muted); }
.nav-links a[aria-current="page"], .nav-links a:hover { color: var(--ink); }
.nav-brand .logo, .nav-brand .logo span { color: var(--ink); }
.btn-primary { background: var(--coral); border-color: var(--coral); color: #06080d; box-shadow: none; }
.btn-primary:hover { background: var(--coral-dark); border-color: var(--coral-dark); color: #06080d; }
.btn-secondary { background: transparent; color: var(--ink); border: 1px solid rgba(255, 255, 255, .25); }
.mobile-menu { background: var(--nav); }
.burger { color: var(--ink); }
.site-footer { background: var(--nav); border-top: 1px solid rgba(63, 169, 255, .14); margin-top: 0; padding: 20px 0 22px; }
.foot-grid { display: flex; flex-wrap: wrap; gap: 8px 22px; align-items: baseline; }
.foot-grid > div { display: contents; }
.foot-brand { display: none; }
.site-footer h4 { display: none; }
.site-footer ul { flex-direction: row; flex-wrap: wrap; gap: 6px 18px; }
.site-footer li a { font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.site-footer li a:hover { color: var(--ink); }
.site-footer li a img { display: none; }
.foot-bottom { margin-top: 12px; padding-top: 10px; border-top: 1px solid rgba(255, 255, 255, .06); font-size: 11px; color: rgba(242, 244, 248, .55); }

/* Listado */
.blog-hero h1 { color: var(--ink); }
.gradient-text { background: none; -webkit-text-fill-color: currentColor; color: var(--coral); }
.filter-btn { background: transparent; border: 1px solid var(--line); color: var(--muted); }
.filter-btn:hover { color: var(--ink); border-color: rgba(255, 255, 255, .3); }
.filter-btn.active { background: var(--coral-soft); color: var(--coral-dark); border-color: var(--coral); }
.blog-listing-card { background: var(--white); border-color: var(--line); box-shadow: none; }
.blog-listing-card:hover { border-color: rgba(63, 169, 255, .45); box-shadow: 0 20px 50px rgba(0, 0, 0, .45); }
body.blog-dev .blog-listing-card:hover { border-color: rgba(255, 59, 92, .45); }
.card-visual { background: rgba(255, 255, 255, .04); }
.meta-tag { color: var(--coral-dark) !important; background: var(--coral-soft); }
.card-footer-info { border-top-color: var(--line); }

/* Artículo */
.blog-post-tag { background: var(--coral-soft); color: var(--coral-dark); }
.blog-post-body { color: rgba(242, 244, 248, .88); }
.blog-post-body h2, .blog-post-body h3, .blog-post-body strong { color: var(--ink); }
.blog-post-body blockquote { background: var(--sand-2); border-left-color: var(--coral); color: var(--ink); }
.blog-post-body code { background: rgba(255, 255, 255, .08); color: #e8edf7; }
.blog-post-body pre { background: #0b1020; border: 1px solid var(--line); }
.blog-post-body table th { background: rgba(255, 255, 255, .06); }
.blog-post-body table td, .blog-post-body table th { border-color: var(--line); }
.blog-post-body hr { border-color: var(--line); }
.blog-post-cover img { box-shadow: 0 20px 50px rgba(0, 0, 0, .5); }
.related-posts { border-top: 1px solid var(--line); }
.related-card { background: var(--white); border: 1px solid var(--line); }
.related-card:hover { border-color: var(--coral); }
.ai-disclosure, .blog-post-disclosure { color: var(--muted); border-color: var(--line); background: var(--sand-2); }

/* Barra de cookies en oscuro */
.cookie-bar { background: #0b1020; border-color: rgba(255, 255, 255, .14); box-shadow: 0 20px 50px rgba(0, 0, 0, .6); }
.cookie-bar p { color: var(--muted); }
.cookie-bar a { color: var(--coral); }

/* CTA y autor al final del artículo */
.post-cta { background: linear-gradient(180deg, rgba(63,169,255,.14), rgba(255,255,255,.03)); border: 1px solid rgba(63,169,255,.3); color: var(--ink); }
body.blog-dev .post-cta { background: linear-gradient(180deg, rgba(255,59,92,.14), rgba(255,255,255,.03)); border-color: rgba(255,59,92,.3); }
.post-cta p, .post-cta h2, .post-cta h3 { color: var(--ink); }
.post-cta-links a { color: var(--ink); border-color: rgba(255,255,255,.3); }
.post-cta-links a.primary, .post-cta-links a.btn-primary { background: var(--coral); border-color: var(--coral); color: #06080d; box-shadow: none; }
.author-box { background: var(--white); border-color: var(--line); }
.site-footer ul, .site-footer li { list-style: none; margin: 0; padding: 0; }
