/* Mundo Drone · componente «intro-marca» (v4.0) · intro de marca de la portada: logo sobre fondo Codex → fundido a transparente (~1,7 s).
   Origen: mockup-v2/intro/md-intro.componente.html (aprobado en despliegue-v2). Sin estilos en línea (CSP). */
.md-intro{--md-intro-bg:var(--md-bg,#060b14);--md-intro-bg-2:var(--md-bg-2,#0a1220);--md-intro-accent:var(--md-cyan,#00d4ff);--md-intro-accent-2:#ff7a00;--md-intro-in:600ms;--md-intro-hold:500ms;--md-intro-out:600ms;--md-intro-logo-w:min(62vw,440px);
position:fixed;inset:0;z-index:2147483000;display:grid;place-items:center;overflow:hidden;cursor:pointer;opacity:1;contain:strict;
background:radial-gradient(ellipse 60% 50% at 50% 50%,color-mix(in srgb,var(--md-intro-accent) 16%,transparent),transparent 70%),radial-gradient(ellipse at 50% 120%,var(--md-intro-bg-2),var(--md-intro-bg) 70%);
transition:opacity var(--md-intro-out) cubic-bezier(.4,0,.2,1)}
.md-intro__grid{position:absolute;inset:-12px;pointer-events:none;opacity:.55;
background-image:linear-gradient(rgba(120,170,220,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(120,170,220,.07) 1px,transparent 1px),conic-gradient(rgba(255,255,255,.018) 25%,transparent 0 50%,rgba(255,255,255,.018) 0 75%,transparent 0);
background-size:12px 12px,12px 12px,24px 24px;-webkit-mask:radial-gradient(ellipse 75% 65% at 50% 50%,#000 30%,transparent 80%);mask:radial-gradient(ellipse 75% 65% at 50% 50%,#000 30%,transparent 80%)}
.md-intro__pulse{position:absolute;left:50%;top:50%;width:var(--md-intro-logo-w);aspect-ratio:1;border-radius:50%;translate:-50% -50%;pointer-events:none;border:1px solid color-mix(in srgb,var(--md-intro-accent) 55%,transparent);box-shadow:0 0 40px color-mix(in srgb,var(--md-intro-accent) 35%,transparent);opacity:0}
.md-intro__scan{position:absolute;left:0;right:0;top:0;height:2px;pointer-events:none;background:linear-gradient(90deg,transparent,var(--md-intro-accent) 30%,#fff 50%,var(--md-intro-accent) 70%,transparent);box-shadow:0 0 18px 2px color-mix(in srgb,var(--md-intro-accent) 70%,transparent);opacity:0}
.md-intro__marca{position:relative;display:grid;justify-items:center;gap:14px;pointer-events:none}
.md-intro__logo{display:block;width:var(--md-intro-logo-w);height:auto;aspect-ratio:640/416;opacity:0;transform:scale(.9);filter:blur(6px) drop-shadow(0 0 0 transparent)}
.md-intro__barra{width:calc(var(--md-intro-logo-w) * .45);height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,var(--md-intro-accent-2),transparent);box-shadow:0 0 12px var(--md-intro-accent-2);transform:scaleX(0);opacity:.85}
.md-intro--on .md-intro__pulse{animation:md-intro-pulse calc(var(--md-intro-in) + var(--md-intro-hold)) ease-out both}
.md-intro--on .md-intro__scan{animation:md-intro-scan calc(var(--md-intro-in) + var(--md-intro-hold)) cubic-bezier(.5,0,.5,1) both}
.md-intro--on .md-intro__logo{animation:md-intro-logo var(--md-intro-in) cubic-bezier(.2,.8,.2,1) forwards}
.md-intro--on .md-intro__barra{animation:md-intro-barra var(--md-intro-in) var(--md-intro-in) ease-out forwards}
.md-intro--fuera{opacity:0;pointer-events:none}
.md-intro--rapido{--md-intro-out:250ms}
@keyframes md-intro-logo{to{opacity:1;transform:scale(1);filter:blur(0) drop-shadow(0 0 18px color-mix(in srgb,var(--md-intro-accent) 45%,transparent))}}
@keyframes md-intro-barra{to{transform:scaleX(1)}}
@keyframes md-intro-scan{0%{opacity:0;transform:translateY(8vh)}15%{opacity:1}85%{opacity:.9}100%{opacity:0;transform:translateY(92vh)}}
@keyframes md-intro-pulse{0%{opacity:0;scale:.35}35%{opacity:.9}100%{opacity:0;scale:1.6}}
@media (prefers-reduced-motion:reduce){.md-intro{display:none}}