/*
Theme Name: Gigbusters Blog
Description: Tema hijo de Hello Elementor para gigbusters.com/blog (Noticias). La cabecera, el pie y el selector de idioma son el MISMO HTML+CSS de la landing (landing/index.html del repo gigbusters) — la coherencia se consigue compartiendo el esqueleto, no la plataforma. Elementor queda para el CONTENIDO de las entradas. Fuente de verdad y despliegue: repo gigbusters, blog/README.md.
Template: hello-elementor
Version: 1.0.0
Author: Era Creativa
Text Domain: gigbusters-blog
*/

/* Mismas webfonts que la landing, AUTOALOJADAS en fonts/ del tema (copia byte a
   byte de web/public/fonts; la vigila tools/verifica-sin-google-fonts.py). La
   url() es RELATIVA a este style.css: `/fonts/…` sería la raíz de WordPress.
   Nada se pide a Google: esa petición llevaba la IP de quien visita antes de
   aceptar las cookies. */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(fonts/inter-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url(fonts/inter-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url(fonts/space-grotesk-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url(fonts/space-grotesk-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* El kit de Elementor (post-6.css) declara Roboto / Roboto Slab como tipografías
   globales; functions.php corta su descarga de Google, así que aquí se le dan
   las nuestras. `body[class*=…]` (0,1,1) gana a `.elementor-kit-6` (0,1,0). */
body[class*="elementor-kit-"]{
  --e-global-typography-primary-font-family:"Space Grotesk";
  --e-global-typography-secondary-font-family:"Space Grotesk";
  --e-global-typography-text-font-family:"Inter";
  --e-global-typography-accent-font-family:"Inter";
}

/* ══ ESQUELETO CALCADO DE landing/index.html — no editar aquí: si la landing
   cambia, se re-copia de allí (la paridad la vigila landing/verifica-blog-paridad.py) ══ */
*{box-sizing:border-box;margin:0;padding:0}
:root{
  --bg:#14101A; --surface:#1E1728; --surface2:#241C31; --line:rgba(255,255,255,.08);
  --ink:#F3EFF7; --muted:#A395B5; --brand:#7A3BA8; --brand-tx:#CBA9E8;
  --live:#E5484D; --fan:#4E97A8; --band:#D2494E; --venue:#E9A13B;
}
/* html body (0,0,2): gana al `body{color:#333}` de theme.css del padre y del
   kit de Elementor AUNQUE carguen después — medido en el blog vivo (25-ago) */
html body{background:var(--bg);color:var(--ink);font-family:Inter,system-ui,sans-serif;line-height:1.6}
.wrap{max-width:1140px;margin:0 auto;padding:0 24px}
a{color:inherit}

.topband{
  position:relative;overflow:hidden;
  background:
    radial-gradient(90% 62% at 50% -8%, rgba(122,59,168,.50), transparent 62%),
    linear-gradient(180deg,#2a123f 0%,#1c1329 45%,var(--bg) 100%);
}
.topband::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--line),transparent);
}

header.cabecera-gb{display:flex;align-items:center;gap:12px;padding:22px 0}
.topnav{display:flex;gap:16px;margin-left:10px}
.topnav a{color:var(--muted);text-decoration:none;font-size:14px;font-weight:600}
.topnav a:hover{color:var(--ink)}
.topnav a[aria-current="page"]{color:var(--ink)}
header.cabecera-gb{position:fixed;top:0;left:0;right:0;z-index:30;max-width:1140px;margin:0 auto;padding:22px 24px}
header.cabecera-gb::before{content:"";position:absolute;top:0;bottom:0;left:calc(50% - 50vw);right:calc(50% - 50vw);
  z-index:-1;background:rgba(52,23,79,.78);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  border-bottom:1px solid var(--line);opacity:0;transition:opacity .3s;pointer-events:none}
header.cabecera-gb.pegada::before{opacity:1}
.topband .wrap{padding-top:88px}
div.topband .wrap{z-index:10}
@media(max-width:520px){.topband .wrap{padding-top:82px}}

/* menú hamburguesa (solo móvil) */
.burger{position:relative;display:none;margin-left:8px}
.burger>button{width:38px;height:38px;display:grid;place-items:center;background:transparent;
  border:1px solid var(--line);border-radius:999px;color:var(--ink);cursor:pointer;padding:0}
.burger .lineas{position:relative;width:16px;height:12px;display:block}
.burger .lineas i{position:absolute;left:0;width:16px;height:2px;border-radius:2px;
  background:currentColor;transition:transform .25s,opacity .2s,top .25s}
.burger .lineas i:nth-child(1){top:0}
.burger .lineas i:nth-child(2){top:5px}
.burger .lineas i:nth-child(3){top:10px}
.burger.abierto .lineas i:nth-child(1){top:5px;transform:rotate(45deg)}
.burger.abierto .lineas i:nth-child(2){opacity:0}
.burger.abierto .lineas i:nth-child(3){top:5px;transform:rotate(-45deg)}
.burger .panel{display:none;position:absolute;right:0;top:calc(100% + 6px);background:var(--surface);
  border:1px solid var(--line);border-radius:12px;padding:6px;min-width:190px;z-index:7}
.burger.abierto .panel{display:block}
.burger .panel a{display:block;color:var(--ink);padding:10px 12px;border-radius:8px;
  font-size:14px;font-weight:600;text-decoration:none}
.burger .panel a:hover{background:var(--surface2)}
.burger .panel a[aria-current="page"]{color:var(--brand-tx)}
.burger .panel .sep{height:1px;background:var(--line);margin:6px 4px}
.burger .panel a.entrar{display:flex;justify-content:center;margin:8px 4px 4px;
  background:rgba(203,169,232,.06);border:1px solid rgba(203,169,232,.32);color:var(--brand-tx);
  border-radius:999px;padding:10px 12px}
@media(max-width:520px){
  .topnav{display:none}
  header.cabecera-gb .enter{display:none}
  .burger{display:block}
}
header.cabecera-gb img{width:38px;height:38px;border-radius:50%}
header.cabecera-gb .name{font-family:'Space Grotesk';font-weight:700;letter-spacing:.02em;color:var(--ink)}
.enter{display:inline-flex;align-items:center;gap:8px;
  background:rgba(203,169,232,.06);border:1px solid rgba(203,169,232,.32);
  color:var(--brand-tx);font-weight:600;font-size:14px;padding:10px 20px;border-radius:999px;
  text-decoration:none;transition:background .2s,border-color .2s,transform .2s,box-shadow .2s}
.enter svg{transition:transform .2s}
.enter:hover{background:var(--brand);border-color:var(--brand);color:#fff;
  transform:translateY(-1px);box-shadow:0 10px 26px rgba(122,59,168,.4)}
.enter:hover svg{transform:translateX(3px)}

/* selector de idioma con icono, preparado para más idiomas */
.idioma{position:relative;margin-left:auto;margin-right:10px}
.idioma>button{display:flex;gap:7px;align-items:center;background:transparent;
  border:1px solid var(--line);border-radius:999px;color:var(--ink);padding:6px 14px;
  font:600 13px Inter,system-ui,sans-serif;cursor:pointer}
.idioma>button svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round}
.idioma .menu{display:none;position:absolute;right:0;top:calc(100% + 6px);background:var(--surface);
  border:1px solid var(--line);border-radius:12px;padding:6px;min-width:150px;z-index:6}
.idioma.abierto .menu{display:block}
.idioma .menu a{display:flex;justify-content:space-between;gap:14px;color:var(--ink);
  padding:8px 12px;border-radius:8px;font-size:13px;font-weight:600;text-decoration:none}
.idioma .menu a:hover{background:var(--surface2)}
.idioma .menu a[aria-current="true"]{color:var(--brand-tx)}

/* logo de marca como fondo de página (igual que la landing) */
.logo-fondo{position:fixed;top:4%;right:-6%;height:115vh;width:auto;max-width:none;
  opacity:.04;z-index:1;pointer-events:none;user-select:none}
@media(max-width:760px){.logo-fondo{height:90vh;top:12%;right:-30%}}
.topband .wrap,.wrap{position:relative;z-index:2}

footer.pie-gb{border-top:1px solid var(--line);padding:22px 0;text-align:center;font-size:12px;color:var(--muted)}
footer.pie-gb a{color:var(--brand-tx);margin:0 6px}
/* Redes: el MISMO pie en las tres superficies (copiado de landing/index.html). */
.redes{display:flex;justify-content:center;gap:10px;margin:0 0 14px}
.redes a{display:inline-flex;width:44px;height:44px;align-items:center;justify-content:center;border-radius:999px;border:1px solid var(--line);color:var(--muted);margin:0;transition:color .15s,border-color .15s,background .15s}
.redes a:hover,.redes a:focus-visible{color:var(--brand-tx);border-color:var(--brand-tx);background:rgba(203,169,232,.08);outline:none}
.redes svg{width:18px;height:18px;fill:currentColor}
.redes a{margin:0}

/* ══ MAQUETACIÓN DEL BLOG (propia de este tema) ══ */
/* h1 de PÁGINA a la escala del sitio (30→44, peso 700 EXPLÍCITO: WordPress
   pisa el peso por defecto de los h1 y este titular salía más fino que el de
   contacto — medido por el operador, 25-ago). Sub de página a 17px, como las
   .cabecera .sub de la landing. */
.blog-titulo{padding:44px 0 46px}
.blog-titulo h1{font-family:'Space Grotesk';font-weight:700;font-size:clamp(30px,5vw,44px);line-height:1.15;color:var(--ink)}
.blog-titulo p{color:var(--muted);margin-top:12px;font-size:17px;max-width:60ch}

.lista-posts{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;padding:36px 0 56px}
.tarjeta-post{display:block;background:var(--surface);border:1px solid var(--line);border-radius:18px;
  overflow:hidden;text-decoration:none;transition:transform .2s,box-shadow .2s}
.tarjeta-post:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(0,0,0,.4)}
/* hueco de imagen: si la entrada no tiene portada, el anagrama de marca al
   150 % y 50 % de opacidad — el MISMO tratamiento que CartelFallback en la app */
