/* MEDHUB IA 4.3.1 · Presentación animada de MEDHUB IA PRO (estilo "Noche + Oro" de la Pro) */
.mhps{
 --gold:#c8b07a;--gold-hi:#f1e2b8;--gold-lo:#8a672c;--night:#0d0d0c;--ink:#f3efe6;--mute:#a59f93;
 position:fixed;inset:0;z-index:300;display:flex;align-items:center;justify-content:center;overflow:hidden auto;
 background:radial-gradient(120% 80% at 50% 0%,#1d1b18 0%,var(--night) 62%);color:var(--ink);
 font-family:Inter,-apple-system,BlinkMacSystemFont,"Helvetica Neue","Segoe UI",Arial,sans-serif;
 opacity:0;transition:opacity .45s cubic-bezier(.2,.7,.2,1);
 padding:max(64px,env(safe-area-inset-top)) 16px max(28px,env(safe-area-inset-bottom));
}
.mhps.show{opacity:1}
.mhps.leaving{opacity:0;pointer-events:none}
body.mhps-open{overflow:hidden}
.mhps-waves{position:fixed;inset:0;width:100%;height:100%;pointer-events:none}
.mhps-glow{position:fixed;left:50%;top:38%;width:min(900px,140vw);height:520px;transform:translate(-50%,-50%);pointer-events:none;
 background:radial-gradient(closest-side,rgba(200,176,122,.13),rgba(200,176,122,0));opacity:0;transition:opacity 1.6s ease}
.mhps.p1 .mhps-glow{opacity:1}

/* Controles */
.mhps-controls{position:fixed;top:max(14px,env(safe-area-inset-top));right:14px;display:flex;gap:8px;z-index:2}
.mhps-controls button{height:36px;min-width:36px;padding:0 13px;border:1px solid rgba(200,176,122,.35);border-radius:999px;background:rgba(20,19,17,.6);
 color:var(--ink);font:500 11px/1 Inter,Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase;cursor:pointer;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);transition:border-color .2s,background .2s,color .2s}
.mhps-controls button:hover{border-color:var(--gold);color:var(--gold-hi)}
.mhps-controls button:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.mhps-controls .mhps-mute{padding:0;font-size:15px;letter-spacing:0}
.mhps-controls .mhps-mute.off{color:var(--mute);text-decoration:line-through}
.mhps-controls .mhps-close{padding:0;font-size:20px;letter-spacing:0}
.mhps.p4 .mhps-skip{display:none}

/* Escena */
.mhps-stage{position:relative;z-index:1;width:min(640px,100%);display:flex;flex-direction:column;align-items:center;text-align:center;margin:auto 0}
.mhps-logo{position:relative;width:min(470px,86vw);opacity:0;transform:scale(1.08);filter:blur(6px);
 transition:opacity 1.1s cubic-bezier(.2,.7,.2,1),transform 1.6s cubic-bezier(.2,.7,.2,1),filter 1.1s ease}
.mhps-logo img{display:block;width:100%;height:auto}
.mhps.p1 .mhps-logo{opacity:1;transform:none;filter:none}
.mhps-shine{position:absolute;inset:0;pointer-events:none;
 background:linear-gradient(100deg,transparent 35%,rgba(255,247,222,.95) 50%,transparent 65%);background-size:260% 100%;background-position:120% 0;
 -webkit-mask:url(/assets/pro-show/medhub-pro-logo.png) center/100% 100% no-repeat;mask:url(/assets/pro-show/medhub-pro-logo.png) center/100% 100% no-repeat;opacity:0}
.mhps.p1:not(.instant) .mhps-shine{animation:mhpsShine 1.5s .75s cubic-bezier(.4,0,.2,1) forwards}
@keyframes mhpsShine{0%{opacity:1;background-position:120% 0}100%{opacity:1;background-position:-30% 0}}

.mhps-kicker{display:flex;align-items:center;gap:14px;margin:26px 0 0;font:500 12px/1.4 Montserrat,Inter,Arial,sans-serif;letter-spacing:.3em;text-transform:uppercase;color:var(--gold);
 opacity:0;transform:translateY(8px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1)}
