/* La Dalia — blog (módulo ybc_blog) con la personalidad del tema: aire de revista, títulos
   en Cormorant Garamond (la serif del logotipo), antetítulos en Jost espaciado, el rojo
   dalia solo para la categoría, el estado activo y la acción.
   Todo va bajo body#ybc_blog_page, que comparten todas las páginas del blog (portada,
   categorías y artículo); el blog no pinta nada fuera de ellas. Con el id, estas reglas
   ganan a las del módulo sin tocar sus ficheros.
   Piezas que van con esta hoja:
   - Configuración del módulo: colores YBC_BLOG_CUSTOM_COLOR (#E0192E) y _HOVER (#141414),
     maquetación YBC_BLOG_LAYOUT = large_grid, últimas entradas YBC_BLOG_SIDEBAR_POST_TYPE =
     default (lista) y sin miniaturas bajo el banner (YBC_BLOG_SLIDER_DISPLAY_THUMBNAIL = 0).
   - Override del tema modules/ybc_blog/views/templates/hook/blog_list.tpl: artículo
     destacado con la imagen grande (li.ld-blog-featured) y categoría como antetítulo.
   Tokens compartidos (--ld-red, --ld-ink, --ld-font-serif…) en custom.css. */

/* ==========================================================================
   1. Página: fondo blanco y el mismo ancho que la cabecera
   ========================================================================== */
#ybc_blog_page #wrapper{padding-top:0;background:#fff}
#ybc_blog_page #wrapper > .container{width:auto;max-width:var(--ld-max);padding:0 var(--ld-gutter)}

/* Migas: como las del listado y la ficha */
#ybc_blog_page .breadcrumb{margin:0;padding:22px 0 34px;background:none}
#ybc_blog_page .breadcrumb ol{display:flex;flex-wrap:wrap;align-items:center;gap:9px;margin:0;padding:0}
#ybc_blog_page .breadcrumb li{display:flex;align-items:center;gap:9px;margin:0;
  font:400 11.5px/1 var(--ld-font-sans);letter-spacing:.12em;text-transform:uppercase;color:var(--ld-ink)}
#ybc_blog_page .breadcrumb li::after{content:"/";margin:0;color:#9A9A9E}
#ybc_blog_page .breadcrumb li:last-child::after{content:none}
#ybc_blog_page .breadcrumb li a{color:#9A9A9E;transition:color .18s ease}
#ybc_blog_page .breadcrumb li a:hover{color:var(--ld-red);text-decoration:none}

/* Columna lateral y contenido: un poco más de aire entre ambos */
#ybc_blog_page #content-wrapper > .row > #left-column{padding-right:28px}
#ybc_blog_page #content-wrapper > .row > #right-column{padding-left:28px}
#ybc_blog_page #content-wrapper [class*="ybc_blog_layout_"]{padding:0;background:none;box-shadow:none;border:0}

/* ==========================================================================
   2. Columna lateral
   ========================================================================== */
#ybc_blog_page #left-column .block,
#ybc_blog_page #right-column .block{margin:0 0 48px;padding:0;background:none;box-shadow:none;border:0}
#ybc_blog_page .title_blog{margin:0 0 6px;padding:0 0 14px;border-bottom:1px solid var(--ld-ink);
  font:500 12px/1.3 var(--ld-font-sans);letter-spacing:.24em;text-transform:uppercase;color:var(--ld-ink)}

/* Categorías */
/* La fila entera es el enlace (el módulo ya le pone línea y relleno con
   `#left-column .ybc_block_categories a`): el li va sin línea para no duplicarla */
#ybc_blog_page .ybc_block_categories ul{margin:0;padding:0}
#ybc_blog_page .ybc_block_categories li{margin:0;padding:0;border:0;
  font:400 14px/1.3 var(--ld-font-sans);color:#3C3C43}
#ybc_blog_page #content-wrapper .ybc_block_categories li a{display:block;padding:12px 0;border:0;border-bottom:1px solid #EDEDEF;
  font:inherit;color:#3C3C43;transition:color .18s ease}
#ybc_blog_page #content-wrapper .ybc_block_categories li a:hover{color:var(--ld-red);text-decoration:none}
#ybc_blog_page #content-wrapper .ybc_block_categories li.active > a,
#ybc_blog_page #content-wrapper .ybc_block_categories .children li.active > a{color:var(--ld-red);font-weight:500}

/* "Ver todo": botón contorneado, como "Cargar más" del listado. El módulo lo fija con
   `color:#fff!important` (sidebar.css) y lo pisa con `#left-column .ybc_block_categories a`,
   así que aquí hace falta el doble id y !important en el color. */
