@import url('https://fonts.googleapis.com/css2?family=Archivo:ital,wdth,wght@0,62..125,400..800;1,62..125,400..700&family=IBM+Plex+Mono:wght@400;500&family=Literata:ital,opsz,wght@0,7..72,300..700;1,7..72,400..600&display=swap');

/* =========================================================================
   SOY BUZO — Sistema de diseño 2026
   Medio de referencia sobre buceo en español.

   Se escribe SOBRE el marcado real de GeneratePress 3.6 + GP Premium 2.5
   (.site-header, .header-wrap, .main-navigation, .page-hero, .inside-article,
    .entry-content, .slideout-navigation, .site-footer) y sobre bloques de
   Gutenberg con clases .sb-* en la portada.

   Orden de carga en el sitio:
     main.min.css → uploads/generatepress/style.min.css → ESTE ARCHIVO
   Por eso casi todo se resuelve sin !important: basta con igualar o subir
   un punto la especificidad de GeneratePress (de ahí los `body .algo`,
   que ganan también a los <style> en línea de GP Premium).

   Índice
   01. Tokens
   02. Base y ritmo
   03. Cabecera, navegación y menú móvil
   04. Page hero (páginas interiores)
   05. Contenedores y retícula
   06. Tipografía de artículo
   07. Tablas, citas, listas, avisos
   08. Bloque FAQ de Rank Math
   09. Archivos y tarjetas
   10. Pie de página
   11. Portada (.sb-*)
   12. Accesibilidad, movimiento e impresión
   ========================================================================= */


/* =========================================================================
   01. TOKENS
   ========================================================================= */

:root {
  /* --- Paleta cruda: carta náutica ----------------------------------------
     Papel, tinta, azul de carta para contornos y filetes, agua somera como
     tinte, y magenta: el color que las cartas usan para las marcas de
     navegación. Sin degradados. Los nombres viejos (petroleo, turquesa,
     senal…) se mantienen como alias para que el resto del CSS siga en pie. */
  --sb-papel:             #F4EFE4;
  --sb-papel-2:           #ECE6D8;
  --sb-papel-claro:       #FBF8F1;
  --sb-tinta:             #1C1C1A;
  --sb-tinta-2:           #2A2A27;
  --sb-azul-carta:        #2F5D8A;
  --sb-azul-carta-hondo:  #244B70;
  --sb-agua:              #DCE9EB;
  --sb-agua-2:            #EAF1F2;
  --sb-magenta:           #B8367A;
  --sb-magenta-hondo:     #8F2A60;
  --sb-blanco:            #FFFFFF;

  /* alias de la paleta anterior */
  --sb-abismo:            var(--sb-tinta);
  --sb-fosa:              var(--sb-tinta-2);
  --sb-petroleo:          var(--sb-tinta);
  --sb-turquesa:          var(--sb-azul-carta);
  --sb-turquesa-hondo:    var(--sb-azul-carta-hondo);
  --sb-superficie:        var(--sb-papel);
  --sb-espuma:            var(--sb-papel-claro);
  --sb-senal:             var(--sb-magenta);
  --sb-senal-viva:        var(--sb-magenta);
  --sb-senal-clara:       var(--sb-magenta);

  /* --- Roles -------------------------------------------------------------- */
  --sb-fondo:             var(--sb-papel);
  --sb-fondo-2:           var(--sb-papel-2);
  --sb-tarjeta:           var(--sb-papel-claro);
  --sb-tarjeta-2:         var(--sb-agua-2);
  --sb-texto:             var(--sb-tinta);
  --sb-texto-suave:       #3A3A36;
  --sb-texto-tenue:       #6E6E68;
  --sb-linea:             rgba(47,93,138,.32);
  --sb-linea-suave:       rgba(47,93,138,.18);
  --sb-linea-fuerte:      var(--sb-azul-carta);
  --sb-enlace:            var(--sb-azul-carta);
  --sb-enlace-hover:      var(--sb-magenta);
  --sb-acento:            var(--sb-magenta);
  --sb-acento-grafico:    var(--sb-magenta);
  --sb-banda:             var(--sb-agua);          /* banda de cabecera interior: recuadro de carta */
  --sb-banda-texto:       var(--sb-texto-suave);
  --sb-banda-titulo:      var(--sb-tinta);
  --sb-banda-linea:       rgba(47,93,138,.32);

  /* --- Tipografía --------------------------------------------------------- */
  --sb-display: 'Archivo', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --sb-lectura: 'Literata', Charter, Georgia, 'Times New Roman', serif;
  --sb-datos:   'IBM Plex Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
  --sb-t-micro: .6875rem;                                       /* 11px    */
  --sb-t-mini:  .8125rem;                                       /* 13px    */
  --sb-t-peq:   .9375rem;                                       /* 15px    */
  --sb-t-base:  clamp(1.0625rem, 1.0125rem + .22vw, 1.1875rem); /* 17–19px */
  --sb-t-lede:  clamp(1.1875rem, 1.09rem + .45vw, 1.4375rem);
  --sb-t-h4:    clamp(1.125rem, 1.06rem + .3vw, 1.3125rem);
  --sb-t-h3:    clamp(1.375rem, 1.24rem + .6vw, 1.75rem);
  --sb-t-h2:    clamp(1.75rem, 1.5rem + 1.1vw, 2.5rem);
  --sb-t-h1:    clamp(2.125rem, 1.72rem + 1.8vw, 3.5rem);
  --sb-t-heroe: clamp(2.5rem, 1.4rem + 5.4vw, 6.25rem);

  --sb-alto-lectura: 1.72;
  --sb-alto-titulo:  1.08;

  /* --- Espaciado (paso 4px) ------------------------------------------- */
  --sb-e1:  .25rem;  --sb-e2:  .5rem;   --sb-e3:  .75rem;  --sb-e4: 1rem;
  --sb-e5: 1.5rem;   --sb-e6:  2rem;    --sb-e7:  2.5rem;  --sb-e8: 3rem;
  --sb-e9:  4rem;    --sb-e10: 5.5rem;  --sb-e11: 7rem;    --sb-e12: 9rem;
  --sb-banda-y: clamp(3.5rem, 2rem + 6vw, 7rem);

  /* --- Radios ---------------------------------------------------------- */
  --sb-r-xs: 2px;  --sb-r-s: 6px;  --sb-r-m: 12px;  --sb-r-l: 20px;
  --sb-r-pastilla: 999px;

  /* --- Sombras --------------------------------------------------------- */
  --sb-sombra-1: 0 1px 2px rgba(28,28,26,.05), 0 10px 24px -16px rgba(28,28,26,.22);
  --sb-sombra-2: 0 2px 4px rgba(28,28,26,.05), 0 28px 56px -32px rgba(28,28,26,.3);

  /* --- Retícula -------------------------------------------------------- */
  --sb-ancho:  1160px;
  --sb-medida: 68ch;      /* 65–75 caracteres en Literata */
  --sb-canal:  clamp(1.25rem, 4vw, 3rem);
  --sb-cabecera-alto: 76px;

  /* --- Se reescriben las variables del propio GeneratePress, para que su
         CSS dinámico (botones, menús, enlaces) herede esta paleta. ------ */
  --contrast:   var(--sb-texto);
  --contrast-2: var(--sb-tinta-2);
  --contrast-3: var(--sb-texto-suave);
  --base:       var(--sb-linea);
  --base-2:     var(--sb-tarjeta);
  --base-3:     var(--sb-fondo);
  --accent:     var(--sb-senal);
  --accent-2:   var(--sb-magenta-hondo);
  --accent-3:   var(--sb-turquesa);
}

/* Sin modo oscuro a propósito: la carta náutica es papel. Un "modo noche"
   (fondo negro, marcas rojas atenuadas, como los plotters) queda como
   decisión futura, no como inversión automática de esta paleta. */



/* =========================================================================
   02. BASE Y RITMO
   ========================================================================= */

html { -webkit-text-size-adjust: 100%; }

body,
button, input, select, textarea {
  font-family: var(--sb-lectura);
  font-size: var(--sb-t-base);
}

body {
  background-color: var(--sb-fondo);
  color: var(--sb-texto);
  line-height: var(--sb-alto-lectura);
  font-optical-sizing: auto;
  font-variation-settings: 'opsz' 16;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}

