/* ==========================================================================
   TIASTICA — Cockpit ERP Module CSS
   Estilos específicos del módulo ERP dentro del Cockpit Shell.
   ========================================================================== */

/* --- MODULE GRID in left panel --- */
.module-preview {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 0.5rem;
  margin-top: 0.75rem;
}
.module-mini {
  background: var(--erp-glow-faint);
  border: 1px solid var(--erp-glow-soft);
  border-radius: 8px;
  padding: 0.5rem;
  text-align: center;
  cursor: pointer;
  transition: all 0.25s ease;
  outline: none;
}
.module-mini:hover {
  background: var(--erp-glow);
  border-color: var(--erp-glow-intense);
  transform: translateY(-2px);
}
.module-mini.active {
  background: var(--erp-glow);
  border-color: var(--color-erp);
  box-shadow: 0 0 12px var(--erp-glow-bright);
}
.module-icon {
  font-size: 1.2rem;
  display: block;
  margin-bottom: 0.2rem;
}
.module-name {
  font-family: var(--font-heading);
  font-size: 0.6rem;
  font-weight: var(--fw-semibold);
  color: var(--color-text-heading);
  display: block;
  line-height: 1.2;
}

/* --- SECTION LABEL --- */
.section-label {
  font-family: var(--font-heading);
  font-size: 0.6rem;
  font-weight: var(--fw-bold);
  color: var(--color-erp);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  margin-top: 1rem;
  margin-bottom: 0.5rem;
  padding-bottom: 0.25rem;
  border-bottom: 1px solid var(--erp-glow);
}

/* --- INTEGRATIONS --- */
.integrations-grid {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  margin-top: 0.5rem;
}
.integration-item {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.4rem 0.5rem;
  background: var(--erp-glow-faint);
  border: 1px solid var(--erp-glow-soft);
  border-radius: 6px;
  transition: all 0.2s;
}
.integration-item:hover {
  background: var(--erp-glow-soft);
  border-color: var(--erp-glow-bright);
}
.integration-icon {
  font-size: 1.1rem;
  flex-shrink: 0;
}
.integration-info strong {
  display: block;
  font-family: var(--font-heading);
  font-size: 0.65rem;
  font-weight: var(--fw-semibold);
  color: var(--color-text-heading);
}
.integration-info small {
  font-size: 0.55rem;
  color: var(--color-text-muted);
}

/* --- PLANS MINI in left panel --- */
.erp-plans-mini {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  margin-top: 0.5rem;
}
.erp-plan-tag {
  font-size: 0.55rem;
  font-weight: var(--fw-semibold);
  color: var(--color-text-muted);
  background: var(--color-bg-glass);
  border: 1px solid var(--color-border);
  border-radius: 100px;
  padding: 0.2rem 0.6rem;
  transition: all 0.2s;
}
.erp-plan-tag.featured {
  color: var(--color-erp);
  border-color: var(--erp-glow-intense);
  background: var(--erp-glow-soft);
}

/* --- ADVANTAGES in left panel --- */
.erp-advantages-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.3rem;
  margin-top: 0.5rem;
}
.erp-advantage-item {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.3rem 0.4rem;
  background: var(--erp-glow-faint);
  border: 1px solid var(--erp-glow-soft);
  border-radius: 6px;
  font-size: 0.55rem;
  font-weight: var(--fw-medium);
  color: var(--color-text-heading);
  transition: all 0.2s;
}
.erp-advantage-item:hover {
  background: var(--erp-glow-soft);
  border-color: var(--erp-glow-bright);
}
.erp-advantage-item i { color: var(--color-erp); flex-shrink: 0; }

/* ==========================================================================
   TAB NAVIGATION — CARACTERÍSTICA · EXPLORADOR · MONITOR
   ========================================================================== */
.erp-tab-bar {
  display: flex;
  gap: 0.25rem;
  padding: 0 0 0.75rem 0;
  border-bottom: 1px solid var(--color-border);
  margin-bottom: 0.75rem;
  flex-shrink: 0;
}
.erp-tab {
  font-family: var(--font-heading);
  font-size: 0.55rem;
  font-weight: var(--fw-bold);
  letter-spacing: 0.1em;
  color: var(--color-text-muted);
  background: transparent;
  border: none;
  border-bottom: 2px solid transparent;
  padding: 0.35rem 0.75rem;
  cursor: pointer;
  transition: all 0.25s ease;
  text-transform: uppercase;
}
.erp-tab:hover {
  color: var(--color-text-muted);
}
.erp-tab--active {
  color: var(--color-erp);
  border-bottom-color: var(--color-erp);
}
.erp-tab-content {
  flex: 1;
  display: flex;
  min-height: 0;
}
.erp-tab-panel {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
}

/* ===================================================================
   CARACTERÍSTICA — Hero + Value Props (GM Transport replica)
   =================================================================== */
.erp-caracteristica {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  overflow-y: auto;
  padding-right: 0.25rem;
}
.erp-vp-hero {
  display: flex;
  gap: 1rem;
  align-items: center;
  background: var(--erp-glow-faint);
  border: 1px solid var(--erp-glow-soft);
  border-radius: 10px;
  padding: 1rem;
}
.erp-vp-hero__text {
  flex: 1;
  min-width: 0;
}
.erp-vp-hero__text h3 {
  font-family: var(--font-heading);
  font-size: 0.85rem;
  font-weight: var(--fw-bold);
  color: var(--color-text-heading);
  margin-bottom: 0.4rem;
  line-height: 1.3;
}
.erp-vp-hero__text p {
  font-size: 0.6rem;
  color: var(--color-text-muted);
  line-height: 1.5;
  margin-bottom: 0.6rem;
}
.erp-vp-ctas {
  display: flex;
  gap: 0.5rem;
}
.erp-vp-btn {
  font-size: 0.5rem;
  font-weight: var(--fw-semibold);
  padding: 0.3rem 0.7rem;
  border-radius: 6px;
  cursor: default;
  white-space: nowrap;
}
.erp-vp-btn--primary {
  background: var(--color-erp);
  color: var(--color-text-heading);
}
.erp-vp-btn--outline {
  background: transparent;
  border: 1px solid var(--erp-glow-bright);
  color: var(--color-erp);
}
.erp-vp-hero__img {
  width: 200px;
  flex-shrink: 0;
  border-radius: 8px;
  overflow: hidden;
  background: var(--color-bg-glass);
}
.erp-vp-screen {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 6px;
}
.erp-vp-subtitle {
  font-family: var(--font-heading);
  font-size: 0.65rem;
  font-weight: var(--fw-semibold);
  color: var(--color-text-heading);
  text-align: center;
  padding: 0.5rem 1rem;
  background: var(--erp-glow-faint);
  border: 1px solid var(--erp-glow-soft);
  border-radius: 8px;
  line-height: 1.4;
}
.erp-vp-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 0.5rem;
}
.erp-vp-card {
  background: var(--color-bg-glass);
  border: 1px solid var(--color-border);
  border-radius: 8px;
  padding: 0.6rem;
  transition: all 0.25s;
}
.erp-vp-card:hover {
  background: var(--erp-glow-faint);
  border-color: var(--erp-glow);
  transform: translateY(-1px);
}
.erp-vp-card i {
  font-size: 1rem;
  color: var(--color-erp);
  display: block;
  margin-bottom: 0.3rem;
}
.erp-vp-card h4 {
  font-family: var(--font-heading);
  font-size: 0.6rem;
  font-weight: var(--fw-semibold);
  color: var(--color-text-heading);
  margin-bottom: 0.2rem;
}
.erp-vp-card p {
  font-size: 0.5rem;
  color: var(--color-text-muted);
  line-height: 1.4;
}