#ybc_blog_page .blog_view_all_button{margin-top:22px;text-align:left}
#ybc_blog_page #wrapper .blog_view_all,
#ybc_blog_page #wrapper .view_all_link{display:inline-block;width:auto;padding:12px 26px;border:1px solid var(--ld-ink);border-radius:0;
  background:transparent;color:var(--ld-ink)!important;font:600 11.5px/1 var(--ld-font-sans);letter-spacing:.2em;
  text-transform:uppercase;transition:background .2s ease,color .2s ease}
#ybc_blog_page #wrapper .blog_view_all:hover,
#ybc_blog_page #wrapper .view_all_link:hover{background:var(--ld-ink);color:#fff!important;text-decoration:none}

/* Últimas entradas: lista compacta (miniatura + título en serif). La columna del blog va
   DENTRO de #content-wrapper (el módulo monta sus propias columnas): .ybc_blog_sidebar da
   el peso para ganar a las reglas de las tarjetas de la sección 4. */
#ybc_blog_page .ybc_blog_sidebar .block_content.row{margin:0}
#ybc_blog_page .ybc_blog_sidebar .ybc_blog_content_block{padding:0}
#ybc_blog_page .ybc_blog_sidebar .ybc_blog_content_block_item{display:grid;grid-template-columns:96px minmax(0,1fr);
  gap:14px;align-items:start;margin:0;padding:16px 0;border-bottom:1px solid #EDEDEF;width:auto;float:none}
#ybc_blog_page .ybc_blog_sidebar .ybc_blog_content_block_item .ybc_item_img{display:block;position:relative;
  aspect-ratio:1.85/1;overflow:hidden;margin:0;background:#F5F5F6}
#ybc_blog_page .ybc_blog_sidebar .ybc_blog_content_block_item .ybc_item_img img{position:absolute;inset:0;
  width:100%;height:100%;object-fit:cover}
#ybc_blog_page .ybc_blog_sidebar .ybc_blog_content_block_item .ybc_item_img svg{display:none}
#ybc_blog_page .ybc_blog_sidebar .ybc-blog-latest-post-content{padding:0;margin:0}
#ybc_blog_page #content-wrapper .ybc_blog_sidebar .ybc_title_block{display:block;margin:0;
  font:500 17px/1.2 var(--ld-font-serif);letter-spacing:0;text-transform:none;color:var(--ld-ink)}
#ybc_blog_page .ybc_blog_sidebar .ybc-blog-latest-toolbar{margin-top:6px}
#ybc_blog_page .ybc_blog_sidebar .blog_description,
#ybc_blog_page .ybc_blog_sidebar .ybc-blog-latest-post-content .read_more{display:none}

/* ==========================================================================
   3. Cabecera del listado (portada y categorías)
   ========================================================================== */
/* La cabecera va arriba y el banner debajo (en el HTML del módulo el banner va primero) */
#ybc_blog_page .ybc-blog-wrapper-blog-list{display:flex;flex-direction:column}
#ybc_blog_page .ybc-blog-wrapper-blog-list > h1.page-heading,
#ybc_blog_page .ybc-blog-wrapper-blog-list > .blog-category{order:-3}
#ybc_blog_page .ybc-blog-wrapper-blog-list > .blog-category-desc{order:-2}

#ybc_blog_page .ybc-blog-wrapper-blog-list h1.page-heading{margin:0 0 30px;padding:0 0 24px;border-bottom:1px solid var(--ld-ink);
  font:500 56px/1.02 var(--ld-font-serif);letter-spacing:-.005em;text-transform:none;color:var(--ld-ink);text-wrap:balance}
#ybc_blog_page .blog-category-desc{max-width:680px;margin:-12px 0 36px;
  font:400 16px/1.7 var(--ld-font-sans);color:#555}
#ybc_blog_page .blog-category-desc p{margin:0 0 12px}
#ybc_blog_page .blog-category .ybc_item_img{margin:0 0 28px}
#ybc_blog_page .blog-category .ybc_item_img img{width:100%;height:auto;display:block}

/* Banner (slider del blog): texto grande a la izquierda y foto a la derecha, como el hero
   de la home; sin la tira de miniaturas (desactivada en la configuración) */
#ybc_blog_page .ybc-blog-slider{margin:0 0 64px}
#ybc_blog_page .ybc-blog-slider a.slick-slide{color:var(--ld-ink);text-decoration:none}
#ybc_blog_page .ybc-blog-slider .slider_big_image{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);
  align-items:center;gap:44px}
