/* =====================================================================
   BioMantenimiento · sistema visual del sitio publico
   ---------------------------------------------------------------------
   Idea: el sitio se lee como la documentacion de un equipo bien llevado.
   Los colores corporativos (azul de marca y azul marino, los mismos de la
   plataforma) llevan todo; verde, ambar y rojo solo se usan con el
   significado que tienen en el software (al dia, proximo, vencido).
   Los codigos de equipo van en monoespaciada.
   Va sobre bootstrap.min.css (rejilla, collapse, dropdown); nada del tema
   viejo (main.css / custom.css) se carga en las paginas publicas.
   Prefijo bm- para todo lo propio.
   ===================================================================== */

:root {
    /* Color corporativo */
    --bm-marino: #06175A;          /* superficies oscuras: orden de trabajo, pie */
    --bm-marino-2: #0A2FB5;        /* azul medio de las franjas de marca */
    --bm-azul: #0540F2;            /* azul de marca: accion principal y enlaces */
    --bm-azul-700: #0433C2;
    --bm-azul-300: #9DB6FF;        /* enlaces sobre marino */
    --bm-celeste: #E8F1FF;         /* rellenos suaves, estados activos */
    --bm-franja: linear-gradient(135deg, #06175A 0%, #0A2FB5 52%, #0540F2 100%); /* franja de marca */
    /* Neutros con el mismo tinte azul */
    --bm-niebla: #F5F8FE;          /* fondo alterno */
    --bm-blanco: #FFFFFF;
    --bm-texto: #0B1739;
    --bm-gris: #55607A;
    --bm-gris-claro: #8C96AE;
    --bm-linea: #E1E7F3;
    --bm-linea-fuerte: #C5D0E6;
    --bm-sobre-marino: #B9C5E6;    /* texto secundario sobre marino */
    /* Estados, con el significado que tienen en la plataforma */
    --bm-etiqueta: #F5A524;        /* proximo */
    --bm-etiqueta-suave: #FEF3DC;
    --bm-etiqueta-tinta: #8A5A08;
    --bm-vencido: #D23F2C;         /* vencido */
    --bm-vencido-suave: #FBE6E1;
    --bm-ok: #0E9F77;              /* al dia, firmado */
    --bm-ok-tinta: #08765A;
    --bm-ok-suave: #E2F5EE;

    /* Tipografia */
    --bm-font: "Barlow", "Segoe UI", system-ui, -apple-system, sans-serif;
    --bm-display: "Barlow Semi Condensed", "Barlow", "Arial Narrow", sans-serif;
    --bm-mono: "IBM Plex Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;

    /* Forma: los documentos casi rectos, los dispositivos y fotos mas redondos */
    --bm-radio-doc: 4px;
    --bm-radio: 8px;
    --bm-radio-foto: 14px;
    --bm-sombra-doc: 0 1px 0 rgba(6,23,90, .06), 0 18px 40px -26px rgba(6,23,90, .45);
    --bm-sombra-foto: 0 30px 60px -36px rgba(6,23,90, .55);

    /* Ritmo */
    --bm-section: clamp(72px, 9vw, 128px);
    --bm-header-h: 68px;
    --bm-ease: cubic-bezier(.22, .8, .26, 1);
    --bm-max: 1240px;

    /* Puente con Bootstrap */
    --bs-body-font-family: var(--bm-font);
    --bs-body-color: var(--bm-texto);
    --bs-body-bg: var(--bm-blanco);
    --bs-primary: #0540F2;
    --bs-primary-rgb: 5, 64, 242;
    --bs-link-color: #0540F2;
    --bs-link-hover-color: #0433C2;
    --bs-border-color: #E1E7F3;
}

/* ---------------------------------------------------------------------
   Base
   --------------------------------------------------------------------- */
html { scroll-padding-top: calc(var(--bm-header-h) + 20px); }
body {
    font-family: var(--bm-font);
    font-size: 1.0625rem;
    line-height: 1.6;
    color: var(--bm-texto);
    background: var(--bm-blanco);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}
h1, h2, h3, h4, h5, h6 {
    font-family: var(--bm-display);
    font-weight: 600;
    line-height: 1.08;
    letter-spacing: -0.005em;
    color: var(--bm-texto);
    text-wrap: balance;
}
p { text-wrap: pretty; }
a { color: var(--bm-azul); text-underline-offset: .18em; }
a:hover { color: var(--bm-azul-700); }
img { max-width: 100%; height: auto; }
:focus-visible { outline: 3px solid var(--bm-azul); outline-offset: 2px; border-radius: 2px; }
::selection { background: var(--bm-celeste); color: var(--bm-texto); }

.container { max-width: var(--bm-max); padding-inline: clamp(16px, 4vw, 40px); }
@media (min-width: 1600px) { :root { --bm-max: 1440px; } }

.bm-skip {
    position: absolute; left: 12px; top: -60px; z-index: 2000;
    background: var(--bm-marino); color: #fff; padding: 10px 14px; border-radius: var(--bm-radio);
}
.bm-skip:focus { top: 12px; color: #fff; }

.bm-mono { font-family: var(--bm-mono); font-weight: 500; letter-spacing: 0; }
.visually-hidden-focusable:not(:focus) { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; }

/* ---------------------------------------------------------------------
   Tipografia
   --------------------------------------------------------------------- */
.bm-h1 { font-size: clamp(2.6rem, 5.4vw, 4.6rem); font-weight: 600; line-height: 1; letter-spacing: -0.015em; margin: 0 0 .4em; }
.bm-h2 { font-size: clamp(2rem, 3.6vw, 3.1rem); font-weight: 600; line-height: 1.04; margin: 0 0 .45em; }
.bm-h3 { font-size: clamp(1.35rem, 1.8vw, 1.6rem); font-weight: 600; line-height: 1.15; margin: 0 0 .5em; }
.bm-lead { font-size: clamp(1.1rem, 1.35vw, 1.25rem); line-height: 1.55; color: var(--bm-gris); max-width: 62ch; margin: 0 0 1.2em; }
.bm-text { color: var(--bm-gris); max-width: 68ch; }
.bm-micro { font-size: .9rem; color: var(--bm-gris); }

/* Antetitulo: solo cuando nombra algo real (el modulo, la seccion de un manual), no decoracion */
.bm-eyebrow {
    display: inline-block; font-family: var(--bm-font); font-size: .95rem; font-weight: 600;
    color: var(--bm-azul); margin-bottom: .6rem;
}

/* ---------------------------------------------------------------------
   Botones y enlaces
   --------------------------------------------------------------------- */
.bm-btn {
    --bm-btn-bg: var(--bm-azul); --bm-btn-fg: #fff; --bm-btn-bd: var(--bm-azul);
    display: inline-flex; align-items: center; justify-content: center; gap: .55rem;
    min-height: 50px; padding: .7rem 1.4rem;
    font-family: var(--bm-font); font-size: 1.02rem; font-weight: 600; line-height: 1.1;
    color: var(--bm-btn-fg); background: var(--bm-btn-bg);
    border: 1.5px solid var(--bm-btn-bd); border-radius: var(--bm-radio);
    text-decoration: none; cursor: pointer; white-space: nowrap;
    transition: background-color .18s ease, color .18s ease, border-color .18s ease, transform .18s var(--bm-ease);
}
.bm-btn:hover { --bm-btn-bg: var(--bm-azul-700); --bm-btn-bd: var(--bm-azul-700); color: var(--bm-btn-fg); }
.bm-btn:active { transform: translateY(1px); }
.bm-btn--secondary { --bm-btn-bg: transparent; --bm-btn-fg: var(--bm-texto); --bm-btn-bd: var(--bm-linea-fuerte); }
.bm-btn--secondary:hover { --bm-btn-bg: var(--bm-niebla); --bm-btn-fg: var(--bm-texto); --bm-btn-bd: var(--bm-texto); }
.bm-btn--claro { --bm-btn-bg: #fff; --bm-btn-fg: var(--bm-marino); --bm-btn-bd: #fff; }
.bm-btn--claro:hover { --bm-btn-bg: var(--bm-celeste); --bm-btn-bd: var(--bm-celeste); --bm-btn-fg: var(--bm-marino); }
.bm-btn--contorno-claro { --bm-btn-bg: transparent; --bm-btn-fg: #fff; --bm-btn-bd: rgba(255,255,255,.45); }
.bm-btn--contorno-claro:hover { --bm-btn-bg: rgba(255,255,255,.08); --bm-btn-fg: #fff; --bm-btn-bd: #fff; }
.bm-btn--sm { min-height: 42px; padding: .5rem 1rem; font-size: .96rem; }
.bm-btn .bi { font-size: 1.05em; }
.btn-glass-shine { display: none; }

.bm-link {
    display: inline-flex; align-items: center; gap: .4rem;
    font-weight: 600; color: var(--bm-azul); text-decoration: underline; text-decoration-thickness: 1.5px;
    text-decoration-color: color-mix(in srgb, var(--bm-azul) 35%, transparent);
}
.bm-link:hover { text-decoration-color: currentColor; }

/* ---------------------------------------------------------------------
   Estados (los mismos colores que usa el software)
   --------------------------------------------------------------------- */
.bm-pill {
    display: inline-flex; align-items: center; gap: .35rem;
    padding: .2rem .55rem; border-radius: 3px;
    font-size: .8rem; font-weight: 600; line-height: 1.3; white-space: nowrap;
    background: var(--bm-niebla); color: var(--bm-gris);
}
.bm-pill--ok { background: var(--bm-ok-suave); color: var(--bm-ok-tinta); }
.bm-pill--info { background: var(--bm-etiqueta-suave); color: var(--bm-etiqueta-tinta); }
.bm-pill--late { background: var(--bm-vencido-suave); color: var(--bm-vencido); }

.bm-checks { list-style: none; padding: 0; margin: 0 0 1.25rem; display: grid; gap: .55rem; }
.bm-checks li { display: grid; grid-template-columns: 1.3rem 1fr; gap: .5rem; color: var(--bm-gris); line-height: 1.45; }
.bm-checks li .bi { color: var(--bm-ok); margin-top: .1rem; }
.bm-checks li.is-plus { color: var(--bm-texto); font-weight: 600; }

/* ---------------------------------------------------------------------
   Secciones
   --------------------------------------------------------------------- */
.bm-section { padding-block: var(--bm-section); }
.bm-section--white { background: var(--bm-blanco); }
.bm-section--mist, .bm-section--paper { background: var(--bm-niebla); }
.bm-section + .bm-section.bm-section--white,
.bm-section--white + .bm-section--white { border-top: 1px solid var(--bm-linea); }

/* Cabeza de seccion: titulo a la izquierda y su explicacion al lado, no centrados */
.bm-section-head { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: 1rem clamp(24px, 5vw, 80px); align-items: end; margin-bottom: clamp(36px, 5vw, 64px); }
.bm-section-head > * { margin-bottom: 0; }
.bm-section-head .bm-eyebrow { grid-column: 1 / -1; margin-bottom: -.5rem; }
.bm-section-head .bm-lead { max-width: 48ch; }
.bm-section-head--solo { grid-template-columns: minmax(0, 1fr); }
.bm-section-head--center { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
@media (max-width: 860px) {
    .bm-section-head, .bm-section-head--center { grid-template-columns: 1fr; align-items: start; }
}

/* ---------------------------------------------------------------------
   Encabezado del sitio
   --------------------------------------------------------------------- */
.bm-header {
    position: sticky; top: 0; z-index: 1030;
    background: rgba(255, 255, 255, .94);
    -webkit-backdrop-filter: saturate(1.4) blur(10px); backdrop-filter: saturate(1.4) blur(10px);
    border-bottom: 1px solid transparent;
    transition: border-color .2s ease;
}
.bm-header.is-scrolled { border-bottom-color: var(--bm-linea); }
.bm-header { transition: background-color .25s ease, border-color .25s ease, box-shadow .25s ease; }
.bm-header.is-scrolled { box-shadow: 0 6px 20px -16px rgba(6, 23, 90, .35); }
/* Sobre la portada azul: transparente y en blanco hasta hacer scroll (lo activa site.js) */
.bm-header--sobre { background: transparent; -webkit-backdrop-filter: none; backdrop-filter: none; border-bottom-color: rgba(255, 255, 255, .1); }
.bm-header--sobre .bm-brand, .bm-header--sobre .bm-brand:hover,
.bm-header--sobre .bm-nav .nav-link, .bm-header--sobre .bm-lang > button { color: #fff; }
.bm-header--sobre .bm-nav .nav-link { opacity: .86; }
.bm-header--sobre .bm-nav .nav-link:hover, .bm-header--sobre .bm-nav .nav-link[aria-current="page"] { color: #fff; opacity: 1; }
.bm-header--sobre .bm-nav .nav-link[aria-current="page"]::after { background: #fff; }
.bm-header--sobre .bm-header__cta .bm-btn { --bm-btn-bg: #fff; --bm-btn-fg: var(--bm-marino); --bm-btn-bd: #fff; }
.bm-header--sobre .bm-header__cta .bm-btn:hover { --bm-btn-bg: var(--bm-celeste); --bm-btn-bd: var(--bm-celeste); }
.bm-header--sobre .bm-toggler { color: #fff; border-color: rgba(255, 255, 255, .4); }
.bm-header .navbar { min-height: var(--bm-header-h); padding-block: .55rem; }
.bm-brand {
    display: inline-flex; align-items: center; gap: .6rem; margin-right: 1.5rem;
    font-family: var(--bm-display); font-size: 1.35rem; font-weight: 700; letter-spacing: -.01em;
    color: var(--bm-texto); text-decoration: none;
}
.bm-brand:hover { color: var(--bm-texto); }
.bm-marca {
    display: inline-grid; place-items: center; width: 38px; height: 38px; flex: none;
    background: var(--bm-azul); border-radius: 7px; position: relative; overflow: hidden;
}
.bm-marca img { width: 26px; height: auto; }

.bm-nav { gap: .15rem; }
.bm-nav .nav-link {
    font-size: 1.02rem; font-weight: 500; color: var(--bm-texto);
    padding: .5rem .8rem !important; border-radius: 6px; position: relative;
}
.bm-nav .nav-link:hover { color: var(--bm-azul); }
.bm-nav .nav-link[aria-current="page"] { color: var(--bm-azul); font-weight: 600; }
.bm-nav .nav-link[aria-current="page"]::after {
    content: ""; position: absolute; left: .8rem; right: .8rem; bottom: .1rem; height: 2px; background: var(--bm-azul);
}
@media (min-width: 992px) { .bm-nav { margin-left: .25rem; } }

/* Boton del menu en celular: hamburguesa que pasa a X; el boton flotante de WhatsApp se aparta */
.bm-toggler[aria-expanded="true"] .bi-list::before { content: "\f659"; }
.bm-header:has(.navbar-collapse.show) ~ .bm-wa, .bm-header:has(.navbar-collapse.collapsing) ~ .bm-wa { display: none; }
.bm-header__actions { display: flex; align-items: center; gap: .6rem; margin-left: auto; }
.bm-lang > button {
    display: inline-flex; align-items: center; gap: .3rem; background: none; border: 0;
    font-weight: 600; font-size: .95rem; color: var(--bm-gris); padding: .5rem .4rem;
}
.bm-lang > button:hover { color: var(--bm-texto); }
.bm-lang .dropdown-menu { border: 1px solid var(--bm-linea); border-radius: var(--bm-radio); box-shadow: var(--bm-sombra-doc); padding: .35rem; min-width: 10rem; }
.bm-lang .dropdown-item { border-radius: 5px; font-weight: 500; padding: .45rem .7rem; }
.bm-lang .dropdown-item.active, .bm-lang .dropdown-item:active { background: var(--bm-celeste); color: var(--bm-azul-700); }
.bm-toggler {
    display: inline-grid; place-items: center; width: 44px; height: 44px;
    background: none; border: 1.5px solid var(--bm-linea-fuerte); border-radius: var(--bm-radio);
    font-size: 1.4rem; color: var(--bm-texto);
}
.bm-nav-lang { display: flex; gap: .5rem; padding: .75rem 0 .25rem; border-top: 1px solid var(--bm-linea); margin-top: .5rem; }
.bm-nav-lang a { flex: 1; text-align: center; padding: .6rem; border: 1px solid var(--bm-linea); border-radius: var(--bm-radio); color: var(--bm-texto); text-decoration: none; font-weight: 500; }
.bm-nav-lang a[aria-current="true"] { background: var(--bm-celeste); border-color: var(--bm-azul); color: var(--bm-azul-700); font-weight: 600; }
@media (max-width: 991.98px) {
    .bm-header .navbar > .container { flex-wrap: wrap; }
    .bm-header .navbar-collapse { flex-basis: 100%; }
    .bm-nav { padding-top: .75rem; }
    .bm-header .navbar-collapse { max-height: calc(100vh - var(--bm-header-h)); overflow-y: auto; }
    .bm-nav .nav-link { padding: .8rem .25rem !important; border-bottom: 1px solid var(--bm-linea); border-radius: 0; font-size: 1.1rem; }
    .bm-nav .nav-link[aria-current="page"]::after { display: none; }
}
.bm-nav-cta { display: none; }
@media (max-width: 575.98px) {
    .bm-header__cta { display: none; }
    .bm-nav-cta { display: block; padding-top: 1rem; }
    .bm-nav-cta .bm-btn { width: 100%; }
}
@media (max-width: 380px) { .bm-brand { font-size: 1.15rem; margin-right: .5rem; } }

/* Boton flotante de WhatsApp */
.bm-wa {
    position: fixed; right: 18px; bottom: 18px; z-index: 1020;
    display: grid; place-items: center; width: 54px; height: 54px; border-radius: 50%;
    background: #1FA855; color: #fff; font-size: 1.6rem; text-decoration: none;
    box-shadow: 0 10px 24px -10px rgba(0, 0, 0, .45);
    transition: transform .2s var(--bm-ease);
}
.bm-wa:hover { color: #fff; transform: translateY(-2px); }

/* ---------------------------------------------------------------------
   Encabezado de pagina interna
   --------------------------------------------------------------------- */
.bm-page-head { padding: clamp(56px, 8vw, 104px) 0 clamp(40px, 5vw, 64px); background: var(--bm-blanco); border-bottom: 1px solid var(--bm-linea); }
.bm-page-head__inner { max-width: 860px; }
.bm-page-head .bm-h1 { font-size: clamp(2.5rem, 5vw, 4rem); }
.bm-page-head .bm-lead { margin-bottom: 0; }
.bm-page-head--center .bm-page-head__inner { max-width: 860px; }
.bm-page-head--compacta { padding-bottom: clamp(28px, 4vw, 40px); }
.bm-page-head__acciones { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.75rem; }

.bm-migas { display: flex; flex-wrap: wrap; gap: .25rem .5rem; font-size: .92rem; color: var(--bm-gris); margin-bottom: 1.25rem; }
.bm-migas a { color: var(--bm-gris); text-decoration: none; }
.bm-migas a:hover { color: var(--bm-azul); text-decoration: underline; }
.bm-migas > * + *::before { content: "/"; margin-right: .5rem; color: var(--bm-linea-fuerte); }
.bm-migas [aria-current] { color: var(--bm-texto); }

/* La primera seccion despues del encabezado no repite todo el aire de arriba */
.bm-page-head + .bm-section, .bm-page-head + section > .bm-section:first-child { padding-top: clamp(48px, 6vw, 80px); }

/* Botones de Bootstrap que quedan en piezas heredadas (recorrido, configurador) */
.btn-primary { --bs-btn-bg: var(--bm-azul); --bs-btn-border-color: var(--bm-azul); --bs-btn-hover-bg: var(--bm-azul-700); --bs-btn-hover-border-color: var(--bm-azul-700); --bs-btn-active-bg: var(--bm-azul-700); --bs-btn-active-border-color: var(--bm-azul-700); font-weight: 600; border-radius: var(--bm-radio); }
.btn-light { font-weight: 600; border-radius: var(--bm-radio); }

/* ---------------------------------------------------------------------
   Preguntas frecuentes
   --------------------------------------------------------------------- */
.bm-faq { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 7fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
.bm-faq__aside { position: sticky; top: calc(var(--bm-header-h) + 28px); }
.bm-faq__aside .bm-eyebrow { color: var(--bm-gris); }
.bm-faq__list { border-top: 1.5px solid var(--bm-texto); }
.bm-faq__item { border-bottom: 1px solid var(--bm-linea); }
.bm-faq__q {
    display: flex; width: 100%; align-items: center; justify-content: space-between; gap: 1.25rem;
    padding: 1.25rem 0; background: none; border: 0; text-align: left;
    font-family: var(--bm-font); font-size: 1.12rem; font-weight: 600; color: var(--bm-texto); line-height: 1.35;
}
.bm-faq__q .bi { flex: none; font-size: 1.1rem; color: var(--bm-azul); transition: transform .25s var(--bm-ease); }
.bm-faq__q[aria-expanded="true"] .bi { transform: rotate(45deg); }
.bm-faq__q:hover span { color: var(--bm-azul); }
.bm-faq__a { padding: 0 2.5rem 1.4rem 0; color: var(--bm-gris); max-width: 68ch; }
.bm-faq__a p:last-child { margin-bottom: 0; }
@media (max-width: 860px) {
    .bm-faq { grid-template-columns: 1fr; }
    .bm-faq__aside { position: static; }
}

/* ---------------------------------------------------------------------
   Cierre de cada pagina
   --------------------------------------------------------------------- */
.bm-close { background: var(--bm-marino); color: #fff; padding-block: clamp(72px, 9vw, 120px); position: relative; overflow: hidden; }
.bm-close__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: clamp(32px, 6vw, 96px); align-items: end; }
.bm-close .bm-h2 { color: #fff; font-size: clamp(2.2rem, 4.4vw, 3.8rem); max-width: 16ch; }
.bm-close .bm-lead { color: var(--bm-sobre-marino); margin-bottom: 0; }
.bm-close__actions { display: grid; gap: .9rem; justify-items: start; }
.bm-close__actions .bm-btn { width: 100%; }
.bm-close__enlaces { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; }
.bm-close__enlaces a { color: #fff; font-weight: 600; text-decoration: underline; text-decoration-color: rgba(255,255,255,.35); text-underline-offset: .2em; display: inline-flex; gap: .4rem; align-items: center; }
.bm-close__enlaces a:hover { text-decoration-color: #fff; color: #fff; }
.bm-close__micro { font-size: .9rem; color: var(--bm-sobre-marino); margin: 0; }
/* La franja de marca: el mismo degradado corporativo de la plataforma */
.bm-close { background: var(--bm-franja); }
@media (max-width: 860px) { .bm-close__grid { grid-template-columns: 1fr; } }

/* ---------------------------------------------------------------------
   Pie de pagina
   --------------------------------------------------------------------- */
/* Pie: el mismo lenguaje de la portada. Degradado corporativo, entrada en diagonal,
   cuna mas oscura y la marca como palabra de fondo. */
.bm-footer {
    position: relative; overflow: hidden; isolation: isolate; color: var(--bm-sobre-marino); font-size: .97rem;
    padding: calc(clamp(56px, 7vw, 88px) + 3vw) 0 28px;
    background: linear-gradient(135deg, #040F3D 0%, #06175A 50%, #0A2FB5 100%);
    clip-path: polygon(0 3vw, 100% 0, 100% 100%, 0 100%);
}
.bm-footer::before {
    content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
    background: linear-gradient(160deg, rgba(4, 15, 61, .1) 0%, rgba(4, 15, 61, .6) 100%);
    clip-path: polygon(0 55%, 100% 25%, 100% 100%, 0 100%);
}
.bm-footer::after {
    content: "BioMantenimiento"; position: absolute; z-index: -1; left: 50%; bottom: 3.2rem; transform: translateX(-50%); pointer-events: none;
    font-family: var(--bm-display); font-weight: 700; font-size: clamp(4rem, 13vw, 13rem); line-height: .8; letter-spacing: -.02em;
    color: rgba(255, 255, 255, .035); white-space: nowrap;
}
.bm-footer a { color: var(--bm-sobre-marino); text-decoration: none; transition: color .15s ease; }
.bm-footer a:hover { color: #fff; }
.bm-footer__main { display: grid; grid-template-columns: minmax(0, 1.6fr) repeat(4, minmax(0, 1fr)); gap: 40px 32px; padding-bottom: clamp(48px, 7vw, 120px); }
.bm-footer__logo { display: inline-flex; align-items: center; gap: .6rem; font-family: var(--bm-display); font-size: 1.4rem; font-weight: 700; color: #fff !important; margin-bottom: 1rem; }
.bm-footer__logo .bm-marca { background: var(--bm-azul); }
.bm-footer__brand p { max-width: 34ch; margin-bottom: 1.25rem; }
.bm-footer__contacto { display: flex; flex-wrap: wrap; gap: .5rem; }
.bm-footer__boton {
    display: inline-flex; align-items: center; gap: .5rem; padding: .5rem 1rem; border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, .2); background: rgba(255, 255, 255, .06); color: #fff !important; font-size: .92rem; font-weight: 500;
}
.bm-footer__boton:hover { background: rgba(255, 255, 255, .14); border-color: rgba(255, 255, 255, .4); }
.bm-footer__boton .bi { color: var(--bm-azul-300); }
.bm-footer__badges { display: flex; gap: .75rem; align-items: center; flex-wrap: wrap; margin-top: 1.25rem; }
.bm-footer__badges img { height: 36px; width: auto; }
.bm-footer__title { display: flex; align-items: center; gap: .5rem; font-family: var(--bm-font); font-size: .98rem; font-weight: 600; color: #fff; margin: 0 0 1.1rem; }
.bm-footer__title::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--bm-azul-300); }
.bm-footer__list { list-style: none; margin: 0; padding: 0; display: grid; gap: .65rem; }
.bm-footer__list li { display: flex; gap: .55rem; align-items: baseline; line-height: 1.4; }
.bm-footer__list .bi { color: var(--bm-azul-300); }
.bm-footer__bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem; padding-top: 22px; border-top: 1px solid rgba(255, 255, 255, .12); font-size: .9rem; }
.bm-footer__bottom p { margin: 0; }
.bm-footer__bottom a { color: #fff; }
.bm-footer__dev { display: inline-flex; gap: .4rem; align-items: center; }
.bm-footer__dev span { color: var(--bm-gris-claro); }
@media (max-width: 991.98px) { .bm-footer__main { grid-template-columns: repeat(2, minmax(0, 1fr)); } .bm-footer__brand { grid-column: 1 / -1; } }
@media (max-width: 575.98px) {
    .bm-footer__main { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 20px; padding-bottom: 40px; }
    .bm-footer__main > div:last-child { grid-column: 1 / -1; }
    .bm-footer__list { font-size: .92rem; }
    .bm-footer::after { bottom: auto; top: 3vw; font-size: 22vw; }
    .bm-footer__bottom { flex-direction: column; gap: .5rem; }
}

/* ---------------------------------------------------------------------
   Aviso de cookies
   --------------------------------------------------------------------- */
.bm-cookies {
    position: fixed; left: 16px; bottom: 16px; z-index: 1040; max-width: 360px;
    display: flex; gap: 1rem; align-items: center;
    padding: .85rem .9rem .85rem 1.1rem; background: var(--bm-blanco); color: var(--bm-texto);
    border: 1px solid var(--bm-linea); border-radius: var(--bm-radio); box-shadow: var(--bm-sombra-doc);
    font-size: .9rem; line-height: 1.4;
}
.bm-cookies[hidden] { display: none; }
.bm-cookies a { color: var(--bm-azul); }
.bm-cookies .bm-btn { min-height: 38px; padding: .4rem .9rem; font-size: .9rem; }
@media (max-width: 575.98px) { .bm-cookies { left: 12px; right: 84px; bottom: 12px; max-width: none; } }

/* ---------------------------------------------------------------------
   Formularios
   --------------------------------------------------------------------- */
.form-label { font-weight: 600; font-size: .95rem; color: var(--bm-texto); margin-bottom: .35rem; }
.form-control, .form-select {
    min-height: 48px; padding: .65rem .85rem; font-size: 1rem; color: var(--bm-texto);
    background-color: var(--bm-blanco); border: 1.5px solid var(--bm-linea-fuerte); border-radius: var(--bm-radio-doc);
}
.form-control::placeholder { color: var(--bm-gris-claro); }
.form-control:focus, .form-select:focus { border-color: var(--bm-azul); box-shadow: 0 0 0 3px color-mix(in srgb, var(--bm-azul) 18%, transparent); }
textarea.form-control { min-height: 140px; }
.bm-form__nota { display: flex; gap: .45rem; align-items: center; font-size: .88rem; color: var(--bm-gris); margin: .75rem 0 0; }

/* ---------------------------------------------------------------------
   Contacto
   --------------------------------------------------------------------- */
.bm-contacto { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(32px, 6vw, 88px); align-items: start; }
.bm-contacto__form { background: var(--bm-blanco); border: 1px solid var(--bm-linea); border-top: 4px solid var(--bm-azul); border-radius: var(--bm-radio-doc); padding: clamp(24px, 4vw, 44px); box-shadow: var(--bm-sombra-doc); }
.bm-canales { margin: 0; border-top: 1.5px solid var(--bm-texto); }
.bm-canal { display: grid; grid-template-columns: 9rem 1fr; gap: .25rem 1rem; padding: 1.1rem 0; border-bottom: 1px solid var(--bm-linea); }
.bm-canal dt { font-weight: 600; color: var(--bm-gris); font-size: .95rem; }
.bm-canal dd { margin: 0; display: grid; gap: .15rem; }
.bm-canal dd > a, .bm-canal dd > span { font-weight: 600; font-size: 1.05rem; color: var(--bm-texto); }
.bm-canal dd > a:hover { color: var(--bm-azul); }
.bm-canal small { color: var(--bm-gris); font-size: .9rem; }
@media (max-width: 860px) { .bm-contacto { grid-template-columns: 1fr; } }
@media (max-width: 480px) { .bm-canal { grid-template-columns: 1fr; } }

/* ---------------------------------------------------------------------
   Agendar demo
   --------------------------------------------------------------------- */
.bm-aviso-plan { display: inline-flex; gap: .5rem; align-items: center; margin: 1.5rem 0 0; padding: .6rem .9rem; background: var(--bm-celeste); border-left: 3px solid var(--bm-azul); border-radius: var(--bm-radio-doc); font-weight: 500; }
.bm-aviso-plan .bi { color: var(--bm-azul); }
.bm-demo { display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: clamp(28px, 4vw, 56px); align-items: start; }
.bm-demo__calendario { background: var(--bm-blanco); border: 1px solid var(--bm-linea); border-radius: var(--bm-radio-doc); overflow: hidden; box-shadow: var(--bm-sombra-doc); }
.bm-demo__cabeza { font-family: var(--bm-font); font-size: 1rem; font-weight: 600; margin: 0; padding: .9rem 1.2rem; border-bottom: 1px solid var(--bm-linea); background: var(--bm-niebla); }
.bm-demo__iframe { display: block; width: 100%; height: 760px; border: 0; }
.bm-demo__aside { display: grid; gap: 2rem; }
.bm-demo__bloque { border-top: 1.5px solid var(--bm-texto); padding-top: 1rem; }
.bm-demo__bloque .bm-link { display: flex; margin-top: .4rem; }
.bm-demo__titulo { font-size: 1.3rem; margin: 0 0 .9rem; }
.bm-demo__pasos { list-style: none; counter-reset: paso; margin: 0; padding: 0; display: grid; gap: .9rem; }
.bm-demo__pasos li { counter-increment: paso; display: grid; grid-template-columns: 2rem 1fr; gap: .1rem .6rem; }
.bm-demo__pasos li::before { content: counter(paso); grid-row: span 2; display: grid; place-items: center; width: 1.7rem; height: 1.7rem; border-radius: 50%; background: var(--bm-celeste); color: var(--bm-azul-700); font-weight: 700; font-size: .9rem; }
.bm-demo__pasos strong { font-weight: 600; }
.bm-demo__pasos span { color: var(--bm-gris); font-size: .95rem; }
@media (max-width: 991.98px) { .bm-demo { grid-template-columns: 1fr; } .bm-demo__iframe { height: 680px; } }

/* ---------------------------------------------------------------------
   Planes
   --------------------------------------------------------------------- */
.bm-pricing-toolbar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 1rem; margin-bottom: 2rem; }
.bm-billing { display: inline-flex; padding: 4px; background: var(--bm-niebla); border: 1px solid var(--bm-linea); border-radius: 10px; }
.bm-billing button { display: inline-flex; gap: .45rem; align-items: center; border: 0; background: none; padding: .55rem 1rem; border-radius: 7px; font-weight: 600; color: var(--bm-gris); }
.bm-billing button[aria-pressed="true"] { background: var(--bm-blanco); color: var(--bm-texto); box-shadow: 0 1px 3px rgba(6,23,90,.15); }
.bm-plans { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border: 1px solid var(--bm-linea); border-radius: var(--bm-radio-doc); background: var(--bm-blanco); }
.bm-plan { position: relative; display: flex; flex-direction: column; gap: 1.1rem; padding: clamp(24px, 3vw, 36px); }
.bm-plan + .bm-plan { border-left: 1px solid var(--bm-linea); }
.bm-plan--featured { background: var(--bm-marino); color: #fff; margin: -1px; border-radius: var(--bm-radio-doc); box-shadow: inset 0 6px 0 var(--bm-azul); }
.bm-plan--featured + .bm-plan { border-left-color: transparent; }
.bm-plan__name { font-size: 1.7rem; margin: 0; display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.bm-plan--featured .bm-plan__name { color: #fff; }
.bm-plan--featured .bm-pill--info { background: var(--bm-etiqueta); color: var(--bm-texto); }
.bm-plan__for { margin: .35rem 0 0; color: var(--bm-gris); }
.bm-plan--featured .bm-plan__for, .bm-plan--featured .bm-plan__billed, .bm-plan--featured .bm-micro, .bm-plan--featured .bm-checks li { color: var(--bm-sobre-marino); }
.bm-plan--featured .bm-checks li.is-plus { color: #fff; }
.bm-plan--featured .bm-checks .bi { color: var(--bm-azul-300); }
.bm-plan__amount { font-family: var(--bm-display); font-size: clamp(2.4rem, 3.6vw, 3rem); font-weight: 600; line-height: 1; }
.bm-plan__amount small { font-family: var(--bm-font); font-size: 1rem; font-weight: 500; color: var(--bm-gris); }
.bm-plan--featured .bm-plan__amount small { color: var(--bm-sobre-marino); }
.bm-plan__billed { margin: .4rem 0 0; font-size: .92rem; color: var(--bm-gris); }
.bm-plan__limits { display: grid; grid-template-columns: 1fr 1fr; border-block: 1px solid var(--bm-linea); }
.bm-plan--featured .bm-plan__limits { border-color: rgba(255,255,255,.16); }
.bm-plan__limit { padding: .8rem 0; display: grid; }
.bm-plan__limit + .bm-plan__limit { padding-left: 1rem; border-left: 1px solid var(--bm-linea); }
.bm-plan--featured .bm-plan__limit + .bm-plan__limit { border-left-color: rgba(255,255,255,.16); }
.bm-plan__limit strong { font-family: var(--bm-display); font-size: 1.6rem; font-weight: 600; line-height: 1.1; }
.bm-plan__limit span { font-size: .88rem; color: var(--bm-gris); }
.bm-plan--featured .bm-plan__limit span { color: var(--bm-sobre-marino); }
.bm-plan .bm-checks { flex: 1; align-content: start; }
.bm-plan > .bm-btn { width: 100%; }
.bm-plan--featured > .bm-btn { --bm-btn-bg: #fff; --bm-btn-fg: var(--bm-marino); --bm-btn-bd: #fff; }
.bm-plan--featured > .bm-btn:hover { --bm-btn-bg: var(--bm-celeste); --bm-btn-bd: var(--bm-celeste); }
.bm-plan__recommend { position: absolute; top: 14px; right: 14px; }
.bm-plan.is-recommended { outline: 2px solid var(--bm-azul); outline-offset: -2px; }
@media (max-width: 991.98px) {
    .bm-plans { grid-template-columns: 1fr; }
    .bm-plan + .bm-plan { border-left: 0; border-top: 1px solid var(--bm-linea); }
}

.bm-compare-wrap { overflow-x: auto; border-top: 1.5px solid var(--bm-texto); }
.bm-compare { width: 100%; min-width: 640px; border-collapse: collapse; }
.bm-compare th, .bm-compare td { padding: .95rem 1rem; border-bottom: 1px solid var(--bm-linea); text-align: center; }
.bm-compare th:first-child, .bm-compare td:first-child { text-align: left; padding-left: 0; }
.bm-compare thead th { font-family: var(--bm-display); font-size: 1.25rem; font-weight: 600; }
.bm-compare .is-featured { background: var(--bm-celeste); }
.bm-compare .bi-check-circle-fill { color: var(--bm-azul); font-size: 1.1rem; }
.bm-no { color: var(--bm-gris-claro); }

/* Terminos y su descripcion (lo que trae un modulo o un plan) */
.bm-terminos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 clamp(24px, 4vw, 56px); margin: 0; }
.bm-terminos > div { padding: 1.1rem 0; border-top: 1px solid var(--bm-linea); }
.bm-terminos dt { font-weight: 600; font-size: 1.05rem; margin-bottom: .25rem; }
.bm-terminos dd { margin: 0; color: var(--bm-gris); }
.bm-terminos--cuatro { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.bm-terminos--extras { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 991.98px) { .bm-terminos--cuatro, .bm-terminos--extras { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575.98px) { .bm-terminos, .bm-terminos--cuatro, .bm-terminos--extras { grid-template-columns: 1fr; } }

/* ---------------------------------------------------------------------
   Funcionalidades: indice fijo + modulos como un manual
   --------------------------------------------------------------------- */
.bm-manual { display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: clamp(32px, 5vw, 80px); align-items: start; }
.bm-indice { position: sticky; top: calc(var(--bm-header-h) + 24px); display: grid; gap: 1.2rem; }
.bm-indice__cabeza { font-weight: 600; color: var(--bm-gris); margin: 0; font-size: .95rem; }
.bm-indice__titulo { font-family: var(--bm-display); font-size: 1.1rem; font-weight: 600; margin: 0 0 .35rem; }
.bm-indice__grupo ul { list-style: none; margin: 0; padding: 0; border-left: 1px solid var(--bm-linea); }
.bm-indice__grupo a { display: block; padding: .3rem 0 .3rem .9rem; margin-left: -1px; border-left: 2px solid transparent; color: var(--bm-gris); text-decoration: none; font-size: .97rem; }
.bm-indice__grupo a:hover { color: var(--bm-texto); }
.bm-indice__grupo a[aria-current] { color: var(--bm-azul-700); border-left-color: var(--bm-azul); font-weight: 600; }
.bm-indice__cta { margin-top: .5rem; }
.bm-manual__modulos { display: grid; gap: clamp(64px, 8vw, 112px); min-width: 0; }
.bm-modulo { scroll-margin-top: calc(var(--bm-header-h) + 24px); }
.bm-modulo__nombre { display: inline-block; font-family: var(--bm-mono); font-size: .85rem; font-weight: 500; color: var(--bm-azul-700); background: var(--bm-celeste); padding: .2rem .5rem; border-radius: 3px; margin: 0 0 .9rem; }
.bm-modulo__titulo { font-size: clamp(1.9rem, 3vw, 2.6rem); margin: 0 0 .6rem; max-width: 22ch; }
.bm-modulo__entrada { color: var(--bm-gris); font-size: 1.12rem; max-width: 62ch; margin-bottom: 1.6rem; }
.bm-modulo__captura { margin: 0 0 1.5rem; border-radius: var(--bm-radio-foto); overflow: hidden; border: 1px solid var(--bm-linea); box-shadow: var(--bm-sombra-foto); background: var(--bm-niebla); }
.bm-modulo__captura img { display: block; width: 100%; }
@media (max-width: 991.98px) {
    .bm-manual { grid-template-columns: 1fr; }
    .bm-indice { position: sticky; top: var(--bm-header-h); z-index: 5; display: flex; gap: .5rem; overflow-x: auto; padding: .75rem 0; margin-inline: calc(-1 * clamp(16px, 4vw, 40px)); padding-inline: clamp(16px, 4vw, 40px); background: rgba(255,255,255,.96); border-bottom: 1px solid var(--bm-linea); scrollbar-width: none; }
    .bm-indice__cabeza, .bm-indice__titulo, .bm-indice__cta { display: none; }
    .bm-indice__grupo ul { display: flex; gap: .4rem; border: 0; }
    .bm-indice__grupo a { white-space: nowrap; border: 1px solid var(--bm-linea); border-radius: 999px; padding: .35rem .8rem; margin: 0; font-size: .9rem; }
    .bm-indice__grupo a[aria-current] { background: var(--bm-celeste); border-color: var(--bm-azul); }
}

/* ---------------------------------------------------------------------
   Roles
   --------------------------------------------------------------------- */
.bm-roles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 clamp(20px, 3vw, 40px); }
.bm-role { border-top: 1.5px solid var(--bm-texto); padding-top: 1.1rem; }
.bm-role__tag { display: flex; gap: .5rem; align-items: center; font-weight: 600; color: var(--bm-azul); margin-bottom: .6rem; }
.bm-role .bm-h3 { font-size: 1.35rem; }
.bm-role .bm-text { font-size: .98rem; margin: 0; }
@media (max-width: 991.98px) { .bm-roles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem; } }
@media (max-width: 575.98px) { .bm-roles { grid-template-columns: 1fr; } }

/* ---------------------------------------------------------------------
   Video (se inserta al hacer clic)
   --------------------------------------------------------------------- */
.bm-video { position: relative; display: block; width: 100%; aspect-ratio: 16 / 9; padding: 0; border: 0; border-radius: var(--bm-radio-foto); overflow: hidden; background: var(--bm-marino); box-shadow: var(--bm-sombra-foto); }
.bm-video img { width: 100%; height: 100%; object-fit: cover; opacity: .85; transition: opacity .3s ease, transform .6s var(--bm-ease); }
.bm-video:hover img { opacity: 1; transform: scale(1.015); }
.bm-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.bm-video__play { position: absolute; left: 24px; bottom: 24px; display: inline-flex; align-items: center; gap: .6rem; padding: .7rem 1.2rem .7rem .8rem; border-radius: 999px; background: #fff; color: var(--bm-marino); font-weight: 600; }
.bm-video__play .bi { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--bm-azul); color: #fff; font-size: 1.3rem; }

/* ---------------------------------------------------------------------
   Logos de clientes: una cinta que corre sola
   --------------------------------------------------------------------- */
.bm-logos { padding-block: clamp(36px, 5vw, 56px); border-block: 1px solid var(--bm-linea); background: var(--bm-blanco); }
.bm-logos__inner { display: grid; grid-template-columns: minmax(0, 15rem) minmax(0, 1fr); gap: 2rem; align-items: center; }
.bm-logos__label { margin: 0; color: var(--bm-gris); font-size: .98rem; line-height: 1.4; }
.bm-logos__label strong { display: block; font-family: var(--bm-display); font-size: 1.35rem; font-weight: 600; color: var(--bm-texto); }
.bm-logos__cinta { overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.bm-logos__pista { display: flex; width: max-content; gap: clamp(36px, 5vw, 64px); list-style: none; margin: 0; padding: 0; animation: bm-cinta 48s linear infinite; }
.bm-logos__cinta:hover .bm-logos__pista { animation-play-state: paused; }
.bm-logos__item { flex: none; display: grid; place-items: center; height: 64px; }
.bm-logos__item img { max-height: 56px; max-width: 150px; width: auto; filter: grayscale(1) contrast(1.1); opacity: .7; mix-blend-mode: multiply; transition: filter .25s ease, opacity .25s ease; }
.bm-logos__item img:hover { filter: none; opacity: 1; }
@keyframes bm-cinta { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .bm-logos__pista { animation: none; flex-wrap: wrap; width: auto; } }
@media (max-width: 767.98px) { .bm-logos__inner { grid-template-columns: 1fr; gap: 1rem; } }

/* ---------------------------------------------------------------------
   Blog
   --------------------------------------------------------------------- */
.bm-articulos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(36px, 4vw, 56px) clamp(24px, 3vw, 40px); }
.bm-articulo__enlace { display: grid; gap: 1rem; color: inherit; text-decoration: none; }
.bm-articulo__img { aspect-ratio: 16 / 10; border-radius: var(--bm-radio); overflow: hidden; background: var(--bm-niebla); }
.bm-articulo__img img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--bm-ease); }
.bm-articulo__enlace:hover .bm-articulo__img img { transform: scale(1.03); }
.bm-articulo__fecha { font-size: .88rem; color: var(--bm-gris); }
.bm-articulo__titulo { font-size: 1.45rem; margin: .25rem 0 .5rem; }
.bm-articulo__enlace:hover .bm-articulo__titulo { color: var(--bm-azul); }
.bm-articulo__resumen { color: var(--bm-gris); font-size: .98rem; margin: 0; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
@media (max-width: 991.98px) { .bm-articulos { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575.98px) { .bm-articulos { grid-template-columns: 1fr; } }

.bm-lectura__cabeza { padding: clamp(48px, 7vw, 88px) 0 clamp(28px, 4vw, 40px); }
.bm-lectura__cabeza > .container, .bm-lectura > .container { max-width: 860px; }
.bm-lectura__titulo { font-size: clamp(2.2rem, 4.5vw, 3.6rem); line-height: 1.04; margin: 0 0 1rem; }
.bm-lectura__meta { display: flex; flex-wrap: wrap; gap: .25rem 1.25rem; color: var(--bm-gris); font-size: .95rem; margin: 0; }
.bm-lectura__portada { margin: 0 0 clamp(32px, 5vw, 56px); border-radius: var(--bm-radio-foto); overflow: hidden; }
.bm-lectura__portada img { display: block; width: 100%; height: auto; }
.bm-lectura__compartir { display: flex; flex-wrap: wrap; gap: .5rem 1rem; align-items: center; padding: 1.25rem 0; margin-top: 2.5rem; border-top: 1px solid var(--bm-linea); font-weight: 600; }
.bm-lectura__compartir a { display: inline-flex; gap: .35rem; align-items: center; color: var(--bm-texto); text-decoration: none; font-weight: 500; }
.bm-lectura__compartir a:hover { color: var(--bm-azul); }

/* Texto largo: articulos y guias */
.bm-prosa { font-size: 1.12rem; line-height: 1.7; color: #26304A; max-width: 70ch; }
.bm-prosa h2 { font-size: clamp(1.7rem, 2.6vw, 2.2rem); margin: 2.4em 0 .6em; }
.bm-prosa h3 { font-size: 1.4rem; margin: 2em 0 .5em; }
.bm-prosa p, .bm-prosa ul, .bm-prosa ol { margin-bottom: 1.15em; }
.bm-prosa li { margin-bottom: .4em; }
.bm-prosa ul li::marker { color: var(--bm-azul); }
.bm-prosa a { color: var(--bm-azul); font-weight: 500; }
.bm-prosa img { border-radius: var(--bm-radio); margin-block: 1em; }
.bm-prosa blockquote { margin: 1.5em 0; padding: .25em 0 .25em 1.25em; border-left: 3px solid var(--bm-azul); color: var(--bm-texto); font-size: 1.2rem; }
.bm-prosa table { width: 100%; border-collapse: collapse; margin: 1.5em 0; font-size: 1rem; }
.bm-prosa th, .bm-prosa td { border-bottom: 1px solid var(--bm-linea); padding: .7rem .75rem .7rem 0; text-align: left; vertical-align: top; }
.bm-prosa thead th { border-bottom: 1.5px solid var(--bm-texto); font-weight: 600; }
.bm-prosa > :first-child { margin-top: 0; }
.bm-prosa .bm-tabla { overflow-x: auto; }

.bm-entrada { font-size: clamp(1.2rem, 1.6vw, 1.4rem); line-height: 1.5; color: var(--bm-texto); padding-left: 1.1rem; border-left: 4px solid var(--bm-azul); margin: 0 0 1rem; max-width: 62ch; }
.bm-firma { font-size: .92rem; color: var(--bm-gris); margin: 0 0 clamp(32px, 5vw, 56px); }

.bm-blog-mas { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(32px, 6vw, 88px); }
.bm-recientes { list-style: none; margin: 0 0 1.25rem; padding: 0; border-top: 1.5px solid var(--bm-texto); }
.bm-recientes li { display: flex; justify-content: space-between; gap: 1rem; padding: .9rem 0; border-bottom: 1px solid var(--bm-linea); }
.bm-recientes a { font-weight: 600; color: var(--bm-texto); text-decoration: none; }
.bm-recientes a:hover { color: var(--bm-azul); }
.bm-recientes time { flex: none; font-size: .88rem; color: var(--bm-gris); }
.bm-boletin { background: var(--bm-celeste); border-radius: var(--bm-radio-doc); padding: clamp(24px, 3vw, 36px); align-self: start; }
.bm-boletin__form { display: flex; gap: .5rem; flex-wrap: wrap; }
.bm-boletin__form .form-control { flex: 1 1 14rem; }
@media (max-width: 860px) { .bm-blog-mas { grid-template-columns: 1fr; } }

/* ---------------------------------------------------------------------
   Paginas de sector y guias
   --------------------------------------------------------------------- */
.bm-ficha-lista { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 clamp(24px, 3vw, 48px); margin: 0; padding: 0; list-style: none; }
.bm-ficha-lista li { display: grid; grid-template-columns: 2.4rem 1fr; grid-template-rows: min-content 1fr; gap: .3rem .9rem; padding: 1.4rem 0; border-top: 1px solid var(--bm-linea); }
.bm-ficha-lista .bi { grid-row: span 2; display: grid; place-items: center; width: 2.4rem; height: 2.4rem; border-radius: 6px; background: var(--bm-celeste); color: var(--bm-azul-700); font-size: 1.15rem; }
.bm-ficha-lista h3 { font-family: var(--bm-font); font-size: 1.1rem; font-weight: 600; margin: 0; line-height: 1.3; align-self: center; min-height: 2.4rem; display: flex; align-items: center; }
.bm-ficha-lista p { margin: 0; color: var(--bm-gris); font-size: .98rem; }
@media (max-width: 991.98px) { .bm-ficha-lista { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575.98px) { .bm-ficha-lista { grid-template-columns: 1fr; } }

.bm-relacionados { display: flex; flex-wrap: wrap; gap: .6rem; margin: 0; padding: 0; list-style: none; }
.bm-relacionados a { display: inline-flex; align-items: center; gap: .5rem; padding: .6rem 1rem; border: 1.5px solid var(--bm-linea-fuerte); border-radius: var(--bm-radio); color: var(--bm-texto); font-weight: 600; text-decoration: none; transition: border-color .18s ease, background-color .18s ease; }
.bm-relacionados a:hover { border-color: var(--bm-azul); background: var(--bm-celeste); color: var(--bm-azul-700); }
.bm-relacionados .bi { color: var(--bm-azul); }

/* Dos columnas: texto a la izquierda, contexto a la derecha */
.bm-dos { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(28px, 6vw, 96px); align-items: start; }
@media (max-width: 860px) { .bm-dos { grid-template-columns: 1fr; } }

/* ---------------------------------------------------------------------
   Movimiento: nada se mueve si la persona lo pidio asi
   --------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}

/* =====================================================================
   Lenguaje comun de las secciones, el mismo de la portada: titulos
   centrados, tarjetas redondeadas con sombra suave (una destacada en azul
   de marca), botones en pildora, encabezados de pagina sobre el degradado
   corporativo y el cierre como una tarjeta con ese mismo degradado.
   ===================================================================== */
:root {
    --bm-radio-tarjeta: 20px;
    --bm-sombra-tarjeta: 0 1px 2px rgba(6, 23, 90, .04), 0 20px 44px -30px rgba(6, 23, 90, .35);
    --bm-sombra-tarjeta-alta: 0 1px 2px rgba(6, 23, 90, .05), 0 30px 56px -30px rgba(6, 23, 90, .5);
}

/* Botones en pildora */
.bm-btn, .bm-billing, .bm-billing button, .bm-relacionados a { border-radius: 999px; }

/* Titulos de seccion centrados, con su texto debajo */
.bm-section-head, .bm-section-head--center { grid-template-columns: minmax(0, 1fr); justify-items: center; text-align: center; gap: .9rem; }
.bm-section-head .bm-h2 { max-width: 24ch; }
.bm-section-head .bm-lead { max-width: 62ch; margin-inline: auto; }

/* Tarjetas */
.bm-role, .bm-ficha-lista li, .bm-terminos > div {
    padding: 1.5rem; background: #fff; border: 1px solid var(--bm-linea); border-radius: var(--bm-radio-tarjeta);
    box-shadow: var(--bm-sombra-tarjeta); transition: transform .25s var(--bm-ease), box-shadow .25s ease;
}
.bm-role:hover, .bm-ficha-lista li:hover, .bm-terminos > div:hover { transform: translateY(-3px); box-shadow: var(--bm-sombra-tarjeta-alta); }
.bm-roles, .bm-ficha-lista { gap: 20px; }
.bm-terminos, .bm-terminos--cuatro, .bm-terminos--extras { gap: 16px; }
.bm-role__tag .bi { display: inline-grid; place-items: center; width: 2rem; height: 2rem; border-radius: 10px; background: var(--bm-celeste); }
/* La tarjeta destacada del grupo de roles: el tecnico, que es quien usa la app en campo */
.bm-role:nth-child(2) { background: var(--bm-azul); border-color: transparent; color: #fff; }
.bm-role:nth-child(2) .bm-h3 { color: #fff; }
.bm-role:nth-child(2) .bm-text { color: #DCE5FA; }
.bm-role:nth-child(2) .bm-role__tag { color: #fff; }
.bm-role:nth-child(2) .bm-role__tag .bi { background: rgba(255, 255, 255, .16); }

/* Preguntas frecuentes en tarjetas */
.bm-faq__list { display: grid; gap: 12px; border-top: 0; }
.bm-faq__item { padding: 0 1.4rem; background: #fff; border: 1px solid var(--bm-linea); border-radius: 16px; box-shadow: var(--bm-sombra-tarjeta); }
.bm-faq__a { padding-right: 0; }

/* Medios y bloques con las mismas esquinas */
.bm-video, .bm-modulo__captura, .bm-demo__calendario, .bm-contacto__form, .bm-boletin, .bm-lectura__portada { border-radius: 24px; }
.bm-articulo__img { border-radius: 16px; }
.bm-plans { border-radius: 24px; }
.bm-plan--featured { border-radius: 24px; }
.bm-compare-wrap { border-top: 0; background: #fff; border: 1px solid var(--bm-linea); border-radius: 20px; padding: 0 1.25rem; box-shadow: var(--bm-sombra-tarjeta); }
.bm-compare th:last-child, .bm-compare td:last-child { padding-right: 0; }
.bm-canales { padding: .25rem 1.4rem; border-top: 0; background: #fff; border: 1px solid var(--bm-linea); border-radius: 20px; box-shadow: var(--bm-sombra-tarjeta); }
.bm-canal:last-child { border-bottom: 0; }

/* Encabezado de las paginas internas: el mismo fondo de la portada (degradado y cuna diagonal) */
.bm-page-head {
    position: relative; overflow: hidden; isolation: isolate; color: #fff; border-bottom: 0;
    margin-top: calc(-1 * var(--bm-header-h) - 1px);
    padding: calc(var(--bm-header-h) + clamp(48px, 6vw, 88px)) 0 clamp(48px, 6vw, 80px);
    background:
        radial-gradient(45% 70% at 80% 30%, rgba(120, 160, 255, .3), transparent 70%),
        linear-gradient(135deg, #040F3D 0%, #0A2FB5 60%, #0540F2 100%);
}
.bm-page-head::before {
    content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
    background: linear-gradient(160deg, rgba(4, 15, 61, .25) 0%, rgba(4, 15, 61, .7) 100%);
    clip-path: polygon(0 72%, 100% 30%, 100% 100%, 0 100%);
}
.bm-page-head .bm-h1 { color: #fff; }
.bm-page-head .bm-lead { color: #C9D5F5; }
.bm-page-head .bm-eyebrow { color: var(--bm-azul-300); }
.bm-page-head .bm-migas, .bm-page-head .bm-migas a { color: var(--bm-sobre-marino); }
.bm-page-head .bm-migas [aria-current] { color: #fff; }
.bm-page-head .bm-migas > * + *::before { color: rgba(255, 255, 255, .35); }
.bm-page-head .bm-btn--secondary { --bm-btn-bg: transparent; --bm-btn-fg: #fff; --bm-btn-bd: rgba(255, 255, 255, .45); }
.bm-page-head .bm-btn--secondary:hover { --bm-btn-bg: rgba(255, 255, 255, .08); --bm-btn-fg: #fff; --bm-btn-bd: #fff; }
.bm-page-head .bm-page-head__acciones .bm-btn:not(.bm-btn--secondary) { --bm-btn-bg: #fff; --bm-btn-fg: var(--bm-marino); --bm-btn-bd: #fff; }
.bm-page-head .bm-aviso-plan { color: var(--bm-texto); }

/* Cierre: una tarjeta con el degradado corporativo, la cuna diagonal y una palabra de fondo */
.bm-close { background: transparent; color: var(--bm-texto); padding-block: clamp(56px, 7vw, 104px); overflow: visible; }
.bm-close__grid {
    position: relative; overflow: hidden; isolation: isolate; color: #fff;
    padding: clamp(36px, 5vw, 72px); border-radius: 28px; background: var(--bm-franja);
    box-shadow: 0 40px 80px -40px rgba(6, 23, 90, .6);
}
.bm-close__grid::before {
    content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
    background: linear-gradient(160deg, rgba(4, 15, 61, .2) 0%, rgba(4, 15, 61, .65) 100%);
    clip-path: polygon(0 70%, 100% 25%, 100% 100%, 0 100%);
}
.bm-close__grid::after {
    content: "DEMO"; position: absolute; z-index: -1; right: -1.5rem; bottom: -2.5rem; pointer-events: none;
    font-family: var(--bm-display); font-weight: 700; font-size: clamp(7rem, 16vw, 14rem); line-height: .8;
    color: rgba(255, 255, 255, .06); white-space: nowrap;
}

/* =====================================================================
   ESTANDAR DE SECCIONES: como cambia el fondo de una seccion a otra
   ---------------------------------------------------------------------
   1. Cada seccion responde una pregunta del cliente (que es, que problema
      resuelve, como funciona, que incluye, para quien es, dudas, como
      empiezo). Cuando cambia la pregunta, cambia el fondo.
   2. Tres tonos:
        .bm-fondo-blanco  contenido principal
        .bm-fondo-claro   contenido de apoyo (azul muy suave)
        .bm-fondo-marino  solo momentos de demostracion; entra en diagonal
   3. Dos secciones que responden la misma pregunta comparten fondo y la
      segunda lleva .bm-mismo-tema (menos aire arriba, sin etiqueta).
   4. Cada tema nuevo abre con su etiqueta: <span class="bm-tema">El problema</span>
   5. Nunca dos fondos iguales seguidos si cambia el tema. El cierre va
      siempre antes del pie; si la seccion anterior es blanca, el cierre
      usa .bm-close--claro.
   ===================================================================== */
.bm-fondo-blanco { background: #fff; }
.bm-fondo-claro, .bm-section--mist, .bm-section--paper { background: var(--bm-niebla); }
.bm-fondo-marino {
    position: relative; isolation: isolate; color: #fff;
    background: linear-gradient(135deg, #040F3D 0%, #06175A 45%, #0A2FB5 100%);
    clip-path: polygon(0 0, 100% 4vw, 100% 100%, 0 100%); padding-top: calc(var(--bm-section) + 4vw);
}
.bm-fondo-marino .bm-h2, .bm-fondo-marino .bm-h3 { color: #fff; }
.bm-fondo-marino .bm-lead, .bm-fondo-marino .bm-text { color: var(--bm-sobre-marino); }
.bm-section.bm-mismo-tema { padding-top: clamp(8px, 1.5vw, 24px); }

/* Etiqueta de tema: dice en que punto de la explicacion esta el visitante */
.bm-tema {
    display: inline-flex; align-items: center; gap: .45rem; width: max-content;
    padding: .35rem .9rem; border-radius: 999px; background: var(--bm-celeste); color: var(--bm-azul-700);
    font-size: .88rem; font-weight: 600; line-height: 1.2;
}
.bm-tema::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.bm-fondo-claro .bm-tema { background: #fff; box-shadow: 0 1px 2px rgba(6, 23, 90, .06); }
.bm-fondo-marino .bm-tema, .journey9.bm-ot .bm-tema { background: rgba(255, 255, 255, .1); color: var(--bm-azul-300); }
.bm-section-head .bm-tema { margin-bottom: -.1rem; }

/* El cierre sobre fondo claro, cuando la seccion anterior es blanca */
.bm-close--claro { background: var(--bm-niebla); }

/* =====================================================================
   Funcionalidades con el estandar: encabezado (marino), mapa de modulos
   (blanco), recorrido (marino, en diagonal), manual (claro, cada modulo
   en su tarjeta blanca) y cierre (blanco).
   ===================================================================== */
.bm-mapa__grupos { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; }
.bm-mapa__grupo {
    padding: 1.5rem; background: #fff; border: 1px solid var(--bm-linea); border-radius: var(--bm-radio-tarjeta);
    box-shadow: var(--bm-sombra-tarjeta);
}
.bm-mapa__grupo:first-child { background: var(--bm-azul); border-color: transparent; color: #fff; }
.bm-mapa__icono { display: grid; place-items: center; width: 2.6rem; height: 2.6rem; border-radius: 12px; background: var(--bm-celeste); color: var(--bm-azul); font-size: 1.2rem; margin-bottom: 1rem; }
.bm-mapa__grupo:first-child .bm-mapa__icono { background: rgba(255, 255, 255, .16); color: #fff; }
.bm-mapa__grupo h3 { font-size: 1.35rem; margin: 0 0 .75rem; }
.bm-mapa__grupo:first-child h3 { color: #fff; }
.bm-mapa__grupo ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.bm-mapa__grupo a { display: flex; justify-content: space-between; align-items: center; gap: .5rem; padding: .45rem 0; border-bottom: 1px solid var(--bm-linea); color: var(--bm-texto); text-decoration: none; font-weight: 500; }
.bm-mapa__grupo li:last-child a { border-bottom: 0; }
.bm-mapa__grupo a .bi { color: var(--bm-azul); opacity: .5; transition: transform .2s var(--bm-ease), opacity .2s; }
.bm-mapa__grupo a:hover { color: var(--bm-azul); }
.bm-mapa__grupo a:hover .bi { opacity: 1; transform: translateY(2px); }
.bm-mapa__grupo:first-child a { color: #fff; border-bottom-color: rgba(255, 255, 255, .18); }
.bm-mapa__grupo:first-child a .bi { color: #fff; }
@media (max-width: 991.98px) { .bm-mapa__grupos { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575.98px) { .bm-mapa__grupos { grid-template-columns: 1fr; } }

/* Manual: el indice y cada modulo como tarjetas sobre el fondo claro */
.bm-manual { gap: clamp(24px, 3vw, 40px); }
.bm-manual__modulos { gap: 24px; }
.bm-modulo {
    padding: clamp(24px, 3.5vw, 48px); background: #fff; border: 1px solid var(--bm-linea);
    border-radius: 28px; box-shadow: var(--bm-sombra-tarjeta);
}
.bm-modulo__nombre {
    display: inline-flex; align-items: center; gap: .45rem; padding: .35rem .9rem; border-radius: 999px;
    background: var(--bm-celeste); color: var(--bm-azul-700); font-family: var(--bm-font); font-size: .88rem; font-weight: 600;
}
.bm-modulo__nombre::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.bm-modulo__captura { border-radius: 18px; }
.bm-modulo .bm-terminos > div { box-shadow: none; background: var(--bm-niebla); border-color: transparent; }
.bm-modulo .bm-terminos > div:hover { transform: none; box-shadow: none; }
@media (min-width: 992px) {
    .bm-indice { padding: 1.4rem; background: #fff; border: 1px solid var(--bm-linea); border-radius: 24px; box-shadow: var(--bm-sombra-tarjeta); }
}
.bm-modulo .bm-modulo__titulo { max-width: 30ch; }
@media (max-width: 575.98px) {
    .bm-modulo { padding: 20px 16px; border-radius: 22px; }
    .bm-modulo .bm-terminos > div { padding: 1rem; }
    .bm-mapa__grupo:first-child { order: 0; }
}

/* ---------------------------------------------------------------------
   Funcionalidades: un bloque por modulo. Texto y captura en dos columnas,
   alternando el lado y el fondo (blanco / claro) de un modulo a otro.
   --------------------------------------------------------------------- */
.bm-bloque { scroll-margin-top: var(--bm-header-h); }
.bm-bloque__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 5vw, 80px); align-items: center; }
.bm-bloque--inverso .bm-bloque__texto { order: 2; }
.bm-bloque--sin-captura .bm-bloque__grid { grid-template-columns: minmax(0, 1fr); }
.bm-bloque--sin-captura .bm-terminos--checks { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem 2.5rem; }
.bm-bloque__texto .bm-h2 { margin: 1rem 0 .6rem; max-width: 20ch; }
.bm-bloque__texto .bm-lead { margin-bottom: 1.5rem; }
.bm-bloque__captura {
    margin: 0; border-radius: 20px; overflow: hidden; border: 1px solid var(--bm-linea); background: var(--bm-niebla);
    box-shadow: 0 40px 80px -44px rgba(6, 23, 90, .5);
}
.bm-bloque__captura img { display: block; width: 100%; height: auto; }
/* Entrada de la captura al llegar a ella */
.bm-bloque__captura.aparece { opacity: 0; transform: translateY(28px) scale(.98); transition: opacity .7s ease, transform .9s var(--bm-ease); }
.bm-bloque--inverso .bm-bloque__captura.aparece { transform: translateY(28px) scale(.98); }
.bm-bloque__captura.aparece.is-visible { opacity: 1; transform: none; }

/* Puntos del modulo como lista con check, sin tarjetas */
.bm-terminos--checks { display: grid; grid-template-columns: 1fr; gap: .9rem; margin: 0; }
.bm-terminos--checks > div,
.bm-terminos--checks > div:hover { position: relative; padding: 0 0 0 2.1rem; background: none; border: 0; border-radius: 0; box-shadow: none; transform: none; }
.bm-terminos--checks > div::before {
    content: "\f272"; font-family: "bootstrap-icons"; position: absolute; left: 0; top: .1rem;
    display: grid; place-items: center; width: 1.4rem; height: 1.4rem; border-radius: 50%;
    background: var(--bm-celeste); color: var(--bm-azul); font-size: .8rem;
}
.bm-fondo-claro .bm-terminos--checks > div::before { background: #fff; }
.bm-terminos--checks dt { font-size: 1.02rem; margin-bottom: .1rem; }
.bm-terminos--checks dd { font-size: .97rem; }

/* Bloque final "Y ademas": tarjetas en tres columnas */
#y-ademas .bm-terminos--extras > div { background: #fff; }
#y-ademas.bm-fondo-blanco .bm-terminos--extras > div { background: var(--bm-niebla); box-shadow: none; }

@media (max-width: 991.98px) {
    .bm-bloque__grid { grid-template-columns: minmax(0, 1fr); gap: 32px; }
    .bm-bloque--inverso .bm-bloque__texto { order: 0; }
    .bm-bloque--sin-captura .bm-terminos--checks { grid-template-columns: 1fr; }
}
.bm-bloque--inverso .bm-bloque__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
@media (max-width: 991.98px) { .bm-bloque--inverso .bm-bloque__grid { grid-template-columns: minmax(0, 1fr); } }

/* ---------------------------------------------------------------------
   Riel de modulos (Funcionalidades): puntos fijos al borde derecho que
   marcan el modulo que se lee. Solo aparece en la zona de modulos.
   --------------------------------------------------------------------- */
.bm-riel { position: fixed; z-index: 1010; opacity: 0; pointer-events: none; transition: opacity .3s ease, transform .3s var(--bm-ease); }
.bm-riel.is-visible { opacity: 1; pointer-events: auto; }
.bm-riel__movil { display: none; }
.bm-riel__puntos { list-style: none; margin: 0; padding: 10px 8px; display: grid; gap: 6px; border-radius: 999px; background: rgba(255, 255, 255, .85); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); border: 1px solid var(--bm-linea); box-shadow: var(--bm-sombra-tarjeta); }
.bm-riel__puntos a { position: relative; display: grid; place-items: center; width: 16px; height: 16px; text-decoration: none; }
.bm-riel__puntos a i { display: block; width: 7px; height: 7px; border-radius: 999px; background: var(--bm-linea-fuerte); transition: height .3s var(--bm-ease), background-color .2s; }
.bm-riel__puntos a:hover i { background: var(--bm-azul-300); }
.bm-riel__puntos a[aria-current] i { height: 18px; background: var(--bm-azul); }
.bm-riel__puntos a[aria-current] { height: 22px; }
/* Nombre del modulo: siempre en el actual, al pasar el mouse en los demas */
.bm-riel__nombre {
    position: absolute; right: calc(100% + 14px); top: 50%; transform: translate(6px, -50%); white-space: nowrap;
    padding: .3rem .75rem; border-radius: 999px; background: var(--bm-marino); color: #fff; font-size: .82rem; font-weight: 600;
    opacity: 0; pointer-events: none; transition: opacity .2s ease, transform .25s var(--bm-ease);
    box-shadow: 0 10px 24px -12px rgba(6, 23, 90, .6);
}
.bm-riel__puntos a:hover .bm-riel__nombre { opacity: 1; transform: translate(0, -50%); }
.bm-riel__puntos a[aria-current] .bm-riel__nombre { background: var(--bm-azul); }
.bm-riel.is-cambio a[aria-current] .bm-riel__nombre, .bm-riel__puntos:hover a[aria-current]:hover .bm-riel__nombre { opacity: 1; transform: translate(0, -50%); }
.bm-riel__puntos:hover a[aria-current]:not(:hover) .bm-riel__nombre { opacity: 0; }

@media (min-width: 992px) {
    .bm-riel { right: 18px; top: 50%; transform: translate(8px, -50%); }
    .bm-riel.is-visible { transform: translate(0, -50%); }
}
/* Celular y tablet: una pildora abajo con el modulo actual y la barra de avance */
@media (max-width: 991.98px) {
    .bm-riel { left: 12px; right: 84px; bottom: 16px; transform: translateY(12px); }
    .bm-riel.is-visible { transform: none; }
    .bm-riel__puntos { display: none; }
    .bm-riel__movil {
        position: relative; display: flex; align-items: center; gap: .6rem; overflow: hidden;
        padding: .7rem 1rem; border-radius: 999px; background: var(--bm-marino); color: #fff; text-decoration: none;
        box-shadow: 0 14px 30px -14px rgba(6, 23, 90, .7);
    }
    .bm-riel__movil:hover { color: #fff; }
    .bm-riel__pos { flex: none; font-size: .8rem; color: var(--bm-azul-300); font-weight: 600; }
    .bm-riel__actual { flex: 1; min-width: 0; font-size: .9rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .bm-riel__movil > .bi { flex: none; font-size: 1.2rem; }
    .bm-riel__barra { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: rgba(255, 255, 255, .12); }
    .bm-riel__barra i { display: block; height: 100%; width: 0; background: var(--bm-azul-300); transition: width .4s var(--bm-ease); }
}
@media (prefers-reduced-motion: reduce) { .bm-riel, .bm-riel__nombre { transition: none; } }

/* ---------------------------------------------------------------------
   Planes con el estandar: la tarjeta destacada en azul de marca (como en
   el resto del sitio), cada plan como tarjeta y la insignia en pildora.
   --------------------------------------------------------------------- */
.bm-pricing-toolbar { margin-top: -8px; }
.bm-plans { gap: 20px; border: 0; background: none; align-items: stretch; }
.bm-plan, .bm-plan + .bm-plan {
    border: 1px solid var(--bm-linea); border-radius: 24px; background: #fff; box-shadow: var(--bm-sombra-tarjeta);
    transition: transform .25s var(--bm-ease), box-shadow .25s ease;
}
.bm-plan:hover { transform: translateY(-4px); box-shadow: var(--bm-sombra-tarjeta-alta); }
.bm-plan--featured, .bm-plan--featured + .bm-plan { margin: 0; }
.bm-plan.bm-plan--featured {
    position: relative; overflow: hidden; isolation: isolate; border-color: transparent;
    background: var(--bm-franja); box-shadow: 0 40px 70px -36px rgba(5, 64, 242, .65);
}
.bm-plan--featured::before {
    content: ""; position: absolute; inset: 0; z-index: -1; pointer-events: none;
    background: linear-gradient(160deg, rgba(4, 15, 61, .1) 0%, rgba(4, 15, 61, .55) 100%);
    clip-path: polygon(0 62%, 100% 34%, 100% 100%, 0 100%);
}
.bm-plan--featured .bm-pill--info { background: #fff; color: var(--bm-azul-700); border-radius: 999px; padding: .25rem .7rem; }
.bm-plan--featured .bm-plan__limits, .bm-plan--featured .bm-plan__limit + .bm-plan__limit { border-color: rgba(255, 255, 255, .22); }
.bm-plan--featured .bm-checks .bi { color: #fff; }
.bm-plan .bm-checks .bi { color: var(--bm-azul); }
.bm-plan__recommend { border-radius: 999px; }
.bm-plan.is-recommended { outline: 3px solid var(--bm-ok); outline-offset: 3px; }
@media (max-width: 991.98px) {
    .bm-plans { grid-template-columns: 1fr; }
    .bm-plan + .bm-plan { border-top: 1px solid var(--bm-linea); }
}

.bm-plan.bm-plan--featured .bm-checks .bi { color: #fff; }

/* ---------------------------------------------------------------------
   Blog: tarjetas con el estandar, el articulo mas reciente destacado
   en la primera pagina y el paginador en pildoras.
   --------------------------------------------------------------------- */
.bm-blog-cabeza { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: 28px; }
.bm-blog-resumen { margin: 0; color: var(--bm-gris); font-weight: 600; }
.bm-articulos { gap: 24px; }
.bm-articulo { background: #fff; border: 1px solid var(--bm-linea); border-radius: 20px; overflow: hidden; box-shadow: var(--bm-sombra-tarjeta); transition: transform .25s var(--bm-ease), box-shadow .25s ease; }
.bm-articulo:hover { transform: translateY(-4px); box-shadow: var(--bm-sombra-tarjeta-alta); }
.bm-articulo__enlace { height: 100%; gap: 0; }
.bm-articulo__img { border-radius: 0; }
.bm-articulo__texto { padding: 1.25rem 1.4rem 1.5rem; }
.bm-articulo__fecha { display: inline-flex; padding: .2rem .6rem; border-radius: 999px; background: var(--bm-celeste); color: var(--bm-azul-700); font-size: .8rem; font-weight: 600; }
.bm-articulo__titulo { font-size: 1.35rem; margin: .6rem 0 .45rem; }

/* Articulo mas reciente: ocupa todo el ancho, imagen a la izquierda */
.bm-articulo--destacado { grid-column: 1 / -1; }
.bm-articulo--destacado .bm-articulo__enlace { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
.bm-articulo--destacado .bm-articulo__img { aspect-ratio: auto; min-height: 320px; }
.bm-articulo--destacado .bm-articulo__texto { align-self: center; padding: clamp(24px, 3vw, 44px); }
.bm-articulo--destacado .bm-articulo__titulo { font-size: clamp(1.7rem, 2.6vw, 2.3rem); }
.bm-articulo--destacado .bm-articulo__resumen { -webkit-line-clamp: 4; font-size: 1.02rem; }

/* Paginador */
.bm-paginador { margin-top: 40px; }
.bm-paginador ul { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px; margin: 0; padding: 0; list-style: none; }
.bm-paginador__num, .bm-paginador__flecha {
    display: inline-flex; align-items: center; justify-content: center; gap: .45rem; min-width: 44px; height: 44px; padding: 0 .9rem;
    border-radius: 999px; border: 1px solid var(--bm-linea); background: #fff; color: var(--bm-texto); font-weight: 600; text-decoration: none;
    transition: border-color .2s, color .2s, background-color .2s;
}
a.bm-paginador__num:hover, a.bm-paginador__flecha:hover { border-color: var(--bm-azul); color: var(--bm-azul); }
.bm-paginador__num.is-actual { background: var(--bm-azul); border-color: var(--bm-azul); color: #fff; }
.bm-paginador__flecha.is-off { opacity: .4; }
.bm-paginador__puntos { padding: 0 .25rem; color: var(--bm-gris); }
@media (max-width: 767.98px) {
    .bm-articulo--destacado .bm-articulo__enlace { grid-template-columns: 1fr; }
    .bm-articulo--destacado .bm-articulo__img { min-height: 0; aspect-ratio: 16 / 10; }
    .bm-paginador__flecha span { display: none; }
}