:root{--brand:#0ea5e9;--ink:#111827;--muted:#6b7280;--bg:#f9fafb;--card:#fff;--shadow:0 6px 30px rgba(0,0,0,.06)}
*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif}
a{color:var(--brand);text-decoration:none}.container{max-width:1100px;margin:0 auto;padding:20px}
.card{background:var(--card);border-radius:18px;box-shadow:var(--shadow);padding:18px}
.header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.header h1{font-size:22px;margin:0}.sub{color:var(--muted);font-size:16px; font-weight:500; line-height:1.4;}
.toolbar{display:flex;gap:10px;flex-wrap:wrap;margin:8px 0 16px}.toolbar .pill{border:1px solid #e5e7eb;border-radius:999px;padding:8px 12px;font-size:13px;background:#fff}
.badge{background:#e0f2fe;color:#0369a1;border-radius:8px;padding:4px 8px;font-size:12px}
footer.nav{position:sticky;bottom:0;background:#fff;border-top:1px solid #e5e7eb}
footer.nav .wrap{max-width:1100px;margin:0 auto;padding:10px 16px;display:flex;gap:10px;justify-content:center}
footer.nav a{padding:10px 12px;border-radius:10px;border:1px solid #e5e7eb}
.info-panel{margin-top:12px;padding:12px;border:1px dashed #e5e7eb;border-radius:12px;background:#fcfcfd}
#img-stage{position:relative;display:block;max-width:100%;border-radius:14px;box-shadow:var(--shadow)}
#img-stage-wrap{position:relative}.hotspot{position:absolute;width:18px;height:18px;border-radius:50%;background:var(--brand);border:2px solid #fff;box-shadow:0 2px 10px rgba(0,0,0,.25);cursor:pointer;transform:translate(-50%,-50%)}
.small{font-size:12px;color:var(--muted)}
/* Permite ver el póster y deja fondo oscuro al final */
model-viewer {
  background-color: #0a0a0a;       /* fondo casi negro tras carga */
  --poster-color: #e8e8e8;         /* color de respaldo del póster */
}

/* El póster ocupa todo y se muestra antes del modelo */
model-viewer::part(poster) {
  background-size: cover;
  background-position: center;
  opacity: 1;
}


.viewer-wrap{
  position: relative;
  border-radius: 14px;
  overflow: hidden;           /* para que los logos respeten esquinas redondeadas */
}
.viewer-logos{
  position: absolute;
  top: 12px;
  right: 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  z-index: 5;                 /* por encima del canvas del model-viewer */
  pointer-events: none;       /* no interfiere con el drag/zoom del viewer */
}

.viewer-logos img{
  width: 92px;
  opacity: 0.9;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.35));
}
.viewer-logos img:hover {
  opacity: 1;
}
.logo-watermark {
  position: absolute;
  inset: 0;
  background: url("assets/logo-lasserlab.png") center/160px no-repeat;
  opacity: 0.1;
  pointer-events: none;
}
/* Bilingüe sin JS */
.i18n [lang]{ display:none; }
html:lang(es) .i18n [lang="es"]{ display:inline; }
html:lang(en) .i18n [lang="en"]{ display:inline; }

/* Bloque de cotización simple */
.quote-block{ background:#1f1f1f; color:#fff; border-radius:12px; margin:1rem auto; padding:1rem; }
@media (prefers-color-scheme:light){
  .quote-block{ background:#f5f5f5; color:#111; }
}
.qb-wrap{ max-width:1100px; margin:0 auto; display:flex; gap:.75rem; align-items:center; flex-wrap:wrap; }
.qb-text strong{ font-size:1.05rem; display:block; }
.qb-text p{ margin:.15rem 0 0; opacity:.9; }
.qb-actions{ margin-left:auto; display:flex; gap:.5rem; flex-wrap:wrap; }
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:.4rem; padding:.5rem .9rem; border-radius:8px; text-decoration:none; font-weight:700; border:2px solid transparent; }
.qb-primary{ background:#ffb100; color:#000; }
.qb-ghost{ background:transparent; border-color:#ffb100; color:inherit; }
.qb-ghost:hover{ background:#ffb100; color:#000; }
