/* ═══════════════════════════════════════════════════════════════
   ConsultIA® — Estilos del Blog (base + nav + artículo)
   Fuente de verdad para las páginas del blog.
   ═══════════════════════════════════════════════════════════════ */

:root {
  --black: #04091a;
  --dark: #060d20;
  --card: rgba(11, 20, 40, 0.65);
  --border: rgba(255, 255, 255, 0.15);
  --white: #ffffff;
  --muted: rgba(235, 244, 255, 0.85);
  --accent: #1e88e5;
  --accent-light: #42a5f5;
  --accent-bright: #64b5f6;
  --glow: rgba(30, 136, 229, 0.3);
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
img, svg, video, iframe { max-width: 100%; height: auto; }
html { scroll-behavior: smooth; overflow-x: hidden; }

body {
  background: var(--black);
  color: var(--white);
  font-family: 'Poppins', sans-serif;
  font-weight: 300;
  line-height: 1.7;
  overflow-x: hidden;
}
body::before {
  content: '';
  position: fixed; inset: 0;
  background-color: rgba(4, 9, 26, 0.82);
  background-image:
    linear-gradient(rgba(21,101,192,0.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(21,101,192,0.08) 1px, transparent 1px);
  background-size: 60px 60px;
  pointer-events: none; z-index: 0;
}
section, main { position: relative; z-index: 1; }

/* ══ NAV ══ */
nav {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  display: flex; align-items: center; justify-content: space-between;
  padding: 20px 6vw;
  background: rgba(5,5,8,0.85); backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--border);
}
.logo-img { height: 36px; }
nav a { color: var(--muted); text-decoration: none; font-size: 0.85rem; letter-spacing: 0.05em; transition: color 0.2s; }
nav a:hover { color: var(--accent); }
.nav-links { display: flex; gap: 2rem; }
.nav-links a { position: relative; }
.nav-links a::after { content:''; position:absolute; bottom:-4px; left:0; width:0; height:2px; background:var(--accent); transition:width 0.3s ease; }
.nav-links a:hover::after { width: 100%; }
.nav-cta {
  background: var(--accent); color: #fff !important; font-weight: 600;
  padding: 10px 22px; border-radius: 6px; font-size: 0.82rem;
  text-transform: uppercase; letter-spacing: 0.03em;
  transition: opacity 0.2s, transform 0.2s;
}
.nav-cta:hover { background: var(--accent-light); transform: translateY(-1px); }

.burger-icon {
  display: none; flex-direction: column; justify-content: center; align-items: center;
  gap: 5px; width: 42px; height: 42px; cursor: pointer;
  background: rgba(255,255,255,0.07); border: 1px solid var(--border);
  border-radius: 8px; z-index: 200; transition: background 0.2s;
}
.burger-icon:hover { background: rgba(30,136,229,0.15); }
.burger-icon span { display:block; width:20px; height:2px; background:var(--white); border-radius:2px; transition:all 0.3s; }
.burger-icon.burger-close span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.burger-icon.burger-close span:nth-child(2) { opacity:0; transform:scaleX(0); }
.burger-icon.burger-close span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
@media(max-width:900px) { .nav-links { display:none; } .nav-cta { display:none; } .burger-icon { display:flex; } }

/* ══ DRAWER MÓVIL ══ */
.mobile-menu-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.65); z-index:10000; opacity:0; visibility:hidden; transition:opacity 0.3s, visibility 0.3s; }
body.mobile-menu-active .mobile-menu-overlay { opacity:1; visibility:visible; }
.mobile-header-wrapper-style {
  position:fixed; top:0; right:0; bottom:0; width:min(320px,82vw);
  background:#060d20; border-left:1px solid var(--border); z-index:10001;
  transform:translateX(100%); visibility:hidden; opacity:0;
  transition:transform 0.3s cubic-bezier(0.645,0.045,0.355,1), opacity 0.25s, visibility 0.25s;
  display:flex; flex-direction:column; overflow:hidden;
}
.mobile-header-wrapper-style.sidebar-visible { transform:translateX(0); visibility:visible; opacity:1; }
.mobile-header-wrapper-inner { height:100%; display:flex; flex-direction:column; overflow-y:auto; }
.mobile-header-logo { display:flex; align-items:center; justify-content:space-between; padding:18px 24px; border-bottom:1px solid var(--border); }
.mobile-close-btn { display:flex; align-items:center; justify-content:center; width:36px; height:36px; background:rgba(255,255,255,0.06); border:1px solid var(--border); border-radius:8px; cursor:pointer; color:var(--white); font-size:1.3rem; transition:background 0.2s, border-color 0.2s; }
.mobile-close-btn:hover { background:rgba(30,136,229,0.2); border-color:var(--accent); }
.mobile-header-content-area { padding:24px 20px; flex:1; }
.mobile-menu { list-style:none; padding:0; margin:0; }
.mobile-menu li { margin-bottom:4px; }
.mobile-menu li a { display:block; padding:11px 16px; color:var(--muted); text-decoration:none; font-size:0.98rem; font-weight:500; border-radius:8px; border:1px solid transparent; transition:all 0.2s; }
.mobile-menu li a:hover { color:var(--white); background:rgba(30,136,229,0.12); border-color:rgba(30,136,229,0.3); }
.mobile-nav-cta { display:block; margin-top:20px; padding:13px 20px; background:var(--accent); color:#fff; text-decoration:none; font-weight:600; font-size:0.82rem; text-transform:uppercase; letter-spacing:0.05em; border-radius:8px; text-align:center; transition:background 0.2s, transform 0.2s; }
.mobile-nav-cta:hover { background:var(--accent-light); transform:translateY(-1px); }
.tgmobile__menu-bottom { padding:20px 24px; border-top:1px solid var(--border); flex-shrink:0; }
.tgmobile__menu-bottom .contact-info { margin-bottom:14px; }
.tgmobile__menu-bottom .contact-info p { font-size:0.78rem; color:rgba(235,244,255,0.55); margin-bottom:4px; }
.tgmobile__menu-bottom .contact-info a { color:var(--accent-light); text-decoration:none; font-weight:500; font-size:0.85rem; }
.mobile-social-icons { display:flex; gap:10px; flex-wrap:wrap; }
.mobile-social-icons a { display:flex; align-items:center; justify-content:center; width:36px; height:36px; background:rgba(255,255,255,0.06); border:1px solid var(--border); border-radius:8px; color:var(--muted); text-decoration:none; transition:all 0.2s; }
.mobile-social-icons a:hover { background:rgba(30,136,229,0.2); border-color:var(--accent); color:var(--white); }
.mobile-social-icons svg { width:16px; height:16px; fill:currentColor; }

/* ══ CURSOR GLOW ══ */
.cursor-glow { position:fixed; pointer-events:none; z-index:9999; width:400px; height:400px; border-radius:50%; background:radial-gradient(circle,rgba(30,136,229,0.08) 0%,transparent 70%); transform:translate(-50%,-50%); transition:left 0.3s,top 0.3s,opacity 0.4s; opacity:0; }
.cursor-glow.active { opacity:1; }
@media (max-width: 480px) { .cursor-glow { display: none; } }

/* ══ SECTION LABEL ══ */
.section-label { font-size:0.72rem; letter-spacing:0.15em; text-transform:uppercase; color:var(--accent-bright); margin-bottom:1.2rem; display:inline-flex; align-items:center; gap:0.6rem; font-weight:500; }
.section-label::before { content:''; width:8px; height:8px; background:var(--accent); border-radius:50%; animation:dotPulse 2s ease-in-out infinite; }
@keyframes dotPulse { 0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(30,136,229,0.4)} 50%{opacity:0.7;box-shadow:0 0 0 6px rgba(30,136,229,0)} }