/* ===================================================================
   EXPLORADOR — Module wheel + categories
   =================================================================== */
.erp-explorador {
  flex: 1;
  display: flex;
  min-height: 0;
}
.erp-explorador__main {
  flex: 1;
  display: flex;
  gap: 1rem;
  align-items: center;
  justify-content: center;
  min-height: 0;
}
.erp-wheel-wrap {
  flex: 1;
  max-width: 55%;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}
.erp-wheel-img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  border-radius: 12px;
  position: relative;
  z-index: 1;
  filter: drop-shadow(0 0 30px var(--erp-glow-bright));
}
.erp-wheel-glow {
  position: absolute;
  width: 70%;
  height: 70%;
  background: radial-gradient(ellipse, var(--erp-glow-soft) 0%, transparent 70%);
  border-radius: 50%;
  z-index: 0;
  pointer-events: none;
}
.erp-module-cats {
  width: 200px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}
.erp-mc-card {
  background: var(--color-bg-glass);
  border: 1px solid var(--color-border);
  border-left: 3px solid var(--mc-color);
  border-radius: 6px;
  padding: 0.5rem 0.6rem;
  transition: all 0.2s;
}
.erp-mc-card:hover {
  background: var(--erp-glow-faint);
  transform: translateX(2px);
}
.erp-mc-card i {
  font-size: 0.7rem;
  color: var(--mc-color);
  margin-bottom: 0.15rem;
  display: block;
}
.erp-mc-card strong {
  font-family: var(--font-heading);
  font-size: 0.55rem;
  font-weight: var(--fw-bold);
  color: var(--color-text-heading);
  display: block;
  margin-bottom: 0.15rem;
}
.erp-mc-card span {
  font-size: 0.45rem;
  color: var(--color-text-muted);
  line-height: 1.35;
  display: block;
}

/* ===================================================================
   MONITOR — Live dashboard
   =================================================================== */
.erp-monitor {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
  min-height: 0;
}

/* ==========================================================================
   CENTER SCREEN — ERP Dashboard (legacy)
   ========================================================================== */
.erp-dashboard {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  padding: 1.25rem;
  gap: 0.75rem;
  position: relative;
  z-index: 1;
}

/* KPI Row */
.erp-dash-kpis {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.5rem;
}
.erp-kpi {
  background: var(--erp-glow-faint);
  border: 1px solid var(--erp-glow);
  border-radius: 8px;
  padding: 0.6rem 0.75rem;
  text-align: center;
  transition: all 0.3s;
}
.erp-kpi__label {
  font-family: var(--font-heading);
  font-size: 0.5rem;
  font-weight: var(--fw-bold);
  color: var(--color-text-muted);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 0.25rem;
}
.erp-kpi__value {
  font-family: var(--font-heading);
  font-size: 1.3rem;
  font-weight: var(--fw-extrabold);
  color: var(--color-text-heading);
  line-height: 1.1;
}
.erp-kpi__value--erp {
  color: var(--color-erp);
}
.erp-kpi__sub {
  font-size: 0.5rem;
  color: var(--color-text-muted);
  margin-top: 0.15rem;
}

/* CANBUS Telemetry Panel */
.erp-canbus {
  flex: 1;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 0.5rem;
  align-content: center;
}
.erp-canbus-card {
  background: var(--erp-glow-faint);
  border: 1px solid var(--erp-glow-soft);
  border-radius: 10px;
  padding: 0.75rem 0.5rem;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  transition: all 0.3s;
}
.erp-canbus-card:hover {
  border-color: var(--erp-glow-bright);
  background: var(--erp-glow-soft);
}
.erp-canbus-val {
  font-family: var(--font-heading);
  font-size: 1.5rem;
  font-weight: var(--fw-extrabold);
  color: var(--color-erp);
  line-height: 1.1;
  transition: all 0.3s;
}
.erp-canbus-unit {
  font-size: 0.5rem;
  color: var(--color-text-muted);
  margin-top: 0.1rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.erp-canbus-label {
  font-family: var(--font-heading);
  font-size: 0.6rem;
  font-weight: var(--fw-semibold);
  color: var(--color-text-heading);
  margin-top: 0.3rem;
  line-height: 1.2;
}

/* Fleet activity strip */
.erp-fleet-strip {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.4rem 0.75rem;
  background: var(--erp-glow-faint);
  border: 1px solid var(--erp-glow-soft);
  border-radius: 8px;
  overflow-x: auto;
  flex-shrink: 0;
}
.erp-fleet-strip::-webkit-scrollbar { height: 2px; }
.erp-fleet-strip::-webkit-scrollbar-thumb { background: var(--erp-glow-intense); border-radius: 1px; }
.erp-fleet-unit {
  display: flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.2rem 0.5rem;
  background: var(--color-bg-glass);
  border-radius: 100px;
  border: 1px solid var(--color-border);
  flex-shrink: 0;
  font-size: 0.55rem;
  color: var(--color-text-muted);
}
.erp-fleet-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  flex-shrink: 0;
}
.erp-fleet-dot--active {
  background: var(--color-erp);
  box-shadow: 0 0 6px var(--erp-glow-intense);
  animation: fleetPulse 1.5s ease-in-out infinite;
}
.erp-fleet-dot--idle {
  background: #EF4444;
  box-shadow: 0 0 6px rgba(239,68,68,0.4);
}
.erp-fleet-dot--off {
  background: var(--color-bg-glass);
}
@keyframes fleetPulse {
  0%, 100% { opacity: 0.6; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.2); }
}

/* Fleet simulation row (shown when stepper is active on cost optimization) */
.erp-fleet-sim-row {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.5rem 0.75rem;
  background: var(--erp-glow-faint);
  border: 1px solid var(--erp-glow-soft);
  border-radius: 8px;
  flex-shrink: 0;
}
.erp-fleet-sim-row .bar-chart-container {
  display: flex;
  align-items: flex-end;
  gap: 3px;
  height: 40px;
  flex: 1;
}
.erp-fleet-sim-row .sim-bar {
  flex: 1;
  background: var(--erp-glow-bright);
  border-radius: 2px 2px 0 0;
  height: 0%;
  transition: height 0.8s cubic-bezier(0.22,1,0.36,1), background 0.3s;
}
.erp-fleet-sim-row .sim-bar.is-active {
  background: var(--erp-glow-intense);
}
.erp-savings-mini {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.4rem 0.75rem;
  background: var(--erp-glow-soft);
  border: 1px solid var(--erp-glow-bright);
  border-radius: 8px;
  flex-shrink: 0;
  white-space: nowrap;
  transition: all 0.5s;
}
.erp-savings-mini span {
  font-family: var(--font-heading);
  font-size: 0.65rem;
  font-weight: var(--fw-bold);
  color: var(--color-erp);
}
.erp-savings-mini small {
  font-size: 0.5rem;
  color: var(--color-text-muted);
}

/* ==========================================================================
   MODULE DETAIL OVERLAY on screen
   ========================================================================== */