#ybc_blog_page .ybc-blog-slider .ybc_slider_image{margin:0}
#ybc_blog_page .ybc-blog-slider .ybc_slider_image img{display:block;width:100%;height:auto}
#ybc_blog_page #ybc_slider .slider_big_image .nivo-caption{order:-1;position:static;inset:auto;width:auto;
  margin:0;padding:0;background:none;opacity:1;
  font:500 44px/1.1 var(--ld-font-serif);letter-spacing:0;text-transform:none;color:var(--ld-ink);text-wrap:balance}
#ybc_blog_page #ybc_slider .nivo-caption > span{font:inherit;text-transform:none;color:inherit}
#ybc_blog_page .ybc-blog-slider .slick-dots{position:static;display:flex;justify-content:center;gap:10px;margin:22px 0 0;padding:0}
#ybc_blog_page .ybc-blog-slider .slick-dots li{margin:0;padding:0}
#ybc_blog_page .ybc-blog-slider .slick-dots button{width:9px!important;min-width:9px!important;height:9px;padding:0;
  border:1px solid var(--ld-ink);border-radius:50%;background:transparent;font-size:0}
#ybc_blog_page .ybc-blog-slider .slick-dots .slick-active button{background:var(--ld-red);border-color:var(--ld-red)}

/* Ordenar por: discreto, a la derecha */
#ybc_blog_page #js-post-list-top{display:flex;justify-content:flex-end;margin:0 0 28px}
#ybc_blog_page #js-post-list-top > div{width:auto;max-width:none;flex:none;float:none;padding:0}
#ybc_blog_page #js-post-list-top .total-products{display:none}
#ybc_blog_page #js-post-list-top .col-md-8{display:flex;align-items:center;gap:12px}
#ybc_blog_page #js-post-list-top .sort-by,
#ybc_blog_page #js-post-list-top .products-sort-order{width:auto;max-width:none;flex:none;float:none;padding:0}
#ybc_blog_page #js-post-list-top .sort-by{font:400 12px/1 var(--ld-font-sans);letter-spacing:.14em;text-transform:uppercase;color:#84848B}
/* Alto fijo y sin padding vertical: con line-height 1 la Jost se cortaba por abajo.
   detail_post.css lo fija a 36px con !important */
#ybc_blog_page #content-wrapper select{height:42px!important;padding:0 36px 0 14px;border:1px solid #E4E4E8;border-radius:0;
  background-color:#fff;font:400 13.5px/normal var(--ld-font-sans);color:var(--ld-ink);box-shadow:none}

/* ==========================================================================
   4. Artículos del listado: cuadrícula de revista
   ========================================================================== */
#ybc_blog_page ul.ybc-blog-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:60px 32px;
  margin:0;padding:0;list-style:none}
/* .row trae ::before/::after de clearfix: en una rejilla ocuparían celdas */
#ybc_blog_page ul.ybc-blog-list::before,
#ybc_blog_page ul.ybc-blog-list::after{content:none;display:none}
/* El módulo fija width:100%!important y width:50% a los li (maquetación con flotados);
   en la rejilla cada li llena su celda */
#ybc_blog_page ul.ybc-blog-list > li{width:auto!important;max-width:none;float:none;clear:none;margin:0;padding:0;min-width:0}
#ybc_blog_page ul.ybc-blog-list .post-wrapper{display:flex;flex-direction:column;height:100%;margin:0;padding:0;
  background:none;border:0;box-shadow:none}

/* Foto con el zoom suave de las tarjetas. Las miniaturas del módulo (260×180) traen bandas
   blancas arriba y abajo de hasta 19px (encaja el banner en el cuadro): un marco de 1,85:1
   con object-fit:cover las recorta en todas; a las que no tienen banda solo les quita un filo */
#ybc_blog_page ul.ybc-blog-list .ybc_item_img{position:relative;display:block;aspect-ratio:1.85/1;overflow:hidden;
  margin:0;padding:0;background:#F5F5F6;float:none;width:auto}
#ybc_blog_page ul.ybc-blog-list .ybc_item_img img{position:absolute;inset:0;width:100%;height:100%;max-width:none;
  object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
#ybc_blog_page ul.ybc-blog-list .ybc_item_img svg{display:none}
#ybc_blog_page ul.ybc-blog-list .post-wrapper:hover .ybc_item_img img{transform:scale(1.04)}