/* ══ BOTONES ══ */
.btn-primary {
  display:inline-block; background: var(--accent); color: #fff; font-family:'Poppins',sans-serif;
  font-weight:700; font-size:0.9rem; letter-spacing:0.04em; text-transform:uppercase;
  padding:16px 36px; border-radius:8px; text-decoration:none;
  position:relative; overflow:hidden; animation:pulseGlow 3s ease-in-out infinite;
  transition:transform 0.2s, box-shadow 0.2s, background 0.2s;
}
.btn-primary:hover { transform:translateY(-2px); background:var(--accent-light); }
.btn-primary::after { content:''; position:absolute; top:-50%; left:-75%; width:50%; height:200%; background:linear-gradient(90deg,transparent,rgba(255,255,255,0.15),transparent); transform:skewX(-25deg); animation:shimmer 4s ease-in-out infinite; }
@keyframes shimmer { 0%,100%{left:-75%} 50%{left:125%} }
@keyframes pulseGlow { 0%,100%{box-shadow:0 4px 25px rgba(30,136,229,0.25)} 50%{box-shadow:0 4px 40px rgba(30,136,229,0.5),0 0 80px rgba(30,136,229,0.15)} }
.btn-ghost { display:inline-block; border:1px solid var(--border); color:var(--white); font-size:0.9rem; padding:14px 30px; border-radius:8px; text-decoration:none; transition:border-color 0.2s, background 0.2s; }
.btn-ghost:hover { border-color:rgba(255,255,255,0.2); background:rgba(255,255,255,0.04); }

