/* ============================================================
   css/site.css — Redes Sociales · Creando Patria
   Paleta: azul oscuro + neón multicolor por red social
   Efecto incrustado + sombras 3D
============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Space+Grotesk:wght@400;500;600;700&family=Space+Mono:wght@400;700&display=swap');

:root {
  --bg:   #080c14;
  --s1:   #0d1220;
  --s2:   #111828;
  --s3:   #172030;
  --s4:   #1e2a3e;
  --s5:   #263346;

  /* Neón por red social */
  --yt:   #ff3d3d;
  --fb:   #1877f2;
  --tt:   #69c9d0;
  --ig:   #e1306c;
  --xc:   #e0e0e0;

  /* Acento principal */
  --acc1: #4f8ef7;
  --acc2: #7c5ff7;
  --acclt:#a0c4ff;

  --text:  #dce8f8;
  --text2: #7a90b0;
  --text3: #3a4d68;

  --border:  rgba(79,142,247,.10);
  --border2: rgba(79,142,247,.22);

  --inset:      inset 3px 3px 8px rgba(0,0,0,.9), inset -1px -1px 3px rgba(255,255,255,.04);
  --inset-acc:  inset 3px 3px 8px rgba(0,0,0,.9), inset -1px -1px 3px rgba(79,142,247,.08);
  --raise:      3px 3px 0 #000, 5px 5px 14px rgba(0,0,0,.8);
  --raise-sm:   2px 2px 0 #000, 3px 3px 8px rgba(0,0,0,.7);
  --raise-acc:  0 4px 0 #1a2a5a, 0 6px 18px rgba(79,142,247,.3);

  --r:  10px;
  --rs:  6px;
  --rx:  4px;
}

*, *::before, *::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; }
body { background:var(--bg); color:var(--text); font-family:'Space Grotesk',sans-serif; font-size:15px; line-height:1.65; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }
::-webkit-scrollbar { width:4px; }
::-webkit-scrollbar-track { background:var(--s1); }
::-webkit-scrollbar-thumb { background:var(--s4); border-radius:2px; }

/* ── HEADER FIXED ───────────────────────────────────────── */
#site-header {
  position: fixed !important;
  top: 0 !important; left: 0 !important; right: 0 !important;
  z-index: 9999 !important;
  background: var(--s1);
  box-shadow: 0 4px 24px rgba(0,0,0,.9), 0 1px 0 var(--border2);
}

/* ── TOPBAR ─────────────────────────────────────────────── */
.topbar {
  background:var(--s1); border-bottom:1px solid var(--border);
  display:flex; align-items:center; justify-content:space-between;
  padding:0 1.75rem; height:33px; font-size:11px; color:var(--text3);
}
.topbar-links { display:flex; align-items:center; gap:1.25rem; }
.topbar-links a { color:var(--text3); transition:color .18s; }
.topbar-links a:hover, .topbar-links a.hi { color:var(--acc1); }
.topbar-right { display:flex; align-items:center; gap:.9rem; }
.tb-live { display:flex; align-items:center; gap:5px; font-size:10.5px; }
.pulse {
  width:6px; height:6px; border-radius:50%;
  background:var(--acc1);
  box-shadow:0 0 0 2px rgba(79,142,247,.2), 0 0 10px rgba(79,142,247,.5);
  animation:blink 2s infinite; flex-shrink:0;
}
@keyframes blink { 0%,100%{opacity:1;} 50%{opacity:.2;} }

.redes-arriba { display:flex; align-items:center; gap:4px; }
.red-arriba {
  width:24px; height:24px; border-radius:var(--rx);
  background:var(--s3); box-shadow:var(--inset);
  display:flex; align-items:center; justify-content:center;
  color:var(--text3); transition:all .2s;
}
.red-arriba svg { width:11px; height:11px; }
.red-arriba:hover { color:var(--acc1); box-shadow:var(--inset-acc); }