#ybc_blog_page ul.ybc-blog-list .ybc-blog-wrapper-content{display:flex;flex:1;float:none;width:auto;margin:0;padding:0}
#ybc_blog_page ul.ybc-blog-list .ybc-blog-wrapper-content-main{display:flex;flex-direction:column;flex:1;padding:22px 0 0}

/* Antetítulo: la categoría, en rojo. El módulo la oculta siempre (display:none en
   sidebar.css y detail_post.css); se muestra solo en las tarjetas del listado */
#ybc_blog_page ul.ybc-blog-list .ybc-blog-sidear-post-meta{display:block;float:none;width:auto;margin:0 0 12px;padding:0}
#ybc_blog_page .ybc-blog-categories{float:none;margin:0;text-align:left;
  font:600 10.5px/1.4 var(--ld-font-sans);letter-spacing:.24em;text-transform:uppercase}
#ybc_blog_page .ybc-blog-categories a{color:var(--ld-red);transition:color .18s ease}
#ybc_blog_page .ybc-blog-categories a:hover{color:var(--ld-ink);text-decoration:none}

/* Título del artículo en serif */
#ybc_blog_page #content-wrapper ul.ybc-blog-list .ybc_title_block{display:block;margin:0;
  font:500 25px/1.18 var(--ld-font-serif);letter-spacing:0;text-transform:none;color:var(--ld-ink);
  text-wrap:pretty;transition:color .18s ease}
#ybc_blog_page .ybc_title_block:hover{color:var(--ld-red);text-decoration:none}

/* Datos (visitas, comentarios): como la marca de las tarjetas de producto */
#ybc_blog_page .post-date,
#ybc_blog_page .ybc-blog-latest-toolbar,
#ybc_blog_page .blog-extra{font:400 10.5px/1.4 var(--ld-font-sans);letter-spacing:.14em;text-transform:uppercase;color:#9A9A9E}
#ybc_blog_page ul.ybc-blog-list .ybc-blog-latest-toolbar{margin:12px 0 0;padding:0}
#ybc_blog_page .ybc-blog-latest-toolbar svg{width:12px;height:12px;fill:currentColor;vertical-align:-1px}

/* Extracto: tres líneas */
#ybc_blog_page #content-wrapper ul.ybc-blog-list .blog_description{margin:14px 0 20px;
  font:400 14.5px/1.65 var(--ld-font-sans);color:#6E6E76}
#ybc_blog_page ul.ybc-blog-list .blog_description p{margin:0;display:-webkit-box;-webkit-box-orient:vertical;
  -webkit-line-clamp:3;overflow:hidden}

/* "Ver el artículo completo": enlace subrayado del tema, al pie de la tarjeta */
#ybc_blog_page .read_more,
#ybc_blog_page .view_post{display:inline-block;align-self:flex-start;padding:0 0 3px;border:0;border-bottom:1px solid var(--ld-ink);
  font:500 11.5px/1 var(--ld-font-sans);font-style:normal;letter-spacing:.18em;text-transform:uppercase;
  color:var(--ld-ink);transition:color .2s ease,border-color .2s ease}
#ybc_blog_page ul.ybc-blog-list .read_more{margin-top:auto}
#ybc_blog_page .read_more:hover,
#ybc_blog_page .view_post:hover{color:var(--ld-red);border-color:var(--ld-red);text-decoration:none}

/* Destacado (primer artículo de la portada): foto a todo el ancho y el texto en una caja
   blanca que monta sobre la esquina inferior de la foto */
#ybc_blog_page ul.ybc-blog-list > li.ld-blog-featured{grid-column:1 / -1}
#ybc_blog_page ul.ybc-blog-list > li.ld-blog-featured .ybc_item_img{aspect-ratio:2.4/1}
#ybc_blog_page ul.ybc-blog-list > li.ld-blog-featured .ybc-blog-wrapper-content{position:relative;z-index:1;
  width:62%;margin:-118px 0 0;background:#fff}
#ybc_blog_page ul.ybc-blog-list > li.ld-blog-featured .ybc-blog-wrapper-content-main{padding:34px 44px 0 0}
#ybc_blog_page #content-wrapper ul.ybc-blog-list > li.ld-blog-featured .ybc_title_block{font-size:42px;line-height:1.08}
#ybc_blog_page #content-wrapper ul.ybc-blog-list > li.ld-blog-featured .blog_description{font-size:16px;line-height:1.7}