/* ══ SCROLL REVEAL ══ */
.reveal { opacity:0; transform:translateY(40px) scale(0.96); transition:opacity 0.8s cubic-bezier(0.25,0.8,0.25,1), transform 0.8s cubic-bezier(0.25,0.8,0.25,1); }
.reveal.visible { opacity:1; transform:translateY(0) scale(1); }

/* ═══════════════ BLOG — LISTADO ═══════════════ */
.blog-hero { padding:160px 6vw 40px; text-align:center; }
.blog-hero h1 { font-family:'Poppins',sans-serif; font-weight:800; font-size:clamp(1.7rem,3.8vw,2.6rem); line-height:1.2; color:#fff; margin-bottom:1rem; }
.blog-hero p { color:var(--muted); max-width:640px; margin:0 auto; font-size:clamp(1rem,1.6vw,1.15rem); }
.blog-grid { max-width:1160px; margin:0 auto; padding:40px 6vw 100px; display:grid; grid-template-columns:repeat(2,1fr); gap:2rem; }
@media(max-width:820px){ .blog-grid{ grid-template-columns:1fr; } }
.blog-card {
  background:var(--card); backdrop-filter:blur(12px); border:1px solid var(--border);
  border-radius:16px; overflow:hidden; display:flex; flex-direction:column;
  text-decoration:none; color:inherit;
  transition:border-color 0.25s, transform 0.25s, box-shadow 0.25s;
}
.blog-card:hover { border-color:rgba(30,136,229,0.55); transform:translateY(-6px); box-shadow:0 12px 44px rgba(30,136,229,0.14); }
.blog-card-cover { position:relative; aspect-ratio:1200/630; overflow:hidden; background:#0b1428; }
.blog-card-cover img { width:100%; height:100%; object-fit:cover; display:block; transition:transform 0.4s ease; }
.blog-card:hover .blog-card-cover img { transform:scale(1.05); }
.blog-card-body { padding:1.6rem 1.7rem 1.9rem; display:flex; flex-direction:column; flex:1; }
.blog-card-cat { font-size:0.7rem; letter-spacing:0.12em; text-transform:uppercase; color:var(--accent-bright); font-weight:600; margin-bottom:0.7rem; }
.blog-card-body h2 { font-family:'Poppins',sans-serif; font-weight:700; font-size:1.15rem; line-height:1.35; color:#fff; margin-bottom:0.7rem; }
.blog-card-body p { color:var(--muted); font-size:0.92rem; flex:1; }
.blog-card-meta { margin-top:1.2rem; font-size:0.78rem; color:rgba(235,244,255,0.55); display:flex; align-items:center; gap:0.5rem; }
.blog-card-link { margin-top:1rem; color:var(--accent-light); font-weight:600; font-size:0.88rem; }

/* ═══════════════ BLOG — ARTÍCULO ═══════════════ */
.article-wrap { max-width:820px; margin:0 auto; padding:130px 6vw 60px; }
.article-back { display:inline-flex; align-items:center; gap:6px; color:var(--accent-light); text-decoration:none; font-size:0.85rem; margin-bottom:1.6rem; }
.article-back:hover { text-decoration:underline; }
.article-cat { font-size:0.72rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--accent-bright); font-weight:600; }
.article-title { font-family:'Poppins',sans-serif; font-weight:800; font-size:clamp(1.5rem,3.2vw,2.15rem); line-height:1.25; color:#fff; margin:0.8rem 0 1rem; }
.article-meta { font-size:0.82rem; color:rgba(235,244,255,0.6); margin-bottom:2rem; }
.article-cover { border-radius:18px; overflow:hidden; border:1px solid var(--border); box-shadow:0 20px 60px rgba(0,0,0,0.5),0 0 40px rgba(21,101,192,0.15); margin-bottom:2.6rem; }
.article-cover img { width:100%; height:auto; display:block; }
.article-body { font-size:1.05rem; color:var(--muted); }
.article-body p { margin-bottom:1.3rem; }
.article-body strong { color:#fff; font-weight:600; }
.article-body em { color:var(--accent-bright); font-style:italic; }
.article-body h2.art-h2 { font-family:'Poppins',sans-serif; font-weight:700; font-size:clamp(1.2rem,2.4vw,1.55rem); color:#fff; margin:2.6rem 0 1.2rem; line-height:1.3; }
.article-body ul, .article-body ol { margin:0 0 1.4rem 1.3rem; }
.article-body li { margin-bottom:0.6rem; color:var(--muted); }
.article-body blockquote {
  border-left:3px solid var(--accent); background:rgba(30,136,229,0.08);
  padding:1.1rem 1.5rem; margin:1.8rem 0; border-radius:0 10px 10px 0;
  font-size:1.15rem; font-style:italic; color:#e0f0ff;
}
.article-body table { width:100%; border-collapse:collapse; margin:1.8rem 0; font-size:0.95rem; background:var(--card); border-radius:12px; overflow:hidden; }
.article-body th, .article-body td { padding:12px 16px; text-align:left; border-bottom:1px solid var(--border); }
.article-body th { background:rgba(30,136,229,0.18); color:#fff; font-weight:600; text-transform:none; letter-spacing:0; }
.article-body td { color:var(--muted); }
.article-body tr:last-child td { border-bottom:none; }

/* CTA final del artículo */
.article-cta {
  margin:3rem 0 1rem; padding:2.4rem; text-align:center;
  background:linear-gradient(135deg, rgba(30,136,229,0.16) 0%, rgba(6,13,32,0.6) 100%);
  border:1px solid rgba(66,165,245,0.3); border-radius:18px;
}
.article-cta h3 { font-family:'Poppins',sans-serif; font-weight:700; font-size:1.3rem; color:#fff; margin-bottom:0.8rem; }
.article-cta p { color:var(--muted); margin-bottom:1.6rem; font-size:0.98rem; }
.article-cta .cta-fine { font-size:0.8rem; color:rgba(235,244,255,0.55); margin-top:1rem; margin-bottom:0; }

/* Otros artículos */
.article-more { max-width:1160px; margin:0 auto; padding:20px 6vw 90px; }
.article-more h3 { font-family:'Poppins',sans-serif; font-weight:700; font-size:1.25rem; color:#fff; margin-bottom:1.6rem; text-align:center; }
.article-more-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.4rem; }
@media(max-width:820px){ .article-more-grid{ grid-template-columns:1fr; } }