::selection { background: var(--sb-senal-viva); color: #fff; }

h1, h2, h3, h4, h5, h6 {
  font-family: var(--sb-display);
  color: var(--sb-texto);
  line-height: var(--sb-alto-titulo);
  letter-spacing: -.015em;
  text-wrap: balance;
  font-variation-settings: 'wdth' 100, 'wght' 700;
}

h1 { font-size: var(--sb-t-h1); font-variation-settings: 'wdth' 108, 'wght' 720; }
h2 { font-size: var(--sb-t-h2); font-variation-settings: 'wdth' 104, 'wght' 700; }
h3 { font-size: var(--sb-t-h3); font-variation-settings: 'wdth' 100, 'wght' 660; line-height: 1.18; }
h4 { font-size: var(--sb-t-h4); font-variation-settings: 'wdth' 96,  'wght' 640; line-height: 1.25; }
h5, h6 {
  font-family: var(--sb-datos);
  font-size: var(--sb-t-mini);
  letter-spacing: .12em;
  text-transform: uppercase;
  font-weight: 500;
  color: var(--sb-texto-suave);
}

a { color: var(--sb-enlace); text-decoration-thickness: 1px; text-underline-offset: .18em; }
a:hover, a:focus { color: var(--sb-enlace-hover); }

strong, b { font-variation-settings: 'wght' 640; }

code, kbd, samp, pre { font-family: var(--sb-datos); font-size: .9em; }

hr, .wp-block-separator {
  border: 0;
  border-top: 1px solid var(--sb-linea);
  margin-block: var(--sb-e8);
  opacity: 1;
}

/* Botones: GeneratePress los pinta de amarillo por defecto. */
button:not(.menu-toggle),
html input[type="button"],
input[type="reset"],
input[type="submit"],
.button,
a.button,
.wp-block-button__link,
a.wp-block-button__link:not(.has-background) {
  font-family: var(--sb-display);
  font-size: var(--sb-t-peq);
  font-weight: 400;
  font-variation-settings: 'wdth' 92, 'wght' 620;
  letter-spacing: .02em;
  color: var(--sb-espuma);
  background-color: var(--sb-petroleo);
  border: 1px solid var(--sb-petroleo);
  border-radius: var(--sb-r-pastilla);
  padding: .7em 1.5em;
  line-height: 1.2;
  transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}

button:not(.menu-toggle):hover,
html input[type="button"]:hover,
input[type="reset"]:hover,
input[type="submit"]:hover,
a.button:hover,
a.button:focus,
a.wp-block-button__link:not(.has-background):hover,
a.wp-block-button__link:not(.has-background):focus {
  color: var(--sb-blanco);
  background-color: var(--sb-senal);
  border-color: var(--sb-senal);
}


/* =========================================================================
   03. CABECERA, NAVEGACIÓN Y MENÚ MÓVIL
   ========================================================================= */

/* GP Premium deja .header-wrap en position:absolute sobre el page hero.
   Cuando no hay hero debajo, la cabecera necesita fondo propio o los
   enlaces claros quedan invisibles. */
.header-wrap {
  background-color: var(--sb-abismo);
  transition: background-color .25s ease;
}
.header-wrap:has(+ .page-hero),
body.home .header-wrap { background-color: transparent; }

.header-wrap .site-header,
.site-header { background: transparent; }

body .inside-header {
  padding-block: var(--sb-e4);
  align-items: center;
  gap: var(--sb-e4);
}

/* Marca */
.site-branding .main-title {
  font-family: var(--sb-display);
  font-size: 1.25rem;
  line-height: 1;
  letter-spacing: .01em;
  margin: 0;
}
.site-header .main-title a,
.site-header a {
  color: var(--sb-blanco);
  text-decoration: none;
  font-variation-settings: 'wdth' 78, 'wght' 780;
  text-transform: uppercase;
}
.site-header .main-title a { position: relative; padding-right: .55em; }
.site-header .main-title a::after {
  content: '';
  position: absolute;
  right: 0;
  bottom: .18em;
  width: .3em;
  height: .3em;
  border-radius: 50%;
  background: var(--sb-senal-viva);
}
.site-header a:hover { color: var(--sb-senal-clara); }

/* Menú principal */
.main-navigation,
.main-navigation ul ul { background-color: transparent; }

.main-navigation a,
.main-navigation .menu-toggle,
.main-navigation .menu-bar-items {
  font-family: var(--sb-display);
  font-size: var(--sb-t-mini);
  font-weight: 400;
  font-variation-settings: 'wdth' 84, 'wght' 600;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.main-navigation .main-nav ul li a,
.main-navigation .menu-toggle,
.main-navigation .menu-bar-items { color: rgba(255,255,255,.9); }

.main-navigation .main-nav ul li:not([class*="current-menu-"]):hover > a,
.main-navigation .main-nav ul li:not([class*="current-menu-"]):focus > a,
.main-navigation .main-nav ul li.sfHover:not([class*="current-menu-"]) > a,
.main-navigation .main-nav ul li[class*="current-menu-"] > a {
  color: var(--sb-senal-clara);
  background-color: transparent;
}

.main-navigation .main-nav ul li a { padding-inline: .9em; }

/* Submenús: tarjeta oscura, no bloque plano */
.main-navigation ul ul {
  background-color: var(--sb-fosa);
  border: 1px solid rgba(255,255,255,.1);
  border-radius: var(--sb-r-m);
  box-shadow: var(--sb-sombra-2);
  padding-block: var(--sb-e2);
  width: 15em;
  overflow: hidden;
}
.main-navigation ul ul li a {
  text-transform: none;
  letter-spacing: .01em;
  font-size: var(--sb-t-peq);
  font-variation-settings: 'wdth' 95, 'wght' 500;
  padding-block: .55em;
  line-height: 1.35;
}
.main-navigation ul ul li:not([class*="current-menu-"]):hover > a {
  background-color: rgba(255,255,255,.06);
}

/* Navegación pegajosa (GP Premium añade .navigation-stick) */
.main-navigation.navigation-stick,
.main-navigation.navigation-stick .inside-navigation {
  background-color: rgba(5,23,27,.92);
  backdrop-filter: saturate(140%) blur(10px);
  -webkit-backdrop-filter: saturate(140%) blur(10px);
}
.main-navigation.navigation-stick { border-bottom: 1px solid rgba(255,255,255,.1); }

/* Botón hamburguesa */
button.menu-toggle,
button.menu-toggle:hover,
button.menu-toggle:focus {
  background: transparent;
  color: rgba(255,255,255,.92);
  border: 0;
  border-radius: 0;
}
button.menu-toggle:hover { color: var(--sb-senal-clara); }

/* Menú deslizante móvil (GP Premium: #generate-slideout-menu) */
.slideout-navigation.main-navigation,
#generate-slideout-menu.slideout-navigation { background-color: var(--sb-abismo); }

#generate-slideout-menu .inside-navigation { padding-top: var(--sb-e6); }

.slideout-navigation.main-navigation .main-nav ul li a,
#generate-slideout-menu .main-nav ul li a {
  color: var(--sb-espuma);
  font-size: 1.0625rem;
  font-variation-settings: 'wdth' 88, 'wght' 620;
  letter-spacing: .04em;
  border-bottom: 1px solid rgba(255,255,255,.08);
  line-height: 1.35;
  padding-block: .95em;
}
#generate-slideout-menu .main-nav ul ul {
  background: transparent;
  border: 0;
  box-shadow: none;
  border-radius: 0;
  width: auto;
}
#generate-slideout-menu .main-nav ul ul li a {
  color: var(--sb-texto-tenue);
  font-family: var(--sb-lectura);
  font-size: var(--sb-t-peq);
  font-variation-settings: normal;
  letter-spacing: 0;
  text-transform: none;
  padding-left: var(--sb-e5);
}
.slideout-navigation.main-navigation .main-nav ul li:not([class*="current-menu-"]):hover > a,
.slideout-navigation.main-navigation .main-nav ul li:not([class*="current-menu-"]):focus > a,
.slideout-navigation.main-navigation .main-nav ul li[class*="current-menu-"] > a {
  color: var(--sb-senal-clara);
  background-color: rgba(255,255,255,.04);
}
.slideout-navigation button.slideout-exit,
.slideout-navigation button.slideout-exit:hover { color: var(--sb-espuma); background: transparent; }
.slideout-overlay { background-color: rgba(5,23,27,.6); }


/* =========================================================================
   04. PAGE HERO (páginas y entradas interiores)
   El elemento de GP Premium trae una foto de fondo por CSS en línea; se
   sustituye por una banda tipográfica que funciona sin imágenes.
   ========================================================================= */

body .page-hero {
  background-image: none;
  background-color: var(--sb-abismo);
  background-image:
    radial-gradient(120% 90% at 12% -20%, rgba(226,85,31,.20) 0%, rgba(226,85,31,0) 55%),
    linear-gradient(178deg, var(--sb-petroleo) 0%, var(--sb-fosa) 55%, var(--sb-abismo) 100%);
  color: var(--sb-banda-texto);
  text-align: left;
  padding: calc(var(--sb-cabecera-alto) + var(--sb-e9)) var(--sb-canal) var(--sb-e9);
  position: relative;
  overflow: hidden;
}

/* Filete de señal a la izquierda: la única marca gráfica del encabezado. */
body .page-hero::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 3px;
  background: linear-gradient(180deg, var(--sb-senal-viva) 0%, var(--sb-turquesa) 60%, transparent 100%);
}

body .page-hero .inside-page-hero.grid-container {
  max-width: var(--sb-ancho);
  margin-inline: auto;
  padding: 0;
}

body .page-hero h1,
body .page-hero h2,
body .page-hero h3 { color: var(--sb-banda-titulo); }

body .page-hero h1 {
  font-size: var(--sb-t-h1);
  font-variation-settings: 'wdth' 88, 'wght' 740;
  letter-spacing: -.02em;
  max-width: 20ch;
  margin: 0;
}
body .page-hero h2 {
  font-family: var(--sb-lectura);
  font-size: var(--sb-t-lede);
  font-variation-settings: 'wght' 400;
  letter-spacing: 0;
  color: var(--sb-banda-texto);
  max-width: 56ch;
  margin-top: var(--sb-e4);
  line-height: 1.5;
}
body .page-hero h3 { margin-top: var(--sb-e6); }