.module-overlay {
  position: absolute;
  inset: 0;
  background: var(--color-bg-glass-strong);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
  z-index: 10;
  border-radius: 14px;
  animation: moduleOverlayIn 0.3s ease both;
}
@keyframes moduleOverlayIn {
  from { opacity: 0; transform: scale(0.96); }
  to { opacity: 1; transform: scale(1); }
}
.module-overlay__icon {
  font-size: 2.5rem;
  margin-bottom: 0.75rem;
}
.module-overlay h3 {
  font-family: var(--font-heading);
  font-size: 1.2rem;
  font-weight: var(--fw-bold);
  margin-bottom: 0.75rem;
  text-align: center;
}
.module-overlay ul {
  list-style: none;
  text-align: left;
  display: inline-block;
  max-width: 340px;
}
.module-overlay li {
  font-size: 0.78rem;
  color: rgba(255,255,255,0.8);
  padding: 0.3rem 0;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  line-height: 1.4;
}
.module-overlay li::before {
  content: '✦';
  font-size: 0.5rem;
  flex-shrink: 0;
}
.module-overlay__close {
  margin-top: 1rem;
  background: var(--color-erp);
  color: #fff;
  border: none;
  padding: 0.4rem 1.2rem;
  border-radius: 6px;
  font-weight: var(--fw-semibold);
  font-size: 0.75rem;
  cursor: pointer;
  transition: all 0.2s;
}
.module-overlay__close:hover {
  background: #53BAE3;
  transform: translateY(-1px);
}

/* ==========================================================================
   GPS FEATURES MINI in console / left panel
   ========================================================================== */
.erp-gps-mini-list {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  margin-top: 0.5rem;
}
.erp-gps-mini-item {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.6rem;
  color: var(--color-text-muted);
  padding: 0.3rem 0.4rem;
  border-radius: 4px;
  transition: all 0.2s;
}
.erp-gps-mini-item:hover {
  background: var(--erp-glow-faint);
  color: var(--color-text-heading);
}
.erp-gps-mini-num {
  font-family: var(--font-heading);
  font-size: 0.7rem;
  font-weight: var(--fw-bold);
  color: var(--color-erp);
  opacity: 0.4;
  width: 1.2rem;
  flex-shrink: 0;
  text-align: right;
}

/* ==========================================================================
   DASHCAM ALERT TAGS in console
   ========================================================================== */
.erp-alert-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-top: 0.5rem;
}
.erp-alert-tag {
  background: var(--erp-glow-soft);
  border: 1px solid var(--erp-glow-bright);
  border-radius: 100px;
  padding: 0.2rem 0.6rem;
  font-size: 0.55rem;
  color: var(--color-erp);
  font-weight: var(--fw-medium);
  white-space: nowrap;
}

/* ==========================================================================
   DASHCAM FEATURES grid
   ========================================================================== */
.erp-dashcam-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.4rem;
  margin-top: 0.5rem;
}
.erp-dashcam-feat {
  background: var(--erp-glow-faint);
  border: 1px solid var(--erp-glow-soft);
  border-radius: 6px;
  padding: 0.4rem;
  text-align: center;
  transition: all 0.2s;
}
.erp-dashcam-feat:hover {
  background: var(--erp-glow-soft);
  border-color: var(--erp-glow-bright);
}
.erp-dashcam-feat__icon {
  font-size: 1rem;
  margin-bottom: 0.2rem;
  display: block;
}
.erp-dashcam-feat h5 {
  font-family: var(--font-heading);
  font-size: 0.55rem;
  font-weight: var(--fw-semibold);
  color: var(--color-text-heading);
  margin-bottom: 0.1rem;
}
.erp-dashcam-feat p {
  font-size: 0.5rem;
  color: var(--color-text-muted);
  line-height: 1.3;
}

/* ==========================================================================
   SOCIAL PROOF stats
   ========================================================================== */
.proof-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.5rem;
  margin-top: 0.5rem;
}
.proof-stat {
  text-align: center;
  padding: 0.4rem 0.25rem;
  background: var(--erp-glow-faint);
  border: 1px solid var(--erp-glow-soft);
  border-radius: 6px;
}
.proof-stat__num {
  font-family: var(--font-heading);
  font-size: 1rem;
  font-weight: var(--fw-extrabold);
  color: var(--color-erp);
  line-height: 1.1;
}
.proof-stat__label {
  font-size: 0.5rem;
  color: var(--color-text-muted);
  margin-top: 0.15rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* ==========================================================================
   SAVINGS / OPTIMIZATION card in center
   ========================================================================== */
.erp-savings-card {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.5rem 0.75rem;
  background: var(--erp-glow);
  border: 1px solid var(--erp-glow-bright);
  border-radius: 10px;
  flex-shrink: 0;
  transition: all 0.5s;
}
.erp-savings-card svg {
  flex-shrink: 0;
  color: var(--color-erp);
}
.erp-savings-card__info {
  flex: 1;
}
.erp-savings-card__label {
  font-family: var(--font-heading);
  font-size: 0.5rem;
  font-weight: var(--fw-bold);
  color: var(--color-text-muted);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.erp-savings-card__value {
  font-family: var(--font-heading);
  font-size: 1.1rem;
  font-weight: var(--fw-extrabold);
  color: var(--color-erp);
  line-height: 1.2;
}
.erp-savings-card__sub {
  font-size: 0.5rem;
  color: var(--color-text-muted);
}

/* ==========================================================================
   RESPONSIVE
   ========================================================================== */
@media (max-width: 1024px) {
  .module-preview {
    grid-template-columns: repeat(3, 1fr);
  }
  .erp-canbus {
    grid-template-columns: repeat(5, 1fr);
    gap: 0.35rem;
  }
  .erp-canbus-val { font-size: 1.2rem; }
  .erp-dashcam-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 768px) {
  .erp-dashboard { padding: 0.75rem; gap: 0.5rem; }
  .erp-kpi__value { font-size: 1rem; }
  .erp-canbus { grid-template-columns: repeat(5, 1fr); gap: 0.25rem; }
  .erp-canbus-card { padding: 0.4rem 0.3rem; }
  .erp-canbus-val { font-size: 1rem; }
  .erp-canbus-label { font-size: 0.5rem; }
  .module-preview {
    grid-template-columns: repeat(3, 1fr);
    gap: 0.3rem;
  }
  .module-mini { padding: 0.35rem; }
  .module-icon { font-size: 1rem; }
  .module-name { font-size: 0.55rem; }
  .erp-dashcam-grid { grid-template-columns: repeat(3, 1fr); gap: 0.25rem; }
  .proof-stats { grid-template-columns: repeat(4, 1fr); }
  .erp-gps-mini-item { font-size: 0.55rem; }
}

@media (max-width: 480px) {
  .erp-dashboard { padding: 0.5rem; gap: 0.35rem; }
  .erp-dash-kpis { gap: 0.3rem; }
  .erp-kpi { padding: 0.35rem 0.4rem; }
  .erp-kpi__value { font-size: 0.85rem; }
  .erp-kpi__label { font-size: 0.45rem; }
  .erp-canbus { gap: 0.15rem; }
  .erp-canbus-card { padding: 0.3rem 0.2rem; }
  .erp-canbus-val { font-size: 0.85rem; }
  .erp-canbus-unit { font-size: 0.4rem; }
  .erp-canbus-label { font-size: 0.45rem; margin-top: 0.15rem; }
  .module-preview {
    grid-template-columns: repeat(3, 1fr);
    gap: 0.2rem;
  }
  .module-mini { padding: 0.25rem; border-radius: 6px; }
  .module-icon { font-size: 0.85rem; margin-bottom: 0.1rem; }
  .module-name { font-size: 0.5rem; }
  .section-label { font-size: 0.5rem; margin-top: 0.75rem; }
  .integration-item { padding: 0.3rem 0.4rem; }
  .integration-info strong { font-size: 0.55rem; }
  .integration-info small { font-size: 0.45rem; }
  .erp-plan-tag { font-size: 0.5rem; padding: 0.15rem 0.5rem; }
  .erp-dashcam-grid { grid-template-columns: repeat(3, 1fr); }
  .erp-dashcam-feat { padding: 0.3rem; }
  .erp-dashcam-feat__icon { font-size: 0.75rem; }
  .erp-dashcam-feat h5 { font-size: 0.5rem; }
  .erp-dashcam-feat p { font-size: 0.45rem; }
  .proof-stats { grid-template-columns: repeat(4, 1fr); }
  .proof-stat__num { font-size: 0.75rem; }
  .erp-alert-tag { font-size: 0.5rem; padding: 0.15rem 0.4rem; }
}



/* ====================================================================
   ERP ONBOARDING — secciones enriquecidas (ventajas, addons, sectores)
   Paleta de marca TIASTICA. ERP accent var(--color-erp) = #1C8FD6
   ==================================================================== */
.erp-section-head{
  display:flex; align-items:center; gap:0.5rem;
  font-size:0.62rem; font-weight:var(--fw-semibold); letter-spacing:0.04em;
  color:var(--color-text-heading); text-transform:none;
  margin:1.1rem 0 0.6rem; padding-bottom:0.4rem;
  border-bottom:1px solid var(--erp-glow);
}
.erp-section-head i{ color:var(--color-erp); font-size:0.8rem; }

/* Ventajas clave — chips horizontales */
.erp-adv-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:0.5rem; }
.erp-adv-chip{
  display:flex; align-items:flex-start; gap:0.5rem; padding:0.6rem;
  background:linear-gradient(135deg, rgba(83,186,227,0.05), rgba(43,128,191,0.02));
  border:1px solid var(--erp-glow); border-radius:10px;
  transition:border-color var(--transition-fast), transform var(--transition-fast);
}
.erp-adv-chip:hover{ border-color:var(--erp-glow-intense); transform:translateY(-2px); }
.erp-adv-chip i{ color:var(--color-erp); font-size:1.1rem; margin-top:0.1rem; }
.erp-adv-chip__txt strong{ display:block; font-size:0.6rem; font-weight:var(--fw-semibold); color:var(--color-text-heading); }
.erp-adv-chip__txt span{ font-size:0.52rem; color:var(--color-text-muted); line-height:1.4; }

/* Módulos adicionales */
.erp-addon-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:0.5rem; }
.erp-addon-card{
  display:flex; align-items:flex-start; gap:0.5rem; padding:0.6rem;
  background:var(--color-bg-glass); border:1px solid var(--color-border);
  border-radius:10px; transition:border-color var(--transition-fast), background var(--transition-fast);
}
.erp-addon-card:hover{ border-color:var(--erp-glow-bright); background:var(--erp-glow-faint); }
.erp-addon-card i{ color:var(--color-erp); font-size:1.05rem; margin-top:0.1rem; }
.erp-addon-card__txt strong{ display:block; font-size:0.6rem; font-weight:var(--fw-semibold); color:var(--color-text-heading); }
.erp-addon-card__txt span{ font-size:0.52rem; color:var(--color-text-muted); line-height:1.4; }