/* Paginación */
#ybc_blog_page .blog-paggination{display:flex;flex-direction:column;align-items:center;gap:16px;margin:72px 0 0;padding:0;border:0}
#ybc_blog_page .blog-paggination .links{display:flex;gap:8px}
#ybc_blog_page .blog-paggination .links > a,
#ybc_blog_page .blog-paggination .links > b{display:grid;place-items:center;min-width:40px;height:40px;margin:0;padding:0 10px;
  border:1px solid #E4E4E8;border-radius:0;background:#fff;font:500 13px/1 var(--ld-font-sans);color:var(--ld-ink);
  transition:border-color .18s ease}
#ybc_blog_page .blog-paggination .links > a:hover{border-color:var(--ld-ink);text-decoration:none}
#ybc_blog_page .blog-paggination .results{font:400 12px/1 var(--ld-font-sans);letter-spacing:.06em;color:#84848B}

/* ==========================================================================
   5. Artículo: cabecera centrada (categoría · título · datos), foto y texto a una columna
   ========================================================================== */
/* El módulo pinta foto → título → texto → categoría; se aplanan sus contenedores
   (display:contents) para reordenar: categoría, título y datos arriba; luego la foto */
#ybc_blog_page .ybc-blog-wrapper-detail{display:flex;flex-direction:column}
#ybc_blog_page .ybc-blog-wrapper-detail > .ybc-blog-wrapper-content,
#ybc_blog_page .ybc-blog-wrapper-detail .post-details{display:contents}
#ybc_blog_page .ybc-blog-wrapper-detail .extra_tag_cat{order:-4}
#ybc_blog_page .ybc-blog-wrapper-detail h1.page-heading{order:-3}
#ybc_blog_page .ybc-blog-wrapper-detail .blog-extra{order:-2}
#ybc_blog_page .ybc-blog-wrapper-detail .ybc_blog_img_wrapper{order:-1}

#ybc_blog_page .ybc-blog-wrapper-detail .extra_tag_cat{margin:0;padding:0;border:0;text-align:center}
#ybc_blog_page .ybc-blog-wrapper-detail .extra_tag_cat .ybc-blog-categories{text-align:center;font-size:11px;letter-spacing:.28em}
#ybc_blog_page .ybc-blog-wrapper-detail .extra_tag_cat .be-label{position:absolute;width:1px;height:1px;overflow:hidden;
  clip:rect(0 0 0 0);white-space:nowrap}
#ybc_blog_page .ybc-blog-wrapper-detail h1.page-heading{max-width:880px;margin:18px auto 0;padding:0;border:0;
  font:500 52px/1.06 var(--ld-font-serif);letter-spacing:-.005em;text-transform:none;color:var(--ld-ink);
  text-align:center;text-wrap:balance}
/* El módulo mete el título en un span.title_cat con mayúsculas */
#ybc_blog_page h1.page-heading .title_cat{font:inherit;letter-spacing:inherit;text-transform:none;color:inherit}
#ybc_blog_page .ybc-blog-wrapper-detail .blog-extra{margin:20px 0 0;text-align:center}
#ybc_blog_page .ybc-blog-wrapper-detail .blog-extra .ybc-blog-latest-toolbar{display:inline-flex;gap:18px;justify-content:center}
#ybc_blog_page .ybc-blog-wrapper-detail .ybc_blog_img_wrapper{margin:40px 0 56px}
#ybc_blog_page .ybc-blog-wrapper-detail .ybc_blog_img_wrapper img{display:block;width:100%;height:auto}

/* Texto de lectura: una columna de 700px, como una revista */
#ybc_blog_page .ybc-blog-wrapper-detail .blog_description{width:100%;max-width:700px;margin:0 auto;
  font:400 16px/1.85 var(--ld-font-sans);color:#555}
#ybc_blog_page .ybc-blog-wrapper-detail .blog_description p{margin:0 0 22px;font:inherit;color:inherit}
/* Entradilla con letra capital */
#ybc_blog_page .ybc-blog-wrapper-detail .blog_description > p:first-of-type{font-size:18.5px;line-height:1.75;color:#3C3C43}
#ybc_blog_page .ybc-blog-wrapper-detail .blog_description > p:first-of-type::first-letter{float:left;
  margin:8px 12px 0 0;font:500 74px/.8 var(--ld-font-serif);color:var(--ld-ink)}
#ybc_blog_page .ybc-blog-wrapper-detail .blog_description h2{margin:56px 0 18px;
  font:500 34px/1.15 var(--ld-font-serif);letter-spacing:0;text-transform:none;color:var(--ld-ink);text-wrap:balance}
#ybc_blog_page .ybc-blog-wrapper-detail .blog_description h3{margin:36px 0 12px;
  font:600 17px/1.4 var(--ld-font-sans);letter-spacing:.01em;text-transform:none;color:var(--ld-ink)}
