/* Página de producto Horizun Revit MCP Pro (/apps/horizun-revit-mcp-pro/ y /en/…).
   Premium por contención: oscuro, una sola señal de color (el sello «Solo Pro»), cifras grandes,
   imágenes reales y una lista larga que se lee como ficha técnica. Tokens de hub.css. */
.pro-sello{display:inline-flex;align-items:center;gap:8px;font:600 12px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--cyan);border:1px solid color-mix(in srgb,var(--cyan) 55%,transparent);background:color-mix(in srgb,var(--teal) 12%,transparent);padding:7px 12px;border-radius:999px}
.pro-sello::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--cyan);box-shadow:0 0 0 4px color-mix(in srgb,var(--cyan) 18%,transparent)}

.pro-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:48px;align-items:center;padding-top:28px;padding-bottom:40px}
.pro-hero .breadcrumb{margin-bottom:18px}
.pro-hero h1{margin:16px 0 10px;font-size:clamp(36px,5vw,58px);line-height:1.02;letter-spacing:-.02em}
.pro-disp{margin:0 0 14px;font-size:18px;color:var(--ink)}
.pro-disp strong{color:var(--cyan)}
.pro-hero .lead{max-width:560px}
.pro-cifras{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin:26px 0 26px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.pro-cifras div{padding:14px 12px 12px 0}
.pro-cifras div+div{padding-left:14px;border-left:1px solid var(--line)}
.pro-cifras dd{margin:0;font-size:34px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums;line-height:1}
.pro-cifras dt{order:2;margin-top:6px;font:500 11.5px var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.pro-cifras div{display:flex;flex-direction:column}
.pro-nota{font-size:13.5px;line-height:1.55;color:var(--muted);max-width:760px;margin:12px 0 0}
.pro-garantia{margin:14px 0 0;font-size:14px;line-height:1.55;color:var(--ink-2);max-width:560px}
.pro-garantia strong{color:var(--ink)}
.pro-nota a,.pro-link{color:var(--cyan)}
.pro-link{display:inline-block;margin-top:6px;font-weight:600;text-decoration:none}
.pro-link:hover{text-decoration:underline;text-underline-offset:3px}

.pro-shot{margin:0}
.pro-shot img{display:block;width:100%;height:auto;border-radius:14px;border:1px solid var(--line-2,var(--line));box-shadow:0 30px 80px rgba(0,0,0,.45),0 0 0 1px color-mix(in srgb,var(--cyan) 10%,transparent)}
.pro-shot figcaption{margin-top:10px;font-size:13px;color:var(--muted)}

.pro-logros{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.pro-logro{display:flex;flex-direction:column;padding:24px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
.pro-logro h3{margin:0 0 8px;font-size:19px}
.pro-logro p{margin:0 0 8px;color:var(--ink-2);line-height:1.55}
.pro-num{font-size:56px!important;font-weight:800;color:var(--ink)!important;line-height:1!important;margin:6px 0 12px!important;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.pro-logro-img,.pro-grupo-img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:contain;background:#fff;border-radius:10px;border:1px solid var(--line)}
.pro-logro-img{margin:-6px 0 18px}
.pro-grupo-cab{display:flex;flex-direction:column;gap:14px}

.pro-intro{color:var(--muted);max-width:720px;margin:8px 0 0}
.pro-logro-ancho{grid-column:1/-1}
.pro-logro-txt{background:transparent;border-color:transparent;border-left:3px solid var(--teal);border-radius:0;padding:6px 0 6px 22px}
.pro-correccion{margin-top:8px;padding:22px 24px;border:1px dashed var(--line);border-radius:14px}
.pro-correccion h3{margin:0 0 6px;font-size:16px;color:var(--ink-2)}
.pro-correccion p{margin:0 0 14px;color:var(--muted);font-size:14px}
.pro-correccion ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.pro-correccion li{display:grid;grid-template-columns:minmax(0,15.5rem) minmax(0,1fr);gap:16px;align-items:baseline}
.pro-correccion code{font:500 13px var(--mono);color:var(--muted);overflow-wrap:anywhere}
.pro-correccion li span{color:var(--muted);font-size:14px;line-height:1.5}
.pro-grupo{display:grid;grid-template-columns:minmax(0,.4fr) minmax(0,1fr);gap:28px;padding:26px 0;border-top:1px solid var(--line)}
.pro-grupo h3{margin:0;font-size:20px;line-height:1.25}
.pro-grupo h3 span{display:block;font:500 12px var(--mono);letter-spacing:.12em;color:var(--teal);margin-bottom:6px}
.pro-grupo ul{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.pro-grupo li{display:grid;grid-template-columns:minmax(0,15.5rem) minmax(0,1fr);gap:16px;align-items:baseline}
.pro-grupo code{font:500 13px var(--mono);color:var(--cyan);overflow-wrap:anywhere}
.pro-grupo li span{color:var(--ink-2);line-height:1.55;font-size:15px}

.pro-pasos{list-style:none;counter-reset:paso;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.pro-pasos li{counter-increment:paso;padding:22px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
.pro-pasos li::before{content:"0" counter(paso);display:block;font:500 12px var(--mono);letter-spacing:.12em;color:var(--teal);margin-bottom:10px}
.pro-pasos strong{display:block;font-size:17px;color:var(--ink);margin-bottom:6px}
.pro-pasos span{color:var(--ink-2);line-height:1.55;font-size:15px}
.pro-cta .pro-sello{margin-bottom:12px}

@media (max-width:980px){
  .pro-hero{grid-template-columns:1fr;gap:28px}
  .pro-logros{grid-template-columns:1fr}
  .pro-pasos{grid-template-columns:1fr}
}
@media (max-width:720px){
  .pro-cifras{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pro-cifras div:nth-child(3){padding-left:0;border-left:0}
  .pro-cifras div:nth-child(n+3){border-top:1px solid var(--line)}
  .pro-cifras dd{font-size:30px}
  .pro-grupo{grid-template-columns:1fr;gap:14px}
  .pro-grupo li{grid-template-columns:1fr;gap:4px}
  .pro-correccion li{grid-template-columns:1fr;gap:4px}
  .pro-num{font-size:46px!important}
}