/* SECTORES tab */
.erp-sectores{ display:flex; flex-direction:column; height:100%; overflow-y:auto; padding:0.25rem; }
.erp-sector-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:0.5rem; }
.erp-sector-card{
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:0.4rem;
  padding:0.85rem 0.5rem; text-align:center;
  background:linear-gradient(160deg, rgba(83,186,227,0.06), rgba(33,78,130,0.03));
  border:1px solid var(--erp-glow); border-radius:12px;
  transition:transform var(--transition-fast), border-color var(--transition-fast), box-shadow var(--transition-fast);
}
.erp-sector-card:hover{ transform:translateY(-3px); border-color:rgba(83,186,227,0.4); box-shadow:0 8px 22px var(--erp-glow); }
.erp-sector-card i{ font-size:1.4rem; color:var(--color-erp); }
.erp-sector-card span{ font-size:0.55rem; font-weight:var(--fw-medium); color:var(--color-text-heading); line-height:1.25; }

/* Alianzas */
.erp-alliance-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:0.6rem; }
.erp-alliance-card{
  display:flex; align-items:center; gap:0.6rem; padding:0.7rem;
  background:var(--color-bg-glass); border:1px solid var(--color-border);
  border-radius:12px;
}
.erp-alliance-card__logo{
  flex-shrink:0; width:38px; height:38px; border-radius:9px;
  display:flex; align-items:center; justify-content:center;
  background:var(--brand-gradient); color:#fff; font-size:1.1rem;
}
.erp-alliance-card__txt strong{ display:block; font-size:0.65rem; font-weight:var(--fw-bold); color:var(--color-text-heading); }
.erp-alliance-card__txt span{ font-size:0.5rem; color:var(--color-text-muted); line-height:1.35; }

@media(max-width:900px){
  .erp-adv-grid,.erp-addon-grid,.erp-alliance-grid{ grid-template-columns:repeat(2,1fr); }
  .erp-sector-grid{ grid-template-columns:repeat(3,1fr); }
}

/* ====================================================================
   ERP MODULE DETAIL — panel desplegable de moduleDetail
   ==================================================================== */
.erp-mc-card{ cursor:pointer; transition:transform var(--transition-fast), border-color var(--transition-fast), box-shadow var(--transition-fast); }
.erp-mc-card:hover{ transform:translateY(-2px); }
.erp-mc-card--active{
  border-color:var(--mc-color)!important;
  box-shadow:0 0 0 1px var(--mc-color), 0 8px 22px var(--erp-glow-bright);
}
.erp-mc-card--active i{ transform:scale(1.1); }

.erp-module-detail{
  margin-top:0.9rem; padding:0.85rem;
  background:linear-gradient(160deg, var(--erp-glow-faint), rgba(33,78,130,0.02));
  border:1px solid var(--erp-glow-bright); border-radius:14px;
  animation:simFadeIn 0.3s ease;
}
.erp-md-head{
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:0.7rem; padding-bottom:0.5rem;
  border-bottom:1px solid var(--erp-glow);
}
.erp-md-head span{ display:flex; align-items:center; gap:0.4rem; font-size:0.7rem; font-weight:var(--fw-bold); color:var(--color-text-heading); }
.erp-md-head span i{ color:var(--color-erp); }
.erp-md-close{
  background:var(--color-bg-glass); border:1px solid var(--color-border);
  color:var(--color-text-muted); border-radius:100px; padding:0.2rem 0.6rem;
  font-size:0.5rem; transition:all var(--transition-fast);
}
.erp-md-close:hover{ color:var(--color-text-heading); border-color:var(--color-erp); }
.erp-md-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:0.6rem; }
.erp-md-card{
  background:var(--color-bg-glass); border:1px solid var(--color-border);
  border-radius:10px; padding:0.65rem;
}
.erp-md-card__head{ display:flex; align-items:flex-start; gap:0.5rem; margin-bottom:0.4rem; }
.erp-md-card__head i{ color:var(--color-erp); font-size:1.1rem; }
.erp-md-card__head strong{ display:block; font-size:0.62rem; font-weight:var(--fw-semibold); color:var(--color-text-heading); }
.erp-md-card__head span{ display:block; font-size:0.5rem; color:var(--color-text-muted); line-height:1.35; margin-top:0.1rem; }
.erp-md-list{ list-style:none; display:grid; grid-template-columns:1fr 1fr; gap:0.15rem 0.5rem; margin:0; padding:0; }
.erp-md-list li{ display:flex; align-items:flex-start; gap:0.3rem; font-size:0.5rem; color:var(--color-text-muted); line-height:1.35; }
.erp-md-list li i{ color:var(--color-erp); font-size:0.6rem; margin-top:0.1rem; flex-shrink:0; }
@media(max-width:900px){ .erp-md-grid{ grid-template-columns:1fr; } .erp-md-list{ grid-template-columns:1fr; } }

/* ============================================================================
   ERP ONBOARDING — sistema de páginas del recorrido (modelo cockpit)
   Azul de marca TIASTICA. ERP accent = #1C8FD6
   ========================================================================== */