#ybc_blog_page .ybc-blog-wrapper-detail .blog_description h4{margin:26px 0 10px;
  font:600 15px/1.4 var(--ld-font-sans);color:var(--ld-ink)}
#ybc_blog_page .ybc-blog-wrapper-detail .blog_description ul,
#ybc_blog_page .ybc-blog-wrapper-detail .blog_description ol{margin:0 0 22px;padding-left:22px}
#ybc_blog_page .ybc-blog-wrapper-detail .blog_description li{margin-bottom:8px}
#ybc_blog_page .ybc-blog-wrapper-detail .blog_description a{color:var(--ld-red);text-decoration:underline;text-underline-offset:3px}
#ybc_blog_page .ybc-blog-wrapper-detail .blog_description a:hover{color:var(--ld-ink)}
#ybc_blog_page .ybc-blog-wrapper-detail .blog_description strong{font-weight:600;color:var(--ld-ink)}
#ybc_blog_page .ybc-blog-wrapper-detail .blog_description img{display:block;max-width:100%;height:auto;margin:36px auto}
#ybc_blog_page .ybc-blog-wrapper-detail .blog_description blockquote{margin:40px 0;padding:4px 0 4px 26px;
  border-left:2px solid var(--ld-ink);font:500 27px/1.35 var(--ld-font-serif);color:var(--ld-ink)}
#ybc_blog_page .ybc-blog-wrapper-detail .blog_description blockquote p{font:inherit;margin:0}
#ybc_blog_page .ybc-blog-wrapper-detail .blog_description hr{margin:44px auto;border:0;border-top:1px solid #EDEDEF}
/* Cierre del artículo: la roseta del logo entre dos filetes */
#ybc_blog_page .ybc-blog-wrapper-detail .blog_description::after{content:"";display:block;clear:both;height:26px;margin-top:64px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 64'%3E%3Cg fill='%23111111' stroke='%23fff' stroke-width='3' paint-order='stroke'%3E%3Cellipse cx='32' cy='18' rx='8.5' ry='16'/%3E%3Cellipse cx='32' cy='18' rx='8.5' ry='16' transform='rotate(45 32 32)'/%3E%3Cellipse cx='32' cy='18' rx='8.5' ry='16' transform='rotate(90 32 32)'/%3E%3Cellipse cx='32' cy='18' rx='8.5' ry='16' transform='rotate(135 32 32)'/%3E%3Cellipse cx='32' cy='18' rx='8.5' ry='16' transform='rotate(180 32 32)'/%3E%3Cellipse cx='32' cy='18' rx='8.5' ry='16' transform='rotate(225 32 32)'/%3E%3Cellipse cx='32' cy='18' rx='8.5' ry='16' transform='rotate(270 32 32)'/%3E%3Cellipse cx='32' cy='18' rx='8.5' ry='16' transform='rotate(315 32 32)'/%3E%3C/g%3E%3Ccircle cx='32' cy='32' r='6' fill='%23fff'/%3E%3C/svg%3E") center/26px 26px no-repeat,
    linear-gradient(#E4E4E8,#E4E4E8) left center/calc(50% - 32px) 1px no-repeat,
    linear-gradient(#E4E4E8,#E4E4E8) right center/calc(50% - 32px) 1px no-repeat}

/* Índice del artículo ("Titulares del post") */
#ybc_blog_page .ybc_indexing_box{margin:0 0 48px;border:0;border-top:2px solid var(--ld-ink);
  border-bottom:1px solid #E4E4E8;border-radius:0;background:none}
#ybc_blog_page .ybc_indexing_box_title{padding:16px 0;background:none;
  font:600 11px/1.3 var(--ld-font-sans);letter-spacing:.24em;text-transform:uppercase;color:var(--ld-ink)}
/* El índice va dentro del texto del artículo: mismo peso que la regla de enlaces de arriba
   y declarado después, para que no salga rojo y subrayado */
#ybc_blog_page .ybc-blog-wrapper-detail .ybc_indexing_content_post{padding:0 0 18px;border:0;
  font:400 14px/1.65 var(--ld-font-sans)}
#ybc_blog_page .ybc-blog-wrapper-detail .ybc_indexing_content_post .ybc_indexing{padding-top:3px;padding-bottom:3px}
#ybc_blog_page .ybc-blog-wrapper-detail .ybc_indexing_content_post .index_h2 a{font-weight:500;color:var(--ld-ink)}
#ybc_blog_page .ybc-blog-wrapper-detail .ybc_indexing_content_post a{color:#6E6E73;text-decoration:none;transition:color .18s ease}
#ybc_blog_page .ybc-blog-wrapper-detail .ybc_indexing_content_post a:hover{color:var(--ld-red);text-decoration:none}