body .page-hero a.button {
  background: transparent;
  border-color: rgba(255,255,255,.35);
  color: var(--sb-blanco);
  margin-right: var(--sb-e2);
}
body .page-hero a.button:hover,
body .page-hero a.button:focus {
  background: var(--sb-senal);
  border-color: var(--sb-senal);
}

/* En la portada el hero lo pone el contenido (bloques .sb-heroe). */
body.home .page-hero,
body.home .entry-header { display: none; }


/* =========================================================================
   05. CONTENEDORES Y RETÍCULA
   ========================================================================= */

body.one-container .container,
body.one-container .site-content { background-color: transparent; }

body.one-container:not(.home) .site-content {
  padding: var(--sb-e9) var(--sb-canal) var(--sb-e10);
}

/* Con page hero, el hero ya deja el aire superior. */
body.one-container:not(.home):has(.page-hero) .site-content { padding-top: var(--sb-e8); }

.grid-container { max-width: var(--sb-ancho); }

/* La portada gobierna sus propios anchos, sección por sección. */
body.home #page.container { max-width: 100%; padding: 0; }
body.home .site-content { padding: 0; }
body.home .inside-article { padding: 0; }
body.home .entry-content { margin-top: 0; }
body.home .entry-content { max-width: 100%; }


/* =========================================================================
   06. TIPOGRAFÍA DE ARTÍCULO
   Medida de 65–75 caracteres, jerarquía clara y ritmo vertical estable
   para textos de 2.000–4.000 palabras.
   ========================================================================= */

body.single .entry-content > *,
body.page:not(.home) .entry-content > *,
body.single .entry-header,
body.page:not(.home) .entry-header {
  max-width: var(--sb-medida);
  margin-inline: auto;
}

body.single .entry-content > .alignwide,
body.page:not(.home) .entry-content > .alignwide,
body.single .entry-content > .wp-block-table,
body.page:not(.home) .entry-content > .wp-block-table,
body.single .entry-content > #rank-math-faq,
body.page:not(.home) .entry-content > #rank-math-faq {
  max-width: min(100%, 900px);
}

body:not(.home) .entry-content > * + * { margin-top: var(--sb-e5); }

body:not(.home) .entry-content p {
  margin: 0 0 var(--sb-e5);
  hanging-punctuation: first last;
}

body:not(.home) .entry-content > h2,
body:not(.home) .entry-content > h3,
body:not(.home) .entry-content > h4 { margin-bottom: var(--sb-e4); }

body:not(.home) .entry-content h2 {
  margin-top: var(--sb-e9);
  padding-top: var(--sb-e5);
  border-top: 1px solid var(--sb-linea);
  position: relative;
  font-variation-settings: 'wdth' 92, 'wght' 720;
  letter-spacing: -.02em;
}
body:not(.home) .entry-content h2::before {
  content: '';
  position: absolute;
  top: -1px; left: 0;
  width: 2.5rem;
  height: 2px;
  background: var(--sb-senal-viva);
}

body:not(.home) .entry-content h3 {
  margin-top: var(--sb-e7);
  color: var(--sb-turquesa-hondo);
  font-variation-settings: 'wdth' 98, 'wght' 660;
}
@media (prefers-color-scheme: dark) {
  body:not(.home) .entry-content h3 { color: #7FCFCB; }
}

body:not(.home) .entry-content h4 {
  margin-top: var(--sb-e6);
  font-family: var(--sb-datos);
  font-size: var(--sb-t-peq);
  font-weight: 500;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--sb-texto-suave);
}

/* Primer párrafo: entradilla. Vale como resumen citable (BLUF). */
body.single .entry-content > p:first-of-type {
  font-size: var(--sb-t-lede);
  line-height: 1.55;
  color: var(--sb-texto);
  font-variation-settings: 'wght' 420;
}

body:not(.home) .inside-article .entry-content a {
  color: var(--sb-enlace);
  text-decoration: underline;
  text-decoration-color: color-mix(in srgb, var(--sb-enlace) 40%, transparent);
  text-decoration-thickness: 1px;
  text-underline-offset: .18em;
  transition: color .15s ease, text-decoration-color .15s ease;
}
body:not(.home) .inside-article .entry-content a:hover,
body:not(.home) .inside-article .entry-content a:focus {
  color: var(--sb-enlace-hover);
  text-decoration-color: currentColor;
}

/* Metadatos de entrada */
.entry-meta,
.entry-meta a {
  font-family: var(--sb-datos);
  font-size: var(--sb-t-mini);
  letter-spacing: .04em;
  color: var(--sb-texto-tenue);
  text-transform: none;
}
.entry-meta a { text-decoration: none; border-bottom: 1px solid var(--sb-linea); }
.entry-meta a:hover { color: var(--sb-acento); border-bottom-color: currentColor; }
.entry-header .entry-meta { margin-bottom: var(--sb-e6); }
footer.entry-meta { margin-top: var(--sb-e8); padding-top: var(--sb-e4); border-top: 1px solid var(--sb-linea); }


/* =========================================================================
   07. TABLAS, CITAS, LISTAS Y AVISOS
   ========================================================================= */

body:not(.home) .entry-content ul,
body:not(.home) .entry-content ol { margin: 0 0 var(--sb-e5); padding-left: 1.35em; }
body:not(.home) .entry-content li { margin-bottom: var(--sb-e3); }
body:not(.home) .entry-content li::marker { color: var(--sb-senal-viva); font-variation-settings: 'wght' 700; }
body:not(.home) .entry-content ul ul,
body:not(.home) .entry-content ol ol { margin-top: var(--sb-e3); margin-bottom: 0; }

body:not(.home) .entry-content blockquote,
body:not(.home) .entry-content .wp-block-quote {
  margin: var(--sb-e7) 0;
  padding: 0 0 0 var(--sb-e5);
  border-left: 3px solid var(--sb-senal-viva);
  font-size: var(--sb-t-lede);
  line-height: 1.5;
  font-style: normal;
  color: var(--sb-texto);
}
body:not(.home) .entry-content blockquote p:last-child { margin-bottom: 0; }
body:not(.home) .entry-content blockquote cite,
body:not(.home) .entry-content .wp-block-quote cite {
  display: block;
  margin-top: var(--sb-e3);
  font-family: var(--sb-datos);
  font-size: var(--sb-t-mini);
  font-style: normal;
  letter-spacing: .04em;
  color: var(--sb-texto-tenue);
}

/* Tablas: registro de instrumento, cifras alineadas y tabulares. */
body:not(.home) .entry-content .wp-block-table,
body:not(.home) .entry-content figure.wp-block-table { overflow-x: auto; }

body:not(.home) .entry-content table {
  width: 100%;
  border-collapse: collapse;
  font-family: var(--sb-display);
  font-size: var(--sb-t-peq);
  font-variation-settings: 'wdth' 96, 'wght' 450;
  font-variant-numeric: tabular-nums;
  background: var(--sb-tarjeta);
  border: 1px solid var(--sb-linea);
  border-radius: var(--sb-r-s);
  overflow: hidden;
}
body:not(.home) .entry-content th {
  font-family: var(--sb-datos);
  font-size: var(--sb-t-micro);
  font-weight: 500;
  letter-spacing: .1em;
  text-transform: uppercase;
  text-align: left;
  color: var(--sb-banda-texto);
  background: var(--sb-petroleo);
  padding: .85em 1em;
  border: 0;
}
body:not(.home) .entry-content td {
  padding: .8em 1em;
  border: 0;
  border-top: 1px solid var(--sb-linea-suave);
  vertical-align: top;
}
body:not(.home) .entry-content tbody tr:nth-child(even) td {
  background: color-mix(in srgb, var(--sb-linea-suave) 40%, transparent);
}

body:not(.home) .entry-content .wp-block-table figcaption,
body:not(.home) .entry-content figcaption {
  font-family: var(--sb-datos);
  font-size: var(--sb-t-mini);
  color: var(--sb-texto-tenue);
  margin-top: var(--sb-e3);
}

/* Grupo de Gutenberg con fondo: caja de aviso o de resumen. */
body:not(.home) .entry-content .wp-block-group.has-background {
  border-radius: var(--sb-r-m);
  padding: var(--sb-e6);
  border: 1px solid var(--sb-linea);
}

body:not(.home) .entry-content pre {
  background: var(--sb-fosa);
  color: var(--sb-espuma);
  padding: var(--sb-e5);
  border-radius: var(--sb-r-s);
  overflow-x: auto;
}
body:not(.home) .entry-content :not(pre) > code {
  background: color-mix(in srgb, var(--sb-turquesa) 14%, transparent);
  padding: .15em .4em;
  border-radius: var(--sb-r-xs);
}

body:not(.home) .entry-content img,
.wp-block-image img { border-radius: var(--sb-r-s); height: auto; }


/* =========================================================================
   08. BLOQUE FAQ DE RANK MATH
   Marcado real: #rank-math-faq .rank-math-list .rank-math-list-item >
   h3.rank-math-question + .rank-math-answer
   ========================================================================= */