.erp-ob-screen{ display:flex; flex-direction:column; height:100%; overflow:hidden; }
.erp-ob-topbar{
  display:flex; align-items:center; justify-content:space-between;
  padding:0.55rem 0.85rem; margin-bottom:0.6rem;
  border-bottom:1px solid var(--erp-glow-bright);
}
.erp-ob-topbar__step{ font-size:0.5rem; letter-spacing:0.12em; color:var(--color-erp); font-weight:var(--fw-bold); }
.erp-ob-topbar__title{ font-size:0.72rem; font-weight:var(--fw-bold); color:var(--color-text-heading); display:flex; align-items:center; gap:0.4rem; }
.erp-ob-topbar__title i{ color:var(--color-erp); }
.erp-ob-page{ flex:1; overflow-y:auto; padding:0.3rem 0.85rem 0.85rem; display:flex; flex-direction:column; gap:0.7rem; }
.erp-ob-lead{ font-size:0.62rem; color:var(--color-text-muted); line-height:1.5; }
.erp-ob-eyebrow{ font-size:0.5rem; letter-spacing:0.12em; text-transform:uppercase; color:var(--color-erp); font-weight:var(--fw-bold); margin-bottom:0.3rem; }
.erp-ob-subhead{ display:flex; align-items:center; gap:0.4rem; font-size:0.62rem; font-weight:var(--fw-semibold); color:var(--color-text-heading); margin-top:0.3rem; padding-bottom:0.35rem; border-bottom:1px solid var(--erp-glow); }
.erp-ob-subhead i{ color:var(--color-erp); }
.erp-ob-note{ font-size:0.55rem; color:var(--color-text-muted); text-align:center; font-style:italic; }

/* Grids */
.erp-ob-grid{ display:grid; gap:0.55rem; }
.erp-ob-grid--2{ grid-template-columns:1fr 1fr; }
.erp-ob-grid--3{ grid-template-columns:repeat(3,1fr); }

/* Hero (página visión) */
.erp-ob-hero{ display:grid; grid-template-columns:1.1fr 1fr; gap:1rem; align-items:center; background:linear-gradient(135deg,var(--erp-glow-soft),rgba(33,78,130,0.03)); border:1px solid var(--erp-glow); border-radius:14px; padding:0.9rem; }
.erp-ob-hero__txt h2{ font-family:var(--font-heading); font-size:0.95rem; line-height:1.2; color:var(--color-text-heading); margin:0 0 0.4rem; }
.erp-ob-hero__txt p{ font-size:0.58rem; color:var(--color-text-muted); line-height:1.5; }
.erp-ob-hero__img img{ width:100%; border-radius:10px; border:1px solid var(--erp-glow-bright); box-shadow:0 10px 30px rgba(0,0,0,0.35); }

/* Cards genéricas */
.erp-ob-card{ background:var(--color-bg-glass); border:1px solid var(--color-border); border-radius:11px; padding:0.7rem; transition:transform var(--transition-fast),border-color var(--transition-fast); }
.erp-ob-card:hover{ transform:translateY(-2px); border-color:var(--erp-glow-intense); }
.erp-ob-card i{ font-size:1.3rem; color:var(--color-erp); }
.erp-ob-card h4{ font-size:0.62rem; font-weight:var(--fw-semibold); color:var(--color-text-heading); margin:0.35rem 0 0.15rem; }
.erp-ob-card p{ font-size:0.52rem; color:var(--color-text-muted); line-height:1.4; }
.erp-ob-card--pick{ cursor:default; text-align:left; }

/* Pain cards */
.erp-ob-pain{ background:var(--color-bg-glass); border:1px solid var(--color-border); border-left:3px solid var(--color-erp); border-radius:10px; padding:0.7rem; }
.erp-ob-pain__tag{ font-size:0.48rem; text-transform:uppercase; letter-spacing:0.1em; color:var(--color-text-muted); margin-bottom:0.3rem; }
.erp-ob-pain__q{ font-size:0.6rem; color:var(--color-text-heading); font-weight:var(--fw-medium); line-height:1.4; margin-bottom:0.5rem; }
.erp-ob-pain__a{ display:flex; align-items:center; gap:0.35rem; font-size:0.55rem; color:var(--color-erp); }

/* Two-column (imagen + texto) */
.erp-ob-two{ display:grid; grid-template-columns:1fr 1fr; gap:0.9rem; align-items:center; }
.erp-ob-two__img img{ width:100%; border-radius:10px; border:1px solid var(--erp-glow-bright); box-shadow:0 8px 24px var(--shadow-color); }
.erp-ob-two__img--phone{ display:flex; justify-content:center; }
.erp-ob-two__img--phone img{ width:auto; max-height:240px; border:none; box-shadow:0 12px 40px rgba(0,0,0,0.45); }
.erp-ob-catrow{ display:flex; flex-direction:column; padding:0.4rem 0; border-bottom:1px solid var(--color-border); }
.erp-ob-catrow strong{ font-size:0.6rem; color:var(--color-text-heading); }
.erp-ob-catrow span{ font-size:0.5rem; color:var(--color-text-muted); margin-top:0.1rem; }

/* Mini cards (addons) */
.erp-ob-mini{ display:flex; gap:0.45rem; align-items:flex-start; background:var(--erp-glow-faint); border:1px solid var(--erp-glow); border-radius:9px; padding:0.5rem; }
.erp-ob-mini i{ color:var(--color-erp); font-size:1rem; margin-top:0.1rem; }
.erp-ob-mini strong{ display:block; font-size:0.55rem; color:var(--color-text-heading); }
.erp-ob-mini span{ font-size:0.48rem; color:var(--color-text-muted); line-height:1.35; }

/* Minirow (interfaz/apps/cobertura) */
.erp-ob-minirow{ display:flex; gap:0.5rem; align-items:flex-start; padding:0.45rem 0; }
.erp-ob-minirow i{ color:var(--color-erp); font-size:1.1rem; margin-top:0.1rem; }
.erp-ob-minirow strong{ display:block; font-size:0.6rem; color:var(--color-text-heading); }
.erp-ob-minirow span{ font-size:0.52rem; color:var(--color-text-muted); line-height:1.4; }

/* Numbered (GPS) */
.erp-ob-num{ display:flex; gap:0.5rem; align-items:flex-start; background:var(--erp-glow-faint); border:1px solid var(--erp-glow); border-radius:10px; padding:0.6rem; }
.erp-ob-num__n{ font-size:0.8rem; font-weight:var(--fw-bold); color:var(--color-erp); min-width:1.3rem; }
.erp-ob-num strong{ font-size:0.58rem; color:var(--color-text-heading); display:block; }
.erp-ob-num p{ font-size:0.5rem; color:var(--color-text-muted); line-height:1.4; margin-top:0.15rem; }

/* Alerts (dashcam) */
.erp-ob-alerts{ display:flex; flex-wrap:wrap; gap:0.4rem; }
.erp-ob-alert{ font-size:0.52rem; padding:0.25rem 0.55rem; background:var(--erp-glow-soft); border:1px solid var(--erp-glow-bright); border-radius:100px; color:var(--color-text-heading); }

/* CANBUS gauges */
.erp-ob-canbus{ display:grid; grid-template-columns:repeat(5,1fr); gap:0.5rem; }
.erp-ob-gauge{ background:var(--erp-glow-faint); border:1px solid var(--erp-glow); border-radius:10px; padding:0.7rem 0.4rem; text-align:center; }
.erp-ob-gauge__v{ font-size:1.1rem; font-weight:var(--fw-bold); color:var(--color-erp); font-family:var(--font-heading); }
.erp-ob-gauge__u{ font-size:0.45rem; color:var(--color-text-muted); }
.erp-ob-gauge__l{ font-size:0.5rem; color:var(--color-text-heading); margin-top:0.2rem; }

