/* Elementos del embudo de ventas compartidos por todas las páginas: promesa de respuesta, financiamiento,
   salida por WhatsApp, invitación tras la ficha PDF y aviso de la cotización. Usan los colores de cada página (--b-*). */

/* Promesa de respuesta: sobre fondos oscuros (hero, cabeceras, panel de la ficha) */
.bkg-sla{display:flex;flex-wrap:wrap;align-items:center;gap:2px 10px;margin:18px 0 0;font-size:14.5px;line-height:1.4;color:#E4E3E1}
.bkg-sla::before{content:"";flex:none;width:9px;height:9px;border-radius:50%;background:#3DDC84;box-shadow:0 0 0 4px rgba(61,220,132,.22)}
.bkg-sla b{color:#fff;font-weight:700}
.bkg-sla--claro{color:var(--b-mute)}
.bkg-sla--claro b{color:var(--b-ink)}

/* Financiamiento y garantía dentro de la ficha (fondo oscuro) */
.bkg-fin{margin:10px 0 0;font-size:13.5px;line-height:1.45;color:#C9C8C6}
.bkg-fin b{color:#fff;font-weight:700}
.bkg-fin[hidden],.bkg-fin__it[hidden]{display:none}

/* Bloque de financiamiento del inicio */
.bkg-financia{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(20px,4vw,48px);align-items:center;background:var(--b-ink);color:#fff;border-radius:var(--b-r);padding:clamp(24px,4vw,44px)}
.bkg-financia h2{font-size:clamp(26px,3.2vw,40px);line-height:1.02;margin:6px 0 12px}
.bkg-financia p{margin:0 0 10px;color:#D6D5D3;font-size:16px;max-width:52ch}
.bkg-financia .bx-kicker{color:var(--b-acc)}
.bkg-financia__pasos{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.bkg-financia__pasos li{display:flex;gap:14px;align-items:flex-start;font-size:15px;color:#E4E3E1}
.bkg-financia__pasos svg{flex:none;width:22px;height:22px;margin-top:1px;color:var(--b-acc)}
.bkg-financia__extra{margin-top:16px;display:grid;gap:8px;font-size:14px;color:#C9C8C6}
.bkg-financia__extra > *[hidden]{display:none}
.bkg-financia__cta{margin-top:18px;display:flex;gap:12px;flex-wrap:wrap}
@media(max-width:820px){.bkg-financia{grid-template-columns:1fr}}

/* Carrito: segunda salida (WhatsApp) y casilla de financiamiento */
.bkg-wa-carro{display:flex;align-items:center;justify-content:center;width:100%;margin-top:10px;padding:12px 16px;border:1.5px solid currentColor;border-radius:999px;font-weight:700;font-size:15px;text-decoration:none;color:inherit;background:transparent;cursor:pointer}
.bkg-wa-carro:hover{background:rgba(127,127,127,.12)}
.bkg-check{display:flex !important;flex-direction:row !important;align-items:flex-start;gap:10px;font-size:14px;line-height:1.35;cursor:pointer}
.bkg-check input{width:18px;height:18px;flex:none;margin-top:1px;accent-color:var(--b-acc)}

/* Ventana emergente tras descargar la ficha (no bloquea la descarga) */
.bkg-modal-abierto{overflow:hidden}
.bkg-modal{position:fixed;inset:0;z-index:2147483000;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(0,0,0,.66);animation:bkg-modal-in .18s ease-out}
.bkg-modal__caja{position:relative;width:100%;max-width:460px;padding:28px 26px 24px;border:1px solid rgba(255,255,255,.18);border-top:4px solid var(--b-acc);border-radius:14px;background:#16191d;color:#fff;box-shadow:0 24px 60px rgba(0,0,0,.55)}
.bkg-modal__caja h2{margin:6px 0 8px;font-size:24px;line-height:1.2;color:#fff}
.bkg-modal__caja p{margin:0 0 18px;font-size:16px;line-height:1.45;color:rgba(255,255,255,.86)}
.bkg-modal__caja .bkg-modal__ok{margin:0;font-size:14px;font-weight:700;color:#7ee2a8}
.bkg-modal__acc{display:flex;flex-direction:column;gap:10px}
.bkg-modal__acc .btn{justify-content:center;text-align:center;width:100%}
.bkg-modal__seguir{align-self:center;padding:8px 12px;border:0;background:transparent;color:rgba(255,255,255,.72);font:inherit;font-size:14px;text-decoration:underline;cursor:pointer}
.bkg-modal__seguir:hover{color:#fff}
.bkg-modal__x{position:absolute;top:8px;right:10px;width:36px;height:36px;border:0;background:transparent;color:#fff;font-size:26px;line-height:1;cursor:pointer;border-radius:50%}
.bkg-modal__x:hover{background:rgba(255,255,255,.14)}
@keyframes bkg-modal-in{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.bkg-modal{animation:none}}

/* Tarjetas del catálogo: enlace de WhatsApp */
.prod__wa{text-decoration:none}
.prod__wa:hover{text-decoration:underline}

/* Páginas por rubro (sectores/*.html): asesor «¿qué necesitas pesar?» y equipos recomendados */
.bkg-chips{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 26px}
.bkg-chip{font:inherit;font-weight:600;font-size:14.5px;padding:10px 18px;border-radius:999px;border:1.5px solid var(--b-line);background:var(--b-paper);color:var(--b-ink);cursor:pointer}
.bkg-chip:hover{border-color:var(--b-acc)}
.bkg-chip[aria-pressed="true"]{background:var(--b-ink);border-color:var(--b-ink);color:#fff}
.bkg-eqs{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:18px}
.bkg-eq{display:flex;flex-direction:column;background:var(--b-paper);border:1px solid var(--b-line);border-radius:var(--b-r);overflow:hidden}
.bkg-eq[hidden]{display:none}
.bkg-eq__foto{display:flex;align-items:center;justify-content:center;aspect-ratio:4/3;background:#fff;padding:12px}
.bkg-eq__foto img{max-width:100%;max-height:100%;object-fit:contain}
.bkg-eq__body{display:flex;flex-direction:column;gap:6px;padding:14px 16px 16px;flex:1}
.bkg-eq__nom{font-weight:700;font-size:16px;line-height:1.25;color:var(--b-ink);text-decoration:none}
.bkg-eq__spec{font-size:13px;color:var(--b-mute)}
.bkg-eq__acc{margin-top:auto;padding-top:10px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.bkg-eq__wa{font-weight:600;font-size:14px;color:var(--b-acc-d)}

/* --- Realismo Operativo Grid (Equipos) --- */
.sectores-realismo {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 1.5rem;
  margin-top: 1rem;
}
.sector-real {
  background: white;
  border: 1px solid #E2E8F0;
  border-radius: 4px;
  padding: 1rem;
  box-shadow: 0 2px 4px rgba(0,0,0,0.02);
  text-decoration: none;
  color: var(--t-pri);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  position: relative;
  display: flex;
  flex-direction: column;
}
.sector-real:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(0,0,0,0.08);
}
.sector-real img {
  width: 100%;
  height: 220px;
  object-fit: cover;
  border-radius: 2px;
  margin-bottom: 1rem;
  filter: contrast(1.1) saturate(0.9);
}
.sector-real__tag {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  background: #F1F5F9;
  color: #64748B;
  padding: 0.25rem 0.5rem;
  border-radius: 2px;
  margin-bottom: 0.5rem;
  align-self: flex-start;
}
.sector-real__title {
  font-family: var(--f-h);
  font-size: 1.25rem;
  font-weight: 600;
  margin: 0 0 0.25rem 0;
}
.sector-real__desc {
  font-family: var(--f-t);
  font-size: 0.95rem;
  color: var(--t-sec);
  margin: 0;
  line-height: 1.4;
}


/* --- Editorial Elegante Grid --- */
.sectores-editorial {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
  margin-top: 1.5rem;
}
@media (max-width: 1024px) {
  .sectores-editorial {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.25rem;
  }
}
@media (max-width: 600px) {
  .sectores-editorial {
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
    margin-top: 1rem;
  }
}
.sector-editorial {
  position: relative;
  height: 400px;
  border-radius: 12px;
  overflow: hidden;
  text-decoration: none;
  background: #1e1e20;
}
@media (max-width: 600px) {
  .sector-editorial {
    height: auto;
    aspect-ratio: 1 / 1.22;
    border-radius: 10px;
  }
}
.sector-editorial img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.7s ease;
}
.sector-editorial__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.88) 0%, rgba(0,0,0,0.45) 50%, rgba(0,0,0,0) 80%);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 2rem;
  color: white;
}
@media (max-width: 600px) {
  .sector-editorial__overlay {
    padding: 12px 10px;
    background: linear-gradient(to top, rgba(10,10,12,0.94) 0%, rgba(10,10,12,0.6) 55%, rgba(10,10,12,0) 85%);
  }
}
.sector-editorial:hover img {
  transform: scale(1.05);
}
.sector-editorial__title {
  font-family: var(--f-d, 'Barlow Condensed', sans-serif);
  font-size: 1.5rem;
  font-weight: 700;
  margin: 0 0 0.5rem 0;
  color: white;
  letter-spacing: .02em;
}
@media (max-width: 600px) {
  .sector-editorial__title {
    font-size: 18px;
    margin: 0 0 2px 0;
    line-height: 1.1;
  }
}
.sector-editorial__desc {
  font-family: var(--f-t);
  font-size: 0.95rem;
  margin: 0;
  transform: translateY(10px);
  opacity: 0;
  transition: all 0.3s ease;
  color: #D6D5D2;
}
.sector-editorial:hover .sector-editorial__desc {
  transform: translateY(0);
  opacity: 1;
}
@media (max-width: 600px) {
  .sector-editorial__desc {
    font-size: 10.5px;
    line-height: 1.25;
    opacity: 1;
    transform: none;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
}


/* --- Premium Components Grid (Original PNGs) --- */
.sectores-componentes {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  margin-top: 2rem;
}
@media (max-width: 900px) {
  .sectores-componentes {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
}
.sector-comp {
  background: #F8FAFC;
  border-radius: 16px;
  padding: 2.5rem 2rem;
  text-decoration: none;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
  position: relative;
  overflow: hidden;
  border: 1px solid #F1F5F9;
}
.sector-comp::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: radial-gradient(circle at top right, rgba(37,99,235,0.04), transparent 70%);
  pointer-events: none;
}
.sector-comp:hover {
  transform: translateY(-5px);
  background: #FFFFFF;
  box-shadow: 0 20px 40px -10px rgba(15,23,42,0.08);
  border-color: #E2E8F0;
}
.sector-comp__img {
  height: 160px;
  width: auto;
  max-width: 100%;
  object-fit: contain;
  margin-bottom: 2rem;
  transition: transform 0.4s ease;
  filter: drop-shadow(0 15px 15px rgba(0,0,0,0.1));
}
.sector-comp:hover .sector-comp__img {
  transform: scale(1.08) rotate(-1deg);
}
.sector-comp__tag {
  font-family: var(--f-m);
  font-size: 0.75rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--brand); /* Asumiendo que existe o usamos un azul #2563EB */
  color: #2563EB;
  margin-bottom: 0.5rem;
  font-weight: 700;
}
.sector-comp__title {
  font-family: var(--f-h);
  font-size: 1.35rem;
  font-weight: 700;
  color: #0F172A;
  margin: 0 0 0.5rem 0;
}
.sector-comp__desc {
  font-family: var(--f-t);
  font-size: 0.95rem;
  color: #64748B;
  margin: 0;
  line-height: 1.5;
}