#rank-math-faq.rank-math-block {
  margin-top: var(--sb-e7);
  border-top: 1px solid var(--sb-linea);
}

/* El bloque se sirve como acordeón: un <input type="checkbox"> invisible
   sobre el <h3> y las respuestas con max-height:0. En un medio de consulta
   las respuestas se leen siempre, así que se desactiva el plegado. */
#rank-math-faq .rank-math-list-item { position: relative; padding: var(--sb-e5) 0; border-bottom: 1px solid var(--sb-linea); }
#rank-math-faq .rank-math-list-item input { display: none; }

#rank-math-faq .rank-math-list-item h3.rank-math-question,
h3.rank-math-question {
  margin: 0 0 var(--sb-e3);
  padding: 0 0 0 1.9rem;
  background: transparent;
  cursor: default;
  position: relative;
  font-family: var(--sb-display);
  font-size: var(--sb-t-h4) !important;
  font-weight: 400 !important;
  font-variation-settings: 'wdth' 96, 'wght' 660;
  line-height: 1.3;
  color: var(--sb-texto);
}

/* El triángulo del plugin se reemplaza por un rombo de señal. */
#rank-math-faq .rank-math-list-item h3.rank-math-question::before,
h3.rank-math-question::before {
  content: '';
  position: absolute;
  left: .3rem;
  top: .55em;
  width: .55rem;
  height: .55rem;
  margin: 0;
  border: 0;
  border-radius: 1px;
  background: var(--sb-senal-viva);
  transform: rotate(45deg);
}
#rank-math-faq .rank-math-list-item input:checked + h3.rank-math-question::before { transform: rotate(45deg); }

#rank-math-faq .rank-math-answer,
#rank-math-faq .rank-math-list-item input:checked + h3 ~ .rank-math-answer {
  max-height: none;
  overflow: visible;
  padding: 0 0 0 1.9rem;
  color: var(--sb-texto-suave);
}
.rank-math-answer p { margin-bottom: var(--sb-e3); }
.rank-math-answer p:last-child { margin-bottom: 0; }


/* =========================================================================
   09. ARCHIVOS Y TARJETAS
   En los archivos de categoría GeneratePress imprime un <article> por
   entrada dentro de .site-main; se convierte en una retícula de fichas.
   ========================================================================= */

body.archive .site-main,
body.blog .site-main,
body.search-results .site-main {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 19rem), 1fr));
  gap: var(--sb-e5);
  align-items: start;
}

body.archive .site-main > .page-header,
body.blog .site-main > .page-header,
body.archive .site-main > .paging-navigation,
body.blog .site-main > .paging-navigation,
body.search-results .site-main > .paging-navigation { grid-column: 1 / -1; }

body.archive .site-main > article,
body.blog .site-main > article,
body.search-results .site-main > article { margin: 0; padding: 0; }

body.archive .site-main .inside-article,
body.blog .site-main .inside-article,
body.search-results .site-main .inside-article {
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: var(--sb-e3);
  background: var(--sb-tarjeta);
  border: 1px solid var(--sb-linea);
  border-radius: var(--sb-r-m);
  padding: var(--sb-e5);
  position: relative;
  overflow: hidden;
  transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
body.archive .site-main .inside-article::before,
body.blog .site-main .inside-article::before {
  content: '';
  position: absolute;
  inset: 0 auto auto 0;
  height: 2px;
  width: 100%;
  background: var(--sb-senal-viva);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .35s cubic-bezier(.2,.7,.3,1);
}
body.archive .site-main .inside-article:hover,
body.blog .site-main .inside-article:hover,
body.archive .site-main .inside-article:focus-within {
  border-color: var(--sb-linea-fuerte);
  transform: translateY(-2px);
  box-shadow: var(--sb-sombra-1);
}
body.archive .site-main .inside-article:hover::before,
body.blog .site-main .inside-article:hover::before,
body.archive .site-main .inside-article:focus-within::before { transform: scaleX(1); }

body.archive .site-main .entry-header,
body.blog .site-main .entry-header { margin: 0; max-width: none; }

body.archive .entry-title,
body.blog .entry-title,
body.search-results .entry-title {
  font-size: var(--sb-t-h4);
  line-height: 1.22;
  margin: 0 0 var(--sb-e2);
  font-variation-settings: 'wdth' 94, 'wght' 680;
}
body.archive .entry-title a,
body.blog .entry-title a,
body.search-results .entry-title a { color: var(--sb-texto); text-decoration: none; }
body.archive .entry-title a:hover,
body.blog .entry-title a:hover { color: var(--sb-acento); }

body.archive .entry-header .entry-meta,
body.blog .entry-header .entry-meta,
body.search-results .entry-header .entry-meta { margin-bottom: 0; }

body.archive .entry-summary,
body.blog .entry-summary,
body.archive .entry-summary p,
body.blog .entry-summary p {
  font-size: var(--sb-t-peq);
  line-height: 1.6;
  color: var(--sb-texto-suave);
  margin: 0;
  flex: 1 1 auto;
}
body.archive .entry-summary p,
body.blog .entry-summary p { margin: 0; }

a.read-more {
  display: inline-block;
  margin-top: var(--sb-e2);
  font-family: var(--sb-datos);
  font-size: var(--sb-t-mini);
  letter-spacing: .04em;
  color: var(--sb-acento);
  text-decoration: none;
  border-bottom: 1px solid currentColor;
}

body.archive .site-main footer.entry-meta,
body.blog .site-main footer.entry-meta {
  margin: 0;
  padding-top: var(--sb-e3);
  border-top: 1px solid var(--sb-linea-suave);
  font-size: var(--sb-t-micro);
}

/* Paginación */
.paging-navigation .nav-links,
.nav-links { display: flex; flex-wrap: wrap; gap: var(--sb-e2); align-items: center; }
.paging-navigation .page-numbers {
  font-family: var(--sb-datos);
  font-size: var(--sb-t-mini);
  padding: .5em .85em;
  border: 1px solid var(--sb-linea);
  border-radius: var(--sb-r-s);
  text-decoration: none;
  color: var(--sb-texto-suave);
}
.paging-navigation .page-numbers.current,
.paging-navigation .page-numbers:hover {
  background: var(--sb-petroleo);
  border-color: var(--sb-petroleo);
  color: var(--sb-espuma);
}

/* Navegación entre entradas */
.post-navigation .nav-previous a,
.post-navigation .nav-next a { text-decoration: none; font-family: var(--sb-display); }


/* =========================================================================
   10. PIE DE PÁGINA
   ========================================================================= */

.site-footer { background-color: var(--sb-abismo); color: var(--sb-banda-texto); }

.footer-widgets { background-color: transparent; }
.footer-widgets-container { padding: var(--sb-e9) var(--sb-canal) var(--sb-e7); }
.inside-footer-widgets { gap: var(--sb-e6); }

.site-footer .widget-title,
.footer-widgets .widget-title {
  font-family: var(--sb-datos);
  font-size: var(--sb-t-micro);
  font-weight: 500;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--sb-turquesa);
  margin-bottom: var(--sb-e4);
}
.site-footer p,
.site-footer li {
  font-size: var(--sb-t-peq);
  line-height: 1.6;
  color: var(--sb-banda-texto);
}
.site-footer p strong { color: var(--sb-blanco); }
.site-footer a { color: var(--sb-espuma); text-decoration: none; border-bottom: 1px solid var(--sb-banda-linea); }
.site-footer a:hover { color: var(--sb-senal-clara); border-bottom-color: currentColor; }
.site-footer ul { list-style: none; padding: 0; margin: 0; }
.site-footer li + li { margin-top: var(--sb-e2); }

.site-info {
  border-top: 1px solid var(--sb-banda-linea);
  background: transparent;
}
.inside-site-info {
  padding: var(--sb-e5) var(--sb-canal);
  font-family: var(--sb-datos);
  font-size: var(--sb-t-micro);
  letter-spacing: .06em;
  color: var(--sb-texto-tenue);
}
.site-info .copyright-bar { color: inherit; }


/* =========================================================================
   11. PORTADA — bloques .sb-*
   Cada sección es una retícula de tres columnas: canal, contenido, canal.
   Los hijos caen solos en la columna de contenido; .sb-completo se sale a
   sangre sin necesitar alignfull.
   ========================================================================= */

.sb-seccion {
  display: grid;
  grid-template-columns:
    [full-start] minmax(var(--sb-canal), 1fr)
    [content-start] minmax(0, var(--sb-ancho)) [content-end]
    minmax(var(--sb-canal), 1fr) [full-end];
  padding-block: var(--sb-banda-y);
  border-top: 1px solid var(--sb-linea);
}
.sb-seccion > * { grid-column: content; margin-block: 0; max-width: none; }
.sb-seccion > .sb-completo { grid-column: full; }

/* Rótulos y títulos de sección --------------------------------------- */
.sb-kicker {
  font-family: var(--sb-datos);
  font-size: var(--sb-t-micro);
  font-weight: 500;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--sb-turquesa-hondo);
  margin: 0 0 var(--sb-e3);
  display: flex;
  align-items: center;
  gap: .7em;
}
.sb-kicker::before {
  content: '';
  width: 1.6rem;
  height: 2px;
  background: var(--sb-senal-viva);
  flex: none;
}
@media (prefers-color-scheme: dark) { .sb-kicker { color: var(--sb-turquesa); } }