/* ── NAVBAR ─────────────────────────────────────────────── */
.navbar {
  background:var(--s1); border-bottom:1px solid var(--border);
  display:flex; align-items:center; justify-content:space-between;
  padding:0 1.75rem; height:58px; gap:1rem;
}
.logo { display:flex; align-items:center; gap:.85rem; }
.logo-img-wrap {
  width:40px; height:40px; border-radius:8px;
  background:var(--s3); box-shadow:var(--inset);
  overflow:hidden; display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.logo-img-wrap img { width:100%; height:100%; object-fit:cover; border-radius:7px; }
.logo-text { display:flex; flex-direction:column; line-height:1.2; }
.logo-name {
  font-family:'Space Grotesk',sans-serif; font-size:16px; font-weight:700;
  color:var(--text); letter-spacing:.01em;
}
.logo-name em { color:var(--acc1); font-style:normal; }
.logo-sub { font-size:9px; color:var(--text3); letter-spacing:.12em; text-transform:uppercase; }

.nav-main { display:flex; align-items:center; gap:2px; }
.nav-link { padding:.38rem .85rem; border-radius:var(--rs); font-size:12.5px; font-weight:500; color:var(--text2); transition:all .18s; }
a.nav-link:hover { background:var(--s3); color:var(--text); box-shadow:var(--inset); }
a.nav-link.active { background:var(--s3); color:var(--acc1); box-shadow:var(--inset-acc); }
.nav-sep { width:1px; height:14px; background:var(--border); margin:0 .15rem; }

.nav-r { display:flex; align-items:center; gap:.6rem; }
.search-form { display:flex; }
.search-wrap-nav {
  display:flex; align-items:center; gap:.45rem;
  background:var(--s3); border:1px solid var(--border);
  border-radius:var(--rs); padding:.32rem .75rem;
  box-shadow:var(--inset); transition:all .18s;
}
.search-wrap-nav:focus-within { border-color:var(--acc1); box-shadow:var(--inset-acc); }
.search-wrap-nav input { background:none; border:none; outline:none; font-size:12.5px; color:var(--text); width:155px; font-family:'Space Grotesk',sans-serif; }
.search-wrap-nav input::placeholder { color:var(--text3); }
.search-wrap-nav button { background:none; border:none; cursor:pointer; color:var(--text3); font-size:13px; padding:0; transition:color .18s; }
.search-wrap-nav button:hover { color:var(--acc1); }

.btn-acceso {
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.4rem 1rem; background:var(--s3); border:1px solid var(--border2);
  border-radius:var(--rs); font-size:11.5px; font-weight:600; color:var(--acc1);
  box-shadow:var(--raise-sm); transition:all .2s; letter-spacing:.03em;
}
.btn-acceso:hover { box-shadow:var(--raise); transform:translateY(-1px); }
.btn-acceso:active { box-shadow:var(--inset); transform:translateY(1px); }
.btn-access-dot {
  width:5px; height:5px; border-radius:50%;
  background:var(--acc1); box-shadow:0 0 6px var(--acc1), 0 0 12px rgba(79,142,247,.4);
  flex-shrink:0;
}

/* ── CATBAR ─────────────────────────────────────────────── */
.catbar {
  background:var(--s1); border-bottom:1px solid var(--border);
  display:flex; align-items:center; gap:4px;
  padding:0 1.75rem; height:42px; overflow-x:auto; scrollbar-width:none;
}
.catbar::-webkit-scrollbar { display:none; }
.cat-btn {
  display:inline-flex; align-items:center; gap:.4rem;
  padding:.28rem .85rem; border-radius:20px;
  font-size:11.5px; font-weight:500; color:var(--text3);
  white-space:nowrap; transition:all .2s; flex-shrink:0;
  background:var(--s2); box-shadow:var(--inset); border:1px solid transparent;
}
.cat-btn:hover { color:var(--text); border-color:var(--border); box-shadow:var(--raise-sm); transform:translateY(-1px); }
.cat-btn.active { color:var(--acc1); border-color:var(--border2); box-shadow:var(--inset-acc); }
.cat-pip { width:5px; height:5px; border-radius:50%; flex-shrink:0; box-shadow:0 0 5px currentColor; }
.cat-sep { width:1px; height:14px; background:var(--border); flex-shrink:0; margin:0 2px; }

/* ── TICKER ─────────────────────────────────────────────── */
.ticker-wrap {
  background:var(--s2); border-bottom:1px solid var(--border);
  overflow:hidden; height:32px; display:flex; align-items:center;
  box-shadow:var(--inset);
}
.ticker-label {
  background:linear-gradient(135deg,var(--acc2),var(--acc1));
  color:#fff; font-family:'Space Mono',monospace;
  font-size:9.5px; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  padding:0 14px; height:100%; display:flex; align-items:center; white-space:nowrap; flex-shrink:0;
  box-shadow:3px 0 12px rgba(0,0,0,.5);
}
.ticker-track { display:flex; animation:ticker 50s linear infinite; white-space:nowrap; }
.ticker-track:hover { animation-play-state:paused; }
@keyframes ticker { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }
.ticker-item {
  display:inline-flex; align-items:center; gap:7px;
  padding:0 24px; font-family:'Space Mono',monospace; font-size:10.5px;
  border-right:1px solid var(--border);
}
.ticker-name  { color:var(--acclt); font-weight:700; letter-spacing:.04em; }
.ticker-price { color:var(--text); }
.ticker-chg   { font-size:9.5px; font-weight:700; padding:1px 5px; border-radius:3px; }
.bg-up   { background:rgba(42,200,100,.15); color:#4cd080; }
.bg-down { background:rgba(220,60,60,.15);  color:#e06060; }

/* ── CONTENIDO ──────────────────────────────────────────── */
.site-content { max-width:1380px; margin:0 auto; padding:1.5rem 1.75rem 4rem; }

/* ── HERO ───────────────────────────────────────────────── */
.hero {
  display:grid; grid-template-columns:210px 1fr 265px;
  min-height:360px; background:var(--s1); border:1px solid var(--border);
  border-radius:var(--r); overflow:hidden; margin-bottom:2.25rem;
  box-shadow:var(--raise);
}
.hero-left { padding:2.25rem 2rem; display:flex; flex-direction:column; justify-content:center; gap:1.1rem; }
.hero-badges { display:flex; flex-wrap:wrap; gap:.4rem; }
.hbadge {
  font-size:9.5px; font-weight:600; letter-spacing:.12em; text-transform:uppercase;
  padding:.22rem .65rem; border-radius:20px;
  background:var(--s3); color:var(--text3); border:1px solid var(--border);
  box-shadow:var(--inset);
}
.hbadge.accent { color:var(--acc1); border-color:var(--border2); box-shadow:var(--inset-acc); }
.hero-left h1 {
  font-family:'Space Grotesk',sans-serif; font-size:clamp(2rem,4.5vw,3rem);
  font-weight:800; line-height:1.0; color:var(--text);
}
.hl  { color:var(--acc1); text-shadow:0 0 30px rgba(79,142,247,.4); }
.hl2 { color:var(--text2); }
.hero-desc { font-size:14px; color:var(--text2); line-height:1.7; max-width:440px; font-weight:400; }
.hero-stats { display:flex; gap:.65rem; flex-wrap:wrap; }
.hstat {
  background:var(--s3); border:1px solid var(--border); border-radius:var(--rs);
  padding:.55rem .9rem; min-width:82px; box-shadow:var(--inset);
}
.hstat.c1 { border-top:2px solid var(--acc1); box-shadow:var(--inset-acc); }
.hstat.c2 { border-top:2px solid var(--tt); }
.hstat.c4 { border-top:2px solid var(--text3); }
.hstat-num { font-family:'Space Mono',monospace; font-size:19px; font-weight:700; color:var(--text); }
.hstat-lbl { font-size:9px; letter-spacing:.1em; text-transform:uppercase; color:var(--text3); margin-top:.1rem; }

.hero-libro { background:var(--s2); border-right:1px solid var(--border); display:flex; flex-direction:column; align-items:center; justify-content:center; padding:1.5rem 1.1rem; gap:.85rem; box-shadow:var(--inset); }
.hero-right { background:var(--s2); border-left:1px solid var(--border); padding:1.25rem; display:flex; flex-direction:column; gap:.75rem; box-shadow:var(--inset); }
.hero-right-title { font-size:9px; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--acc1); padding-bottom:.55rem; border-bottom:1px solid var(--border); }

/* ── SECCIONES ──────────────────────────────────────────── */
.sec-row { display:flex; align-items:center; gap:.75rem; margin:2.25rem 0 1.1rem; }
.sec-bar { width:3px; height:18px; border-radius:2px; flex-shrink:0; box-shadow:0 0 8px currentColor; }
.sec-label {
  font-family:'Space Grotesk',sans-serif; font-size:11px; font-weight:700;
  letter-spacing:.16em; text-transform:uppercase; color:var(--text2); white-space:nowrap;
  display:flex; align-items:center; gap:.5rem;
}
.sec-count { font-size:11px; color:var(--text3); white-space:nowrap; }
.sec-line { flex:1; height:1px; background:linear-gradient(90deg,var(--border2),transparent); }

/* ── CARDS ──────────────────────────────────────────────── */
.g3 { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-bottom:.5rem; }
.g4 { display:grid; grid-template-columns:repeat(4,1fr); gap:8px;  margin-bottom:.5rem; }

.nc {
  background:var(--s1); border:1px solid var(--border); border-radius:var(--r);
  display:flex; flex-direction:column; box-shadow:var(--raise);
  transition:all .22s; text-decoration:none; color:inherit; overflow:hidden;
}
.nc:hover { transform:translateY(-3px); box-shadow:var(--raise), 0 0 0 1px var(--border2); }
.nc:active { transform:translateY(0); box-shadow:var(--inset); }

.nc-thumb { position:relative; overflow:hidden; flex-shrink:0; }
.nc-thumb img { width:100%; object-fit:cover; transition:transform .35s; }
.nc:hover .nc-thumb img { transform:scale(1.05); }
.nc-thumb-ph { display:flex; align-items:center; justify-content:center; font-size:2.5rem; color:var(--text3); background:var(--s2); }
.nc-thumb-bar { position:absolute; bottom:0; left:0; right:0; height:2px; box-shadow:0 0 8px currentColor; }
.nc-body { padding:1rem 1.1rem; flex:1; display:flex; flex-direction:column; gap:.38rem; }
.nc-tags { display:flex; flex-wrap:wrap; gap:.3rem; }

.pill {
  display:inline-flex; align-items:center; gap:.25rem;
  font-size:9.5px; font-weight:600; letter-spacing:.08em; text-transform:uppercase;
  padding:.18rem .55rem; border-radius:20px;
  background:var(--s3); border:1px solid var(--border); box-shadow:var(--inset);
}
.p-hot { color:#ff4444; border-color:rgba(255,68,68,.25); }
.p-new { color:var(--acc1); border-color:var(--border2); box-shadow:var(--inset-acc); }

.nc-title {
  font-family:'Space Grotesk',sans-serif; font-size:14px; font-weight:600;
  color:var(--text); line-height:1.35;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}
.nc-meta { display:flex; align-items:center; gap:.4rem; font-size:10.5px; color:var(--text3); flex-wrap:wrap; }
.nc-dot { width:2px; height:2px; border-radius:50%; background:var(--text3); flex-shrink:0; }
.nc-excerpt { font-size:12.5px; color:var(--text3); line-height:1.55; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.nc-sm .nc-title { font-size:12.5px; }
.nc-sm .nc-excerpt { display:none; }

.tc1 { background:linear-gradient(160deg,#0d0808,#1a0c0c); }
.tc2 { background:linear-gradient(160deg,#080c1a,#0c1428); }
.tc3 { background:linear-gradient(160deg,#080d0e,#0c1618); }
.tc4 { background:linear-gradient(160deg,#140810,#201018); }
.tc5 { background:linear-gradient(160deg,#0e0e0e,#181818); }

/* ── ARTÍCULO ───────────────────────────────────────────── */
.article-layout { display:grid; grid-template-columns:1fr 272px; gap:1.5rem; align-items:start; margin-bottom:2rem; }
.article-aside { position:sticky; top:175px; }
.article-main { background:var(--s1); border:1px solid var(--border); border-radius:var(--r); overflow:hidden; box-shadow:var(--raise); }
.art-header { padding:1.75rem 1.75rem 0; }
.art-title { font-family:'Space Grotesk',sans-serif; font-size:clamp(1.5rem,3.5vw,2.2rem); font-weight:700; color:var(--text); line-height:1.15; margin-bottom:.6rem; }
.art-subtitle { font-size:16px; color:var(--text2); margin-bottom:.75rem; line-height:1.6; font-weight:400; }
.art-meta { display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; font-size:11px; color:var(--text3); margin-bottom:1.25rem; font-family:'Space Mono',monospace; }
.art-img-wrap { margin:0 1.75rem; border-radius:var(--rs); overflow:hidden; box-shadow:var(--raise); }
.art-img { width:100%; max-height:460px; object-fit:cover; }
.art-body { padding:1.5rem 1.75rem; font-size:16.5px; color:var(--text2); line-height:1.85; font-weight:400; }
.art-body h2 { font-family:'Space Grotesk',sans-serif; font-size:1.15rem; font-weight:700; color:var(--text); text-transform:uppercase; letter-spacing:.08em; margin:1.75rem 0 .75rem; padding-left:.85rem; border-left:3px solid var(--acc1); }
.art-body h3 { font-family:'Space Grotesk',sans-serif; font-size:1rem; font-weight:600; color:var(--text2); margin:1.25rem 0 .5rem; }
.art-body p { margin-bottom:1.1rem; }
.art-body strong { color:var(--text); font-weight:600; }
.art-body blockquote { border-left:3px solid var(--acc1); padding:.85rem 1.1rem; margin:1.25rem 0; background:var(--s3); border-radius:0 var(--rs) var(--rs) 0; font-style:italic; color:var(--text2); box-shadow:var(--inset); }
.art-source { margin:0 1.75rem 1.25rem; padding:.65rem .9rem; background:var(--s3); border:1px solid var(--border); border-radius:var(--rs); font-size:11.5px; color:var(--text3); display:flex; align-items:center; gap:.5rem; box-shadow:var(--inset); }
.art-source a { color:var(--acc1); }
.art-share { display:flex; align-items:center; gap:.5rem; flex-wrap:wrap; padding:1rem 1.75rem 1.5rem; border-top:1px solid var(--border); font-size:11px; color:var(--text3); }
.share-btn { display:inline-flex; align-items:center; gap:.35rem; padding:.35rem .8rem; border-radius:20px; background:var(--s3); border:1px solid var(--border); font-size:10.5px; font-weight:500; color:var(--text2); cursor:pointer; transition:all .2s; box-shadow:var(--raise-sm); }
.share-btn:hover { border-color:var(--acc1); color:var(--acc1); box-shadow:var(--raise); transform:translateY(-1px); }
.share-btn:active { box-shadow:var(--inset); transform:translateY(1px); }

/* ── WIDGETS ────────────────────────────────────────────── */
.widget { background:var(--s1); border:1px solid var(--border); border-radius:var(--r); overflow:hidden; margin-bottom:1rem; box-shadow:var(--raise); }
.w-head { display:flex; align-items:center; gap:.5rem; padding:.75rem 1rem; border-bottom:1px solid var(--border); font-size:9px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--text3); background:var(--s2); box-shadow:var(--inset); }
.w-head-bar { width:2px; height:12px; border-radius:1px; box-shadow:0 0 6px currentColor; }
.cat-list { padding:.5rem .6rem; display:flex; flex-direction:column; gap:.3rem; }
.cat-row { display:flex; align-items:center; padding:.42rem .65rem; border-radius:var(--rs); font-size:12.5px; color:var(--text2); transition:all .2s; border:1px solid transparent; background:var(--s2); box-shadow:var(--inset); margin-bottom:1px; }
.cat-row:hover { color:var(--text); border-color:var(--border); box-shadow:var(--raise-sm); transform:translateX(3px); }
.cat-left { display:flex; align-items:center; gap:.5rem; }
.cat-pip { width:5px; height:5px; border-radius:50%; flex-shrink:0; box-shadow:0 0 5px currentColor; }

/* ── BREADCRUMB ─────────────────────────────────────────── */
.breadcrumb { display:flex; align-items:center; gap:.4rem; padding:.75rem 0; font-size:11.5px; color:var(--text3); flex-wrap:wrap; }
.breadcrumb a { color:var(--text3); }
.breadcrumb a:hover { color:var(--acc1); }
.breadcrumb span:last-child { color:var(--text2); }

/* ── CAT HERO ───────────────────────────────────────────── */
.cat-hero { display:flex; align-items:center; gap:1.5rem; background:var(--s1); border:1px solid var(--border); border-radius:var(--r); padding:1.75rem 2rem; margin-bottom:1.5rem; border-left:3px solid var(--cat-color,var(--acc1)); box-shadow:var(--raise); }
.cat-hero-icon { font-size:2.5rem; flex-shrink:0; }
.cat-hero-title { font-family:'Space Grotesk',sans-serif; font-size:1.8rem; font-weight:700; color:var(--text); }
.cat-hero-desc  { font-size:13.5px; color:var(--text2); margin-top:.35rem; }
.cat-hero-count { font-size:11px; color:var(--text3); margin-top:.45rem; font-family:'Space Mono',monospace; }

/* ── BUSCAR ─────────────────────────────────────────────── */
.search-hero { margin-bottom:2rem; }
.search-form-big { margin-bottom:1rem; }
.search-big-wrap { display:flex; align-items:center; gap:.75rem; background:var(--s3); border:1px solid var(--border); border-radius:var(--r); padding:.75rem 1.25rem; box-shadow:var(--inset); transition:border-color .18s; }
.search-big-wrap:focus-within { border-color:var(--acc1); box-shadow:var(--inset-acc); }
.search-big-wrap input { flex:1; background:none; border:none; outline:none; font-size:15px; color:var(--text); font-family:'Space Grotesk',sans-serif; }
.search-big-wrap input::placeholder { color:var(--text3); }
.search-big-wrap .btn-primary { padding:.45rem 1.1rem; border-radius:var(--rs); background:linear-gradient(135deg,var(--acc2),var(--acc1)); font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:#fff; border:none; cursor:pointer; font-family:'Space Grotesk',sans-serif; box-shadow:var(--raise-acc); transition:all .2s; }
.search-big-wrap .btn-primary:hover { transform:translateY(-2px); box-shadow:0 6px 0 #1a2a5a, 0 8px 20px rgba(79,142,247,.4); }
.search-big-wrap .btn-primary:active { transform:translateY(1px); box-shadow:var(--inset-acc); }
.search-info { font-size:13px; color:var(--text3); }

.search-results { display:flex; flex-direction:column; gap:8px; margin-bottom:1.5rem; }
.sr-item { display:grid; grid-template-columns:130px 1fr; background:var(--s1); border:1px solid var(--border); border-radius:var(--r); overflow:hidden; box-shadow:var(--raise); transition:all .2s; }
.sr-item:hover { transform:translateY(-2px); box-shadow:var(--raise), 0 0 0 1px var(--border2); }
.sr-thumb { width:130px; height:86px; object-fit:cover; }
.sr-thumb-ph { width:130px; height:86px; display:flex; align-items:center; justify-content:center; font-size:1.8rem; background:var(--s2); }
.sr-body { padding:.75rem 1rem .75rem .9rem; }
.sr-title { font-family:'Space Grotesk',sans-serif; font-size:14px; font-weight:600; color:var(--text); margin:.25rem 0; }
.sr-excerpt { font-size:12px; color:var(--text3); line-height:1.55; }

/* ── PAGINACION ─────────────────────────────────────────── */
.pagination { display:flex; align-items:center; gap:.4rem; flex-wrap:wrap; margin:1.5rem 0; }
.page-btn { display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:var(--rs); background:var(--s3); border:1px solid var(--border); font-size:12px; font-weight:500; color:var(--text2); font-family:'Space Mono',monospace; box-shadow:var(--raise-sm); transition:all .2s; }
.page-btn:hover { border-color:var(--acc1); color:var(--acc1); box-shadow:var(--raise); transform:translateY(-2px); }
.page-btn.active { color:var(--acc1); border-color:var(--border2); box-shadow:var(--inset-acc); }

/* ── LEGALES ────────────────────────────────────────────── */
.legal-wrap { max-width:880px; margin:0 auto 3rem; }
.legal-hero { background:var(--s1); border:1px solid var(--border); border-radius:var(--r); padding:2rem 2.5rem; margin-bottom:1.5rem; box-shadow:var(--raise); }
.legal-hero h1 { font-family:'Space Grotesk',sans-serif; font-size:2rem; font-weight:700; color:var(--text); }
.legal-hero p  { color:var(--text3); font-size:12px; margin-top:.4rem; font-family:'Space Mono',monospace; }
.legal-body { background:#f0f4f8; color:#1a2030; border-radius:var(--r); padding:2rem 2.5rem; font-size:15.5px; line-height:1.9; box-shadow:var(--raise); }
.legal-body h2 { font-family:'Space Grotesk',sans-serif; font-size:1rem; font-weight:700; color:#0a1020; text-transform:uppercase; letter-spacing:.08em; margin:1.5rem 0 .5rem; padding-left:.75rem; border-left:2px solid var(--acc1); }
.legal-body h2:first-child { margin-top:0; }
.legal-body p { margin-bottom:.85rem; color:#2a3848; }
.legal-body a { color:var(--acc2); }

/* ── ALERTS ─────────────────────────────────────────────── */
.alert { padding:.75rem 1rem; border-radius:var(--rs); font-size:13px; margin-bottom:.85rem; box-shadow:var(--inset); }
.alert-success { background:rgba(42,200,100,.08); border:1px solid rgba(42,200,100,.2); color:#4cd080; }
.alert-error   { background:rgba(220,60,60,.08);  border:1px solid rgba(220,60,60,.2);  color:#e06060; }

/* ── ERROR PAGE ─────────────────────────────────────────── */
.error-page { text-align:center; padding:5rem 2rem; }
.error-page h1 { font-family:'Space Grotesk',sans-serif; font-size:7rem; font-weight:800; color:var(--acc1); opacity:.1; line-height:1; }
.error-page h2 { font-family:'Space Grotesk',sans-serif; font-size:1.6rem; font-weight:700; color:var(--text2); margin:.5rem 0; }
.error-page p  { color:var(--text3); max-width:400px; margin:.75rem auto 1.5rem; line-height:1.6; }
.btn-acc { display:inline-flex; align-items:center; gap:.4rem; padding:.45rem 1rem; border-radius:var(--rs); background:var(--s3); border:1px solid var(--border); font-size:11.5px; font-weight:500; color:var(--acc1); box-shadow:var(--raise-sm); transition:all .2s; cursor:pointer; }
.btn-acc:hover { border-color:var(--acc1); box-shadow:var(--raise); transform:translateY(-2px); }

/* ── FORMULARIOS ────────────────────────────────────────── */
.field { display:flex; flex-direction:column; gap:.4rem; }
.field label { font-size:10.5px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--text3); }
.field input,.field textarea,.field select { background:var(--s3); border:1px solid var(--border); border-radius:var(--rs); outline:none; padding:.6rem .85rem; font-size:13.5px; color:var(--text); font-family:'Space Grotesk',sans-serif; resize:vertical; width:100%; box-shadow:var(--inset); transition:border-color .18s; }
.field input:focus,.field textarea:focus { border-color:var(--acc1); box-shadow:var(--inset-acc); }
.field textarea { min-height:120px; }

/* ── FOOTER ─────────────────────────────────────────────── */
footer { background:var(--s1); border-top:1px solid var(--border); margin-top:4rem; box-shadow:0 -4px 20px rgba(0,0,0,.6); }
.ft-top { padding:3rem 1.75rem 2rem; }
.ft-grid { display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:3rem; max-width:1380px; margin:0 auto; }
.ft-brand { display:flex; flex-direction:column; }
.ft-brand b  { font-family:'Space Grotesk',sans-serif; font-size:15px; font-weight:700; color:var(--text); margin-bottom:.55rem; }
.ft-brand p  { font-size:12.5px; color:var(--text3); line-height:1.7; max-width:280px; }
.ft-col h5 { font-size:9px; font-weight:700; letter-spacing:.2em; text-transform:uppercase; color:var(--acc1); margin-bottom:.9rem; padding-bottom:.5rem; border-bottom:1px solid var(--border); }
.ft-col { display:flex; flex-direction:column; }
.ft-col a { font-size:12.5px; color:var(--text3); padding:.22rem 0; transition:all .18s; }
.ft-col a:hover { color:var(--text); padding-left:4px; }
.ft-bottom { max-width:1380px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:.75rem; padding:1.25rem 1.75rem; border-top:1px solid var(--border); font-size:11px; color:var(--text3); }
.ft-live { display:flex; align-items:center; gap:.4rem; }
.ft-bottom a { color:var(--text3); }
.ft-bottom a:hover { color:var(--acc1); }

/* ── RESPONSIVE ─────────────────────────────────────────── */
@media(max-width:1100px){
  .hero{grid-template-columns:1fr!important;min-height:auto;}
  .hero-libro,.hero-right{display:none!important;}
  .g4{grid-template-columns:repeat(3,1fr);}
  .ft-grid{grid-template-columns:1fr 1fr;}
}
@media(max-width:900px){
  .article-layout{grid-template-columns:1fr;}
  .article-aside{position:static;}
  .g3,.g4{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:600px){
  .nav-main,.search-form{display:none;}
  .site-content{padding:.75rem 1rem 2rem;}
  .g3,.g4{grid-template-columns:1fr;}
  .sr-item{grid-template-columns:1fr;}
  .sr-thumb,.sr-thumb-ph{display:none;}
  .ft-grid{grid-template-columns:1fr;gap:2rem;}
  .topbar-links{display:none;}
}
