/* =====================================================================
   BioMantenimiento · portada
   ---------------------------------------------------------------------
   Va despues de site.css y usa sus tokens. El comparador (.compare7) y la
   orden de trabajo (.journey9) conservan su CSS original; los alias de
   abajo los pasan a la paleta nueva sin reescribirlos.
   ===================================================================== */
:root {
    --ink: var(--bm-texto);
    --ink-2: var(--bm-gris);
    --deep: var(--bm-azul-700);
    --blue: var(--bm-azul);
    --light: #DCE6FF;
    --mist: var(--bm-niebla);
    --white: #FFFFFF;
    --ok: var(--bm-ok);
    --line: var(--bm-linea);
    --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
    --ease-io: cubic-bezier(0.77, 0, 0.175, 1);
    --ease-drawer: cubic-bezier(0.32, 0.72, 0, 1);
    --display: var(--bm-display);
    --mono: var(--bm-mono);
}

/* ---------------------------------------------------------------------
   Portada: el texto a la izquierda sobre la franja corporativa y, a la
   derecha, la plataforma en el portatil y en el celular, con la etiqueta
   de inventario del equipo pegada delante.
   --------------------------------------------------------------------- */
.bm-portada {
    position: relative; overflow: hidden; isolation: isolate; color: #fff;
    margin-top: calc(-1 * var(--bm-header-h) - 1px);
    padding: calc(var(--bm-header-h) + clamp(36px, 5vw, 72px)) 0 clamp(56px, 7vw, 96px);
    background:
        radial-gradient(48% 60% at 72% 46%, rgba(120, 160, 255, .38), transparent 70%),
        linear-gradient(135deg, #040F3D 0%, #0A2FB5 55%, #0540F2 100%);
}
/* Cuna diagonal en marino: parte el fondo en dos planos y le da movimiento */
.bm-portada::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 64%, 100% 20%, 100% 100%, 0 100%);
}
/* Palabra de fondo, enorme y casi transparente, detras de los equipos */
.bm-portada::after {
    content: "CMMS"; position: absolute; z-index: -1; right: max(-1vw, calc((100vw - var(--bm-max)) / 2 - 2rem)); top: calc(var(--bm-header-h) + 8px);
    font-family: var(--bm-display); font-weight: 700; font-size: clamp(9rem, 24vw, 22rem); line-height: .8; letter-spacing: -.02em;
    color: rgba(255, 255, 255, .07); pointer-events: none; user-select: none; white-space: nowrap;
}
@media (max-width: 991.98px) {
    .bm-portada::after { top: auto; bottom: 30%; font-size: 34vw; }
    .bm-portada::before { clip-path: polygon(0 70%, 100% 48%, 100% 100%, 0 100%); }
}
.bm-portada > .container { position: relative; }
.bm-portada__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(28px, 4vw, 64px); align-items: center; }
.bm-portada .bm-h1 { font-size: clamp(2.8rem, 4.5vw, 4.3rem); line-height: 1; max-width: none; color: #fff; }
.bm-portada .bm-h1 em { font-style: normal; color: var(--bm-azul-300); }
.bm-portada .bm-lead { max-width: 46ch; color: #C9D5F5; }
.bm-portada__antetitulo { display: inline-block; margin-bottom: 1rem; font-weight: 600; color: var(--bm-azul-300); }
.bm-portada__funciones { list-style: none; margin: 1.5rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .6rem 1.75rem; max-width: 34rem; }
.bm-portada__funciones li { display: flex; align-items: center; gap: .6rem; color: #DCE5FA; font-size: .98rem; line-height: 1.3; }
.bm-portada__funciones .bi { flex: none; color: var(--bm-azul-300); font-size: 1.05rem; }
@media (max-width: 575.98px) { .bm-portada__funciones { grid-template-columns: 1fr; } }

.bm-portada__acciones { display: flex; flex-wrap: wrap; gap: .75rem; margin: 1.9rem 0 1.6rem; }
.bm-portada__nota { display: flex; align-items: center; gap: .5rem; margin: 0; font-size: .92rem; color: var(--bm-sobre-marino); }
.bm-portada__nota .bi { color: var(--bm-azul-300); }


.bm-portada__visual { position: relative; padding: 44px 0 52px; }


@media (max-width: 991.98px) {
    .bm-portada__grid { grid-template-columns: 1fr; }
    .bm-portada .bm-h1 { max-width: 16ch; }
    .bm-portada__visual { width: 100%; max-width: 680px; margin: 1.5rem auto 0; }
}
@media (max-width: 575.98px) {
    .bm-portada__acciones .bm-btn { flex: 1 1 100%; }
    .bm-portada { padding-bottom: 72px; }
}

/* ---------------------------------------------------------------------
   Equipos de la portada: la plataforma real en el portatil y el celular.
   Sombra en el suelo y luz azul detras para que se integren al fondo; los
   avisos salen de lo que muestran las pantallas (la alerta de la caldera y
   la hoja de vida abierta con QR), marcados con un punto que late.
   --------------------------------------------------------------------- */
.bm-equipos { position: relative; isolation: isolate; }
.bm-equipos__img { position: relative; display: block; width: 100%; height: auto; pointer-events: none; }
.bm-equipos::before {
    content: ""; position: absolute; z-index: -1; inset: 4% 14% 30% 22%;
    background: radial-gradient(closest-side, rgba(110, 150, 255, .5), transparent); filter: blur(28px);
}
.bm-equipos::after {
    content: ""; position: absolute; z-index: -1; left: 2%; right: 0; bottom: -4%; height: 11%;
    background: radial-gradient(closest-side, rgba(2, 8, 40, .7), transparent); filter: blur(8px);
}

/* Puntos sobre las pantallas: la alerta del portatil y el boton "Ver QR" del celular */
.bm-punto { position: absolute; z-index: 1; width: 12px; height: 12px; margin: -6px 0 0 -6px; border-radius: 50%; border: 2px solid #fff; }
.bm-punto::after { content: ""; position: absolute; inset: -2px; border-radius: 50%; animation: bm-punto 2s ease-out infinite; }
.bm-punto--alerta { left: 79.4%; top: 24.8%; background: var(--bm-vencido); }
.bm-punto--alerta::after { box-shadow: 0 0 0 0 rgba(210, 63, 44, .6); }
.bm-punto--qr { left: 88.9%; top: 78.6%; background: var(--bm-ok); }
.bm-punto--qr::after { box-shadow: 0 0 0 0 rgba(14, 159, 119, .6); animation-delay: 1s; }
@keyframes bm-punto { 0% { box-shadow: 0 0 0 0 currentColor; opacity: 1; } 100% { box-shadow: 0 0 0 14px transparent; opacity: 0; } }
.bm-punto--alerta { color: rgba(210, 63, 44, .55); }
.bm-punto--qr { color: rgba(14, 159, 119, .55); }

/* Avisos */
.bm-avisos { list-style: none; margin: 0; padding: 0; }
.bm-aviso {
    position: absolute; z-index: 2; display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; column-gap: 11px; align-items: center;
    width: max-content; max-width: 310px; padding: 9px 14px 9px 9px; border-radius: 14px;
    background: rgba(255, 255, 255, .98); color: var(--bm-texto); font-size: 13px; line-height: 1.25;
    box-shadow: 0 1px 2px rgba(2, 8, 40, .12), 0 18px 36px -16px rgba(2, 8, 40, .6);
}
.bm-aviso > .bi { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; font-size: 16px; }
.bm-aviso__texto { min-width: 0; }
.bm-aviso__texto b { display: block; font-size: 13.5px; font-weight: 600; }
.bm-aviso__texto span { display: block; margin-top: 1px; color: var(--bm-gris); font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bm-aviso small { align-self: start; margin: 2px 0 0 4px; color: var(--bm-gris-claro); font-size: 11px; white-space: nowrap; }
.bm-aviso--vencido { top: -4%; right: 2%; }
.bm-aviso--vencido > .bi { background: var(--bm-vencido-suave); color: var(--bm-vencido); }
.bm-aviso--orden { bottom: 5%; left: -3%; }
.bm-aviso--orden > .bi { background: var(--bm-celeste); color: var(--bm-azul); }
.bm-aviso--qr { bottom: -6%; right: 4%; }
.bm-aviso--qr > .bi { background: var(--bm-ok-suave); color: var(--bm-ok); }

/* Portatiles pequenos: columnas iguales, titulo menor y sin la tarjeta del medio */
@media (min-width: 992px) and (max-width: 1279.98px) {
    .bm-portada__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
    .bm-portada .bm-h1 { font-size: clamp(2.6rem, 4.2vw, 3.3rem); }
    .bm-portada .bm-lead { font-size: 1.05rem; }
    .bm-portada__funciones { grid-template-columns: 1fr 1fr; gap: .5rem 1rem; }
    .bm-portada__funciones li { font-size: .9rem; }
    .bm-aviso--orden { display: none; }
}
/* Escritorio: la portada ocupa la pantalla y centra su contenido */
@media (min-width: 992px) {
    .bm-portada { display: flex; align-items: center; min-height: min(100svh, 940px); }
    .bm-portada > .container { width: 100%; }
}
/* Pantallas grandes: titulo y texto acordes al ancho */
@media (min-width: 1600px) {
    .bm-portada .bm-h1 { font-size: 4.9rem; }
    .bm-portada .bm-lead { font-size: 1.3rem; max-width: 50ch; }
    .bm-portada__funciones { max-width: 38rem; }
    .bm-portada__funciones li { font-size: 1.05rem; }
}
/* Celular */
@media (max-width: 575.98px) {
    .bm-aviso { max-width: 82%; grid-template-columns: 30px minmax(0, 1fr) auto; column-gap: 8px; padding: 7px 10px 7px 7px; font-size: 12px; }
    .bm-aviso > .bi { width: 30px; height: 30px; font-size: 14px; border-radius: 8px; }
    .bm-aviso__texto b { font-size: 12.5px; }
    .bm-aviso__texto span { font-size: 11.5px; }
    .bm-aviso--orden { display: none; }
    .bm-aviso--vencido { top: -8%; right: 0; }
    .bm-aviso--qr { bottom: -10%; right: 0; }
    .bm-portada__visual { padding-bottom: 44px; }
}
@media (prefers-reduced-motion: reduce) { .bm-punto::after { animation: none; } }

/* ---------------------------------------------------------------------
   Que es: respuesta corta y tres datos concretos
   --------------------------------------------------------------------- */
.bm-definicion__texto { font-size: clamp(1.2rem, 1.7vw, 1.45rem); line-height: 1.5; color: var(--bm-texto); max-width: 54ch; margin: 0 0 1.75rem; }
.bm-definicion__datos { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 1.5rem; }
.bm-definicion__datos li { display: flex; gap: .6rem; align-items: baseline; padding-top: .9rem; border-top: 1.5px solid var(--bm-texto); font-weight: 600; line-height: 1.35; }
.bm-definicion__datos .bi { color: var(--bm-azul); }
@media (max-width: 575.98px) { .bm-definicion__datos { grid-template-columns: 1fr; gap: 1rem; } }

/* ---------------------------------------------------------------------
   Modulos: pestañas a la izquierda, la captura real a la derecha
   --------------------------------------------------------------------- */
.bm-modulos__caja { display: grid; grid-template-columns: 230px minmax(0, 1fr); gap: clamp(24px, 4vw, 64px); align-items: start; }
.bm-modulos__pestanas { list-style: none; margin: 0; padding: 0; border-left: 1px solid var(--bm-linea); position: sticky; top: calc(var(--bm-header-h) + 24px); }
.bm-modulos__pestanas button {
    display: block; width: 100%; margin-left: -1px; padding: .7rem 1rem; text-align: left;
    background: none; border: 0; border-left: 3px solid transparent;
    font-size: 1.05rem; font-weight: 500; color: var(--bm-gris); transition: color .15s ease, border-color .15s ease;
}
.bm-modulos__pestanas button:hover { color: var(--bm-texto); }
.bm-modulos__pestanas button[aria-selected="true"] { color: var(--bm-texto); font-weight: 600; border-left-color: var(--bm-azul); }
.bm-modulos__panel { display: grid; gap: 1.5rem; }
.bm-modulos__panel:not([hidden]) { animation: bm-aparece .35s var(--bm-ease); }
.bm-modulos__texto { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .25rem 2rem; align-items: end; }
.bm-modulos__texto .bm-h3 { grid-column: 1 / -1; font-size: clamp(1.6rem, 2.4vw, 2.1rem); max-width: 24ch; }
.bm-modulos__texto .bm-text { margin: 0; }
.bm-modulos__captura { margin: 0; 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-modulos__captura img { display: block; width: 100%; height: auto; }
@keyframes bm-aparece { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media (max-width: 991.98px) {
    .bm-modulos__caja { grid-template-columns: 1fr; }
    .bm-modulos__pestanas { position: static; display: flex; gap: .4rem; overflow-x: auto; border: 0; padding-bottom: .25rem; scrollbar-width: none; }
    .bm-modulos__pestanas button { white-space: nowrap; margin: 0; padding: .45rem .9rem; border: 1px solid var(--bm-linea); border-radius: 999px; font-size: .95rem; }
    .bm-modulos__pestanas button[aria-selected="true"] { background: var(--bm-celeste); border-color: var(--bm-azul); }
    .bm-modulos__texto { grid-template-columns: 1fr; }
}

/* ---------------------------------------------------------------------
   Sectores
   --------------------------------------------------------------------- */
.bm-sectores { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 clamp(24px, 3vw, 48px); }
.bm-sector { display: grid; grid-template-columns: 2.4rem minmax(0, 1fr); gap: .3rem .8rem; padding: 1.4rem 0 2rem; border-top: 1.5px solid var(--bm-texto); }
.bm-sector .bi { grid-row: span 2; font-size: 1.5rem; color: var(--bm-azul); line-height: 1.1; }
.bm-sector h3 { font-size: 1.45rem; margin: 0; }
.bm-sector h3 a { color: var(--bm-texto); text-decoration: underline; text-decoration-color: var(--bm-linea-fuerte); text-decoration-thickness: 1.5px; text-underline-offset: .18em; }
.bm-sector h3 a:hover { color: var(--bm-azul); text-decoration-color: currentColor; }
.bm-sector p { margin: 0; color: var(--bm-gris); font-size: .98rem; }
@media (max-width: 991.98px) { .bm-sectores { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575.98px) { .bm-sectores { grid-template-columns: 1fr; } }

/* ---------------------------------------------------------------------
   Comparador antes / ahora: ajustes sobre su CSS original
   --------------------------------------------------------------------- */
.compare7 .stage { border-radius: var(--bm-radio-foto); box-shadow: 0 0 0 1px var(--bm-linea), var(--bm-sombra-foto); }
.compare7 .layer-order { background-image: radial-gradient(circle at 1px 1px, #CFDBFB 1px, transparent 1.2px); }
.compare7 .compare-foot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem 1.5rem; margin-top: 1rem; font-size: .9rem; color: var(--bm-gris); }
.compare7 .compare-foot i { margin-right: .4rem; color: var(--bm-azul); }

/* ---- Comparador y orden de trabajo: CSS original ---- */
.compare7 .compare{margin-top:clamp(32px,4.5vw,56px)}
.compare7{--ease:cubic-bezier(0.23,1,0.32,1);--late:#F5A524}.compare7 .stage{position:relative;width:100%;aspect-ratio:1280/660;border-radius:22px;overflow:hidden;background:var(--mist);touch-action:pan-y;user-select:none;-webkit-user-select:none;cursor:ew-resize;box-shadow:0 0 0 1px var(--line),0 40px 80px -48px rgba(6,23,90,.45);isolation:isolate}
.compare7 .canvas{position:absolute;left:0;top:0;width:1280px;height:660px;transform-origin:0 0}
.compare7 .layer{position:absolute;inset:0;overflow:hidden}
.compare7 .layer-order{background-color:var(--mist);background-image:radial-gradient(circle at 1px 1px,#CFDBFB 1px,transparent 1.2px);background-size:24px 24px}
.compare7 .layer-chaos{background:#D9D7D2;will-change:clip-path;clip-path:inset(0 50% 0 0)}
.compare7 .slot{position:absolute}
.compare7 .s-a{left:40px;top:76px;width:400px;height:278px}
.compare7 .s-b{left:40px;top:386px;width:400px;height:236px}
.compare7 .s-c{left:470px;top:76px;width:340px;height:546px}
.compare7 .s-d{left:840px;top:76px;width:400px;height:350px}
.compare7 .s-e{left:840px;top:452px;width:400px;height:170px}
.compare7 .tag{position:absolute;top:22px;font-size:13.5px;font-weight:620;padding:7px 13px;border-radius:999px;display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.compare7 .tag-chaos{left:40px;background:#F3F1EC;color:#4B4A46;box-shadow:0 1px 0 rgba(0,0,0,.08)}
.compare7 .tag-order{right:40px;background:var(--blue);color:#fff}
.compare7 .hand{font-family:"Caveat",cursive;font-weight:600;color:#2D3A66;line-height:1.05}
.compare7 .xl{position:absolute;inset:0;background:#FBFBF9;border:1px solid #B9BCB7;transform:rotate(-1.6deg);box-shadow:0 10px 22px -12px rgba(0,0,0,.35);font-stretch:88%;font-size:14px;color:#2F2F2F;overflow:hidden}
.compare7 .xl-bar{display:flex;align-items:center;gap:8px;padding:8px 10px;background:#EDEEEA;border-bottom:1px solid #C9CBC6;font-size:12px;color:#5B5D58;white-space:nowrap}
.compare7 .xl-ico{width:16px;height:16px;border-radius:3px;background:#6F8A75;color:#fff;font-size:10px;font-weight:700;display:grid;place-items:center;flex:none}
.compare7 .xl table{border-collapse:collapse;width:100%;table-layout:fixed}
.compare7 .xl th,.compare7 .xl td{border:1px solid #D6D7D3;padding:6px 7px;height:31px;text-align:left;white-space:nowrap;overflow:hidden;font-weight:400}
.compare7 .xl th{background:#F1F1EE;color:#7A7C77;font-size:11.5px;text-align:center;height:22px;padding:2px}
.compare7 .xl th:first-child,.compare7 .xl td:first-child{width:28px;background:#F1F1EE;color:#7A7C77;text-align:center;font-size:11.5px;padding:0}
.compare7 .xl .bold td{font-weight:700}
.compare7 .xl .red{background:#F1C6C0;color:#9A2A1F;font-weight:600}
.compare7 .xl .yel{background:#FBF0A6}
.compare7 .xl .sel{outline:2px solid #4E7A58;outline-offset:-2px}
.compare7 .sticky{position:absolute;width:186px;height:168px;background:#EEDF86;padding:20px 16px;font-size:30px;box-shadow:0 14px 18px -12px rgba(0,0,0,.4)}
.compare7 .sticky::before{content:"";position:absolute;left:50%;top:-11px;width:78px;height:24px;margin-left:-39px;background:rgba(255,255,255,.55);transform:rotate(-3deg)}
.compare7 .st-1{left:18px;top:24px;transform:rotate(-5deg)}
.compare7 .st-2{left:190px;top:46px;transform:rotate(4deg);background:#E9E6A2}
.compare7 .wa{position:absolute;inset:0;border-radius:26px;background:#E5E0D6;overflow:hidden;box-shadow:0 0 0 7px #2A2B2E,0 24px 40px -18px rgba(0,0,0,.55);transform:rotate(1.4deg);font-size:14.5px;color:#222;display:flex;flex-direction:column}
.compare7 .wa-head{display:flex;align-items:center;gap:10px;padding:12px 14px;background:#5C766C;color:#F5F8FE}
.compare7 .wa-av{width:34px;height:34px;border-radius:50%;background:#A9B9B1;display:grid;place-items:center;color:#41574D;flex:none}
.compare7 .wa-head b{display:block;font-size:14.5px;font-weight:600}
.compare7 .wa-head small{display:block;font-size:11.5px;opacity:.8}
.compare7 .wa-body{flex:1;padding:14px 12px;display:flex;flex-direction:column;gap:8px}
.compare7 .msg{max-width:84%;padding:7px 10px 18px;border-radius:10px;background:#FBFAF7;position:relative;box-shadow:0 1px 0 rgba(0,0,0,.08);line-height:1.35}
.compare7 .msg small{position:absolute;right:8px;bottom:3px;font-size:10.5px;color:#8A8B86}
.compare7 .msg .from{display:block;font-size:12px;font-weight:650;color:#7C5A3C;margin-bottom:2px}
.compare7 .msg .from.b{color:#3E6A87}
.compare7 .msg.out{align-self:flex-end;background:#D6E3CC}
.compare7 .msg.big{font-size:16px}
.compare7 .photo{width:196px;height:122px;border-radius:6px;margin-bottom:6px;background:#9C988F;position:relative;overflow:hidden}
.compare7 .photo::before{content:"";position:absolute;left:28px;top:20px;width:108px;height:84px;border-radius:10px 10px 4px 4px;background:#BDB8AD;box-shadow:inset 0 -14px 0 #A8A398}
.compare7 .photo::after{content:"";position:absolute;left:60px;top:42px;width:40px;height:40px;border-radius:50%;background:#8E8A81;box-shadow:0 0 0 5px #C9C4B9}
.compare7 .wa-input{margin:0 10px 12px;padding:10px 14px;border-radius:999px;background:#FBFAF7;color:#9A9A95;font-size:13.5px}
.compare7 .paper{position:absolute;inset:0;background:#F2EFE7;transform:rotate(2.6deg);box-shadow:0 18px 28px -16px rgba(0,0,0,.45);padding:20px 24px;color:#3B3B38}
.compare7 .paper-h{display:flex;justify-content:space-between;align-items:baseline;border-bottom:2px solid #3B3B38;padding-bottom:6px;font-family:"IBM Plex Mono",monospace;font-size:12.5px;font-weight:600;letter-spacing:.06em}
.compare7 .fld{display:flex;align-items:baseline;gap:8px;border-bottom:1px solid #B7B3A8;padding:8px 0 3px;font-family:"IBM Plex Mono",monospace;font-size:11px;color:#6A675F}
.compare7 .fld .hand{font-size:25px;color:#22337A}
.compare7 .fld .hand.r{color:#8E2A20}
.compare7 .coffee{position:absolute;right:30px;bottom:24px;width:104px;height:104px;border-radius:50%;border:7px solid rgba(122,82,42,.22);box-shadow:inset 0 0 0 3px rgba(122,82,42,.08),0 0 0 2px rgba(122,82,42,.07);transform:rotate(-12deg) scaleX(1.06)}
.compare7 .coffee::after{content:"";position:absolute;right:-26px;top:22px;width:22px;height:30px;border-radius:50%;border:5px solid rgba(122,82,42,.14);border-left-color:transparent;border-bottom-color:transparent}
.compare7 .folder{position:absolute;inset:0}
.compare7 .folder .sheet{position:absolute;width:300px;height:120px;background:#F6F4EE;box-shadow:0 2px 6px rgba(0,0,0,.18)}
.compare7 .folder .sh1{left:36px;top:2px;transform:rotate(-7deg)}
.compare7 .folder .sh2{left:84px;top:-6px;transform:rotate(5deg);background:#ECEAE3}
.compare7 .folder .sh3{left:150px;top:8px;transform:rotate(-2deg);background:#F9F7F2}
.compare7 .folder .sheet::before{content:"";position:absolute;left:16px;right:40px;top:16px;height:44px;background:repeating-linear-gradient(#C9C5BA 0 2px,transparent 2px 11px)}
.compare7 .folder-back{position:absolute;left:10px;right:10px;top:26px;bottom:0;background:#C8B68E;border-radius:4px 10px 6px 6px}
.compare7 .folder-front{position:absolute;left:4px;right:16px;top:56px;bottom:-4px;background:#D8C8A1;border-radius:6px;transform:rotate(-1.5deg);box-shadow:0 12px 18px -10px rgba(0,0,0,.45);padding:22px 24px}
.compare7 .folder-front .hand{font-size:38px;color:#3A3428}
.compare7 .folder-front .note{position:absolute;right:26px;top:-22px;width:130px;padding:10px 10px;background:#EEDF86;font-size:22px;transform:rotate(6deg);box-shadow:0 8px 12px -8px rgba(0,0,0,.4)}
.compare7 .card{position:absolute;inset:0;background:#fff;border-radius:16px;box-shadow:0 1px 0 var(--line),0 0 0 1px rgba(18,56,184,.07),0 22px 40px -26px rgba(18,56,184,.45);overflow:hidden}
.compare7 .card-h{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:16px 18px 12px;border-bottom:1px solid #E6ECFB}
.compare7 .card-h b{font-weight:680;font-size:15.5px}
.compare7 .card-h .mono{font-size:12px;color:var(--ink-2)}
.compare7 .code{font-family:"IBM Plex Mono",monospace;font-size:12px;font-weight:500;color:var(--deep);letter-spacing:.01em}
.compare7 .pill{display:inline-flex;align-items:center;gap:6px;padding:3px 9px;border-radius:999px;font-size:12px;font-weight:620;white-space:nowrap}
.compare7 .pill::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.compare7 .p-late{background:rgba(245,165,36,.17);color:#7A4A00}
.compare7 .p-late::before{background:var(--late)}
.compare7 .p-next{background:var(--light);color:var(--deep)}
.compare7 .p-ok{background:rgba(14,159,119,.12);color:#08664C}
.compare7 .p-ok::before{background:var(--ok)}
.compare7 .crow{display:grid;grid-template-columns:1fr auto;gap:4px 12px;align-items:center;padding:12px 18px;border-bottom:1px solid #EEF2FC}
.compare7 .crow:last-child{border-bottom:0}
.compare7 .crow .nm{font-weight:600;font-size:14.5px;line-height:1.25}
.compare7 .crow .ty{font-size:12.5px;color:var(--ink-2)}
.compare7 .crow .rt{display:flex;flex-direction:column;align-items:flex-end;gap:5px}
.compare7 .crow .dt{font-family:"IBM Plex Mono",monospace;font-size:12px;color:var(--ink-2)}
.compare7 .crow.is-late{background:linear-gradient(90deg,rgba(245,165,36,.09),rgba(245,165,36,0) 70%);box-shadow:inset 3px 0 0 var(--late)}
.compare7 .rec{display:flex;flex-direction:column}
.compare7 .rec-top{padding:18px 20px 0;display:flex;justify-content:space-between;align-items:flex-start}
.compare7 .rec-top .lbl{font-size:12.5px;color:var(--ink-2);font-weight:560}
.compare7 .qr{width:46px;height:46px;border-radius:8px;background:var(--mist);display:grid;place-items:center;font-size:26px;color:var(--ink)}
.compare7 .rec h3{font-size:27px;font-stretch:108%;padding:6px 20px 0;letter-spacing:-.02em}
.compare7 .alert{margin:16px 16px 4px;padding:13px 14px;border-radius:12px;background:rgba(245,165,36,.14);box-shadow:inset 0 0 0 1px rgba(245,165,36,.45);display:flex;gap:11px;align-items:flex-start}
.compare7 .alert i{color:#C47D00;font-size:19px;line-height:1.2}
.compare7 .alert b{display:block;font-size:14.5px;font-weight:660;line-height:1.3}
.compare7 .alert span{font-size:12.5px;color:#6B4600}
.compare7 .dl{margin:10px 20px 0;display:grid;grid-template-columns:auto 1fr;gap:0 16px;font-size:14px}
.compare7 .dl dt,.compare7 .dl dd{margin:0;padding:9px 0;border-bottom:1px solid #EEF2FC}
.compare7 .dl dt{color:var(--ink-2)}
.compare7 .dl dd{font-weight:580;text-align:right}
.compare7 .docs{display:flex;gap:6px;flex-wrap:wrap;padding:14px 20px 0}
.compare7 .chip{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border-radius:8px;background:var(--mist);font-size:12.5px;font-weight:560;color:var(--deep)}
.compare7 .rec .act{margin:auto 16px 16px;display:flex;align-items:center;justify-content:center;gap:8px;height:44px;border-radius:11px;background:var(--blue);color:#fff;font-weight:620;font-size:14.5px}
.compare7 .mini{display:flex;gap:12px;padding:14px 18px;border-bottom:1px solid #EEF2FC;align-items:flex-start}
.compare7 .mini:last-child{border-bottom:0}
.compare7 .mini > i{font-size:20px;line-height:1.2}
.compare7 .mini .nm{font-weight:620;font-size:14.5px;line-height:1.3}
.compare7 .mini .sub{font-size:13px;color:var(--ink-2);margin-top:2px}
.compare7 .mini .chip{margin-top:8px}
.compare7 .rep{border-radius:6px;padding:18px 22px}
.compare7 .rep-h{display:flex;align-items:center;gap:10px;padding-bottom:12px;border-bottom:1px solid #E6ECFB}
.compare7 .rep-h .logo-tile{width:28px;height:28px;border-radius:8px}
.compare7 .rep-h .logo-tile img{width:19px;height:19px}
.compare7 .rep-h b{font-size:14.5px;font-weight:680;line-height:1.2}
.compare7 .rep-h .pdf{margin-left:auto;font-family:"IBM Plex Mono",monospace;font-size:11px;font-weight:600;padding:3px 7px;border-radius:5px;background:var(--ink);color:#fff}
.compare7 .rep-meta{display:grid;grid-template-columns:auto 1fr;gap:3px 14px;font-size:13px;padding:12px 0 8px}
.compare7 .rep-meta span{color:var(--ink-2)}
.compare7 .checks{display:flex;gap:14px;flex-wrap:wrap;font-size:13px;padding-bottom:12px;border-bottom:1px solid #E6ECFB}
.compare7 .checks i{color:var(--ok);margin-right:4px}
.compare7 .signs{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding-top:10px}
.compare7 .sign svg{width:100%;height:46px;display:block}
.compare7 .sign div{border-top:1px solid #B8C4E6;padding-top:5px;font-size:12px;color:var(--ink-2)}
.compare7 .saved{position:absolute;left:22px;right:22px;bottom:16px;display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:600;color:#08664C}
.compare7 .audit{padding:16px 20px}
.compare7 .audit-h{display:flex;align-items:center;gap:10px;font-weight:680;font-size:15.5px}
.compare7 .audit-h i{color:var(--blue);font-size:20px}
.compare7 .audit-h .mono{margin-left:auto;font-weight:500;font-size:12px;color:var(--ink-2)}
.compare7 .audit ul{list-style:none;margin:12px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:9px 16px;font-size:13.5px}
.compare7 .audit li{display:flex;gap:7px;align-items:center}
.compare7 .audit li i{color:var(--ok)}
.compare7 .handle{position:absolute;top:0;bottom:0;left:0;width:0;z-index:5;will-change:transform;transform:translate3d(50%,0,0);pointer-events:none}
.compare7 .handle::before{content:"";position:absolute;top:0;bottom:0;left:-1.5px;width:3px;background:#fff;box-shadow:0 0 0 1px rgba(6,23,90,.12),0 0 18px rgba(6,23,90,.25)}
.compare7 .knob{position:absolute;top:50%;left:0;width:56px;height:56px;margin:-28px 0 0 -28px;border-radius:50%;background:#fff;color:var(--ink);display:grid;place-items:center;box-shadow:0 0 0 1px rgba(6,23,90,.1),0 10px 24px -6px rgba(6,23,90,.45);pointer-events:auto;cursor:grab;touch-action:none;transition:transform 140ms var(--ease)}
.compare7 .knob span{display:flex;gap:2px;font-size:15px}
.compare7 .stage.dragging .knob{cursor:grabbing;transform:scale(.94)}
.compare7 .knob:focus-visible{outline:3px solid var(--blue);outline-offset:4px;border-radius:50%}
.compare7 .stage.easing .layer-chaos{transition:clip-path 220ms var(--ease)}
.compare7 .stage.easing .handle{transition:transform 220ms var(--ease)}
.compare7 .compare-foot{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:14px;font-size:14px;color:var(--ink-2)}
.compare7 .compare-foot i{color:var(--blue);margin-right:6px}
@media(max-width:720px){.compare7{--ease:cubic-bezier(0.23,1,0.32,1);--late:#F5A524}.compare7 .stage{aspect-ratio:400/716;border-radius:18px}.compare7 .canvas{width:400px;height:716px}.compare7 .s-a{left:16px;top:490px;width:368px;height:212px}.compare7 .s-c{left:16px;top:66px;width:368px;height:406px}.compare7 .s-b,.compare7 .s-d,.compare7 .s-e{display:none}.compare7 .tag{top:18px;font-size:12.5px;padding:6px 11px}.compare7 .tag-chaos{left:16px}.compare7 .tag-order{right:16px}.compare7 .wa .m-hide,.compare7 .rec .m-hide,.compare7 .xl tr.m-hide{display:none}.compare7 .crow .ty{display:none}}
.journey9{--brand:var(--blue);--text-2:var(--ink-2);--rule:var(--line);--done:var(--ok);--drawer:var(--ease-drawer);--sans:var(--bm-font);background:var(--mist);color:var(--ink);border-bottom:1px solid var(--line)}
.journey9{position:relative;isolation:isolate;overflow:clip;min-width:0;background:var(--mist);border-bottom:1px solid var(--rule)}
.journey9 > .container{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:56px;min-width:0}.journey9 .scene-text,.journey9 .paper-col{min-width:0}
.journey9 .hero{min-height:calc(100vh - 72px);display:flex;flex-direction:column;justify-content:center;padding:64px 0 48px}
.journey9 .hero h2{font-family:var(--bm-font);font-size:clamp(1.75rem,3.2vw,2.625rem);line-height:1.1;font-weight:800;letter-spacing:-.03em;text-wrap:balance;color:var(--ink);max-width:none}
.journey9 .hero .lead{margin-top:24px;font-size:clamp(1.0625rem,1.4vw,1.1875rem);line-height:1.65;color:var(--text-2);max-width:52ch}
.journey9 .hero .ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.journey9 .hero .note{margin-top:18px;font-size:15px;color:var(--text-2)}
.journey9 .scroll-hint{margin-top:56px;display:flex;align-items:center;gap:12px;font-size:15px;color:var(--text-2)}
.journey9 .scroll-hint i{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#fff;box-shadow:inset 0 0 0 1px var(--line);color:var(--brand)}
.journey9 .steps{padding-bottom:22vh}
.journey9 .step{min-height:78vh;display:flex;flex-direction:column;justify-content:center;max-width:440px;padding:40px 0}
.journey9 .step .n{font:500 14px/1 var(--mono);color:var(--brand);display:flex;align-items:center;gap:10px}
.journey9 .step .n::after{content:"";height:1px;width:48px;background:var(--line)}
.journey9 .step h3{font-size:clamp(28px,2.6vw,38px);line-height:1.08;font-weight:650;margin-top:18px}
.journey9 .step p{margin-top:16px;color:var(--text-2);max-width:42ch}
.journey9 .step .aside{margin-top:20px;font-size:15px;padding-left:14px;border-left:2px solid var(--light);color:var(--ink)}
.journey9 .step{opacity:.38;transition:opacity 300ms ease}
.journey9 .step.is-current{opacity:1}
.journey9 .mobile-ctrl{display:none}
.journey9 .paper-col{position:relative}
.journey9 .paper-stick{position:sticky;top:96px;padding-bottom:40px;transform-origin:top center}
.journey9 .stack{position:relative}
.journey9 .sheet2{position:absolute;inset:0;background:#fff;border-radius:6px;box-shadow:0 0 0 1px var(--line);transform:translate(0,0) rotate(0);opacity:0;transition:transform 600ms var(--ease-out),opacity 300ms ease}
.journey9 .paper{position:relative;background:#fff;border-radius:6px;box-shadow:0 0 0 1px var(--line),0 30px 60px -30px rgba(6,23,90,.30);padding:26px 28px 20px;font-size:14px;line-height:1.4}
.journey9 .p-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding-bottom:16px;border-bottom:2px solid var(--ink)}
.journey9 .p-head .t{display:flex;gap:12px;align-items:center}
.journey9 .p-head .logo-tile{width:34px;height:34px}
.journey9 .p-head h3{font:700 19px/1.15 var(--display);letter-spacing:-.01em}
.journey9 .p-head .sub{font-size:13px;color:var(--text-2);margin-top:2px}
.journey9 .p-head .r{text-align:right;flex:none}
.journey9 .ot{font:600 14px/1 var(--mono)}
.journey9 .state{display:inline-grid;margin-top:8px;font:600 12px/1 var(--sans);border-radius:999px;overflow:hidden}
.journey9 .state span{grid-area:1/1;padding:6px 10px;transition:opacity 250ms ease,transform 250ms var(--ease-out)}
.journey9 .state .s1{background:var(--light);color:var(--deep)}
.journey9 .state .s2{background:var(--done);color:#fff;opacity:0;transform:translateY(6px)}
.journey9 .paper.signed .state .s1{opacity:0;transform:translateY(-6px)}
.journey9 .paper.signed .state .s2{opacity:1;transform:none}
.journey9 .ej{display:block;margin-top:6px;font-size:11px;color:var(--text-2)}
.journey9 .p-sec{margin-top:16px}
.journey9 .p-sec > .h{font:600 12px/1 var(--sans);color:var(--text-2);margin-bottom:8px;display:flex;justify-content:space-between}
.journey9 .fields{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--rule);border-left:1px solid var(--rule)}
.journey9 .f{border-right:1px solid var(--rule);border-bottom:1px solid var(--rule);padding:7px 10px 8px;min-height:50px}
.journey9 .f.w2{grid-column:span 2}
.journey9 .f label{display:block;font-size:11px;color:var(--text-2);margin-bottom:3px}
.journey9 .v{display:block;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;position:relative}
.journey9 .v.mono{font-weight:500;font-size:13.5px}
.journey9 .ink{clip-path:inset(0 100% 0 0);transition:clip-path 520ms var(--ease-out)}
.journey9 .on > .ink,.journey9 .ink.on{clip-path:inset(0 0 0 0)}
.journey9 .slot{position:relative}
.journey9 .slot::before{content:"";position:absolute;left:0;right:12%;bottom:3px;border-bottom:1.5px dotted #C3CDE6;transition:opacity 200ms ease}
.journey9 .slot.on::before{opacity:0}
.journey9 .check{width:100%;border-collapse:collapse}
.journey9 .check th{font:600 11px/1 var(--sans);color:var(--text-2);text-align:left;padding:0 8px 6px 0}
.journey9 .check th:last-child,.journey9 .check td:last-child{text-align:right;padding-right:0}
.journey9 .check td{border-top:1px solid var(--rule);padding:6px 8px 6px 0;vertical-align:middle}
.journey9 .check td.val{font:500 13px/1.2 var(--mono);white-space:nowrap;width:112px}
.journey9 .box{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:5px;box-shadow:inset 0 0 0 1.5px #C3CDE6;position:relative;vertical-align:middle}
.journey9 .box::before{content:"";position:absolute;inset:0;border-radius:5px;background:var(--done);transform:scale(.6);opacity:0;transition:transform 220ms var(--ease-out),opacity 160ms ease}
.journey9 .box svg{position:relative;width:13px;height:13px}
.journey9 .box path{fill:none;stroke:#fff;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 260ms var(--ease-out) 80ms}
.journey9 tr.on .box::before{transform:none;opacity:1}
.journey9 tr.on .box path{stroke-dashoffset:0}
.journey9 tr .val .ink{display:inline-block}
.journey9 tr.on .ink{clip-path:inset(0 0 0 0)}
.journey9 .row3{display:grid;grid-template-columns:150px minmax(0,1fr);gap:16px;margin-top:16px}
.journey9 .photo{position:relative;height:118px;border-radius:6px;background:repeating-linear-gradient(135deg,#F4F7FE 0 8px,#fff 8px 16px);box-shadow:inset 0 0 0 1.5px #C9D4EE;display:grid;place-items:center;color:#9AABD3;font-size:28px;overflow:hidden}
.journey9 .photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 52%;clip-path:inset(0 0 100% 0);transform:scale(1.08);transition:clip-path 700ms var(--ease-io),transform 900ms var(--ease-out)}
.journey9 .photo.on img{clip-path:inset(0 0 0 0);transform:scale(1)}
.journey9 .photo .cap{position:absolute;left:6px;bottom:6px;font:500 10.5px/1 var(--mono);background:rgba(6,23,90,.82);color:#fff;padding:4px 6px;border-radius:4px;opacity:0;transform:translateY(4px);transition:opacity 250ms ease 400ms,transform 250ms var(--ease-out) 400ms}
.journey9 .photo.on .cap{opacity:1;transform:none}
.journey9 .part{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 12px;align-items:baseline;border-top:1px solid var(--rule);padding-top:7px}
.journey9 .part .nm{font-weight:600}
.journey9 .part .q{font:500 13px/1 var(--mono)}
.journey9 .stock{grid-column:1/-1;display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--text-2);opacity:0;transform:translateY(4px);transition:opacity 250ms ease,transform 300ms var(--ease-out)}
.journey9 .stock.on{opacity:1;transform:none}
.journey9 .stock b{font:600 12.5px/1 var(--mono);color:var(--ink);background:var(--mist);padding:4px 7px;border-radius:5px}
.journey9 .obs{margin-top:10px;border-top:1px solid var(--rule);padding-top:7px}
.journey9 .obs label{display:block;font-size:11px;color:var(--text-2);margin-bottom:3px}
.journey9 .obs .v{white-space:normal;overflow:visible}
.journey9 .obs .ink{display:block}
.journey9 .sigs{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:30px;position:relative}
.journey9 .sig{border-bottom:1.5px solid var(--ink);height:78px;position:relative}
.journey9 .sig svg{position:absolute;left:4px;bottom:2px;width:78%;height:70px;overflow:visible}
.journey9 .sig path{fill:none;stroke:var(--deep);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1}
.journey9 .sig.on path{transition:stroke-dashoffset 1100ms cubic-bezier(.45,.05,.35,1)}
.journey9 .sig.on path.p2{transition-delay:900ms;transition-duration:350ms}
.journey9 .sig.on path{stroke-dashoffset:0}
.journey9 .sig-l{margin-top:6px;font-size:12px;color:var(--text-2);display:flex;justify-content:space-between;gap:8px}
.journey9 .sig-l b{color:var(--ink);font-weight:600}
.journey9 .seal{position:absolute;left:50%;top:-34px;width:104px;height:104px;margin-left:-52px;border-radius:50%;color:var(--done);display:grid;place-items:center;pointer-events:none;opacity:0;transform:rotate(-14deg) scale(1.35);transition:opacity 160ms ease,transform 260ms cubic-bezier(.3,1.4,.5,1)}
.journey9 .seal svg{position:absolute;inset:0;width:100%;height:100%}
.journey9 .seal .c{font:700 15px/1 var(--display);letter-spacing:.02em;text-align:center;background:rgba(255,255,255,.9);padding:4px 6px;border-radius:4px}
.journey9 .seal .c small{display:block;font:500 10px/1.3 var(--mono);letter-spacing:0;margin-top:2px}
.journey9 .seal.on{opacity:.95;transform:rotate(-14deg) scale(1)}
.journey9 .p-foot{margin-top:14px;display:flex;justify-content:space-between;font-size:11px;color:var(--text-2)}
.journey9 .pdf-chip{display:flex;align-items:center;gap:14px;margin-top:16px;background:var(--ink);color:#fff;border-radius:12px;padding:12px 16px 12px 12px;opacity:0;transform:translateY(-14px) scale(.97);transform-origin:top center;transition:opacity 250ms ease,transform 450ms var(--drawer)}
.journey9 .pdf-chip .ic{width:42px;height:48px;border-radius:6px;background:#fff;color:var(--deep);display:grid;place-items:center;font:700 11px/1 var(--mono);position:relative;flex:none}
.journey9 .pdf-chip .ic::after{content:"";position:absolute;right:0;top:0;border-style:solid;border-width:0 10px 10px 0;border-color:transparent var(--ink) var(--light) transparent}
.journey9 .pdf-chip .nm{font:500 13.5px/1.3 var(--mono);word-break:break-all}
.journey9 .pdf-chip .sub{font-size:13px;color:#B9C8EE;margin-top:3px}
.journey9 .pdf-chip .dl{margin-left:auto;width:38px;height:38px;border-radius:50%;background:var(--brand);display:grid;place-items:center;font-size:18px;flex:none}
.journey9 .done .pdf-chip{opacity:1;transform:none}
.journey9 .done .sheet2{opacity:1;transform:translate(10px,10px) rotate(1.2deg)}
@media(max-width:1080px){.journey9 > .container{gap:36px}.journey9 .paper{padding:22px 20px 18px}}
@media(max-width:900px){.journey9 > .container{grid-template-columns:minmax(0,1fr);gap:0}.journey9 .hero{min-height:0;padding:48px 0 32px}.journey9 .scroll-hint{display:none}.journey9 .scene-text{display:contents}.journey9 .steps{padding:14px 0 0;position:sticky;top:72px;z-index:5;background:var(--mist);box-shadow:0 1px 0 var(--rule)}.journey9 .step h3{font-size:24px}.journey9 .step p{font-size:15.5px;margin-top:8px}.journey9 .step .aside{display:none}.journey9 .step{display:none;min-height:0;padding:0;opacity:1;max-width:none}.journey9 .step.is-current{display:flex}.journey9 .step h3{margin-top:12px}.journey9 .mobile-ctrl{display:flex;align-items:center;gap:10px;margin:14px 0}.journey9 .mobile-ctrl .dots{display:flex;gap:6px;flex:1}.journey9 .mobile-ctrl .dots span{height:4px;flex:1;border-radius:2px;background:var(--light);position:relative;overflow:hidden}.journey9 .mobile-ctrl .dots span::after{content:"";position:absolute;inset:0;background:var(--brand);transform:scaleX(0);transform-origin:left center;transition:transform 300ms var(--ease-out)}.journey9 .mobile-ctrl .dots span.on::after{transform:scaleX(1)}.journey9 .mobile-ctrl button{width:46px;height:46px;border-radius:50%;border:0;background:#fff;box-shadow:inset 0 0 0 1.5px var(--line);color:var(--ink);font-size:18px;cursor:pointer}.journey9 .mobile-ctrl button.next{background:var(--brand);color:#fff}.journey9 .mobile-ctrl button:disabled{opacity:.4;cursor:default}.journey9 .paper-stick{position:relative;top:0;padding-bottom:56px}}
@media(max-width:600px){.journey9 .paper{padding:18px 14px 14px;font-size:13px}.journey9 .p-head h3{font-size:16px}.journey9 .p-head .sub{display:none}.journey9 .fields{grid-template-columns:repeat(2,minmax(0,1fr))}.journey9 .check td.val{width:auto}.journey9 .row3{grid-template-columns:110px minmax(0,1fr);gap:12px}.journey9 .photo{height:104px}.journey9 .sigs{gap:12px}.journey9 .sig{height:64px}.journey9 .sig svg{height:56px}.journey9 .sig-l{flex-direction:column;gap:2px}.journey9 .seal{width:86px;height:86px;margin-left:-43px;top:-30px}.journey9 .seal .c{font-size:13px}.journey9 .pdf-chip .nm{font-size:12px}}
.compare7{padding-block:var(--section-pad);padding-inline:var(--pad);background:var(--bm-mist);color:var(--bm-ink)}
.compare7 .compare{width:100%;max-width:var(--page-max);margin:0 auto}
.compare7 .bm-section-head{--z-fg:var(--bm-ink);--z-eb:var(--bm-blue-700);--z-muted:var(--bm-muted);margin-bottom:clamp(1.75rem,3.5vw,3rem)}
.journey9{background:var(--surface-soft);border:0}
.compare7 .bm-h2{color:var(--bm-ink)}
@media(max-width:600px){.compare7{padding-block:clamp(40px,5vw,64px);padding-inline:14px}.closing-cta__link{font-size:14px}}
.compare7 .mini > i.is-success{color:var(--ok)}
.compare7 .mini > i.is-primary{color:var(--blue)}
.journey9 .p-sec--flush{margin-top:0}

/* ---------------------------------------------------------------------
   Orden de trabajo sobre la franja verde: la hoja blanca es el documento
   que se llena; el texto de los pasos va en claro sobre el pino.
   --------------------------------------------------------------------- */
.journey9.bm-ot { background: var(--bm-marino); color: #fff; border-bottom: 0; --text-2: var(--bm-sobre-marino); }
.journey9.bm-ot .hero h2 { font-family: var(--bm-display); font-size: clamp(2.2rem, 3.6vw, 3.2rem); font-weight: 600; line-height: 1.04; letter-spacing: -.01em; color: #fff; }
.journey9.bm-ot .hero .lead { color: var(--bm-sobre-marino); }
.journey9.bm-ot .step .n { color: var(--bm-azul-300); }
.journey9.bm-ot .step .n::after { background: rgba(255,255,255,.25); }
.journey9.bm-ot .step h3 { font-family: var(--bm-display); font-size: clamp(1.7rem, 2.4vw, 2.3rem); font-weight: 600; line-height: 1.08; margin-top: 18px; color: #fff; }
.journey9.bm-ot .step p { color: var(--bm-sobre-marino); }
.journey9.bm-ot .step .aside { color: #fff; border-left-color: var(--bm-azul-300); }
.journey9.bm-ot .step { opacity: .35; }
.journey9.bm-ot .step.is-current { opacity: 1; }
.journey9.bm-ot .paper { box-shadow: 0 50px 90px -40px rgba(0,0,0,.75); color: var(--bm-texto); --text-2: var(--bm-gris); }
.journey9.bm-ot .paper .p-head h3 { font-family: var(--bm-display); font-weight: 600; font-size: 20px; color: var(--bm-texto); }
.journey9.bm-ot .p-head .logo-tile { display: inline-grid; place-items: center; background: var(--bm-azul); border-radius: 6px; }
.journey9.bm-ot .p-head .logo-tile img { width: 22px; height: auto; }
.journey9.bm-ot .slot::before { border-bottom-color: #C3CDE6; }
.journey9.bm-ot .box { box-shadow: inset 0 0 0 1.5px #C3CDE6; }
.journey9.bm-ot .photo { background: repeating-linear-gradient(135deg, #F4F7FE 0 8px, #fff 8px 16px); box-shadow: inset 0 0 0 1.5px #CFDBFB; color: #9AABD3; }
.journey9.bm-ot .sheet2 { box-shadow: 0 0 0 1px rgba(255,255,255,.2); }
.journey9.bm-ot .pdf-chip { color: var(--bm-texto); }
.journey9.bm-ot .mobile-ctrl button { color: var(--bm-texto); }


@media (max-width: 900px) {
    .journey9.bm-ot .steps { background: var(--bm-marino); top: var(--bm-header-h); box-shadow: 0 1px 0 rgba(255,255,255,.12); }
    .journey9.bm-ot .mobile-ctrl .dots span { background: rgba(255,255,255,.22); }
    .journey9.bm-ot .mobile-ctrl .dots span::after { background: var(--bm-azul-300); }
    .journey9.bm-ot .mobile-ctrl button.next { background: #fff; color: var(--bm-marino); }
    .journey9.bm-ot .step .n { margin-top: 0; }
}

/* =====================================================================
   Secciones del inicio con el lenguaje de la portada: tarjetas
   redondeadas, una destacada en azul, franjas oscuras con diagonal y
   palabras de fondo casi transparentes.
   ===================================================================== */

/* Que es: los tres datos como tarjetas */
.bm-definicion__datos { gap: 14px; }
.bm-definicion__datos li { padding: 1rem 1.1rem; border-top: 0; border-radius: 16px; background: #fff; border: 1px solid var(--bm-linea); box-shadow: var(--bm-sombra-tarjeta); }

/* Comparador */
.compare7 .stage { border-radius: 24px; }

/* Orden de trabajo: la franja marina entra en diagonal y lleva su palabra de fondo */
.journey9.bm-ot { clip-path: polygon(0 0, 100% 4vw, 100% 100%, 0 100%); padding-top: 4vw; }
.journey9.bm-ot::after {
    content: "GMAO"; position: absolute; z-index: -1; top: calc(4vw + 1rem); right: -1vw; pointer-events: none;
    font-family: var(--bm-display); font-weight: 700; font-size: clamp(8rem, 20vw, 18rem); line-height: .8;
    color: rgba(255, 255, 255, .045); white-space: nowrap;
}

/* Modulos: la caja de pestanas como una tarjeta grande */
.bm-modulos__caja { padding: clamp(18px, 3vw, 36px); border-radius: 28px; background: var(--bm-niebla); border: 1px solid var(--bm-linea); }
.bm-modulos__pestanas { border-left: 0; display: grid; gap: 4px; }
.bm-modulos__pestanas button { margin: 0; border-left: 0; border-radius: 12px; padding: .7rem 1rem; }
.bm-modulos__pestanas button:hover { background: rgba(255, 255, 255, .7); }
.bm-modulos__pestanas button[aria-selected="true"] { background: #fff; color: var(--bm-azul); box-shadow: var(--bm-sombra-tarjeta); }
.bm-modulos__captura { border-radius: 18px; }
@media (max-width: 991.98px) {
    .bm-modulos__pestanas { display: flex; }
    .bm-modulos__pestanas button { border-radius: 999px; }
}

/* Sectores: tarjetas; la primera (biomedicos, el origen de BioMantenimiento) destacada en azul */
#sectores { position: relative; overflow: hidden; isolation: isolate; }
#sectores::after {
    content: "CMMS"; position: absolute; z-index: -1; left: -1vw; bottom: -2.5rem; pointer-events: none;
    font-family: var(--bm-display); font-weight: 700; font-size: clamp(8rem, 18vw, 16rem); line-height: .8;
    color: rgba(5, 64, 242, .045); white-space: nowrap;
}
.bm-sectores { gap: 20px; }
.bm-sector {
    padding: 1.5rem; border-top: 0; 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-sector:hover { transform: translateY(-3px); box-shadow: var(--bm-sombra-tarjeta-alta); }
.bm-sector .bi { display: grid; place-items: center; width: 2.6rem; height: 2.6rem; border-radius: 12px; background: var(--bm-celeste); font-size: 1.25rem; }
.bm-sector:first-child { background: var(--bm-azul); border-color: transparent; }
.bm-sector:first-child .bi { background: rgba(255, 255, 255, .16); color: #fff; }
.bm-sector:first-child h3 a { color: #fff; text-decoration-color: rgba(255, 255, 255, .45); }
.bm-sector:first-child h3 a:hover { color: #fff; text-decoration-color: #fff; }
.bm-sector:first-child p { color: #DCE5FA; }
.bm-sector .bi { grid-row: span 2; }
/* El titulo de cada sector ocupa la altura del icono, asi el texto empieza a la misma altura en todas */
.bm-sector { grid-template-rows: min-content 1fr; align-content: start; }
.bm-sector h3 { min-height: 2.6rem; display: flex; align-items: center; }

/* El comparador lleva el mismo aire de cualquier seccion */
.compare7.bm-section { padding-block: var(--bm-section); }
.compare7 .compare { margin-top: 0; }

/* ---------------------------------------------------------------------
   Comparador con el estandar del sitio: marco de tarjeta grande (28px),
   el lado ordenado sobre el degradado corporativo suave, tarjetas con la
   misma sombra y esquinas del resto, etiquetas en pildora como .bm-tema
   y el control con el azul de marca.
   --------------------------------------------------------------------- */
.compare7 .stage { border-radius: 28px; box-shadow: 0 0 0 1px var(--bm-linea), 0 40px 80px -44px rgba(6, 23, 90, .45); }
.compare7 .layer-order {
    background-color: var(--bm-niebla);
    background-image: radial-gradient(60% 70% at 75% 35%, rgba(5, 64, 242, .08), transparent 70%), radial-gradient(circle at 1px 1px, #D5E0FA 1px, transparent 1.2px);
    background-size: auto, 24px 24px;
}
.compare7 .layer-order .card { border-radius: 20px; border: 1px solid var(--bm-linea); box-shadow: 0 1px 2px rgba(6, 23, 90, .04), 0 20px 44px -30px rgba(6, 23, 90, .35); }
.compare7 .card-h b, .compare7 .rec h3, .compare7 .audit-h { font-family: var(--bm-display); font-weight: 600; }
.compare7 .chip { border-radius: 999px; background: var(--bm-celeste); color: var(--bm-azul-700); }
.compare7 .act { border-radius: 999px; }

/* Etiquetas de cada lado, en pildora con punto como las de tema */
.compare7 .tag { gap: 8px; padding: 7px 14px; font-size: 13px; font-weight: 600; }
.compare7 .tag .bi { display: none; }
.compare7 .tag::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.compare7 .tag-chaos { background: rgba(255, 255, 255, .85); color: #6B6A66; box-shadow: 0 1px 2px rgba(0, 0, 0, .08); }
.compare7 .tag-order { background: var(--bm-azul); color: #fff; box-shadow: 0 8px 20px -10px rgba(5, 64, 242, .7); }

/* Linea y control para arrastrar */
.compare7 .handle::before { width: 3px; background: var(--bm-azul); box-shadow: 0 0 0 4px rgba(5, 64, 242, .12); }
.compare7 .knob { width: 52px; height: 52px; margin: -26px 0 0 -26px; background: var(--bm-azul); color: #fff; box-shadow: 0 0 0 6px rgba(5, 64, 242, .18), 0 12px 26px -8px rgba(6, 23, 90, .6); }

/* Pie del comparador: las dos notas en pildoras claras */
.compare7 .compare-foot { margin-top: 18px; font-size: .9rem; }
.compare7 .compare-foot > span { display: inline-flex; align-items: center; padding: .45rem .9rem; border-radius: 999px; background: var(--bm-niebla); border: 1px solid var(--bm-linea); color: var(--bm-gris); }
@media (max-width: 720px) { .compare7 .stage { border-radius: 22px; } }

/* ---------------------------------------------------------------------
   Reporte de la orden de trabajo con la estructura del informe real de
   la plataforma (formato F.MAI.03): encabezado con los dos logos, datos
   del cliente, informacion del equipo, inspeccion, medidas, evidencias,
   insumos, observaciones y firmas. Tablas con bordes, como el PDF.
   --------------------------------------------------------------------- */
.journey9 .paper.rp { padding: 22px 22px 14px; font-size: 11.5px; line-height: 1.3; }
.journey9 .rp-t { width: 100%; border-collapse: collapse; margin-bottom: 8px; }
.journey9 .rp-t th, .journey9 .rp-t td { border: 1px solid #C9D2E6; padding: 4px 7px; vertical-align: middle; text-align: left; }
.journey9 .rp-t th { background: #EEF2FB; color: var(--bm-marino); font-family: var(--bm-font); font-size: 10.5px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; text-align: center; }
.journey9 .rp-l { width: 1%; white-space: nowrap; color: var(--bm-gris); font-size: 10.5px; font-weight: 600; text-transform: uppercase; }
.journey9 .rp-sub td { background: #F7F9FD; color: var(--bm-gris); font-size: 10.5px; font-weight: 600; }
.journey9 .rp-t .mono { font-family: var(--bm-mono); font-size: 11px; }
.journey9 .rp .v { font-weight: 600; }
.journey9 .rp .slot::before { bottom: 1px; }

/* Encabezado: logo del cliente, titulo del formato y logo del prestador */
.journey9 .rp-cab .rp-logo { width: 74px; text-align: center; }
.journey9 .rp-cliente { display: grid; justify-items: center; gap: 2px; font-size: 9.5px; font-weight: 700; line-height: 1.1; color: var(--bm-marino); }
.journey9 .rp-cliente .bi { font-size: 18px; color: var(--bm-vencido); }
.journey9 .rp-cab .logo-tile { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 8px; background: var(--bm-azul); }
.journey9 .rp-titulo { background: #fff !important; font-size: 12px !important; letter-spacing: .02em; }
.journey9 .rp-c { text-align: center !important; }
.journey9 .rp-c .state { margin: 0 0 0 6px; vertical-align: middle; }
.journey9 .rp-mini td { font-size: 10px; color: var(--bm-gris); text-align: center; }
.journey9 .rp-mini b { color: var(--bm-texto); }

/* Equipo con su foto */
.journey9 .rp-foto-eq { width: 70px; text-align: center !important; color: var(--bm-azul); }
.journey9 .rp-foto-eq svg { width: 52px; height: 42px; }

/* Dos tablas lado a lado */
.journey9 .rp-dos { display: grid; grid-template-columns: 1.15fr 1fr; gap: 8px; align-items: start; }
.journey9 .rp-dos > * { margin-bottom: 8px; }
.journey9 .rp-dos .rp-t { margin-bottom: 0; }
.journey9 .rp-dos > div > .rp-t + * { margin-top: 6px; }
.journey9 .check td { border-top: 1px solid #C9D2E6; padding: 4px 7px; }
.journey9 .rp-box { width: 30px; text-align: center !important; }
.journey9 .rp-cnt { float: right; font-weight: 500; text-transform: none; color: var(--bm-gris); }
.journey9 .rp-medidas td { text-align: center; }
.journey9 .rp-medidas td:first-child { text-align: left; }
.journey9 .rp-evid td { text-align: center; }
.journey9 .rp .photo { height: 92px; }
.journey9 .rp .stock { margin: 4px 0 0; }
.journey9 .rp-obs { white-space: normal !important; }
.journey9 .rp-obs .ink { display: block; }

/* Firmas */
.journey9 .rp-firmas { position: relative; margin-top: 4px; }
.journey9 .rp-firmas th, .journey9 .rp-firmas td { width: 50%; }
.journey9 .rp-firmas .sig { height: 54px; border-bottom: 0; }
.journey9 .rp-firmas .sig svg { height: 48px; }
.journey9 .rp-pie-firma td { font-size: 10.5px; color: var(--bm-gris); }
.journey9 .rp-pie-firma b { color: var(--bm-texto); }
.journey9 .paper.rp { position: relative; }
.journey9 .paper.rp > .seal { top: auto; bottom: 58px; left: 50%; }
.journey9 .rp-footer { margin: 8px 0 0; padding-top: 6px; border-top: .5px solid #C9D2E6; display: flex; justify-content: space-between; gap: 8px; font-size: 9.5px; color: #6B7389; }
.journey9 .rp-footer .ej { display: inline; margin: 0; }
@media (max-width: 900px) {
    .journey9 .paper.rp { padding: 14px 12px 10px; font-size: 11px; }
    .journey9 .rp-dos { grid-template-columns: 1fr; gap: 0; }
    .journey9 .rp-foto-eq { display: none; }
    .journey9 .rp-cab .rp-logo { width: 54px; }
    .journey9 .rp-t th, .journey9 .rp-t td { padding: 3px 5px; }
    .journey9 .rp-l { font-size: 9.5px; }
}
.journey9 .check thead th { text-align: left; }
.journey9 .rp-cnt { margin-left: 8px; }