.sb-titulo {
  font-size: var(--sb-t-h2);
  margin: 0 0 var(--sb-e4);
  max-width: 20ch;
  font-variation-settings: 'wdth' 96, 'wght' 720;
  letter-spacing: -.025em;
}

.sb-lede {
  font-size: var(--sb-t-lede);
  line-height: 1.5;
  color: var(--sb-texto-suave);
  max-width: 56ch;
  margin: 0 0 var(--sb-e6);
}

.sb-seccion > .sb-pie {
  margin-top: var(--sb-e6);
  font-family: var(--sb-datos);
  font-size: var(--sb-t-mini);
  letter-spacing: .04em;
}
.sb-pie a { color: var(--sb-acento); text-decoration: none; border-bottom: 1px solid currentColor; }
.sb-lede + .sb-pie { margin-top: 0; }

/* --- Hero ------------------------------------------------------------- */
.sb-heroe {
  background-color: var(--sb-abismo);
  background-image:
    radial-gradient(100% 80% at 8% -10%, rgba(226,85,31,.22) 0%, rgba(226,85,31,0) 58%),
    linear-gradient(176deg, #10454C 0%, var(--sb-fosa) 52%, var(--sb-abismo) 100%);
  color: var(--sb-banda-texto);
  border-top: 0;
  padding-block: calc(var(--sb-cabecera-alto) + var(--sb-e9)) var(--sb-e9);
  position: relative;
  overflow: hidden;
}
.sb-heroe::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 3px;
  background: linear-gradient(180deg, var(--sb-senal-viva) 0%, var(--sb-turquesa) 55%, transparent 100%);
}
.sb-heroe .sb-kicker { color: var(--sb-turquesa); }

.sb-heroe__titulo {
  font-family: var(--sb-display);
  font-size: var(--sb-t-heroe);
  line-height: .92;
  letter-spacing: -.035em;
  color: var(--sb-blanco);
  margin: 0 0 var(--sb-e6);
  text-wrap: nowrap;
}
/* La firma de la casa: el titular se comprime al descender, como el
   volumen de un gas al bajar (Boyle). Eje wdth de Archivo, 3 pasos. */
.sb-heroe__titulo span {
  display: block;
  animation: sb-emerge .8s cubic-bezier(.2,.7,.3,1) backwards;
}
.sb-heroe__l1 { font-variation-settings: 'wdth' 122, 'wght' 560; color: #EAF3F0; animation-delay: .05s; }
.sb-heroe__l2 { font-variation-settings: 'wdth' 96,  'wght' 680; color: #BFD8D4; animation-delay: .18s; }
.sb-heroe__l3 { font-variation-settings: 'wdth' 70,  'wght' 800; color: var(--sb-senal-clara); animation-delay: .31s; }

@keyframes sb-emerge {
  from { opacity: 0; transform: translateY(.35em); }
  to   { opacity: 1; transform: none; }
}

.sb-heroe__deck {
  font-size: var(--sb-t-lede);
  line-height: 1.55;
  color: var(--sb-banda-texto);
  max-width: 54ch;
  margin: 0 0 var(--sb-e6);
}

.sb-acciones { display: flex; flex-wrap: wrap; gap: var(--sb-e3); margin: 0; }
.sb-acciones a {
  display: inline-block;
  font-family: var(--sb-display);
  font-size: var(--sb-t-peq);
  font-variation-settings: 'wdth' 92, 'wght' 620;
  letter-spacing: .02em;
  text-decoration: none;
  padding: .75em 1.6em;
  border-radius: var(--sb-r-pastilla);
  border: 1px solid rgba(255,255,255,.35);
  color: var(--sb-blanco);
  transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}
.sb-acciones a:first-child { background: var(--sb-senal); border-color: var(--sb-senal); }
.sb-acciones a:hover,
.sb-acciones a:focus { background: var(--sb-blanco); border-color: var(--sb-blanco); color: var(--sb-abismo); }

/* --- Manifiesto ------------------------------------------------------- */
.sb-manifiesto { border-top: 0; }
.sb-principios {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--sb-e6);
  margin: 0;
}
.sb-principio { margin: 0; }
.sb-principio h3 {
  font-size: var(--sb-t-h4);
  margin: 0 0 var(--sb-e2);
  padding-top: var(--sb-e3);
  border-top: 2px solid var(--sb-senal-viva);
  font-variation-settings: 'wdth' 92, 'wght' 680;
}
.sb-principio p { margin: 0; color: var(--sb-texto-suave); font-size: var(--sb-t-peq); line-height: 1.6; }

/* --- Matriz de secciones (la firma estructural: 9 celdas, como una
       tabla de buceo) ------------------------------------------------- */
.sb-matriz {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1px;
  background: var(--sb-linea);
  border: 1px solid var(--sb-linea);
  border-radius: var(--sb-r-m);
  overflow: hidden;
  margin: 0;
}
.sb-celda {
  margin: 0;
  background: var(--sb-tarjeta);
  padding: var(--sb-e5);
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--sb-e2);
  transition: background-color .2s ease;
}
.sb-celda::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: var(--sb-senal-viva);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .35s cubic-bezier(.2,.7,.3,1);
}
.sb-celda:hover,
.sb-celda:focus-within { background: var(--sb-tarjeta-2); }
.sb-celda:hover::before,
.sb-celda:focus-within::before { transform: scaleX(1); }

.sb-celda h3 {
  margin: 0;
  font-size: var(--sb-t-h4);
  font-variation-settings: 'wdth' 92, 'wght' 680;
  line-height: 1.2;
}
.sb-celda h3 a { color: var(--sb-texto); text-decoration: none; }
.sb-celda h3 a::after { content: ''; position: absolute; inset: 0; }
.sb-celda:hover h3 a { color: var(--sb-acento); }
.sb-celda p {
  margin: 0;
  font-size: var(--sb-t-peq);
  line-height: 1.55;
  color: var(--sb-texto-suave);
}

/* --- Pilares ---------------------------------------------------------- */
.sb-pilares { background: var(--sb-fondo-2); }
.sb-lista-pilares {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  margin: 0;
  border-top: 1px solid var(--sb-linea);
}
.sb-pilar {
  margin: 0;
  padding: var(--sb-e5) 0;
  border-bottom: 1px solid var(--sb-linea);
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--sb-e1);
  align-content: start;
  transition: padding-left .25s ease;
}
.sb-pilar:hover { padding-left: var(--sb-e3); }
.sb-pilar__seccion {
  font-family: var(--sb-datos);
  font-size: var(--sb-t-micro);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--sb-texto-tenue);
  margin: 0;
}
.sb-pilar h3 {
  margin: 0;
  font-size: var(--sb-t-h4);
  font-variation-settings: 'wdth' 94, 'wght' 680;
  line-height: 1.2;
}
.sb-pilar h3 a { color: var(--sb-texto); text-decoration: none; }
.sb-pilar h3 a::after { content: ''; position: absolute; inset: 0; }
.sb-pilar:hover h3 a { color: var(--sb-acento); }
.sb-pilar p:last-child {
  margin: 0;
  font-size: var(--sb-t-peq);
  line-height: 1.55;
  color: var(--sb-texto-suave);
}

/* --- Destinos --------------------------------------------------------- */
.sb-rejilla-destinos {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--sb-e4);
  margin: 0;
}
.sb-destino {
  margin: 0;
  background: var(--sb-tarjeta);
  border: 1px solid var(--sb-linea);
  border-left: 3px solid var(--sb-turquesa);
  border-radius: var(--sb-r-s);
  padding: var(--sb-e4) var(--sb-e5);
  position: relative;
  transition: border-left-color .2s ease, transform .2s ease, box-shadow .2s ease;
}
.sb-destino:hover,
.sb-destino:focus-within {
  border-left-color: var(--sb-senal-viva);
  transform: translateY(-2px);
  box-shadow: var(--sb-sombra-1);
}
.sb-destino h3 {
  margin: 0 0 var(--sb-e1);
  font-size: var(--sb-t-h4);
  font-variation-settings: 'wdth' 94, 'wght' 680;
  line-height: 1.2;
}
.sb-destino h3 a { color: var(--sb-texto); text-decoration: none; }
.sb-destino h3 a::after { content: ''; position: absolute; inset: 0; }
.sb-destino:hover h3 a { color: var(--sb-acento); }
.sb-destino__pais {
  margin: 0 0 var(--sb-e2);
  font-family: var(--sb-datos);
  font-size: var(--sb-t-micro);
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--sb-texto-tenue);
}
.sb-destino p:last-child {
  margin: 0;
  font-size: var(--sb-t-peq);
  line-height: 1.5;
  color: var(--sb-texto-suave);
}