.tarjeta-post .miniatura{position:relative;aspect-ratio:16/9;background:var(--surface2);overflow:hidden}
.tarjeta-post .miniatura img{width:100%;height:100%;object-fit:cover;max-width:none}
.tarjeta-post .miniatura img.anagrama{position:absolute;left:50%;top:50%;width:auto;height:150%;
  max-width:none;transform:translate(-50%,-50%);opacity:.5;object-fit:contain}
.tarjeta-post .cuerpo{padding:16px 18px 18px}
.tarjeta-post .fecha{font-size:12px;color:var(--muted);letter-spacing:.04em}
.tarjeta-post h2{font-family:'Space Grotesk';font-weight:700;font-size:17px;line-height:1.3;margin:6px 0 8px;color:var(--ink)}
.tarjeta-post p{font-size:13.5px;color:var(--muted)}
.blog-vacio{padding:12px 0 80px;color:var(--muted)}

.paginacion{display:flex;justify-content:center;gap:10px;padding:0 0 72px;flex-wrap:wrap}
.paginacion a,.paginacion span{border:1px solid var(--line);border-radius:10px;padding:9px 16px;
  font-size:14px;font-weight:600;text-decoration:none;color:var(--ink)}
.paginacion a:hover{border-color:var(--brand-tx);color:var(--brand-tx)}
.paginacion span.current{background:var(--brand);border-color:var(--brand);color:#fff}

/* entrada individual */
.entrada-cab{padding:26px 0 36px;max-width:820px}
.entrada-cab .fecha{color:var(--muted);font-size:13px;letter-spacing:.04em}
/* titular de ENTRADA: algo menor que el h1 de página A PROPÓSITO — es titular
   de contenido sobre una columna de lectura de 820px; el peso sí es el 700
   del sitio */
.entrada-cab h1{font-family:'Space Grotesk';font-weight:700;font-size:clamp(26px,4.2vw,40px);line-height:1.15;margin-top:8px;color:var(--ink)}
.entrada-portada{max-width:820px;margin:26px auto 0}
.entrada-portada img{width:100%;height:auto;border-radius:18px;border:1px solid var(--line)}
.entrada{max-width:820px;margin:30px auto 46px;font-size:16px}
.entrada p{margin:0 0 18px;color:#D9D0E3}
.entrada h2,.entrada h3,.entrada h4{font-family:'Space Grotesk';font-weight:700;margin:30px 0 12px;color:var(--ink)}
.entrada img{max-width:100%;height:auto;border-radius:12px}
.entrada a{color:var(--brand-tx)}
.entrada blockquote{border-left:3px solid var(--brand);padding:6px 18px;margin:20px 0;color:var(--muted)}
.entrada ul,.entrada ol{margin:0 0 18px 22px;color:#D9D0E3}
.entrada figure{margin:20px 0}
.entrada figcaption{font-size:12.5px;color:var(--muted);margin-top:6px;text-align:center}
.volver{display:inline-block;margin:0 0 64px;color:var(--brand-tx);text-decoration:none;font-weight:600;font-size:14px}
.volver:hover{text-decoration:underline}

/* con sesión de WP abierta, la barra de admin no debe tapar la cabecera fija */
body.admin-bar header.cabecera-gb{top:32px}
@media(max-width:782px){body.admin-bar header.cabecera-gb{top:46px}}