/* Product Detail – UX uplift v3.6 (menu superior igual al index, imagen contenida, info mejorada) */
:root{
  --brand-orange:#fd8500;
  --brand-blue:#127ac6;
  --border:#e5e7eb;
  --text:#101214;
}
/* Asegura estilos del menú superior derecho (por si la página se sirve aislada) */
.top-links{gap:1rem}
.top-links a{color:#111111;text-decoration:none;font-weight:600;font-size:.95rem}
.top-links a:hover{color:#000000;text-decoration:underline}

/* Imagen y marco */
.product-hero{position:relative}
.frame{background:#fff;border:2px solid var(--brand-blue);border-radius:16px;padding:6px;box-shadow:0 8px 30px rgba(0,0,0,.08)}
.frame-inner{border:1px dashed rgba(18,122,198,.35);border-radius:12px;overflow:hidden}
.frame .ratio{--bs-aspect-ratio:75%} /* 4:3 */
.frame img{object-fit:cover;width:100%;height:100%}

/* Meta pills */
.pill{display:inline-flex;align-items:center;gap:.35rem;padding:.25rem .55rem;border-radius:999px;font-size:.8rem}
.pill-muted{background:#f3f4f6;color:#4b5563;border:1px solid #e5e7eb}
.pill-ok{background:rgba(22,163,74,.1);color:#166534;border:1px solid rgba(22,163,74,.25)}

/* Info card */
.info-card{border:1px solid var(--border);border-radius:14px;overflow:hidden}
.info-card .row>div{padding:.75rem 1rem;border-bottom:1px solid var(--border)}
.info-card .row>div:nth-child(odd){background:#fafafa}
.info-card .row>div:last-child{border-bottom:0}
.info-label{font-size:.75rem;color:#6b7280;text-transform:uppercase;letter-spacing:.03em}
.info-value{font-weight:600}

/* Features list */
.feature-list{margin:0;padding:0;list-style:none}
.feature-list li{display:flex;gap:.6rem;align-items:flex-start;padding:.25rem 0}
.feature-list i{color:var(--brand-orange)}

/* Prosa */
.prose{line-height:1.7}
.prose p{margin-bottom:0.75rem;color:#374151}

/* Espaciados compactos */
.section-gap{margin-top:1rem}

/* CTA */
.cta-row{display:flex;gap:.5rem;flex-wrap:wrap}

/* Contener imagen en desktop */
@media (min-width:992px){.col-hero{max-width:460px}}