/* --- Autoridad (E-E-A-T) ---------------------------------------------- */
.sb-autoridad {
  background-color: var(--sb-petroleo);
  background-image: linear-gradient(168deg, var(--sb-petroleo) 0%, var(--sb-fosa) 100%);
  color: var(--sb-banda-texto);
  border-top: 0;
}
.sb-autoridad .sb-kicker { color: var(--sb-turquesa); }
.sb-autoridad .sb-titulo { color: var(--sb-banda-titulo); max-width: 22ch; }
.sb-autoridad p { color: var(--sb-banda-texto); }
.sb-autoridad .sb-lede { color: var(--sb-banda-texto); }

.sb-fuentes {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--sb-e5);
  margin: var(--sb-e6) 0 0;
  padding-top: var(--sb-e6);
  border-top: 1px solid var(--sb-banda-linea);
}
.sb-fuente { margin: 0; }
.sb-fuente dt,
.sb-fuente h3,
.sb-fuente__sigla {
  font-family: var(--sb-datos);
  font-size: var(--sb-t-mini);
  font-weight: 500;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--sb-turquesa);
  margin: 0 0 var(--sb-e1);
}
.sb-fuente p { margin: 0; font-size: var(--sb-t-peq); line-height: 1.55; }

.sb-salidas {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--sb-e4);
  margin: var(--sb-e7) 0 0;
}
.sb-salida {
  margin: 0;
  padding: var(--sb-e5);
  border: 1px solid var(--sb-banda-linea);
  border-radius: var(--sb-r-m);
  background: rgba(255,255,255,.04);
  font-size: var(--sb-t-peq);
  line-height: 1.6;
}
.sb-salida a {
  color: var(--sb-blanco);
  text-decoration: underline;
  text-decoration-color: var(--sb-senal-clara);
  text-decoration-thickness: 2px;
  text-underline-offset: .2em;
}
.sb-salida a:hover { color: var(--sb-senal-clara); }

/* --- Cierre ----------------------------------------------------------- */
.sb-cierre .sb-titulo { max-width: 24ch; }


/* --- Puntos de ruptura de la portada ---------------------------------- */
@media (min-width: 600px) {
  .sb-principios { grid-template-columns: repeat(3, 1fr); }
  .sb-matriz { grid-template-columns: repeat(2, 1fr); }
  .sb-rejilla-destinos { grid-template-columns: repeat(2, 1fr); }
  .sb-fuentes { grid-template-columns: repeat(3, 1fr); }
  .sb-salidas { grid-template-columns: repeat(2, 1fr); }
  .sb-pilar { grid-template-columns: 10rem 1fr; column-gap: var(--sb-e5); }
  .sb-pilar__seccion { grid-row: span 2; padding-top: .35em; }
}

@media (min-width: 900px) {
  .sb-matriz { grid-template-columns: repeat(3, 1fr); }
  .sb-rejilla-destinos { grid-template-columns: repeat(4, 1fr); }
  .sb-heroe__deck { font-size: clamp(1.25rem, 1.05rem + .6vw, 1.5rem); }
  .sb-titulo { font-size: var(--sb-t-h1); }
}


/* =========================================================================
   12. ACCESIBILIDAD, MOVIMIENTO E IMPRESIÓN
   ========================================================================= */

:focus-visible {
  outline: 3px solid var(--sb-acento-grafico);
  outline-offset: 3px;
  border-radius: var(--sb-r-xs);
}
.sb-heroe :focus-visible,
.sb-autoridad :focus-visible,
.site-footer :focus-visible,
.main-navigation :focus-visible,
body .page-hero :focus-visible { outline-color: var(--sb-senal-clara); }

.screen-reader-text.skip-link:focus {
  background: var(--sb-senal);
  color: #fff;
  font-family: var(--sb-display);
  padding: .8em 1.2em;
  border-radius: 0 0 var(--sb-r-s) 0;
  z-index: 100000;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    scroll-behavior: auto !important;
  }
  .sb-heroe__titulo span { animation: none; opacity: 1; transform: none; }
}

@media print {
  .header-wrap, .site-footer, .slideout-navigation, .slideout-overlay,
  body .page-hero::before, .sb-acciones { display: none !important; }
  body { background: #fff; color: #000; font-size: 11pt; }
  body .page-hero { background: none; color: #000; padding: 0 0 1cm; }
  body .page-hero h1, body .page-hero h2 { color: #000; }
  .entry-content > * { max-width: none; }
  .entry-content a::after { content: ' (' attr(href) ')'; font-size: 9pt; word-break: break-all; }
}


/* =========================================================================
   13. IMÁGENES Y MIGAS  (añadido tras poblar el silo de imágenes)
   El sistema se diseñó sin fotos porque no había ninguna. Ahora los 214
   artículos del silo tienen imagen destacada: unos con foto real de la
   biblioteca, otros con portada tipográfica generada. Estas reglas les dan
   sitio sin romper la composición anterior.
   ========================================================================= */

/* --- Migas de pan ------------------------------------------------------ */
.soybuzo-migas {
  font-family: var(--sb-mono, 'IBM Plex Mono', ui-monospace, monospace);
  font-size: .78rem;
  letter-spacing: .04em;
  line-height: 1.5;
  color: var(--sb-texto-tenue);
  margin: 0 0 1.4rem;
  display: flex;
  flex-wrap: wrap;
  gap: .1rem .55rem;
  align-items: baseline;
}
.soybuzo-migas a {
  color: var(--sb-texto-suave);
  text-decoration: none;
  border-bottom: 1px solid transparent;
  transition: color .18s ease, border-color .18s ease;
}
.soybuzo-migas a:hover,
.soybuzo-migas a:focus-visible { color: var(--sb-enlace, var(--sb-turquesa)); border-bottom-color: currentColor; }
.soybuzo-migas-sep { color: var(--sb-senal-viva); font-size: .9em; }
/* El último tramo es el título del artículo: se recorta antes que envolver
   tres líneas en móvil, donde ya está el H1 justo encima. */
.soybuzo-migas [aria-current="page"] {
  max-width: 34ch;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--sb-texto-tenue);
}

/* --- Foto principal del artículo --------------------------------------- */
/* Solo aparece cuando la destacada es una foto real: la portada generada ya
   lleva el título dentro y repetirlo bajo el H1 se lee como un error. */
.soybuzo-foto-principal {
  margin: 0 0 2.4rem;
  position: relative;
}
.soybuzo-foto-principal img {
  display: block;
  width: 100%;
  height: clamp(220px, 42vw, 460px);
  object-fit: cover;
  border-radius: 3px;
  background: var(--sb-tarjeta, var(--sb-petroleo));
}
.soybuzo-foto-principal figcaption {
  font-family: var(--sb-mono, 'IBM Plex Mono', ui-monospace, monospace);
  font-size: .74rem;
  letter-spacing: .03em;
  color: var(--sb-texto-tenue);
  padding-top: .6rem;
  border-top: 1px solid var(--sb-linea-suave);
  margin-top: .7rem;
}

/* --- Tarjetas de archivo ----------------------------------------------- */
/* GeneratePress imprime título, imagen y extracto en ese orden. La imagen es
   el ancla visual de la tarjeta, así que va primero. */
body:not(.home) .inside-article { display: flex; flex-direction: column; }
body:not(.home) .inside-article > .post-image { order: -1; margin: 0 0 1.15rem; }
body:not(.home) .inside-article > .entry-header { order: 0; }
body:not(.home) .inside-article > .entry-summary { order: 1; }
body:not(.home) .inside-article > .entry-meta { order: 2; }

body:not(.home) .post-image img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: 2px;
  transition: transform .5s cubic-bezier(.2,.6,.2,1), opacity .3s ease;
}
body:not(.home) .post-image { overflow: hidden; border-radius: 2px; }
body:not(.home) article:hover .post-image img { transform: scale(1.025); }

@media (prefers-reduced-motion: reduce) {
  body:not(.home) .post-image img,
  body:not(.home) article:hover .post-image img { transition: none; transform: none; }
}

/* --- Limpieza de la tarjeta de archivo ---------------------------------- */
/* GeneratePress vuelca en el pie de cada tarjeta la categoría, la lista entera
   de etiquetas y el enlace de comentarios. En una parrilla de 20 tarjetas eso
   compite con el titular y alarga la tarjeta al doble. En el archivo se deja
   solo la categoría; las etiquetas siguen visibles dentro del artículo. */
body:not(.home) .entry-meta .tags-links,
body:not(.home) .entry-meta .comments-link { display: none; }

body:not(.home) .entry-meta {
  font-family: var(--sb-mono, 'IBM Plex Mono', ui-monospace, monospace);
  font-size: .72rem;
  letter-spacing: .045em;
  text-transform: uppercase;
  color: var(--sb-texto-tenue);
  padding-top: .9rem;
  margin-top: 1.1rem;
  border-top: 1px solid var(--sb-linea-suave);
}
body:not(.home) .entry-meta a { color: var(--sb-texto-suave); text-decoration: none; }
body:not(.home) .entry-meta a:hover { color: var(--sb-enlace, var(--sb-turquesa)); }

/* El extracto se corta a cuatro líneas: todas las tarjetas miden lo mismo y la
   parrilla deja de parecer una escalera. */
body:not(.home) .entry-summary p {
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin-bottom: 0;
}

/* El artículo sí muestra sus etiquetas, pero al final y sin gritar. */
.single .entry-meta .tags-links a {
  display: inline-block;
  padding: .18em .6em;
  margin: .15em .2em .15em 0;
  border: 1px solid var(--sb-linea);
  border-radius: 2px;
  font-size: .92em;
}

/* =========================================================================
   14. PORTADA: LO ÚLTIMO
   Bloque nativo core/latest-posts. Es la única sección dinámica de la portada:
   un medio tiene que mostrar lo recién publicado sin que nadie edite la home.
   ========================================================================= */
.sb-ultimos .wp-block-latest-posts__list {
  list-style: none;
  margin: 2.6rem 0 0;
  padding: 0;
  display: grid;
  gap: 2.2rem 1.9rem;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 268px), 1fr));
}
.sb-ultimos .wp-block-latest-posts__list li { margin: 0; }