/* Planes */
.erp-ob-plan{ background:var(--color-bg-glass); border:1px solid var(--color-border); border-radius:11px; padding:0.7rem; text-align:center; }
.erp-ob-plan--feat{ border-color:var(--color-erp); box-shadow:0 0 0 1px var(--color-erp),0 8px 22px var(--erp-glow-bright); }
.erp-ob-plan__badge{ font-size:0.42rem; text-transform:uppercase; letter-spacing:0.1em; color:var(--color-erp); }
.erp-ob-plan__name{ font-size:0.85rem; font-weight:var(--fw-bold); color:var(--color-text-heading); font-family:var(--font-heading); margin:0.2rem 0; }
.erp-ob-plan__desc{ font-size:0.5rem; color:var(--color-text-muted); line-height:1.4; }

/* Stats grandes */
.erp-ob-stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:0.5rem; }
.erp-ob-stat{ text-align:center; background:var(--erp-glow-faint); border:1px solid var(--erp-glow); border-radius:10px; padding:0.7rem 0.4rem; }
.erp-ob-stat__v{ font-size:1.3rem; font-weight:var(--fw-extrabold); color:var(--color-erp); font-family:var(--font-heading); }
.erp-ob-stat__l{ font-size:0.5rem; color:var(--color-text-muted); margin-top:0.15rem; }

/* Tags/chips */
.erp-ob-tags{ display:flex; flex-wrap:wrap; gap:0.4rem; }
.erp-ob-chip{ font-size:0.52rem; padding:0.3rem 0.6rem; background:rgba(83,186,227,0.07); border:1px solid rgba(83,186,227,0.18); border-radius:100px; color:var(--color-text-heading); }

/* Quotes */
.erp-ob-quote{ background:var(--color-bg-glass); border:1px solid var(--color-border); border-radius:11px; padding:0.75rem; display:flex; flex-direction:column; gap:0.4rem; }
.erp-ob-quote > i{ font-size:1.1rem; color:var(--color-erp); }
.erp-ob-quote p{ font-size:0.52rem; color:var(--color-text-muted); font-style:italic; line-height:1.5; flex:1; }
.erp-ob-quote__who{ display:flex; align-items:center; justify-content:space-between; gap:0.4rem; }
.erp-ob-quote__who strong{ font-size:0.55rem; color:var(--color-text-heading); }
.erp-ob-quote__m{ font-size:0.45rem; padding:0.15rem 0.4rem; border-radius:100px; background:var(--um-glow); color:#10B981; font-weight:var(--fw-semibold); }

/* Stores */
.erp-ob-stores{ display:flex; gap:0.5rem; margin-top:0.5rem; }
.erp-ob-store{ display:flex; align-items:center; gap:0.35rem; font-size:0.55rem; padding:0.35rem 0.7rem; background:var(--color-bg-glass); border:1px solid var(--color-border); border-radius:8px; color:var(--color-text-heading); }
.erp-ob-store i{ color:var(--color-erp); }

/* CTA final */
.erp-ob-cta{ align-items:center; justify-content:center; }
.erp-ob-cta__box{ text-align:center; max-width:420px; margin:auto; padding:1.5rem; background:linear-gradient(135deg,var(--erp-glow),rgba(33,78,130,0.04)); border:1px solid var(--erp-glow-bright); border-radius:16px; }
.erp-ob-cta__box > i{ font-size:2.2rem; color:var(--color-erp); }
.erp-ob-cta__box h3{ font-family:var(--font-heading); font-size:0.9rem; color:var(--color-text-heading); margin:0.5rem 0; }
.erp-ob-cta__box p{ font-size:0.58rem; color:var(--color-text-muted); line-height:1.5; }
.erp-ob-cta__btns{ display:flex; gap:0.5rem; justify-content:center; margin:0.9rem 0 0.6rem; flex-wrap:wrap; }
.erp-ob-btn{ font-size:0.58rem; padding:0.5rem 1rem; border-radius:8px; font-weight:var(--fw-semibold); border:1px solid transparent; }
.erp-ob-btn--primary{ background:var(--brand-gradient); color:#fff; }
.erp-ob-btn--ghost{ background:transparent; border-color:var(--erp-glow-intense); color:var(--color-erp); }
.erp-ob-cta__chips{ display:flex; gap:0.4rem; justify-content:center; flex-wrap:wrap; }

/* NAVEGADOR (panel derecho) */
.erp-ob-nav{ display:flex; flex-direction:column; height:100%; padding:0.5rem; }
.erp-ob-nav__head{ display:flex; align-items:center; justify-content:space-between; gap:0.4rem; font-size:0.6rem; font-weight:var(--fw-bold); color:var(--color-text-heading); padding-bottom:0.5rem; border-bottom:1px solid var(--erp-glow); margin-bottom:0.5rem; }
.erp-ob-nav__head > span{ display:flex; align-items:center; gap:0.4rem; }
.erp-ob-nav__head i{ color:var(--color-erp); }
.erp-ob-nav__end{ display:flex; align-items:center; gap:0.25rem; font-size:0.5rem; font-weight:var(--fw-semibold); padding:0.25rem 0.55rem; border-radius:7px; background:var(--color-bg-glass); border:1px solid var(--color-border); color:var(--color-text-muted); white-space:nowrap; transition:all var(--transition-fast); }
.erp-ob-nav__end:hover{ color:var(--color-text-heading); border-color:var(--color-erp); background:var(--erp-glow-soft); }
.erp-ob-nav__list{ flex:1; overflow-y:auto; display:flex; flex-direction:column; gap:0.2rem; }
.erp-ob-nav__item{ display:flex; align-items:center; gap:0.5rem; padding:0.4rem 0.5rem; background:transparent; border:1px solid transparent; border-radius:8px; text-align:left; transition:all var(--transition-fast); }
.erp-ob-nav__item:hover{ background:var(--erp-glow-faint); }
.erp-ob-nav__item--active{ background:var(--erp-glow); border-color:var(--erp-glow-intense); }
.erp-ob-nav__n{ width:18px; height:18px; border-radius:50%; background:var(--color-bg-glass); color:var(--color-text-muted); font-size:0.5rem; font-weight:var(--fw-bold); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.erp-ob-nav__item--active .erp-ob-nav__n{ background:var(--color-erp); color:#fff; }
.erp-ob-nav__lbl{ font-size:0.56rem; color:var(--color-text-heading); }
.erp-ob-nav__ctrls{ display:flex; gap:0.4rem; margin-top:0.5rem; padding-top:0.5rem; border-top:1px solid var(--erp-glow); }
.erp-ob-nav__btn{ flex:1; font-size:0.52rem; padding:0.45rem; border-radius:7px; background:var(--color-bg-glass); border:1px solid var(--color-border); color:var(--color-text-heading); display:flex; align-items:center; justify-content:center; gap:0.25rem; transition:all var(--transition-fast); }
.erp-ob-nav__btn:hover:not(:disabled){ border-color:var(--color-erp); }
.erp-ob-nav__btn:disabled{ opacity:0.35; }
.erp-ob-nav__btn--primary{ background:var(--brand-gradient); border-color:transparent; color:#fff; }

@media(max-width:1100px){
  .erp-ob-grid--3{ grid-template-columns:1fr 1fr; }
  .erp-ob-hero,.erp-ob-two{ grid-template-columns:1fr; }
  .erp-ob-canbus,.erp-ob-stats{ grid-template-columns:repeat(2,1fr); }
}

/* ============================================================================
   ERP TOUR — estado expandido (al pulsar Iniciar)
   Oculta panel izquierdo y consola; monitor + explorador crecen.
   ========================================================================== */
#cockpit-mount.state-erp-tour .cockpit-panel-left{
  overflow:hidden; min-width:0; padding:0; border:none; opacity:0; pointer-events:none;
}
#cockpit-mount.state-erp-tour .cockpit-interface{
  grid-template-columns:0 1fr 280px;
}
#cockpit-mount.state-erp-tour .cockpit-console{
  max-height:0; opacity:0; padding-top:0; padding-bottom:0; margin:0;
  pointer-events:none; overflow:hidden;
}
.cockpit-console{ transition:max-height 0.5s cubic-bezier(0.22,1,0.36,1), opacity 0.4s ease, padding 0.4s ease; }

/* ============================================================================
   ERP INTRO — pantalla inicial del monitor
   ========================================================================== */
.erp-ob-introwrap{ display:flex; align-items:center; justify-content:center; height:100%; }
.erp-ob-intro{ text-align:center; max-width:560px; margin:auto; padding:1.5rem; display:flex; flex-direction:column; align-items:center; gap:0.6rem; }
.erp-ob-intro__logo img{ max-height:54px; width:auto; margin-bottom:0.3rem; }
.erp-ob-intro__badge{ font-size:0.5rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--color-erp); font-weight:var(--fw-bold); padding:0.3rem 0.8rem; border:1px solid var(--erp-glow-bright); border-radius:100px; }
.erp-ob-intro__title{ font-family:var(--font-heading); font-size:1.5rem; line-height:1.15; color:var(--color-text-heading); margin:0.4rem 0; }
.erp-ob-intro__desc{ font-size:0.65rem; color:var(--color-text-muted); line-height:1.6; max-width:460px; }
.erp-ob-intro__stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:0.6rem; width:100%; margin:0.8rem 0; }
.erp-ob-intro__hint{ font-size:0.58rem; color:var(--color-text-muted); display:flex; align-items:center; gap:0.4rem; }
.erp-ob-intro__hint i{ color:var(--color-erp); font-size:0.9rem; }
.erp-ob-intro__hint strong{ color:var(--color-erp); }