/* Botón flotante del índice (aparece al bajar por el artículo) */
#ybc_blog_page .ybc_btn_show_table_content{border:0;border-radius:0;background:var(--ld-ink);color:#fff}
#ybc_blog_page .ybc_btn_show_table_content svg{fill:currentColor}

/* Comentarios y bloques al pie del artículo, a la misma columna que el texto */
#ybc_blog_page .ybc-blog-wrapper-detail .ybc-blog-wrapper-comment,
#ybc_blog_page .ybc-blog-wrapper-detail .ybc-blog-related-posts,
#ybc_blog_page .ybc-blog-wrapper-detail .ybc-blog-related-products{width:100%;max-width:700px;margin-left:auto;margin-right:auto}

/* ==========================================================================
   6. Azules escritos a fuego en los CSS del módulo
   ========================================================================== */
#ybc_blog_page .ybc_paggination .links b,
#ybc_blog_page .blog-paggination .links > b{background:var(--ld-red);border-color:var(--ld-red);color:#fff}
#ybc_blog_page .ybc-blog-thumbnail-list.carousel .slick-dots .slick-active button{background:var(--ld-red);border-color:var(--ld-red)}
#ybc_blog_page .blog-submit .button,
#ybc_blog_page .form-polls-body button{background-color:var(--ld-red);border-color:var(--ld-red);color:#fff;border-radius:0}
#ybc_blog_page .blog-submit .button:hover,
#ybc_blog_page .form-polls-body button:hover,
#ybc_blog_page .form-polls-body button[name="polls_cancel"]:hover{background-color:var(--ld-cta-hover);border-color:var(--ld-cta-hover)}
#ybc_blog_page .form_reply_comment input[type="submit"]{border-color:var(--ld-red)}
#ybc_blog_page .form_reply_comment input[type="submit"]:hover{background-color:var(--ld-cta-hover);border-color:var(--ld-cta-hover)}
#ybc_blog_page .ybc-block-comment-reply.active,
#ybc_blog_page .ybc-block-comment-reply:hover,
#ybc_blog_page .list_category_item .sub_category li a:hover,
#ybc_blog_page .comment-content h4.comment_name span,
#ybc_blog_page .blog-post-like-btn::before,
#ybc_blog_page .rss-authors a:hover,
#ybc_blog_page .ybc-page-rss a:hover,
#ybc_blog_page .block_rss a:hover,
#ybc_blog_page span#ybc-blog-polls-capcha-refesh:hover::before{color:var(--ld-red)}
/* Marco de la miniatura activa del carrusel (detail_post.css lo trae en #2ecafe) */
#ybc_blog_page .ybc-blog-thumbnail-list.carousel .ybc-blog-thumbnail-item.slick-current::before{border-color:var(--ld-red)}
/* Encuestas del artículo (si se activan): turquesas del módulo a los del tema */
#ybc_blog_page .polls-title label{color:var(--ld-ink)}
#ybc_blog_page .polls-title label:hover{color:var(--ld-red)}
#ybc_blog_page .form-polls::after{border-top-color:var(--ld-red);border-bottom-color:var(--ld-red)}
/* Línea de la cabecera de tabla de comentarios (azul claro en blog.css) */
#ybc_blog_page .comment-content thead tr,
#ybc_blog_page .comment-content thead tr td{border-bottom-color:#EDEDEF}