.mhps-rule{display:block;width:34px;height:1px;background:linear-gradient(90deg,transparent,var(--gold))}
.mhps-rule:last-child{background:linear-gradient(90deg,var(--gold),transparent)}
.mhps.p2 .mhps-kicker{opacity:1;transform:none}

.mhps-list{list-style:none;margin:30px 0 0;padding:0;width:100%;display:grid;gap:10px;text-align:left}
.mhps-list li{display:flex;align-items:center;gap:14px;padding:12px 16px;border:1px solid rgba(200,176,122,.18);border-radius:14px;background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.01));
 opacity:0;transform:translateY(14px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1),border-color .3s;transition-delay:calc(var(--i)*.68s)}
.mhps.p3 .mhps-list li{opacity:1;transform:none}
.mhps-list li:hover{border-color:rgba(200,176,122,.42)}
.mhps-ico{flex:none;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;color:var(--gold-hi);border:1px solid rgba(200,176,122,.45);background:radial-gradient(circle at 35% 30%,rgba(241,226,184,.16),rgba(200,176,122,.04))}
.mhps-ico svg{width:19px;height:19px}
.mhps-txt{display:flex;flex-direction:column;gap:3px;min-width:0}
.mhps-txt strong{font:600 14px/1.25 Montserrat,Inter,Arial,sans-serif;letter-spacing:.02em;color:var(--ink)}
.mhps-txt span{font-size:13px;line-height:1.4;color:var(--mute)}

.mhps-cta{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:28px;opacity:0;transform:translateY(10px);pointer-events:none;
 transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}
.mhps.p4 .mhps-cta{opacity:1;transform:none;pointer-events:auto}
.mhps-go{border:0;border-radius:999px;padding:15px 28px;cursor:pointer;color:#17140e;font:700 13px/1 Montserrat,Inter,Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;
 background:linear-gradient(120deg,var(--gold-lo),#d9be82 28%,var(--gold-hi) 48%,#b8904a 70%,#e6cf97);background-size:200% 100%;box-shadow:0 10px 30px rgba(200,176,122,.22);transition:background-position .6s ease,transform .2s}
.mhps-go:hover{background-position:100% 0;transform:translateY(-1px)}
.mhps-go:focus-visible{outline:2px solid var(--gold-hi);outline-offset:3px}
.mhps-later{border:1px solid rgba(243,239,230,.2);border-radius:999px;padding:14px 22px;background:none;color:var(--mute);font:500 12px/1 Inter,Arial,sans-serif;letter-spacing:.08em;cursor:pointer}
.mhps-later:hover{color:var(--ink);border-color:rgba(243,239,230,.45)}
.mhps-later:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
.mhps-fine{margin:16px 0 0;font-size:11px;letter-spacing:.06em;color:#7d786e;opacity:0;transition:opacity .7s .2s ease}
.mhps.p4 .mhps-fine{opacity:1}

/* Saltar / ya vista: todo aparece de inmediato */
.mhps.instant .mhps-logo,.mhps.instant .mhps-kicker,.mhps.instant .mhps-list li,.mhps.instant .mhps-cta,.mhps.instant .mhps-fine,.mhps.instant .mhps-glow{transition-duration:.35s!important;transition-delay:0s!important}

@media(max-width:560px){
 .mhps{align-items:flex-start}
 .mhps-logo{width:min(330px,82vw)}
 .mhps-kicker{margin-top:18px;font-size:10px;letter-spacing:.22em;gap:10px}
 .mhps-rule{width:20px}
 .mhps-list{margin-top:20px;gap:8px}
 .mhps-list li{padding:10px 12px;gap:12px}
 .mhps-ico{width:34px;height:34px}
 .mhps-txt strong{font-size:13px}
 .mhps-txt span{font-size:12px}
 .mhps-cta{margin-top:20px;width:100%}
 .mhps-go{width:100%;padding:15px 20px}
 .mhps-later{width:100%}
}
@media(max-height:700px) and (min-width:561px){.mhps{align-items:flex-start}.mhps-list{gap:7px;margin-top:20px}.mhps-list li{padding:9px 14px}.mhps-kicker{margin-top:18px}}
@media(prefers-reduced-motion:reduce){
 .mhps,.mhps *{transition-duration:0s!important;transition-delay:0s!important;animation:none!important}
}