.sb-ultimos .wp-block-latest-posts__featured-image {
  display: block;
  margin-bottom: .95rem;
  overflow: hidden;
  border-radius: 2px;
}
.sb-ultimos .wp-block-latest-posts__featured-image img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  transition: transform .5s cubic-bezier(.2,.6,.2,1);
}
.sb-ultimos li:hover .wp-block-latest-posts__featured-image img { transform: scale(1.03); }

.sb-ultimos .wp-block-latest-posts__post-title {
  display: block;
  font-family: var(--sb-titular, 'Archivo', system-ui, sans-serif);
  font-weight: 640;
  font-size: 1.08rem;
  line-height: 1.28;
  letter-spacing: -.008em;
  color: var(--sb-texto);
  text-decoration: none;
  margin-bottom: .45rem;
}
.sb-ultimos .wp-block-latest-posts__post-title:hover { color: var(--sb-enlace, var(--sb-turquesa)); }

.sb-ultimos .wp-block-latest-posts__post-date {
  display: block;
  font-family: var(--sb-mono, 'IBM Plex Mono', ui-monospace, monospace);
  font-size: .7rem;
  letter-spacing: .05em;
  text-transform: uppercase;
  color: var(--sb-texto-tenue);
  margin-bottom: .5rem;
  order: -1;
}
.sb-ultimos .wp-block-latest-posts__post-excerpt {
  font-size: .93rem;
  line-height: 1.6;
  color: var(--sb-texto-suave);
  margin: 0;
}

@media (prefers-reduced-motion: reduce) {
  .sb-ultimos .wp-block-latest-posts__featured-image img,
  .sb-ultimos li:hover .wp-block-latest-posts__featured-image img { transition: none; transform: none; }
}

/* =========================================================================
   15. BITÁCORA DEL LECTOR
   Progreso, seguir leyendo, guardados y perfil. Todo vive en el navegador
   del lector: sin registro, sin cookies de terceros, sin fricción.
   ========================================================================= */

/* --- Barra de progreso del artículo ------------------------------------- */
.sb-progreso {
  position: fixed;
  inset: 0 0 auto 0;
  height: 3px;
  z-index: 9999;
  background: transparent;
  pointer-events: none;
}
.sb-progreso__relleno {
  height: 100%;
  width: 100%;
  transform: scaleX(0);
  transform-origin: 0 50%;
  background: linear-gradient(90deg, var(--sb-turquesa), var(--sb-senal-viva));
  will-change: transform;
}

/* --- Guardar para después ----------------------------------------------- */
.sb-guardar {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  margin: 2.6rem 0 0;
  padding: .72em 1.15em;
  font-family: var(--sb-mono, 'IBM Plex Mono', ui-monospace, monospace);
  font-size: .78rem;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: var(--sb-texto-suave);
  background: transparent;
  border: 1px solid var(--sb-linea);
  border-radius: 2px;
  cursor: pointer;
  transition: border-color .18s ease, color .18s ease, background .18s ease;
}
.sb-guardar:hover { color: var(--sb-texto); border-color: var(--sb-turquesa); }
.sb-guardar__icono {
  width: 12px; height: 15px;
  border: 1.5px solid currentColor;
  border-bottom-color: transparent;
  clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 72%, 0 100%);
}
.sb-guardar--activo {
  color: var(--sb-senal-clara, var(--sb-senal));
  border-color: currentColor;
}
.sb-guardar--activo .sb-guardar__icono { background: currentColor; }

/* --- Aviso efímero ------------------------------------------------------ */
.sb-aviso {
  position: fixed;
  left: 50%; bottom: 1.6rem;
  transform: translateX(-50%);
  z-index: 10000;
  padding: .7em 1.2em;
  border-radius: 3px;
  background: var(--sb-petroleo);
  color: var(--sb-espuma);
  font-family: var(--sb-mono, 'IBM Plex Mono', ui-monospace, monospace);
  font-size: .78rem;
  box-shadow: 0 8px 30px rgba(0,0,0,.35);
  transition: opacity .5s ease, transform .5s ease;
}
.sb-aviso--fuera { opacity: 0; transform: translate(-50%, 8px); }

/* --- Módulo de portada -------------------------------------------------- */
.sb-bitacora[hidden] { display: none !important; }
.sb-bitacora {
  border-top: 1px solid var(--sb-linea-suave);
  border-bottom: 1px solid var(--sb-linea-suave);
}
.sb-bitacora__cabecera { margin-bottom: 1.8rem; }
.sb-bitacora__nota,
.sb-bitacora__bajada {
  font-size: .88rem;
  color: var(--sb-texto-tenue);
  margin: .5rem 0 0;
  max-width: 58ch;
}
.sb-bitacora__cols {
  display: grid;
  gap: 2.4rem 2.6rem;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr));
}
.sb-bitacora__lista { list-style: none; margin: 1rem 0 0; padding: 0; }
.sb-bitacora__item + .sb-bitacora__item { margin-top: .9rem; }

.sb-bitacora__enlace {
  display: grid;
  grid-template-columns: 104px 1fr;
  gap: .95rem;
  align-items: start;
  text-decoration: none;
  color: inherit;
  padding: .55rem;
  margin: -.55rem;
  border-radius: 3px;
  transition: background .18s ease;
}
.sb-bitacora__enlace:hover { background: var(--sb-tarjeta, rgba(46,128,130,.07)); }
.sb-bitacora__img {
  display: block;
  overflow: hidden;
  border-radius: 2px;
  background: var(--sb-linea-suave);
}
.sb-bitacora__img img {
  display: block; width: 100%; height: auto;
  /* 16:9 como las portadas generadas: un recorte 4:3 les cortaba el título. */
  aspect-ratio: 16 / 9; object-fit: cover;
}
.sb-bitacora__seccion {
  display: block;
  font-family: var(--sb-mono, 'IBM Plex Mono', ui-monospace, monospace);
  font-size: .66rem;
  letter-spacing: .07em;
  text-transform: uppercase;
  color: var(--sb-texto-tenue);
  margin-bottom: .25rem;
}
.sb-bitacora__titulo {
  display: block;
  font-family: var(--sb-titular, 'Archivo', system-ui, sans-serif);
  font-weight: 620;
  font-size: .98rem;
  line-height: 1.3;
  color: var(--sb-texto);
}
.sb-bitacora__enlace:hover .sb-bitacora__titulo { color: var(--sb-enlace, var(--sb-turquesa)); }

.sb-bitacora__barra {
  display: block;
  height: 3px;
  margin: .55rem 0 .3rem;
  background: var(--sb-linea-suave);
  border-radius: 2px;
  overflow: hidden;
}
.sb-bitacora__barra-relleno {
  display: block; height: 100%;
  background: var(--sb-senal-viva);
}
.sb-bitacora__pct {
  font-family: var(--sb-mono, 'IBM Plex Mono', ui-monospace, monospace);
  font-size: .68rem;
  color: var(--sb-texto-tenue);
}
.sb-bitacora__perfil {
  margin: 2.2rem 0 0;
  padding-top: 1.4rem;
  border-top: 1px solid var(--sb-linea-suave);
  font-size: 1rem;
  color: var(--sb-texto-suave);
}
.sb-bitacora__perfil strong { color: var(--sb-texto); font-weight: 620; }
.sb-bitacora__sugerencias { margin-top: 1.4rem; }
.sb-bitacora__sugerencias .sb-bitacora__lista {
  display: grid;
  gap: .9rem 1.6rem;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr));
}

@media (prefers-reduced-motion: reduce) {
  .sb-progreso__relleno, .sb-aviso, .sb-bitacora__enlace { transition: none; }
}

/* =========================================================================
   16. CARTA NÁUTICA
   Dirección elegida sobre el lienzo. Papel, tinta, azul de carta y magenta
   de marca; sin degradados. Va al final para ganar por cascada a las reglas
   del hero y las bandas, que nacieron para la paleta oscura.
   ========================================================================= */

/* --- Bandas: de degradado petróleo a recuadro de carta --------------------- */
body .page-hero,
.sb-heroe,
.sb-autoridad {
  background-image: none;
  background-color: var(--sb-agua);
  color: var(--sb-texto-suave);
}
body .page-hero::before,
.sb-heroe::before {
  background: var(--sb-magenta);
  width: 3px;
}
body .page-hero .page-hero-title,
body .page-hero h1,
.sb-heroe__titulo,
.sb-autoridad .sb-titulo,
.sb-autoridad h2 { color: var(--sb-tinta); }
.sb-heroe__l1 { color: var(--sb-tinta); }
.sb-heroe__l2 { color: var(--sb-tinta-2); }
.sb-heroe__l3 { color: var(--sb-magenta); }
.sb-heroe .sb-kicker,
.sb-autoridad .sb-kicker { color: var(--sb-magenta); }
.sb-heroe__deck { color: var(--sb-texto-suave); }