/* Indicador de carga del módulo: el mismo nombre de animación, redefinida en rojo */
#ybc_blog_page .squaresWaveG{background-color:var(--ld-red)}
@keyframes bounce_squaresWaveG{0%{background-color:#E0192E}100%{background-color:#fff}}

/* Fuentes que el módulo fija (Open Sans en los comentarios) */
#ybc_blog_page h4.comment_name,
#ybc_blog_page .comment-content thead tr,
#ybc_blog_page .comment-content thead tr td{font-family:var(--ld-font-sans)}

/* ==========================================================================
   7. Responsive
   ========================================================================== */
@media (max-width:1199px){
  #ybc_blog_page ul.ybc-blog-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:52px 28px}
  #ybc_blog_page .ybc-blog-wrapper-blog-list h1.page-heading{font-size:48px}
  #ybc_blog_page #ybc_slider .slider_big_image .nivo-caption{font-size:36px}
  #ybc_blog_page ul.ybc-blog-list > li.ld-blog-featured .ybc-blog-wrapper-content{width:76%}
  #ybc_blog_page #content-wrapper ul.ybc-blog-list > li.ld-blog-featured .ybc_title_block{font-size:36px}
}
@media (max-width:991px){
  #ybc_blog_page #content-wrapper > .row > #left-column{padding-right:15px}
  #ybc_blog_page #content-wrapper > .row > #right-column{padding-left:15px}
  #ybc_blog_page ul.ybc-blog-list{gap:44px 22px}
  #ybc_blog_page #content-wrapper ul.ybc-blog-list .ybc_title_block{font-size:21px}
  #ybc_blog_page .ybc-blog-slider .slider_big_image{grid-template-columns:minmax(0,1fr);gap:20px}
  #ybc_blog_page #ybc_slider .slider_big_image .nivo-caption{order:2;font-size:30px}
  /* Destacado sin solape: texto debajo de la foto */
  #ybc_blog_page ul.ybc-blog-list > li.ld-blog-featured .ybc-blog-wrapper-content{width:auto;margin:0}
  #ybc_blog_page ul.ybc-blog-list > li.ld-blog-featured .ybc-blog-wrapper-content-main{padding:22px 0 0}
  #ybc_blog_page #content-wrapper ul.ybc-blog-list > li.ld-blog-featured .ybc_title_block{font-size:30px}
  #ybc_blog_page .ybc-blog-wrapper-detail h1.page-heading{font-size:40px}
}
@media (max-width:767px){
  #ybc_blog_page #wrapper > .container{padding:0 var(--ld-gutter)}
  /* En móvil el contenido va antes que la columna lateral */
  #ybc_blog_page #content-wrapper > .row{display:flex;flex-wrap:wrap}
  #ybc_blog_page #content-wrapper > .row > #left-column,
  #ybc_blog_page #content-wrapper > .row > #right-column{order:2;margin-top:56px}
  #ybc_blog_page .ybc-blog-wrapper-blog-list h1.page-heading{margin-bottom:24px;padding-bottom:18px;font-size:38px}
  #ybc_blog_page .ybc-blog-slider{margin-bottom:44px}
  #ybc_blog_page #ybc_slider .slider_big_image .nivo-caption{font-size:26px}
  #ybc_blog_page #js-post-list-top{justify-content:flex-start}
  #ybc_blog_page .ybc-blog-wrapper-detail h1.page-heading{font-size:32px}
  #ybc_blog_page .ybc-blog-wrapper-detail .ybc_blog_img_wrapper{margin:28px 0 36px}
  #ybc_blog_page .ybc-blog-wrapper-detail .blog_description{font-size:15.5px;line-height:1.8}
  #ybc_blog_page .ybc-blog-wrapper-detail .blog_description > p:first-of-type{font-size:17px}
  #ybc_blog_page .ybc-blog-wrapper-detail .blog_description > p:first-of-type::first-letter{font-size:60px}
  #ybc_blog_page .ybc-blog-wrapper-detail .blog_description h2{font-size:27px}
  /* Desplegable de la columna del blog en móvil: botón perfilado como "Ver todo" */
  #ybc_blog_page .ybc_blog_sidebar .ybc-navigation-blog{margin:0 0 28px;padding:16px 44px 16px 18px;
    border:1px solid var(--ld-ink);border-radius:0;background:#fff;text-align:left;
    font:600 12px/1.3 var(--ld-font-sans);letter-spacing:.24em;text-transform:uppercase;color:var(--ld-ink)}
  #ybc_blog_page .ybc_blog_sidebar .ybc-navigation-blog::before{top:19px;right:20px;border-color:var(--ld-ink)}
}
@media (max-width:575px){
  #ybc_blog_page ul.ybc-blog-list{grid-template-columns:minmax(0,1fr);gap:44px}
  #ybc_blog_page #content-wrapper ul.ybc-blog-list .ybc_title_block{font-size:23px}
  #ybc_blog_page ul.ybc-blog-list > li.ld-blog-featured .ybc_item_img{aspect-ratio:1.85/1}
  #ybc_blog_page #content-wrapper ul.ybc-blog-list > li.ld-blog-featured .ybc_title_block{font-size:28px}
}
@media (prefers-reduced-motion:reduce){
  #ybc_blog_page ul.ybc-blog-list .ybc_item_img img{transition:none}
  #ybc_blog_page ul.ybc-blog-list .post-wrapper:hover .ybc_item_img img{transform:none}
}
