/* Blog CAMSOL — estilos de /blog/ (índice, categorías, artículo).
   Usa las variables y tipografías de style.css (International Headline / International Text).
   Mobile first. Contraste de texto ≥ 4.5:1; objetivos táctiles ≥ 44px. */

:root {
  --bl-naranja: #d63f06;        /* botones (blanco encima: 4.6:1) */
  --bl-naranja-osc: #b83403;    /* hover y texto naranja sobre blanco (6:1) */
  --bl-texto: #2b2a28;
  --bl-suave: #5c5b57;
  --bl-linea: #e4e3e0;
  --bl-fondo: #f6f5f3;
  --bl-pad: clamp(1rem, 4vw, 3rem);
  --bl-ancho: 1440px;
  --bl-radio: 14px;
}

body.bl-page {
  font-family: "International Text", system-ui, sans-serif;
  color: var(--bl-texto);
  background: #fff;
}
.bl-main { display: block; }
.bl-wrap { max-width: var(--bl-ancho); margin: 0 auto; padding: 0 var(--bl-pad); }

@media (min-width: 1800px) { :root { --bl-ancho: 1560px; } }

/* ── Botones ───────────────────────────────────────────────── */
.bl-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  min-height: 48px; padding: .7rem 1.5rem; border-radius: 10px; border: 2px solid transparent;
  background: var(--bl-naranja); color: #fff !important;
  font-family: "International Headline", system-ui, sans-serif; font-weight: 700; font-size: 1rem;
  letter-spacing: .03em; text-transform: uppercase; text-decoration: none !important; text-align: center;
  cursor: pointer; transition: background .2s, color .2s, border-color .2s;
}
.bl-btn:hover { background: var(--bl-naranja-osc); color: #fff !important; }
.bl-btn:focus-visible, .bl-cats a:focus-visible, .bl-card-link:focus-visible, .bl-buscador input:focus-visible,
.bl-buscador button:focus-visible, .bl-faq-item summary:focus-visible, .bl-toc summary:focus-visible,
.bl-paginacion a:focus-visible, .bl-prod:focus-visible { outline: 3px solid #1a56db; outline-offset: 2px; }
.bl-btn--claro { background: #fff; color: var(--bl-texto) !important; border-color: #bab9b5; }
.bl-btn--claro:hover { background: #fff; color: var(--bl-naranja-osc) !important; border-color: var(--bl-naranja-osc); }
.bl-btn--sm { min-height: 44px; padding: .5rem 1rem; font-size: .9rem; }
.bl-btn--grande { width: 100%; font-size: 1.05rem; min-height: 54px; }

/* ── Hero ──────────────────────────────────────────────────── */
.bl-hero {
  position: relative; display: flex; align-items: flex-end; color: #fff; background: var(--negro, #272623);
  min-height: clamp(360px, 52vh, 520px); padding: 150px 0 clamp(2rem, 5vw, 3.5rem); overflow: hidden;
}
.bl-hero-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.bl-hero::before {
  content: ""; position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(to top, rgba(20,19,18,.88) 0%, rgba(20,19,18,.55) 55%, rgba(20,19,18,.35) 100%);
}
.bl-hero--simple {
  min-height: 0; background: linear-gradient(135deg, #272623 0%, #3a3936 100%);
  border-bottom: 5px solid var(--international-orange, #fc4d0e);
}
.bl-hero--simple::before { display: none; }
.bl-hero-in { position: relative; z-index: 2; width: 100%; max-width: var(--bl-ancho); margin: 0 auto; padding: 0 var(--bl-pad); box-sizing: border-box; text-shadow: 0 2px 6px rgba(0,0,0,.35); }
.bl-hero-eyebrow { margin: 0 0 .6rem; font-size: .9rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #ffd2bf; }
.bl-hero-eyebrow a { color: inherit; text-decoration: none; }
.bl-hero-eyebrow a:hover { text-decoration: underline; }
.bl-hero-h1 {
  margin: 0; max-width: 22ch; font-family: "International Headline", system-ui, sans-serif; font-weight: 700;
  font-size: clamp(2rem, 4.6vw, 3.4rem); line-height: 1.12; letter-spacing: -.005em;
}
.bl-hero--articulo .bl-hero-h1 { max-width: 40ch; font-size: clamp(1.85rem, 4vw, 3rem); }
.bl-hero-intro { margin: 1rem 0 0; max-width: 46rem; font-size: clamp(1.05rem, 1.6vw, 1.25rem); line-height: 1.55; padding: 0 !important; }
.bl-hero-meta { display: flex; flex-wrap: wrap; gap: .35rem .6rem; margin: 1rem 0 0; font-size: 1rem; color: #ececea; padding: 0 !important; }
.bl-vigencia { display: inline-block; margin: 1rem 0 0; padding: .45rem .9rem; border-radius: 999px; font-weight: 700; font-size: .95rem; background: rgba(255,255,255,.16); border: 1px solid rgba(255,255,255,.4); padding-left: .9rem !important; }
.bl-vigencia--terminada { background: #fde8cf; color: #6b3200; border-color: #f0b878; text-shadow: none; }

/* Migas de pan: sobre el hero, bajo el menú fijo (anula la posición por porcentaje de style.css) */
body.bl-page nav[aria-label="breadcrumb"] {
  position: absolute; top: 76px; left: 0; right: 0; width: auto; max-width: var(--bl-ancho);
  margin: 0 auto; padding: 0 var(--bl-pad); z-index: 5;
}
body.bl-page nav[aria-label="breadcrumb"] .breadcrumb { padding: .5rem 0 !important; margin: 0; flex-wrap: wrap; font-size: .95rem; }
@media (min-width: 768px) { body.bl-page nav[aria-label="breadcrumb"] { top: 88px; } }
@media (min-width: 1280px) { body.bl-page nav[aria-label="breadcrumb"] { top: 80px; } }
.bl-crumb-actual { color: rgba(255,255,255,.92); }

/* ── Filtros: buscador + categorías ────────────────────────── */
.bl-listado { padding-top: 2rem; padding-bottom: 1rem; }
.bl-filtros { display: flex; flex-direction: column; gap: 1rem; margin-bottom: 2rem; }
.bl-buscador { display: flex; gap: .5rem; width: 100%; max-width: 520px; }
.bl-buscador input {
  flex: 1; min-width: 0; min-height: 48px; padding: .6rem 1rem; font-size: 1rem; border: 2px solid #bab9b5; border-radius: 10px;
  font-family: inherit; background: #fff; color: var(--bl-texto);
}
.bl-buscador button {
  min-height: 48px; padding: 0 1.25rem; border: 0; border-radius: 10px; background: var(--negro, #272623); color: #fff;
  font-family: "International Headline", system-ui, sans-serif; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; cursor: pointer;
}
.bl-buscador button:hover { background: var(--bl-naranja-osc); }
.bl-cats ul { display: flex; gap: .6rem; margin: 0; padding: 0 0 .25rem; list-style: none; overflow-x: auto; scrollbar-width: thin; }
.bl-cats a {
  display: inline-flex; align-items: center; min-height: 44px; padding: .4rem 1.1rem; border-radius: 999px; white-space: nowrap;
  border: 2px solid var(--bl-linea); background: #fff; color: var(--bl-texto); font-weight: 600; text-decoration: none; font-size: 1rem;
}
.bl-cats a:hover { border-color: var(--bl-naranja-osc); color: var(--bl-naranja-osc); }
.bl-cats a.activa { background: var(--negro, #272623); border-color: var(--negro, #272623); color: #fff; }
@media (min-width: 992px) {
  .bl-filtros { flex-direction: row; align-items: center; justify-content: space-between; gap: 2rem; }
  .bl-cats ul { flex-wrap: wrap; overflow: visible; justify-content: flex-end; }
}

/* ── Tarjetas ──────────────────────────────────────────────── */
.bl-grid { display: grid; gap: 1.75rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 330px), 1fr)); }
.bl-card {
  position: relative; display: flex; flex-direction: column; background: #fff; border: 1px solid var(--bl-linea);
  border-radius: var(--bl-radio); overflow: hidden; transition: box-shadow .2s, transform .2s, border-color .2s;
}
.bl-card:hover { box-shadow: 0 12px 30px rgba(0,0,0,.1); transform: translateY(-3px); border-color: #cfcdc9; }
.bl-card-media { aspect-ratio: 16 / 9; background: var(--bl-fondo); overflow: hidden; }
.bl-card-media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bl-card-noimg {
  display: flex; align-items: center; justify-content: center; height: 100%; padding: 1rem; text-align: center;
  background: linear-gradient(135deg, #272623, #41413e); color: #fff; font-family: "International Headline", sans-serif; font-weight: 700; font-size: 1.15rem;
}
.bl-card-body { display: flex; flex-direction: column; flex: 1; gap: .55rem; padding: 1.25rem 1.35rem 1.4rem; }
.bl-eyebrow { margin: 0; font-size: .82rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--bl-naranja-osc); padding: 0 !important; }
.bl-card-title { margin: 0; font-family: "International Headline", system-ui, sans-serif; font-weight: 700; font-size: 1.28rem; line-height: 1.25; }
.bl-card-link { color: var(--bl-texto); text-decoration: none; }
.bl-card-link::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.bl-card:hover .bl-card-link { color: var(--bl-naranja-osc); }
.bl-card-excerpt {
  margin: 0; color: var(--bl-suave); font-size: 1rem; line-height: 1.55; padding: 0 !important;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
}
.bl-card-meta { margin: auto 0 0; padding: .4rem 0 0 !important; color: var(--bl-suave); font-size: .92rem; }
.bl-card-cta { color: var(--bl-naranja-osc); font-weight: 700; font-size: 1rem; }
.bl-card:hover .bl-card-cta span { display: inline-block; transform: translateX(4px); transition: transform .2s; }

.bl-destacado { margin-bottom: 2.75rem; }
.bl-card--grande .bl-card-title { font-size: clamp(1.5rem, 2.6vw, 2.25rem); line-height: 1.18; }
.bl-card--grande .bl-card-excerpt { font-size: 1.1rem; -webkit-line-clamp: 4; }
@media (min-width: 992px) {
  .bl-card--grande { flex-direction: row; }
  .bl-card--grande .bl-card-media { flex: 1.25; aspect-ratio: auto; min-height: 380px; }
  .bl-card--grande .bl-card-body { flex: 1; justify-content: center; gap: .9rem; padding: 2.25rem 2.5rem; }
}
.bl-seccion-titulo { font-family: "International Headline", system-ui, sans-serif; font-weight: 700; font-size: 1.5rem; margin: 0 0 1.25rem; }

/* ── Paginación ────────────────────────────────────────────── */
.bl-paginacion { margin: 2.75rem 0 1rem; }
.bl-paginacion ul { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: center; margin: 0; padding: 0; list-style: none; align-items: center; }
.bl-paginacion a, .bl-pag-actual {
  display: inline-flex; align-items: center; justify-content: center; min-width: 46px; min-height: 46px; padding: 0 .9rem;
  border-radius: 10px; border: 2px solid var(--bl-linea); background: #fff; color: var(--bl-texto); font-weight: 700; text-decoration: none;
}
.bl-paginacion a:hover { border-color: var(--bl-naranja-osc); color: var(--bl-naranja-osc); }
.bl-pag-actual { background: var(--negro, #272623); border-color: var(--negro, #272623); color: #fff; }
.bl-pag-gap { padding: 0 .25rem; color: var(--bl-suave); }

/* ── Estado vacío / error ──────────────────────────────────── */
.bl-vacio { text-align: center; padding: 3rem 1rem 4rem; max-width: 40rem; margin: 0 auto; }
.bl-vacio h2, .bl-error h2 { font-family: "International Headline", sans-serif; font-weight: 700; font-size: clamp(1.5rem, 3vw, 2rem); margin: 0 0 .75rem; }
.bl-vacio p { color: var(--bl-suave); font-size: 1.1rem; padding: 0 !important; }
.bl-vacio-links { display: flex; flex-wrap: wrap; gap: .75rem; justify-content: center; margin-top: 1.5rem; }
.bl-error { padding-top: 3rem; padding-bottom: 3rem; text-align: center; }
.bl-error .bl-grid { text-align: left; }
.bl-error .bl-seccion-titulo { margin-top: 3rem; }

/* ── Banda de asesoría ─────────────────────────────────────── */
.bl-banda { margin: 1rem 0 clamp(2.5rem, 6vw, 4rem); }
.bl-banda-in { display: flex; flex-direction: column; gap: 1.5rem; padding: clamp(1.5rem, 4vw, 2.5rem); background: var(--bl-fondo); border: 1px solid var(--bl-linea); border-left: 6px solid var(--international-orange, #fc4d0e); border-radius: var(--bl-radio); }
.bl-banda h2 { margin: 0 0 .5rem; font-family: "International Headline", sans-serif; font-weight: 700; font-size: clamp(1.4rem, 2.6vw, 2rem); text-transform: none; color: var(--negro, #272623); }
.bl-banda p { margin: 0; max-width: 46rem; font-size: 1.1rem; color: var(--bl-suave); padding: 0 !important; }
.bl-banda-acciones { display: flex; flex-wrap: wrap; gap: .75rem; }
.bl-banda-acciones .btn { display: flex; align-items: center; justify-content: center; font-family: "International Headline", sans-serif; font-weight: 700; text-transform: uppercase; font-size: 1rem; }
.bl-banda-acciones .btn img { width: auto; height: 1.4rem; margin-right: .6rem; }
@media (min-width: 992px) { .bl-banda-in { flex-direction: row; align-items: center; justify-content: space-between; gap: 3rem; } .bl-banda-acciones { flex-shrink: 0; } }

/* ── Artículo: maquetación ─────────────────────────────────── */
.bl-layout { display: grid; grid-template-columns: minmax(0, 1fr); gap: 2rem; padding-top: 2rem; padding-bottom: 3rem; }
@media (min-width: 992px) {
  .bl-layout { grid-template-columns: minmax(0, 1fr) clamp(19rem, 26vw, 24rem); gap: clamp(2rem, 4vw, 4rem); padding-top: 2.75rem; }
  .bl-lateral { position: sticky; top: 92px; align-self: start; display: flex; flex-direction: column; gap: 1.25rem; max-height: calc(100vh - 112px); }
  .bl-toc--lateral { flex: 0 1 auto; min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
  .bl-lateral-cta { flex-shrink: 0; }
}
.bl-articulo { min-width: 0; }
.bl-destacada { margin: 0 0 1.75rem; }
.bl-destacada img { width: 100%; height: auto; max-height: min(62vh, 620px); object-fit: cover; display: block; border-radius: var(--bl-radio); background: var(--bl-fondo); }
.bl-destacada figcaption { margin-top: .6rem; font-size: .95rem; color: var(--bl-suave); }
.bl-aviso { margin: 0 0 1.5rem; padding: 1rem 1.25rem; border-radius: 10px; background: #fff3e3; border: 1px solid #f0b878; color: #5c2d00; font-size: 1.02rem; }
.bl-actualizado { margin: 1.5rem 0 0; color: var(--bl-suave); font-size: .98rem; padding: 0 !important; }

/* Índice */
.bl-toc { background: var(--bl-fondo); border-radius: 12px; border: 1px solid var(--bl-linea); padding: 1.1rem 1.25rem; }
.bl-toc-titulo, .bl-toc summary { margin: 0 0 .5rem; font-family: "International Headline", sans-serif; font-weight: 700; font-size: 1.05rem; text-transform: uppercase; letter-spacing: .04em; }
.bl-toc ol { margin: 0; padding-left: 1.3rem; }
.bl-toc li { margin: .4rem 0; line-height: 1.4; }
.bl-toc ol ol { margin-top: .3rem; list-style-type: lower-alpha; font-size: .95em; }
.bl-toc a { color: var(--bl-texto); text-decoration: none; }
.bl-toc a:hover { color: var(--bl-naranja-osc); text-decoration: underline; }
.bl-toc--movil { margin-bottom: 1.5rem; }
.bl-toc--movil summary { cursor: pointer; list-style: none; min-height: 44px; display: flex; align-items: center; justify-content: space-between; margin: 0; }
.bl-toc--movil summary::after { content: "+"; font-size: 1.6rem; line-height: 1; color: var(--bl-naranja-osc); }
.bl-toc--movil[open] summary::after { content: "−"; }
.bl-toc--movil summary::-webkit-details-marker { display: none; }
.bl-toc--movil[open] summary { margin-bottom: .5rem; }
.bl-toc--lateral { display: none; }
@media (min-width: 992px) { .bl-toc--movil { display: none; } .bl-toc--lateral { display: block; } }

.bl-lateral-cta { border: 1px solid var(--bl-linea); border-radius: 12px; padding: 1.5rem 1.4rem; display: flex; flex-direction: column; gap: .8rem; }
.bl-lateral-titulo { margin: 0 0 .3rem; font-family: "International Headline", sans-serif; font-weight: 700; font-size: 1.3rem; line-height: 1.3; text-transform: none; color: var(--negro, #272623); padding: 0 !important; }
.bl-lateral-cta .btn { display: flex; align-items: center; justify-content: center; width: 100%; font-family: "International Headline", sans-serif; font-weight: 700; text-transform: uppercase; font-size: 1rem; }
.bl-lateral-cta .btn img { width: auto; height: 1.4rem; margin-right: .6rem; }


/* ── Texto del artículo ────────────────────────────────────── */
.bl-prose { font-size: clamp(1.125rem, 1.02rem + .3vw, 1.25rem); line-height: 1.75; color: var(--bl-texto); overflow-wrap: break-word; }
.bl-prose > :first-child { margin-top: 0; }
.bl-prose p { margin: 0 0 1.25em; padding: 0 !important; }
.bl-prose h2, .bl-prose h3, .bl-prose h4 { font-family: "International Headline", system-ui, sans-serif; font-weight: 700; line-height: 1.25; scroll-margin-top: 96px; color: #1c1b1a; }
.bl-prose h2 { margin: 2.2em 0 .6em; font-size: clamp(1.55rem, 2.8vw, 2rem); padding-bottom: .35em; border-bottom: 3px solid var(--international-orange, #fc4d0e); }
.bl-prose h3 { margin: 1.9em 0 .5em; font-size: clamp(1.25rem, 2.2vw, 1.5rem); }
.bl-prose h4 { margin: 1.6em 0 .4em; font-size: 1.15rem; }
.bl-prose ul, .bl-prose ol { margin: 0 0 1.25em; padding-left: 1.5em; }
.bl-prose li { margin: .45em 0; padding-left: .2em; }
.bl-prose li::marker { color: var(--bl-naranja-osc); font-weight: 700; }
.bl-prose a:not(.bl-btn) { color: var(--bl-naranja-osc); text-decoration: underline; text-underline-offset: 3px; text-decoration-thickness: 1.5px; }
.bl-prose a:not(.bl-btn):hover { color: #8c2700; }
.bl-prose strong { font-weight: 700; color: #1c1b1a; }
.bl-prose blockquote { margin: 1.75em 0; padding: 1.1em 1.4em; border-left: 5px solid var(--international-orange, #fc4d0e); background: var(--bl-fondo); border-radius: 0 10px 10px 0; font-size: 1.12em; font-style: italic; }
.bl-prose blockquote p:last-child { margin-bottom: 0; }
.bl-prose img { max-width: 100%; height: auto; border-radius: 10px; display: block; margin: 1.75em auto; }
.bl-prose figure { margin: 1.75em 0; }
.bl-prose figcaption { font-size: .95rem; color: var(--bl-suave); margin-top: .5rem; }
.bl-prose hr { margin: 2.5em 0; border: 0; border-top: 2px solid var(--bl-linea); opacity: 1; }
.bl-boton { margin: 1.5em 0 !important; }

.bl-tabla { margin: 1.75em 0; overflow-x: auto; border: 1px solid var(--bl-linea); border-radius: 10px; -webkit-overflow-scrolling: touch; }
.bl-tabla:focus-visible { outline: 3px solid #1a56db; outline-offset: 2px; }
.bl-tabla table { width: 100%; min-width: 520px; border-collapse: collapse; font-size: 1rem; line-height: 1.5; }
.bl-tabla th, .bl-tabla td { padding: .8rem 1rem; text-align: left; vertical-align: top; border-bottom: 1px solid var(--bl-linea); }
.bl-tabla thead th { background: var(--negro, #272623); color: #fff; font-family: "International Headline", sans-serif; font-weight: 700; border-bottom: 0; }
.bl-tabla tbody tr:nth-child(even) { background: var(--bl-fondo); }
.bl-tabla tbody tr:last-child td, .bl-tabla tbody tr:last-child th { border-bottom: 0; }
.bl-tabla tbody th { font-weight: 700; }

/* ── CTA dentro del texto y al final ───────────────────────── */
.bl-cta {
  margin: 2.25rem 0; padding: clamp(1.4rem, 3vw, 2rem); border-radius: var(--bl-radio); display: flex; flex-direction: column; align-items: flex-start; gap: .6rem;
}
.bl-cta-title { margin: 0 !important; padding: 0 !important; font-family: "International Headline", system-ui, sans-serif; font-weight: 700; font-size: clamp(1.25rem, 2.4vw, 1.6rem); line-height: 1.25; }
.bl-cta-text { margin: 0 0 .5rem !important; padding: 0 !important; font-size: 1.08rem; line-height: 1.55; }
.bl-cta--oscuro { background: var(--negro, #272623); color: #fff; }
.bl-cta--oscuro .bl-cta-title, .bl-cta--oscuro .bl-cta-text { color: #fff; }
.bl-cta--claro { background: var(--bl-fondo); color: var(--bl-texto); border: 1px solid var(--bl-linea); border-left: 6px solid var(--international-orange, #fc4d0e); }
.bl-cta--naranja { background: var(--bl-naranja); color: #fff; }
.bl-cta--naranja .bl-cta-title, .bl-cta--naranja .bl-cta-text { color: #fff; }
.bl-cta--naranja .bl-btn { background: #fff; color: var(--bl-naranja-osc) !important; }
.bl-cta--naranja .bl-btn:hover { background: #fdeee7; }
.bl-cta--oscuro .bl-btn:focus-visible, .bl-cta--naranja .bl-btn:focus-visible { outline-color: #fff; }
.bl-cta--final { margin-top: 2.5rem; }

/* ── Compartir ─────────────────────────────────────────────── */
.bl-compartir { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; margin: 2.25rem 0 0; padding-top: 1.5rem; border-top: 1px solid var(--bl-linea); }
.bl-compartir-t { font-weight: 700; margin-right: .5rem; }

/* ── Preguntas frecuentes ──────────────────────────────────── */
.bl-faq { margin: 2.75rem 0 0; }
.bl-faq h2, .bl-productos h2, .bl-relacionados h2 { font-family: "International Headline", sans-serif; font-weight: 700; font-size: clamp(1.5rem, 2.8vw, 2rem); margin: 0 0 1.1rem; line-height: 1.2; }
.bl-faq-item { border: 1px solid var(--bl-linea); border-radius: 10px; margin-bottom: .75rem; background: #fff; }
.bl-faq-item summary {
  list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 1rem;
  min-height: 56px; padding: .85rem 1.25rem; font-weight: 700; font-size: 1.08rem; line-height: 1.35;
}
.bl-faq-item summary::-webkit-details-marker { display: none; }
.bl-faq-item summary::after { content: "+"; flex-shrink: 0; font-size: 1.7rem; line-height: 1; color: var(--bl-naranja-osc); }
.bl-faq-item[open] summary::after { content: "−"; }
.bl-faq-item[open] summary { border-bottom: 1px solid var(--bl-linea); }
.bl-faq-resp { padding: 1rem 1.25rem 1.2rem; font-size: 1.05rem; line-height: 1.65; }

/* ── Productos / contenido relacionado de CAMSOL ───────────── */
.bl-productos { margin: 2.75rem 0 0; }
.bl-prod-grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 210px), 1fr)); }
.bl-prod { display: flex; flex-direction: column; border: 1px solid var(--bl-linea); border-radius: 12px; overflow: hidden; background: #fff; color: var(--bl-texto); text-decoration: none; transition: box-shadow .2s, border-color .2s, transform .2s; }
.bl-prod:hover { border-color: var(--bl-naranja-osc); box-shadow: 0 10px 24px rgba(0,0,0,.1); transform: translateY(-2px); color: var(--bl-texto); }
.bl-prod-img { aspect-ratio: 4 / 3; background: var(--bl-fondo); display: flex; align-items: center; justify-content: center; }
.bl-prod-img img { width: 100%; height: 100%; object-fit: cover; }
.bl-prod-body { display: flex; flex-direction: column; gap: .35rem; padding: 1rem 1.1rem 1.2rem; flex: 1; }
.bl-prod-nombre { font-family: "International Headline", sans-serif; font-weight: 700; font-size: 1.2rem; }
.bl-prod-desc { font-size: .96rem; line-height: 1.45; color: var(--bl-suave); }
.bl-prod-ver { margin-top: auto; padding-top: .5rem; font-weight: 700; color: var(--bl-naranja-osc); }

/* ── Formulario de asesoría ────────────────────────────────── */
.bl-form-box { margin: 2.75rem 0 0; padding: clamp(1.4rem, 3.5vw, 2.4rem); border-radius: 16px; background: var(--bl-fondo); border: 1px solid var(--bl-linea); scroll-margin-top: 90px; }
.bl-form-intro h2 { margin: 0 0 .5rem; font-family: "International Headline", sans-serif; font-weight: 700; font-size: clamp(1.4rem, 2.6vw, 1.85rem); line-height: 1.2; }
.bl-form-intro p { margin: 0 0 1.4rem; color: var(--bl-suave); font-size: 1.08rem; padding: 0 !important; }
.bl-form-ok { padding: 1.25rem 1.5rem; border-radius: 10px; background: #e6f4ea; border: 1px solid #9ad0ac; color: #0d4a22; font-size: 1.1rem; }
.bl-form-grid { display: grid; gap: 1rem; grid-template-columns: 1fr; margin-bottom: 1.25rem; }
@media (min-width: 576px) { .bl-form-grid { grid-template-columns: 1fr 1fr; } .bl-campo--full { grid-column: 1 / -1; } }
.bl-campo label { display: block; margin-bottom: .35rem; font-weight: 700; font-size: .98rem; }
.bl-opc { font-weight: 400; color: var(--bl-suave); }
.bl-campo .form-control, .bl-campo .form-select { min-height: 50px; font-size: 1rem; border: 2px solid #bab9b5; border-radius: 10px; background-color: #fff; color: var(--bl-texto); }
.bl-campo textarea.form-control { min-height: 96px; }
.bl-campo .form-control:focus, .bl-campo .form-select:focus { border-color: var(--bl-naranja-osc); box-shadow: 0 0 0 3px rgba(214,63,6,.25); }
.bl-form-nota { margin: 1rem 0 0; font-size: .92rem; color: var(--bl-suave); padding: 0 !important; }
.bl-form-nota a { color: var(--bl-naranja-osc); text-decoration: underline; }

/* ── Relacionados ──────────────────────────────────────────── */
.bl-relacionados { background: var(--bl-fondo); padding: clamp(2.25rem, 5vw, 3.5rem) 0; border-top: 1px solid var(--bl-linea); }

/* ── Barra de contacto móvil ───────────────────────────────── */
.bl-movil-cta {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 900; display: grid; grid-template-columns: 1fr 1fr; gap: .6rem;
  padding: .6rem var(--bl-pad) calc(.6rem + env(safe-area-inset-bottom)); background: #fff; box-shadow: 0 -4px 18px rgba(0,0,0,.14);
  transition: transform .25s;
}
.bl-movil-cta.oculta { transform: translateY(115%); }
/* Deja libre la esquina derecha para la burbuja del chat (60 px, a 16-22 px del borde) */
.bl-movil-cta { padding-right: calc(var(--bl-pad) + 76px + env(safe-area-inset-right)); }
.bl-movil-cta .btn { display: flex; align-items: center; justify-content: center; min-width: 0; min-height: 48px; padding: .4rem .5rem; font-family: "International Headline", sans-serif; font-weight: 700; text-transform: uppercase; font-size: clamp(.8rem, 3.2vw, 1rem); white-space: nowrap; }
.bl-movil-cta .btn img { width: auto; height: 1.2rem; margin-right: .4rem; }
@media (max-width: 419.98px) { .bl-movil-cta .btn img { display: none; } }
@media (max-width: 991.98px) { body.bl-articulo-page { padding-bottom: 76px; } }
@media (min-width: 992px) { .bl-movil-cta { display: none; } }

/* ── Aviso de vista previa (admin) ─────────────────────────── */
.bl-preview-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 2000; padding: .7rem 1rem; background: #1a56db; color: #fff; font-size: .98rem; text-align: center; box-shadow: 0 -3px 14px rgba(0,0,0,.25); }
.bl-preview-bar strong { text-transform: uppercase; letter-spacing: .05em; }

@media (prefers-reduced-motion: reduce) {
  .bl-card, .bl-prod, .bl-movil-cta, .bl-card-cta span { transition: none !important; transform: none !important; }
}

/* Legibilidad: el sitio usa títulos en mayúsculas; en el blog, con títulos largos y preguntas, se leen mejor en minúsculas. */
body.bl-page h1, body.bl-page h2, body.bl-page h3, body.bl-page h4,
body.bl-page .bl-card-title, body.bl-page .bl-cta-title, body.bl-page .bl-lateral-titulo, body.bl-page .bl-prod-nombre, body.bl-page .bl-seccion-titulo { text-transform: none; }