/* La portada entera sobre papel: el hero deja de ser una banda y se funde. */
.home .sb-heroe { background-color: var(--sb-papel); }

/* --- Contornos batimétricos detrás del hero ------------------------------- */
.sb-heroe { position: relative; }
.sb-contornos {
  position: absolute;
  right: 0; top: 0;
  width: min(52vw, 760px);
  height: 100%;
  opacity: .55;
  pointer-events: none;
}
.sb-contornos text { font-family: var(--sb-datos); font-size: 10px; fill: var(--sb-azul-carta); }
@media (max-width: 900px) { .sb-contornos { display: none; } }

/* --- Regla de profundidad: la portada es un descenso ---------------------- */
.home .site-content { position: relative; }
.sb-regla {
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 88px;
  border-right: 1px solid var(--sb-linea);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-end;
  padding: 8rem 12px 4rem 0;
  box-sizing: border-box;
  font-family: var(--sb-datos);
  font-size: var(--sb-t-micro);
  letter-spacing: .08em;
  color: var(--sb-texto-tenue);
  pointer-events: none;
}
.sb-regla span { display: flex; align-items: center; gap: 8px; }
.sb-regla span::after { content: ''; width: 18px; height: 1px; background: var(--sb-azul-carta); }
.sb-regla span:first-child::after { background: var(--sb-magenta); }
.sb-regla b { font-weight: 500; color: var(--sb-tinta); }
@media (max-width: 1100px) { .sb-regla { display: none; } }
@media (min-width: 1101px) { .home .sb-seccion { padding-left: 88px; } }

/* Cada sección lleva su cota. Es texto real en el kicker, no un adorno. */
.sb-cota {
  font-family: var(--sb-datos);
  color: var(--sb-magenta);
  letter-spacing: .16em;
  margin-right: 1em;
}

/* --- Tarjetas y separadores ------------------------------------------------ */
.sb-seccion + .sb-seccion { border-top: 1px solid var(--sb-linea-suave); }
.sb-ultimos .wp-block-latest-posts__featured-image img,
body:not(.home) .post-image img { border: 1px solid var(--sb-linea); }
.sb-guardar--activo { color: var(--sb-magenta); }
.sb-progreso__relleno { background: var(--sb-magenta); }
.sb-bitacora__barra-relleno { background: var(--sb-magenta); }
.sb-secciones .sb-celda,
.sb-matriz > * { background: var(--sb-papel); }

/* --- Cabecera sobre papel ------------------------------------------------- */
/* Nació para fondo petróleo con texto claro; sobre papel el menú desaparecía. */
body .site-header,
body .header-wrap,
body .main-navigation,
body .main-navigation .inside-navigation { background: transparent; }
body .site-header { border-bottom: 1px solid var(--sb-linea); }
body .site-header .main-title a,
body .site-header .main-title a:hover,
body .site-header .main-title a:visited,
body .site-logo,
body .site-branding a { color: var(--sb-tinta); }
body .main-navigation a,
body .main-navigation .menu-toggle,
body .main-navigation .mobile-menu,
body .main-navigation button.menu-toggle { color: var(--sb-texto-suave); }
body .main-navigation a:hover,
body .main-navigation .current-menu-item > a,
body .main-navigation .current-menu-ancestor > a,
body .main-navigation .current_page_item > a { color: var(--sb-magenta); }
body .main-navigation .menu-item-has-children .dropdown-menu-toggle { color: inherit; }
body .main-navigation ul ul { background: var(--sb-papel-claro); border: 1px solid var(--sb-linea); }
body .main-navigation ul ul a { color: var(--sb-tinta); }
body .slideout-navigation,
body .slideout-navigation a { background: var(--sb-papel); color: var(--sb-tinta); }
/* El punto de la marca pasa de naranja a magenta */
body .site-header .main-title::after,
.sb-marca__punto { background: var(--sb-magenta); }

/* Mismos selectores que el CSS del Customizer de GeneratePress, para igualar su
   especificidad: la cabecera oscura los fijaba en blanco y ganaba por peso. */
.main-navigation .main-nav ul li a,
.main-navigation .menu-bar-items,
.main-navigation .menu-bar-items a { color: var(--sb-texto-suave); }
.main-navigation .main-nav ul li > a:hover,
.main-navigation .main-nav ul li:hover > a,
.main-navigation .main-nav ul li[class*="current-menu-"] > a { color: var(--sb-magenta); background-color: transparent; }
.main-navigation ul ul { background-color: var(--sb-papel-claro); border: 1px solid var(--sb-linea); box-shadow: var(--sb-sombra-1); }
.main-navigation ul ul li a { color: var(--sb-tinta); }
.main-navigation ul ul li:not([class*="current-menu-"]):hover > a { background-color: var(--sb-agua-2); }
.main-navigation.navigation-stick .inside-navigation { background-color: rgba(244,239,228,.94); }
.main-navigation.navigation-stick { border-bottom: 1px solid var(--sb-linea); }
button.menu-toggle, button.menu-toggle:focus { color: var(--sb-tinta); background: transparent; }
button.menu-toggle:hover { color: var(--sb-magenta); }
#generate-slideout-menu.slideout-navigation { background-color: var(--sb-papel); }
#generate-slideout-menu .main-nav ul li a { color: var(--sb-tinta); border-color: var(--sb-linea-suave); }
#generate-slideout-menu .main-nav ul li[class*="current-menu-"] > a,
#generate-slideout-menu .main-nav ul li a:hover { color: var(--sb-magenta); }

/* Matriz de secciones sobre papel: el fondo de la rejilla ya no hace de
   separador (en dos columnas el hueco de la última fila quedaba como una losa
   azul). Fondo papel y un hairline por celda. */
.sb-matriz { background: var(--sb-papel); gap: 0; border-color: var(--sb-linea); border-radius: 2px; }
.sb-celda { background: var(--sb-papel-claro); outline: 1px solid var(--sb-linea-suave); outline-offset: -1px; }
.sb-celda:hover, .sb-celda:focus-within { background: var(--sb-agua-2); }
.sb-celda::before { background: var(--sb-magenta); }

/* WordPress envuelve el contenido de cada grupo en .wp-block-group__inner-container.
   Un grupo con display:grid tenía entonces UN solo hijo (el envoltorio) y todas
   sus tarjetas se apilaban dentro de una única celda: la matriz 3x3, los pilares,
   los destinos y los principios nunca formaron columnas en vivo. Con
   display:contents el envoltorio desaparece del layout y las tarjetas pasan a ser
   hijos de la rejilla. No se aplica a .sb-seccion: ahí el envoltorio centra. */
.sb-matriz > .wp-block-group__inner-container,
.sb-lista-pilares > .wp-block-group__inner-container,
.sb-principios > .wp-block-group__inner-container,
.sb-rejilla-destinos > .wp-block-group__inner-container,
.sb-salidas > .wp-block-group__inner-container,
.sb-fuentes > .wp-block-group__inner-container,
.sb-celda > .wp-block-group__inner-container,
.sb-pilar > .wp-block-group__inner-container { display: contents; }

/* El relleno del envoltorio de sección se contagiaba a los envoltorios de las
   tarjetas anidadas (100 px de aire sobre cada destino). Solo la sección lleva
   relleno; los grupos anidados, ninguno. */
.sb-seccion .wp-block-group .wp-block-group__inner-container { padding: 0; margin: 0; max-width: none; }
.sb-destino > .wp-block-group__inner-container { display: contents; }

/* Tarjeta de destino en clave de carta: recuadro hairline, sin borde lateral
   de color ni esquinas redondeadas. El magenta solo aparece al pasar. */
.sb-destino {
  border: 1px solid var(--sb-linea);
  border-left-width: 1px;
  border-radius: 2px;
  background: var(--sb-papel-claro);
  transition: border-color .2s ease, background .2s ease;
}
.sb-destino:hover, .sb-destino:focus-within { border-color: var(--sb-magenta); transform: none; box-shadow: none; background: var(--sb-agua-2); }
.sb-destino__pais { color: var(--sb-magenta); font-family: var(--sb-datos); letter-spacing: .12em; }

/* Barra lateral fuera. GeneratePress la muestra en archivos y entradas con los
   widgets por defecto (buscador, "Entradas recientes" que lista hasta fichas
   noindexadas). Un medio no lleva barra lateral: la columna de lectura manda. */
body .sidebar,
body #right-sidebar,
body #left-sidebar { display: none; }
body #primary,
body .content-area { width: 100%; float: none; }
body .site-content { display: block; }

/* Miniatura en cada celda de la matriz de secciones. Recuadro de carta: hairline,
   sin radio, y la misma desaturación con la que se generaron. */
.sb-celda__img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border: 1px solid var(--sb-linea);
  margin: 0 0 var(--sb-e3);
  background: var(--sb-agua);
}
.sb-celda h3 a::after { inset: 0; }