/* ============================================================================
   EXPLORADOR — estado reposo (invitación + botón Iniciar)
   ========================================================================== */
.erp-ob-nav__intro{ display:flex; flex-direction:column; align-items:center; justify-content:center; height:100%; text-align:center; padding:1rem; gap:0.6rem; }
.erp-ob-nav__introicon{ width:54px; height:54px; border-radius:50%; background:linear-gradient(135deg,var(--erp-glow-bright),rgba(33,78,130,0.05)); border:1px solid var(--erp-glow-bright); display:flex; align-items:center; justify-content:center; }
.erp-ob-nav__introicon i{ font-size:1.5rem; color:var(--color-erp); }
.erp-ob-nav__intro h3{ font-size:0.78rem; font-weight:var(--fw-bold); color:var(--color-text-heading); margin:0; }
.erp-ob-nav__intro p{ font-size:0.56rem; color:var(--color-text-muted); line-height:1.5; }
.erp-ob-nav__start{ margin-top:0.5rem; display:flex; align-items:center; gap:0.4rem; font-size:0.65rem; font-weight:var(--fw-bold); padding:0.65rem 1.4rem; border-radius:10px; background:var(--brand-gradient); color:#fff; border:none; box-shadow:0 8px 22px var(--erp-glow-intense); transition:transform var(--transition-fast),box-shadow var(--transition-fast); }
.erp-ob-nav__start:hover{ transform:translateY(-2px); box-shadow:0 12px 30px var(--erp-glow-intense); }
.erp-ob-nav__start i{ font-size:0.85rem; }

/* ============================================================================
   TARJETA DE PRODUCTO — GM Transport (única, abajo)
   ========================================================================== */
.erp-ob-deck{ display:flex; justify-content:center; }
.erp-ob-product{ display:flex; align-items:center; gap:0.7rem; max-width:380px; width:100%; padding:0.7rem 1rem; cursor:pointer; }
.erp-ob-product__logo{ flex-shrink:0; width:42px; height:42px; border-radius:10px; background:#fff; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.erp-ob-product__logo img{ max-width:90%; max-height:90%; object-fit:contain; }
.erp-ob-product__logo i{ color:var(--color-erp); font-size:1.3rem; }
.erp-ob-product__tag{ margin-left:auto; font-size:0.48rem; padding:0.2rem 0.5rem; border-radius:100px; background:var(--um-glow); color:#10B981; font-weight:var(--fw-semibold); white-space:nowrap; }

/* ============================================================================
   ERP — TEMA LEGIBLE DEL MONITOR
   Fondo claro de la paleta TIASTICA + tipografía más grande y oscura.
   Solo aplica cuando el cockpit ERP está activo (#cockpit-mount.cockpit-mount--erp).
   ========================================================================== */
#cockpit-mount.cockpit-mount--erp .cockpit-screen{
  background:linear-gradient(160deg,#f4f9fd 0%,#e8f3fb 100%);
  border-color:rgba(33,78,130,0.18);
  box-shadow:inset 0 0 40px rgba(33,78,130,0.06);
}
/* Tokens de texto locales para el monitor claro */
#cockpit-mount.cockpit-mount--erp .erp-ob-screen{
  --ink:#14304d;        /* texto principal sobre fondo claro */
  --ink-soft:#3f5b78;   /* texto secundario */
  --ink-faint:#6885a3;  /* etiquetas tenues */
  color:var(--ink);
}

/* ---- Topbar del monitor ---- */
#cockpit-mount.cockpit-mount--erp .erp-ob-topbar{ border-bottom-color:rgba(33,78,130,0.16); }
#cockpit-mount.cockpit-mount--erp .erp-ob-topbar__step{ color:var(--brand-blue); font-size:0.7rem; letter-spacing:0.08em; }
#cockpit-mount.cockpit-mount--erp .erp-ob-topbar__title{ color:var(--ink); font-size:1.05rem; }

/* ---- Textos generales del monitor (más grandes + oscuros) ---- */
#cockpit-mount.cockpit-mount--erp .erp-ob-lead{ color:var(--ink-soft); font-size:0.92rem; line-height:1.55; }
#cockpit-mount.cockpit-mount--erp .erp-ob-eyebrow{ color:var(--brand-blue); font-size:0.72rem; }
#cockpit-mount.cockpit-mount--erp .erp-ob-subhead{ color:var(--ink); font-size:0.9rem; border-bottom-color:rgba(33,78,130,0.14); }
#cockpit-mount.cockpit-mount--erp .erp-ob-note{ color:var(--ink-soft); font-size:0.78rem; }

/* Hero */
#cockpit-mount.cockpit-mount--erp .erp-ob-hero{ background:linear-gradient(135deg,rgba(83,186,227,0.18),rgba(43,128,191,0.08)); border-color:rgba(43,128,191,0.2); }
#cockpit-mount.cockpit-mount--erp .erp-ob-hero__txt h2{ color:var(--ink); font-size:1.35rem; }
#cockpit-mount.cockpit-mount--erp .erp-ob-hero__txt p{ color:var(--ink-soft); font-size:0.86rem; }

/* Cards */
#cockpit-mount.cockpit-mount--erp .erp-ob-card{ background:#ffffff; border-color:rgba(33,78,130,0.12); box-shadow:0 2px 10px rgba(33,78,130,0.05); }
#cockpit-mount.cockpit-mount--erp .erp-ob-card:hover{ border-color:var(--brand-blue); }
#cockpit-mount.cockpit-mount--erp .erp-ob-card h4{ color:var(--ink); font-size:0.92rem; }
#cockpit-mount.cockpit-mount--erp .erp-ob-card p{ color:var(--ink-soft); font-size:0.8rem; }
#cockpit-mount.cockpit-mount--erp .erp-ob-card i{ color:var(--brand-blue); }

/* Pain cards */
#cockpit-mount.cockpit-mount--erp .erp-ob-pain{ background:#ffffff; border-color:rgba(33,78,130,0.1); }
#cockpit-mount.cockpit-mount--erp .erp-ob-pain__tag{ color:var(--ink-faint); font-size:0.7rem; }
#cockpit-mount.cockpit-mount--erp .erp-ob-pain__q{ color:var(--ink); font-size:0.9rem; }
#cockpit-mount.cockpit-mount--erp .erp-ob-pain__a{ color:var(--brand-blue); font-size:0.82rem; }

/* Two-col / categorías / mini / minirow */
#cockpit-mount.cockpit-mount--erp .erp-ob-catrow{ border-bottom-color:rgba(33,78,130,0.1); }
#cockpit-mount.cockpit-mount--erp .erp-ob-catrow strong{ color:var(--ink); font-size:0.88rem; }
#cockpit-mount.cockpit-mount--erp .erp-ob-catrow span{ color:var(--ink-soft); font-size:0.76rem; }
#cockpit-mount.cockpit-mount--erp .erp-ob-mini{ background:#ffffff; border-color:rgba(33,78,130,0.1); }
#cockpit-mount.cockpit-mount--erp .erp-ob-mini strong{ color:var(--ink); font-size:0.8rem; }
#cockpit-mount.cockpit-mount--erp .erp-ob-mini span{ color:var(--ink-soft); font-size:0.72rem; }
#cockpit-mount.cockpit-mount--erp .erp-ob-mini i{ color:var(--brand-blue); }
#cockpit-mount.cockpit-mount--erp .erp-ob-minirow strong{ color:var(--ink); font-size:0.88rem; }
#cockpit-mount.cockpit-mount--erp .erp-ob-minirow span{ color:var(--ink-soft); font-size:0.78rem; }
#cockpit-mount.cockpit-mount--erp .erp-ob-minirow i{ color:var(--brand-blue); }

/* Numbered (GPS) */
#cockpit-mount.cockpit-mount--erp .erp-ob-num{ background:#ffffff; border-color:rgba(33,78,130,0.1); }
#cockpit-mount.cockpit-mount--erp .erp-ob-num__n{ color:var(--brand-blue); font-size:1.05rem; }
#cockpit-mount.cockpit-mount--erp .erp-ob-num strong{ color:var(--ink); font-size:0.86rem; }
#cockpit-mount.cockpit-mount--erp .erp-ob-num p{ color:var(--ink-soft); font-size:0.76rem; }

/* Alerts / chips / tags */
#cockpit-mount.cockpit-mount--erp .erp-ob-alert{ background:rgba(43,128,191,0.1); border-color:rgba(43,128,191,0.25); color:var(--ink); font-size:0.78rem; }
#cockpit-mount.cockpit-mount--erp .erp-ob-chip{ background:rgba(83,186,227,0.16); border-color:rgba(43,128,191,0.25); color:var(--ink); font-size:0.76rem; }

/* CANBUS gauges */
#cockpit-mount.cockpit-mount--erp .erp-ob-gauge{ background:#ffffff; border-color:rgba(33,78,130,0.12); }
#cockpit-mount.cockpit-mount--erp .erp-ob-gauge__v{ color:var(--brand-blue); font-size:1.4rem; }
#cockpit-mount.cockpit-mount--erp .erp-ob-gauge__u{ color:var(--ink-faint); font-size:0.65rem; }
#cockpit-mount.cockpit-mount--erp .erp-ob-gauge__l{ color:var(--ink); font-size:0.72rem; }

/* Planes */
#cockpit-mount.cockpit-mount--erp .erp-ob-plan{ background:#ffffff; border-color:rgba(33,78,130,0.12); }
#cockpit-mount.cockpit-mount--erp .erp-ob-plan__name{ color:var(--ink); }
#cockpit-mount.cockpit-mount--erp .erp-ob-plan__desc{ color:var(--ink-soft); font-size:0.74rem; }
#cockpit-mount.cockpit-mount--erp .erp-ob-plan__badge{ color:var(--brand-blue); font-size:0.6rem; }

/* Stats */
#cockpit-mount.cockpit-mount--erp .erp-ob-stat{ background:#ffffff; border-color:rgba(33,78,130,0.12); }
#cockpit-mount.cockpit-mount--erp .erp-ob-stat__v{ color:var(--brand-blue); font-size:1.6rem; }
#cockpit-mount.cockpit-mount--erp .erp-ob-stat__l{ color:var(--ink-soft); font-size:0.72rem; }

/* Quotes */
#cockpit-mount.cockpit-mount--erp .erp-ob-quote{ background:#ffffff; border-color:rgba(33,78,130,0.1); }
#cockpit-mount.cockpit-mount--erp .erp-ob-quote p{ color:var(--ink-soft); font-size:0.78rem; }
#cockpit-mount.cockpit-mount--erp .erp-ob-quote__who strong{ color:var(--ink); font-size:0.8rem; }
#cockpit-mount.cockpit-mount--erp .erp-ob-quote > i{ color:var(--brand-blue); }

/* Stores */
#cockpit-mount.cockpit-mount--erp .erp-ob-store{ background:#ffffff; border-color:rgba(33,78,130,0.14); color:var(--ink); font-size:0.78rem; }

/* Intro (pantalla inicial) */
#cockpit-mount.cockpit-mount--erp .erp-ob-intro__title{ color:var(--ink); }
#cockpit-mount.cockpit-mount--erp .erp-ob-intro__desc{ color:var(--ink-soft); font-size:0.85rem; }
#cockpit-mount.cockpit-mount--erp .erp-ob-intro__badge{ color:var(--brand-blue); border-color:rgba(43,128,191,0.3); }
#cockpit-mount.cockpit-mount--erp .erp-ob-intro__hint{ color:var(--ink-soft); font-size:0.8rem; }
#cockpit-mount.cockpit-mount--erp .erp-ob-intro__stats .erp-ob-stat__v{ color:var(--brand-blue); }

/* CTA final */
#cockpit-mount.cockpit-mount--erp .erp-ob-cta__box{ background:linear-gradient(135deg,rgba(83,186,227,0.2),rgba(43,128,191,0.1)); border-color:rgba(43,128,191,0.3); }
#cockpit-mount.cockpit-mount--erp .erp-ob-cta__box h3{ color:var(--ink); }
#cockpit-mount.cockpit-mount--erp .erp-ob-cta__box p{ color:var(--ink-soft); font-size:0.82rem; }

/* ---- NAVEGACIÓN (explorador) — más legible ---- */
.erp-ob-nav__head{ font-size:0.78rem; }
.erp-ob-nav__lbl{ font-size:0.78rem; }
.erp-ob-nav__n{ width:22px; height:22px; font-size:0.62rem; }
.erp-ob-nav__btn{ font-size:0.74rem; padding:0.55rem; }
.erp-ob-nav__end{ font-size:0.64rem; }
.erp-ob-nav__item{ padding:0.5rem 0.6rem; }
.erp-ob-nav__intro h3{ font-size:0.92rem; }
.erp-ob-nav__intro p{ font-size:0.74rem; }
.erp-ob-nav__start{ font-size:0.8rem; }

/* Eliminar el efecto scanline (rayas CRT) en el monitor del ERP — molesto sobre fondo claro */
#cockpit-mount.cockpit-mount--erp .cockpit-screen::after{
  display:none !important;
  background:none !important;
  animation:none !important;
}
