/* MasInfoDe Public CSS — Aislado bajo .mid-public-page — Sin root global, determinista, sin hack atributo */
.mid-public-page{--mid-primary:#1d4ed8;--mid-primary-hover:#1e40af;--mid-primary-soft:#dbeafe;--mid-background:#f8fafc;--mid-surface:#fff;--mid-surface-muted:#f1f5f9;--mid-border:#e2e8f0;--mid-text:#0f172a;--mid-text-muted:#64748b;--mid-success:#16a34a;--mid-warning:#d97706;--mid-danger:#dc2626;--mid-info:#0284c7;--mid-radius:10px;--mid-shadow:0 1px 3px rgba(15,23,42,.08),0 4px 12px rgba(15,23,42,.06);--mid-font-sans:Inter,ui-sans-serif,system-ui,sans-serif;--mid-heading-fallback:clamp(1.4rem,4vw,2.5rem);--mid-text-fallback:clamp(.95rem,2vw,1.05rem)}
.mid-public-page *,.mid-public-page *::before,.mid-public-page *::after{box-sizing:border-box}
.mid-public-page{margin:0;padding:0;min-height:100vh;min-height:100dvh;line-height:1.6;-webkit-font-smoothing:antialiased;background:var(--mid-background);color:var(--mid-text);font-family:var(--mid-font-sans)}
.mid-public-page .mid-public-header,.mid-public-page .mid-public-footer{font-family:var(--mid-font-sans)}
.mid-public-page #mid-page{max-width:var(--mid-page-max-width,720px);margin:0 auto;padding:var(--mid-page-pad-m,16px);min-height:100vh;min-height:100dvh}
@media(min-width:768px){.mid-public-page #mid-page{padding:var(--mid-page-pad-d,24px)}}
/* Safe areas §146 — iPhone notch */
@supports(padding:env(safe-area-inset-top)){
  .mid-public-page{padding-top:env(safe-area-inset-top);padding-bottom:env(safe-area-inset-bottom);padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}
  .mid-public-page #mid-page{padding-top:max(var(--mid-page-pad-m,16px), env(safe-area-inset-top));padding-bottom:max(var(--mid-page-pad-m,16px), env(safe-area-inset-bottom))}
}
.mid-public-page img{max-width:100%;height:auto;display:block}
.mid-public-page a{color:var(--mid-primary);text-decoration:none}
.mid-public-page a:focus-visible{outline:2px solid var(--mid-primary);outline-offset:2px}
.mid-public-page .mid-btn{display:inline-block;padding:12px 24px;border-radius:var(--mid-radius);font-weight:600;text-align:center;transition:transform .15s,box-shadow .15s;max-width:100%}
.mid-public-page .mid-btn--primary{background:var(--mid-primary);color:#fff;box-shadow:var(--mid-shadow)}
.mid-public-page .mid-btn--secondary{background:var(--mid-secondary);color:#fff}
.mid-public-page .mid-btn--outline{background:transparent;color:var(--mid-primary);border:2px solid var(--mid-primary)}
.mid-public-page .mid-btn:hover{transform:translateY(-1px)}
@media(max-width:360px){.mid-public-page .mid-btn{padding:10px 16px;font-size:14px}}
.mid-public-page .mid-heading{font-family:var(--mid-font-heading);line-height:1.2;margin:0 0 .5em;color:var(--mid-text);overflow-wrap:break-word}
.mid-public-page .mid-text{color:var(--mid-text);overflow-wrap:break-word}
.mid-public-page .mid-align--center{text-align:center}
.mid-public-page .mid-align--right{text-align:right}
.mid-public-page .mid-align--justify{text-align:justify}
.mid-public-page .mid-divider{border:none;border-top:1px solid #e5e7eb;margin:16px 0}
.mid-public-page .mid-spacer{width:100%}
.mid-public-page .mid-container{border-radius:var(--mid-radius)}
.mid-public-page .mid-widget{margin-bottom:12px}
.mid-public-page .mid-gallery{grid-template-columns:repeat(auto-fit,minmax(120px,1fr))}
/* Heading animations */
@keyframes mid-fade { from { opacity:0 } to { opacity:1 } }
@keyframes mid-fade-up { from { opacity:0; transform:translateY(16px) } to { opacity:1; transform:translateY(0) } }
@keyframes mid-fade-down { from { opacity:0; transform:translateY(-16px) } to { opacity:1; transform:translateY(0) } }
@keyframes mid-fade-left { from { opacity:0; transform:translateX(16px) } to { opacity:1; transform:translateX(0) } }
@keyframes mid-fade-right { from { opacity:0; transform:translateX(-16px) } to { opacity:1; transform:translateX(0) } }
@keyframes mid-zoom { from { opacity:0; transform:scale(.85) } to { opacity:1; transform:scale(1) } }
@keyframes mid-zoom-in { from { opacity:0; transform:scale(.7) } to { opacity:1; transform:scale(1) } }
@keyframes mid-zoom-out { from { opacity:0; transform:scale(1.15) } to { opacity:1; transform:scale(1) } }
@keyframes mid-slide-up { from { transform:translateY(24px) } to { transform:translateY(0) } }
@keyframes mid-slide-down { from { transform:translateY(-24px) } to { transform:translateY(0) } }
@keyframes mid-slide-left { from { transform:translateX(24px) } to { transform:translateX(0) } }
@keyframes mid-slide-right { from { transform:translateX(-24px) } to { transform:translateX(0) } }
@keyframes mid-bounce { 0% { transform:translateY(8px) } 50% { transform:translateY(-4px) } 100% { transform:translateY(0) } }
/* Text animations — namespaced mid-heading-text-* */
@keyframes mid-text-wave { 0%{transform:translateY(0)} 50%{transform:translateY(calc(var(--mid-wave-intensity,8px) * -1))} 100%{transform:translateY(0)} }
@keyframes mid-text-letter { from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:translateY(0)} }
@keyframes mid-text-word { from{opacity:0;transform:translateY(10px)} to{opacity:1;transform:translateY(0)} }
@keyframes mid-reveal-ltr { from{clip-path:inset(0 100% 0 0)} to{clip-path:inset(0 0 0 0)} }
@keyframes mid-reveal-rtl { from{clip-path:inset(0 0 0 100%)} to{clip-path:inset(0 0 0 0)} }
@keyframes mid-reveal-center { from{clip-path:inset(0 50% 0 50%)} to{clip-path:inset(0 0 0 0)} }
@keyframes mid-reveal-outside { from{clip-path:inset(0 0 0 0)} to{clip-path:inset(0 50% 0 50%)} }
@keyframes mid-float { 0%{transform:translateY(0)} 50%{transform:translateY(calc(var(--mid-float-intensity,8px) * -1))} 100%{transform:translateY(0)} }
@keyframes mid-pulse { 0%{transform:scale(1)} 50%{transform:scale(1.03)} 100%{transform:scale(1)} }
@keyframes mid-text-zoom { from{opacity:0;transform:scale(0.92)} to{opacity:1;transform:scale(1)} }
@keyframes mid-text-fade { from{opacity:0} to{opacity:1} }
@keyframes mid-text-appear { from{opacity:0;transform:translateY(12px)} to{opacity:1;transform:translateY(0)} }
@keyframes mid-text-appear-up { from{opacity:0;transform:translateY(16px)} to{opacity:1;transform:translateY(0)} }
@keyframes mid-text-appear-down { from{opacity:0;transform:translateY(-16px)} to{opacity:1;transform:translateY(0)} }
@keyframes mid-text-appear-left { from{opacity:0;transform:translateX(16px)} to{opacity:1;transform:translateX(0)} }
@keyframes mid-text-appear-right { from{opacity:0;transform:translateX(-16px)} to{opacity:1;transform:translateX(0)} }
@keyframes mid-text-up { from{opacity:0;transform:translateY(16px)} to{opacity:1;transform:translateY(0)} }
@keyframes mid-text-down { from{opacity:0;transform:translateY(-16px)} to{opacity:1;transform:translateY(0)} }
@keyframes mid-appear-soft { from{opacity:0} to{opacity:1} }
@keyframes mid-appear-left { from{opacity:0;transform:translateX(20px)} to{opacity:1;transform:translateX(0)} }
@keyframes mid-appear-right { from{opacity:0;transform:translateX(-20px)} to{opacity:1;transform:translateX(0)} }
@keyframes mid-zoom-elastic { 0%{opacity:0;transform:scale(0.6)} 60%{transform:scale(1.08)} 80%{transform:scale(0.96)} 100%{opacity:1;transform:scale(1)} }
@keyframes mid-letter-up { from{opacity:0;transform:translateY(12px)} to{opacity:1;transform:translateY(0)} }
@keyframes mid-letter-down { from{opacity:0;transform:translateY(-12px)} to{opacity:1;transform:translateY(0)} }
@keyframes mid-letter-scale { from{opacity:0;transform:scale(0.7)} to{opacity:1;transform:scale(1)} }
@keyframes mid-letter-bounce { 0%{opacity:0;transform:translateY(12px)} 60%{transform:translateY(-4px)} 80%{transform:translateY(2px)} 100%{opacity:1;transform:translateY(0)} }
@keyframes mid-vibrate { 0%,100%{transform:translateX(0)} 25%{transform:translateX(-1px)} 75%{transform:translateX(1px)} }
@keyframes mid-word-up { from{opacity:0;transform:translateY(12px)} to{opacity:1;transform:translateY(0)} }
@keyframes mid-word-left { from{opacity:0;transform:translateX(12px)} to{opacity:1;transform:translateX(0)} }
@keyframes mid-word-zoom { from{opacity:0;transform:scale(0.85)} to{opacity:1;transform:scale(1)} }
@keyframes mid-word-stagger { from{opacity:0;transform:translateY(8px)} to{opacity:1;transform:translateY(0)} }
@keyframes mid-sweep-ltr { from{transform:translateX(-100%)} to{transform:translateX(0)} }
@keyframes mid-sweep-rtl { from{transform:translateX(100%)} to{transform:translateX(0)} }
@keyframes mid-shine { 0%{background-position:-200% 0} 100%{background-position:200% 0} }
@keyframes mid-glow { 0%{text-shadow:0 0 4px currentColor} 50%{text-shadow:0 0 12px currentColor, 0 0 20px currentColor} 100%{text-shadow:0 0 4px currentColor} }
@keyframes mid-swing { 0%{transform:rotate(0)} 25%{transform:rotate(1.5deg)} 75%{transform:rotate(-1.5deg)} 100%{transform:rotate(0)} }
@keyframes mid-pop { 0%{opacity:0;transform:scale(0.7)} 70%{transform:scale(1.08)} 100%{opacity:1;transform:scale(1)} }
@keyframes mid-sway { 0%,100%{transform:translateX(0)} 50%{transform:translateX(6px)} }
@keyframes mid-wobble { 0%{transform:translateX(0) rotate(0)} 15%{transform:translateX(-6px) rotate(-1.5deg)} 30%{transform:translateX(4px) rotate(1deg)} 45%{transform:translateX(-3px) rotate(-0.5deg)} 100%{transform:translateX(0) rotate(0)} }
@keyframes mid-shake { 0%,100%{transform:translateX(0)} 20%,60%{transform:translateX(-6px)} 40%,80%{transform:translateX(6px)} }
@keyframes mid-btn-gradient-shift { 0%{background-position:0% 50%} 50%{background-position:100% 50%} 100%{background-position:0% 50%} }
@keyframes mid-rotate { from{transform:rotate(0)} to{transform:rotate(360deg)} }
@keyframes mid-rotate-in { from{opacity:0;transform:rotate(-180deg) scale(0.5)} to{opacity:1;transform:rotate(0) scale(1)} }
@keyframes mid-tilt { 0%{transform:rotate(0)} 50%{transform:rotate(2deg)} 100%{transform:rotate(0)} }
@keyframes mid-flip { 0%{transform:perspective(600px) rotateY(0)} 50%{transform:perspective(600px) rotateY(90deg)} 100%{transform:perspective(600px) rotateY(0)} }
@keyframes mid-heartbeat { 0%,100%{transform:scale(1)} 50%{transform:scale(1.12)} }
@keyframes mid-jello { 0%,100%{transform:skewX(0) skewY(0)} 30%{transform:skewX(4deg) skewY(-3deg)} 60%{transform:skewX(-2deg) skewY(2deg)} }
@keyframes mid-rubber { 0%{transform:scaleX(1) scaleY(1)} 30%{transform:scaleX(1.15) scaleY(0.85)} 50%{transform:scaleX(0.9) scaleY(1.1)} 100%{transform:scaleX(1) scaleY(1)} }
@keyframes mid-flash { 0%,50%,100%{opacity:1} 25%,75%{opacity:0} }
@keyframes mid-scale { from{opacity:0;transform:scale(0.9)} to{opacity:1;transform:scale(1)} }
@keyframes mid-appear { from{opacity:0} to{opacity:1} }
@keyframes mid-cursor-blink { 0%,50%{opacity:1} 51%,100%{opacity:0} }
.mid-heading-text-letter,.mid-heading-text-word{will-change:transform,opacity}
.mid-heading-text-cursor{will-change:opacity}
.mid-heading-text-reveal{will-change:clip-path}
/* Prefers reduced motion §149 */
@media(prefers-reduced-motion:reduce){.mid-public-page *{animation:none!important;transition:none!important}}
/* Fluid typography §38 — determinista: inline style gana por especificidad, clamp solo fallback cuando HeadingWidget no emite font-size */
.mid-public-page .mid-heading{font-size:var(--mid-heading-fallback)}
.mid-public-page .mid-text{font-size:var(--mid-text-fallback)}
/* Responsive container §41 */
@media(min-width:1024px){.mid-public-page #mid-page{max-width:min(var(--mid-page-max-width,720px), 90vw)}}
/* Lazy loading placeholder */
.mid-public-page img[loading="lazy"]{background:#f3f4f6}