/* El mapa aprobado conserva la interacción manual; la señal gana ritmo y profundidad. */
.mk-hero .mk-channel>strong { font-family:var(--font-body); font-weight:700; font-size:12px; text-transform:none; letter-spacing:0; }
.mk-hero .mk-orbit-ring--outer { animation:mkOrbitOuter 27s linear infinite; }
.mk-hero .mk-orbit-ring--inner { animation:mkOrbitInner 21s linear infinite; }
.mk-hero .mk-orbit::before,.mk-hero .mk-orbit::after { content:""; position:absolute; z-index:-1; left:50%; top:50%; width:110px; height:110px; border:1px solid rgba(255,174,0,.37); border-radius:50%; opacity:0; pointer-events:none; transform:translate(-50%,-50%); animation:mkSignalRipple 7s ease-out infinite; }
.mk-hero .mk-orbit::after { animation-delay:-3.5s; border-color:rgba(166,127,255,.5); }
.mk-hero .mk-center-icon>i { transform-origin:center; animation:mkSignalBars 2.4s ease-in-out infinite; }
.mk-hero .mk-center-icon>i:nth-child(2) { animation-delay:-.8s; }.mk-hero .mk-center-icon>i:nth-child(3) { animation-delay:-1.6s; }
.mk-route-spark { fill:none; stroke:transparent; stroke-width:3; stroke-linecap:round; stroke-dasharray:4 96; opacity:0; }
.mk-signal[data-channel="meta"] .mk-route-spark--meta,.mk-signal[data-channel="google"] .mk-route-spark--google,.mk-signal[data-channel="linkedin"] .mk-route-spark--linkedin,.mk-signal[data-channel="tiktok"] .mk-route-spark--tiktok { stroke:var(--active-channel); animation:mkRoutePacket 4.8s linear infinite; }
.mk-hero .mk-channel[aria-pressed="true"]::after { content:""; position:absolute; right:9px; top:9px; width:4px; height:4px; border-radius:50%; background:var(--channel-color); animation:mkChannelBeacon 2.4s ease-in-out infinite; }
.mk-service-commitments { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:clamp(30px,6vw,90px); align-items:start; }
.mk-service-commitments .mk-body { margin-top:25px; }
.mk-service-commitments ol { padding:0; margin:0; list-style:none; counter-reset:mk-commitment; }
.mk-service-commitments li { display:grid; grid-template-columns:29px minmax(0,1fr); column-gap:16px; padding:21px 0; border-top:1px solid var(--mk-line); counter-increment:mk-commitment; }
.mk-service-commitments li::before { content:"0" counter(mk-commitment); color:#d1b0ff; font:500 9px/1.7 var(--font-body); padding-top:2px; }
.mk-service-commitments h3 { margin:0 0 10px; font-size:clamp(13px,1.1vw,17px); }
.mk-service-commitments li p { grid-column:2; margin:0; color:#c9c0d0; font:400 13px/1.8 var(--font-body); }
.mk-service-commitments .mk-commitment-note { margin-top:25px; color:#b7a9c6; font:400 12px/1.8 var(--font-body); }
@keyframes mkOrbitOuter { from { transform:rotate(-22deg); } to { transform:rotate(338deg); } }
@keyframes mkOrbitInner { from { transform:rotate(25deg); } to { transform:rotate(-335deg); } }
@keyframes mkSignalRipple { 0% { opacity:0; transform:translate(-50%,-50%) scale(.7); } 12% { opacity:.45; } 85%,100% { opacity:0; transform:translate(-50%,-50%) scale(2.5); } }
@keyframes mkSignalBars { 0%,100% { transform:scaleY(.55); opacity:.7; } 50% { transform:scaleY(1.25); opacity:1; } }
@keyframes mkRoutePacket { 0%,8% { stroke-dashoffset:100; opacity:0; } 15%,75% { opacity:1; } 88%,100% { stroke-dashoffset:0; opacity:0; } }
@keyframes mkChannelBeacon { 0%,100% { opacity:.35; } 50% { opacity:1; } }
@media (max-width:820px) { .mk-service-commitments { grid-template-columns:1fr; gap:30px; } }
@media (max-width:520px) { .mk-hero .mk-channel>strong { font-size:11px; } }
/* El formato vertical conserva una proporción de retrato también en portátil. */
@media (min-width:521px) {
 .mk-creative-v2 .mkp-format--vertical { width:min(18%,84px); top:174px; }
 .mk-creative-v2 .mkp-format--vertical>div { min-height:0; aspect-ratio:9/16; padding:8px; }
 .mk-creative-v2 .mkp-format--vertical>div>b { font-size:8px; }
}
@media (min-width:821px) and (max-height:800px) {
 .mk-creative-v2 .mkp-format--vertical { width:min(14%,74px); top:132px; }
}
@media (prefers-reduced-motion:reduce) { .mk-hero *,.mk-hero *::before,.mk-hero *::after { animation:none!important; }.mk-route-spark,.mk-hero .mk-orbit::before,.mk-hero .mk-orbit::after { display:none; } }
