/* One-by-one center burst. Random order; final positions are non-overlapping cells. */
.opening-world{position:absolute;inset:0;background:#070707;filter:none;opacity:1;z-index:-3}
.opening-world:before{content:'';position:absolute;inset:-30%;background:radial-gradient(ellipse at 35% 45%,#8887,transparent 50%),radial-gradient(ellipse at 75% 60%,#5555,transparent 50%);filter:url(#smoke-texture);opacity:.4}
.opening-world:after{content:'';position:absolute;inset:0;background:radial-gradient(ellipse at 50% 45%,transparent 10%,#0008 68%,#000e 100%)}
.brand-intro .cinema-grain{display:block;z-index:1;opacity:.025;pointer-events:none}.opening-ring{display:none}
.opening-cabinets{position:absolute;left:50%;top:45%;translate:-50% -50%;width:94%;height:76svh;max-width:1700px;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:22px 26px;perspective:none}
.opening-cabinets .opening-machine{position:relative;inset:auto;min-width:0;min-height:0;width:100%;height:100%;object-fit:contain;object-position:center;transform-origin:center;backface-visibility:hidden;filter:drop-shadow(0 10px 12px #000b);opacity:0;transform:none}
.brand-intro:not(.running) .opening-signature{opacity:0}
.brand-intro.running .opening-cabinets{animation:burst-machines-away .95s var(--machines-clear) ease-in-out both}
.brand-intro.running .opening-machine{animation:center-to-slot .64s var(--burst-delay) both;will-change:transform,opacity}
.brand-intro.running .cinema-progress{animation:intro-duration var(--intro-duration) linear both}
.brand-intro.running .opening-world{animation:none;opacity:1}
.brand-intro.running .opening-world:before{animation:burst-haze 12s linear infinite}
.opening-flare{left:50%;top:50%;width:58vmin;height:58vmin;translate:-50% -50%;background:radial-gradient(ellipse,#ff686855,#ee242c22 25%,transparent 65%);opacity:0;z-index:-2;pointer-events:none}
.brand-intro.running .opening-flare{animation:burst-core var(--machines-clear) both}
.opening-energy{position:absolute;left:50%;top:50%;width:100vmax;height:100vmax;translate:-50% -50%;background:repeating-conic-gradient(from 0deg,transparent 0deg 24deg,#ee242c20 25deg,transparent 26deg 45deg);mask-image:radial-gradient(closest-side,transparent 5%,#0009 22%,transparent 64%);opacity:0;z-index:-1;pointer-events:none}
.brand-intro.running .opening-energy{animation:burst-rays var(--machines-clear) both}
.opening-signature{position:absolute;left:50%;top:50%;right:auto;bottom:auto;translate:none;transform:translate(-50%,-50%);width:min(440px,86%);max-width:none;text-align:center;z-index:4}
.opening-signature .opening-tagline{display:none}
.opening-signature h2{font-family:Chakra,Body,sans-serif;display:inline-block;position:relative;font-size:34px;font-weight:700;font-style:italic;letter-spacing:-.045em;line-height:1.2;overflow:hidden;padding:5px 12px 7px;color:#fff8f8;text-shadow:0 0 18px #ee242c22}
.opening-signature h2 span{font-family:Chakra,Body,sans-serif;font-size:17px;font-style:italic;letter-spacing:.015em;color:#ee414b;margin-left:8px}
.opening-signature h2:after{content:'';position:absolute;inset:-25% -60%;background:linear-gradient(110deg,transparent 40%,#ff747444 46%,#fff9 50%,#ff747444 54%,transparent 60%);mix-blend-mode:screen;transform:translateX(-110%);opacity:0;pointer-events:none}
.opening-signature>p:last-child{margin-top:2px;font-size:9px;color:#a8949b;letter-spacing:.04em}
.brand-intro.running .opening-signature{animation:signature-to-center .85s var(--signature-start) both}
.brand-intro.running .opening-signature h2:after{animation:signature-final-light .75s var(--signature-shine) both}
@keyframes center-to-slot{0%{opacity:0;transform:translate3d(var(--burst-x),var(--burst-y),0) scale(.025);animation-timing-function:cubic-bezier(.15,.65,.18,1)}15%{opacity:1;transform:translate3d(calc(var(--burst-x)*.78),calc(var(--burst-y)*.78),0) scale(.2);animation-timing-function:cubic-bezier(.16,.75,.2,1)}78%{opacity:1;transform:translate3d(0,0,0) scale(1.035);animation-timing-function:ease-out}100%{opacity:1;transform:translate3d(0,0,0) scale(1)}}
@keyframes burst-machines-away{0%{opacity:1;filter:blur(0)}50%{opacity:.3;filter:blur(2px)}100%{opacity:0;filter:blur(6px)}}
@keyframes burst-haze{from{transform:translate(-3%,2%) scale(1)}to{transform:translate(4%,-3%) scale(1.12)}}
@keyframes burst-core{0%{opacity:0;scale:.15}12%{opacity:.65;scale:.7}40%{opacity:.4;scale:.95}78%{opacity:.25;scale:1.1}100%{opacity:0;scale:1.2}}
@keyframes burst-rays{0%{opacity:0;transform:scale(.1) rotate(-8deg)}12%{opacity:.45}78%{opacity:.18}100%{opacity:0;transform:scale(1.15) rotate(5deg)}}
@keyframes signature-to-center{0%{opacity:0;transform:translate(calc(-50% + var(--signature-x)),calc(-50% + var(--signature-y)))}30%{opacity:1}100%{opacity:1;transform:translate(-50%,-50%)}}
@keyframes signature-final-light{0%{opacity:0;transform:translateX(-110%)}25%{opacity:1}100%{opacity:0;transform:translateX(110%)}}
@media(max-width:900px){.opening-cabinets{gap:18px 16px}}
@media(max-width:700px){.opening-cabinets{width:93%;height:76svh;top:46%;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(6,minmax(0,1fr));gap:12px 14px}.opening-signature h2{font-size:29px}.opening-signature h2 span{font-size:14px}.opening-signature>p:last-child{font-size:8px}.opening-flare{width:60vmin;height:60vmin}}
@media(max-height:550px) and (orientation:landscape){.opening-cabinets{width:94%;height:74svh;top:46%;grid-template-columns:repeat(6,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:10px 20px}.opening-signature h2{font-size:28px}.opening-signature h2 span{font-size:14px}}
@media(prefers-reduced-motion:reduce){.brand-intro.running .machine-opening *,.brand-intro.running .opening-world:before{animation:none!important;will-change:auto}.opening-machine{opacity:1!important;transform:none!important}.opening-world{opacity:1}.opening-energy,.opening-signature h2:after{display:none}.opening-signature{opacity:0}.opening-flare{opacity:.1}}

.opening-signature{width:max-content;max-width:86%}
/* Brighter localized launch effects; the entire screen never flashes. */
.opening-burst-effects{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.burst-launch{position:absolute;left:50%;top:50%;width:var(--fx-distance);height:2px;transform-origin:left center;transform:rotate(var(--fx-angle)) scaleX(0);background:linear-gradient(90deg,transparent,#f31e36bb 28%,#ffb0a8 86%,#fff1e9);box-shadow:0 0 9px #ee242caa;opacity:0}
.burst-pulse{position:absolute;left:50%;top:50%;width:95px;height:95px;margin:-47.5px 0 0 -47.5px;border:2px solid #ff6b70aa;border-radius:50%;background:radial-gradient(circle,#fff5edaa 0%,#ff7b7399 9%,#ee242c44 26%,transparent 64%);box-shadow:0 0 25px #ee242c88,inset 0 0 20px #ee242c55;opacity:0;transform:scale(.08)}
.brand-intro.running .burst-launch{animation:launch-trace .58s var(--fx-delay) both}
.brand-intro.running .burst-pulse{animation:launch-pulse .58s var(--fx-delay) both}
.opening-flare{width:88vmin;height:88vmin;background:radial-gradient(ellipse,#fff4df66 0%,#ff514e77 9%,#ee242c44 27%,transparent 66%)}
.opening-energy{background:repeating-conic-gradient(from 0deg,transparent 0deg 24deg,#ff3f4d44 25deg,transparent 26deg 45deg)}
.opening-cabinets{width:97%;height:82svh;top:47%;max-width:1840px;gap:12px 16px}
.opening-signature{width:max-content;max-width:90%}
.opening-signature h2{font-size:clamp(42px,min(10vw,16svh),160px);padding:8px 14px 12px;line-height:1.1;white-space:nowrap}
.opening-signature h2 span{font-size:.5em;margin-left:.16em;letter-spacing:0}
.opening-signature>p:last-child{font-size:clamp(10px,1vw,15px);margin-top:8px;letter-spacing:.06em}
.brand-intro.running .machine-opening{animation:opening-final-fade .4s calc(var(--intro-duration) - .4s) both}
@keyframes launch-trace{0%{opacity:0;transform:rotate(var(--fx-angle)) scaleX(.02)}18%{opacity:.85}65%{opacity:.5;transform:rotate(var(--fx-angle)) scaleX(1)}100%{opacity:0;transform:rotate(var(--fx-angle)) scaleX(1)}}
@keyframes launch-pulse{0%{opacity:0;transform:scale(.08)}20%{opacity:.8}68%{opacity:.25}100%{opacity:0;transform:scale(2.5)}}
@keyframes opening-final-fade{0%{opacity:1}100%{opacity:0}}
@keyframes signature-to-center{0%{opacity:0;transform:translate(calc(-50% + var(--signature-x)),calc(-50% + var(--signature-y))) scale(.45)}30%{opacity:1}100%{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@media(max-width:900px){.opening-cabinets{gap:12px 12px}}
@media(max-width:700px){.opening-cabinets{width:96%;height:80svh;top:47%;gap:8px 10px}.opening-signature h2{font-size:clamp(36px,min(12vw,12svh),72px);padding:6px 8px 10px}.opening-signature h2 span{font-size:.5em}.opening-signature>p:last-child{font-size:10px}.burst-pulse{width:72px;height:72px;margin:-36px 0 0 -36px}}
@media(max-height:550px) and (orientation:landscape){.opening-cabinets{height:78svh;top:48%;gap:8px 18px}.opening-signature h2{font-size:clamp(38px,min(10vw,17svh),96px)}.opening-signature h2 span{font-size:.5em}.opening-signature>p:last-child{font-size:10px}}
@media(prefers-reduced-motion:reduce){.opening-burst-effects{display:none}.brand-intro.running .machine-opening{animation:none!important}}
/* Original MCK logo, red marquee and expanding logo finale. */
.opening-signature{top:43%;width:min(44vw,460px,57svh);max-width:84%;transform:translate(-50%,-50%);pointer-events:none}
.opening-signature h2{display:block;width:100%;padding:0;margin:0;line-height:0;overflow:visible;font-size:inherit;filter:drop-shadow(0 0 24px #ed202a22);transform-origin:50% 47%}
.opening-official-logo{display:block;width:100%;height:auto;clip-path:inset(0 0 7% 0)}
.opening-signature h2:after{inset:0 -20% 7%;mix-blend-mode:screen;clip-path:inset(0 15%)}
.brand-intro.running .opening-signature{animation:official-logo-arrive 1s var(--signature-start) cubic-bezier(.22,.6,.25,1) both}
.brand-intro.running .opening-signature h2{animation:official-logo-explode .85s var(--logo-burst) cubic-bezier(.35,0,.6,1) forwards}
.opening-logo-fragments{position:absolute;inset:0;pointer-events:none}
.logo-shard{position:absolute;inset:0;opacity:0;transform-origin:center}
.logo-shard img{display:block;width:100%;height:auto}
.brand-intro.running .logo-shard{animation:logo-fragment-flight .85s calc(var(--logo-burst) + .08s) both}
.opening-tape{position:absolute;left:-4%;width:108%;top:76%;height:77px;background:#ec202b;box-shadow:0 -1px 0 #ff6669,0 18px 50px #0009;display:flex;align-items:center;overflow:hidden;transform:rotate(-3deg);z-index:5;opacity:0;pointer-events:none}
.opening-tape-track{display:flex;width:max-content;flex-shrink:0;color:#100809;font-family:Chakra,Body,sans-serif;font-size:39px;font-weight:700;font-style:italic;letter-spacing:.025em;line-height:1}
.opening-tape-track>div{display:flex;align-items:center;gap:32px;padding-right:32px;flex-shrink:0}
.opening-tape-track b{font:inherit;white-space:nowrap}.opening-tape-track i{font-style:normal;color:#fff4ef;font-size:21px}
.brand-intro.running .opening-tape{animation:intro-tape-enter .55s var(--signature-start) ease-out both,intro-tape-exit .4s calc(var(--logo-burst) + .3s) ease-in forwards}
.brand-intro.running .opening-tape-track{animation:intro-tape-scroll 12s var(--signature-start) linear infinite}
.opening-finale{position:absolute;inset:0;z-index:6;pointer-events:none}
.opening-finale-glow,.opening-finale-ring{position:absolute;left:50%;top:43%;width:55vmin;height:55vmin;translate:-50% -50%;border-radius:50%;opacity:0}
.opening-finale-glow{background:radial-gradient(circle,#ffddd577 0%,#ff3d4e77 9%,#ed202a33 28%,transparent 67%)}
.opening-finale-ring{border:2px solid #ff7d8288;box-shadow:0 0 28px #ed202a66,inset 0 0 25px #ed202a44}
.brand-intro.running .opening-finale-glow{animation:logo-finale-glow .85s var(--logo-burst) both}
.brand-intro.running .opening-finale-ring{animation:logo-finale-ring .85s calc(var(--logo-burst) + .07s) both}
.opening-finale-sparks{position:absolute;left:50%;top:43%;width:0;height:0}
.opening-finale-sparks i,.burst-spark{position:absolute;left:0;top:0;width:var(--spark-length,12px);height:2px;background:linear-gradient(90deg,#ed202a00,#ff5e65,#ffe9df);box-shadow:0 0 8px #ed202a88;opacity:0}
.brand-intro.running .opening-finale-sparks i{animation:logo-finale-spark .85s calc(var(--logo-burst) + .08s) both}
.burst-spark{left:50%;top:50%;width:4px;height:2px}
.brand-intro.running .burst-spark{animation:launch-spark .6s var(--fx-delay) both}
.brand-intro.running .burst-launch{animation-duration:var(--fx-duration,.58s)}
.brand-intro.running .burst-pulse{animation:launch-pulse-varied var(--fx-duration,.58s) var(--fx-delay) both}
.burst-style-1{border-style:dashed;background:radial-gradient(circle,#ff989966,transparent 60%)}
.burst-style-2{border:none;background:conic-gradient(from 10deg,transparent,#ff777799,transparent 20%,transparent 30%,#ed202a99,transparent 50%,transparent 65%,#ffaba999,transparent 85%);box-shadow:none}
@keyframes official-logo-arrive{0%{opacity:0;transform:translate(-50%,-50%) scale(.9)}100%{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes official-logo-explode{0%{opacity:1;transform:scale(1);filter:drop-shadow(0 0 24px #ed202a22)}20%{opacity:1;transform:scale(1.13);filter:drop-shadow(0 0 38px #ed202a88)}58%{opacity:.45;transform:scale(1.85);filter:blur(2px) drop-shadow(0 0 50px #ed202a66)}100%{opacity:0;transform:scale(3);filter:blur(9px)}}
@keyframes logo-fragment-flight{0%{opacity:0;transform:scale(1.1)}14%{opacity:.8}100%{opacity:0;transform:translate(var(--shard-x),var(--shard-y)) rotate(var(--shard-turn)) scale(1.7);filter:blur(4px)}}
@keyframes intro-tape-enter{from{opacity:0;transform:translateY(65px) rotate(-3deg)}to{opacity:1;transform:translateY(0) rotate(-3deg)}}
@keyframes intro-tape-exit{to{opacity:0;transform:translateY(65px) rotate(-3deg)}}
@keyframes intro-tape-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes logo-finale-glow{0%{opacity:0;transform:scale(.2)}30%{opacity:.85}100%{opacity:0;transform:scale(2.9)}}
@keyframes logo-finale-ring{0%{opacity:0;transform:scale(.3)}22%{opacity:.8}100%{opacity:0;transform:scale(3.4)}}
@keyframes logo-finale-spark{0%{opacity:0;transform:translate(0,0) rotate(var(--spark-turn)) scaleX(.2)}18%{opacity:.9}100%{opacity:0;transform:translate(var(--spark-x),var(--spark-y)) rotate(var(--spark-turn)) scaleX(1.5)}}
@keyframes launch-spark{0%{opacity:0;transform:translate(0,0) scale(.2)}20%{opacity:.8}100%{opacity:0;transform:translate(var(--spark-x),var(--spark-y)) scale(.3)}}
@keyframes launch-pulse-varied{0%{opacity:0;transform:scale(.08) rotate(0)}20%{opacity:var(--fx-power,.8)}68%{opacity:.25}100%{opacity:0;transform:scale(var(--fx-scale,2.5)) rotate(35deg)}}
@media(max-width:700px){.opening-signature{width:min(78vw,360px,40svh);top:43%}.opening-signature h2{padding:0;font-size:inherit}.opening-tape{height:60px;top:74%}.opening-tape-track{font-size:29px}.opening-tape-track>div{gap:22px;padding-right:22px}.opening-tape-track i{font-size:15px}}
@media(max-height:550px) and (orientation:landscape){.opening-signature{width:min(36vw,47svh)}.opening-signature h2{padding:0}.opening-tape{height:47px;top:76%}.opening-tape-track{font-size:26px}}
@media(prefers-reduced-motion:reduce){.opening-finale,.opening-logo-fragments{display:none}.brand-intro.running .opening-signature{opacity:1;transform:translate(-50%,-50%)}.brand-intro.running .opening-tape{opacity:1}.brand-intro.running .opening-tape-track,.brand-intro.running .opening-signature h2{animation:none!important}}
/* Reveal the live page beneath the expanding red afterglow. */
.brand-intro{background:transparent}
.brand-intro::backdrop{background:#020202}
.opening-signature{width:min(53vw,560px,69svh)}
.brand-intro.running .machine-opening{animation:none}
.brand-intro.running .opening-world{animation:intro-world-reveal 1.85s var(--site-reveal) cubic-bezier(.25,.1,.25,1) both}
.brand-intro.running::backdrop{animation:intro-backdrop-reveal 1.85s var(--site-reveal) cubic-bezier(.25,.1,.25,1) both}
.brand-intro .cinema-smoke{display:none}
.brand-intro.running .intro-topline,.brand-intro.running .intro-bottomline,.brand-intro.running .cinema-grain{animation:intro-controls-reveal .65s var(--site-reveal) ease-out forwards}
.brand-intro.running .cinema-progress{animation:intro-duration var(--intro-duration) linear both,intro-controls-reveal .65s var(--site-reveal) ease-out forwards}
.brand-intro.running .opening-tape{animation:intro-tape-enter .55s var(--signature-start) ease-out both,intro-tape-exit .65s calc(var(--logo-burst) + .18s) ease-in forwards}
.opening-finale-glow{background:radial-gradient(ellipse,#ffb0a244 0%,#f6334370 12%,#ed202a38 33%,transparent 68%);will-change:transform,opacity}
.brand-intro.running .opening-finale-glow{animation:logo-finale-diffuse 2s var(--logo-burst) cubic-bezier(.2,.55,.3,1) both}
.brand-intro.running .opening-finale-ring{animation:logo-finale-ring-soft 1.8s calc(var(--logo-burst) + .07s) ease-out both}
.brand-intro.running .opening-finale-sparks i{animation:logo-finale-spark 1.5s calc(var(--logo-burst) + .08s) ease-out both}
@keyframes intro-world-reveal{from{opacity:1}to{opacity:0}}
@keyframes intro-backdrop-reveal{from{background-color:#020202}to{background-color:#02020200}}
@keyframes intro-controls-reveal{to{opacity:0}}
@keyframes logo-finale-diffuse{0%{opacity:0;transform:scale(.2);filter:blur(0)}16%{opacity:.9;transform:scale(.85);filter:blur(2px)}48%{opacity:.48;transform:scale(2.05);filter:blur(10px)}78%{opacity:.12;transform:scale(3.1);filter:blur(22px)}100%{opacity:0;transform:scale(3.8);filter:blur(32px)}}
@keyframes logo-finale-ring-soft{0%{opacity:0;transform:scale(.3);filter:blur(0)}18%{opacity:.55}55%{opacity:.19;filter:blur(3px)}100%{opacity:0;transform:scale(4);filter:blur(12px)}}
@media(max-width:700px){.opening-signature{width:min(88vw,410px,46svh)}}
@media(max-height:550px) and (orientation:landscape){.opening-signature{width:min(44vw,58svh)}}
@media(prefers-reduced-motion:reduce){.brand-intro.running::backdrop,.brand-intro.running .opening-world,.brand-intro.running .intro-topline,.brand-intro.running .intro-bottomline,.brand-intro.running .cinema-grain{animation:none!important}.opening-finale-glow{will-change:auto}}
/* Each cabinet launches as its own contour drawing, then resolves into the photograph. */
.opening-machine-slot{position:relative;min-width:0;min-height:0;width:100%;height:100%;transform-origin:center;opacity:0}
.opening-cabinets .opening-machine-slot>.opening-machine{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transform:none;opacity:0}
.machine-blueprint{position:absolute;inset:0;opacity:0;pointer-events:none;isolation:isolate}
.machine-blueprint-image{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:url(#machine-blueprint) drop-shadow(0 0 1.5px #ff3b5080);opacity:1}
.machine-blueprint-guides{position:absolute;inset:0;width:100%;height:100%;fill:none;stroke:#ff919c;stroke-width:.85;vector-effect:non-scaling-stroke}
.blueprint-grid{opacity:.25;stroke-dasharray:2 5}.blueprint-corners{opacity:.95;stroke-width:1.2}.blueprint-axis{opacity:.6}
.machine-blueprint:after{content:'';position:absolute;left:4%;right:4%;height:2px;top:8%;background:linear-gradient(90deg,transparent,#ff9ca3aa,transparent);box-shadow:0 0 8px #ed202a66;opacity:0}
.brand-intro.running .opening-machine-slot{animation:blueprint-to-slot 1.25s var(--burst-delay) both;will-change:transform,opacity}
.brand-intro.running .opening-cabinets .opening-machine{animation:blueprint-photo-reveal 2.2s var(--burst-delay) cubic-bezier(.4,0,.2,1) both;will-change:opacity}
.brand-intro.running .machine-blueprint{animation:blueprint-drawing-reveal 2.2s var(--burst-delay) ease-in-out both}
.brand-intro.running .machine-blueprint:after{animation:blueprint-scan 1.9s var(--burst-delay) ease-in-out both}
@keyframes blueprint-to-slot{0%{opacity:0;transform:translate3d(var(--burst-x),var(--burst-y),0) scale(.55)}12%{opacity:1;transform:translate3d(calc(var(--burst-x)*.91),calc(var(--burst-y)*.91),0) scale(1.12);animation-timing-function:cubic-bezier(.12,.65,.22,1)}64%{opacity:1;transform:translate3d(0,0,0) scale(1.025);animation-timing-function:ease-out}100%{opacity:1;transform:translate3d(0,0,0) scale(1)}}
@keyframes blueprint-photo-reveal{0%,40%{opacity:0}96%,100%{opacity:1}}
@keyframes blueprint-drawing-reveal{0%{opacity:0}8%,46%{opacity:1}76%{opacity:.5}100%{opacity:0}}
@keyframes blueprint-scan{0%{opacity:0;top:8%}15%{opacity:.8}70%{opacity:.5}100%{opacity:0;top:92%}}
@media(prefers-reduced-motion:reduce){.brand-intro.running .opening-machine-slot{animation:none!important;opacity:1;transform:none}.machine-blueprint{display:none}.brand-intro.running .opening-cabinets .opening-machine{opacity:1!important}}


/* Fast model names during the launch; slower, prominent services afterward. */
.opening-tape{top:auto;bottom:25px;height:64px;transform:rotate(-1deg)}
.opening-tape-track{position:absolute;left:0;top:0;height:100%;align-items:center}
.opening-tape-names{gap:24px;padding:0 20px;font-size:clamp(20px,2.4vw,31px);opacity:1}
.opening-tape-services{opacity:0;color:#fff8f3;--services-duration:14s;text-shadow:0 1px 0 #a6081666}
.brand-intro .intro-bottomline{bottom:9px}
.brand-intro.running .opening-tape{animation:intro-model-tape-enter .45s .08s ease-out both,intro-service-tape-lift .7s var(--signature-start) ease-in-out forwards,intro-tape-exit .65s calc(var(--logo-burst) + .18s) ease-in forwards}
.brand-intro.running .opening-tape-names{animation:intro-model-names var(--names-duration) .18s linear both,intro-model-names-out .3s var(--services-start) ease-out forwards}
.brand-intro.running .opening-tape-services{animation:intro-services-in .4s var(--services-start) ease-out both,intro-tape-scroll var(--services-duration) var(--services-start) linear infinite}
@keyframes intro-model-tape-enter{from{opacity:0;transform:translateY(65px) rotate(-1deg)}to{opacity:1;transform:translateY(0) rotate(-1deg)}}
@keyframes intro-service-tape-lift{from{bottom:25px;transform:rotate(-1deg)}to{bottom:14svh;transform:rotate(-3deg)}}
@keyframes intro-model-names{from{transform:translateX(0)}to{transform:translateX(var(--names-end))}}
@keyframes intro-model-names-out{to{opacity:0}}
@keyframes intro-services-in{from{opacity:0}to{opacity:1}}
@media(max-width:700px){.opening-tape{top:auto;height:54px}.opening-tape-names{font-size:22px;gap:22px}.opening-tape-services{font-size:27px;--services-duration:6.5s}}
@media(max-height:550px) and (orientation:landscape){.opening-tape{top:auto;bottom:18px;height:44px}.opening-tape-names{font-size:21px}.opening-tape-services{font-size:26px;--services-duration:10s}}
@media(prefers-reduced-motion:reduce){.opening-tape-names{display:none}.opening-tape-services{opacity:1}.brand-intro.running .opening-tape{animation:none!important;opacity:1;bottom:14svh}}
/* Keep the final light sweep inside the original logo silhouette. */
.opening-signature h2:after{inset:0;background:linear-gradient(110deg,transparent 40%,#ffbcbc44 46%,#fff9 50%,#ffbcbc44 54%,transparent 60%);background-size:250% 100%;mask-image:url('assets/mck-logo-intro-wide-elektronik.svg');mask-size:100% 100%;mask-repeat:no-repeat;clip-path:inset(0 0 7% 0);transform:none}
.brand-intro.running .opening-signature h2:after{animation:original-logo-light .75s var(--signature-shine) both}
@keyframes original-logo-light{0%{opacity:0;background-position:150% 0}25%{opacity:.8}100%{opacity:0;background-position:-70% 0}}
/* Soft, localized light bursts without geometric symbols. */
.opening-flare,.opening-energy{display:none}
.burst-launch,.burst-pulse,.burst-spark{left:var(--fx-x);top:var(--fx-y)}
.burst-pulse{width:var(--fx-size,90px);height:calc(var(--fx-size,90px)*var(--fx-aspect,1));margin:0;translate:-50% -50%;background:radial-gradient(ellipse,#ffafa388 0%,#f343535e 15%,#df273934 35%,transparent 72%);border:0;border-radius:50%;box-shadow:none}
.burst-launch{height:1px;background:linear-gradient(90deg,transparent,#e42c4244 35%,#ff9b9c77);box-shadow:none}
.burst-spark{width:3px;height:1px;background:#ff7d89;box-shadow:0 0 3px #e42c4244}
.brand-intro.running .burst-pulse{animation-name:soft-launch-pulse}
.brand-intro.running .burst-launch{animation-name:soft-launch-trace}
.brand-intro.running .burst-spark{animation-name:soft-launch-spark}
.brand-intro.running .opening-machine-slot{animation:machine-in-place 1.1s var(--burst-delay) ease-out both;will-change:transform,opacity}
.brand-intro.running .opening-cabinets .opening-machine,.brand-intro.running .machine-blueprint{animation-duration:var(--machine-reveal-duration,2.5s)}
.brand-intro.running .machine-blueprint:after{animation-duration:2.2s}
@keyframes soft-launch-pulse{0%{opacity:0;transform:scale(.4) rotate(var(--fx-turn))}28%{opacity:var(--fx-power,.48);transform:scale(.95) rotate(var(--fx-turn))}65%{opacity:.18}100%{opacity:0;transform:scale(var(--fx-scale,1.7)) rotate(var(--fx-turn))}}
@keyframes soft-launch-trace{0%{opacity:0;transform:rotate(var(--fx-angle)) scaleX(.05)}24%{opacity:.28}70%{opacity:.12;transform:rotate(var(--fx-angle)) scaleX(1)}100%{opacity:0;transform:rotate(var(--fx-angle)) scaleX(1)}}
@keyframes soft-launch-spark{0%{opacity:0;transform:translate(0,0) scale(.5)}25%{opacity:.35}100%{opacity:0;transform:translate(var(--spark-x),var(--spark-y)) scale(.2)}}

/* Each technical drawing materializes directly in its final cell. */
@keyframes machine-in-place{0%{opacity:0;transform:scale(.82)}20%{opacity:1;transform:scale(1.018)}65%,100%{opacity:1;transform:scale(1)}}

/* Larger original logo with the same soft, localized arrival light as the cabinets. */
.opening-signature{width:min(74.2vw,784px,96.6svh);max-width:92%}
.opening-signature:before{content:'';position:absolute;inset:-12% -18%;z-index:-1;pointer-events:none;border-radius:50%;background:radial-gradient(ellipse,#ffafa34d 0%,#f3435344 16%,#df27392b 36%,transparent 70%);filter:blur(8px);opacity:0}
.brand-intro.running .opening-signature:before{animation:logo-arrival-glow 1.6s var(--signature-start) ease-out both}
@keyframes logo-arrival-glow{0%{opacity:0;transform:scale(.6)}28%{opacity:.55;transform:scale(.96)}68%{opacity:.2;transform:scale(1.12)}100%{opacity:0;transform:scale(1.25)}}
@media(max-width:700px){.opening-signature{width:min(123.2vw,574px,64.4svh);max-width:92%}.opening-signature:before{inset:-10% -8%;filter:blur(6px)}}
@media(max-height:550px) and (orientation:landscape){.opening-signature{width:min(61.6vw,81.2svh)}}
@media(prefers-reduced-motion:reduce){.opening-signature:before{display:none}}


/* Fill every row: seven by three in landscape, three by seven in portrait. */
.opening-cabinets{width:97%;height:80svh;top:46%;max-width:none;grid-template-columns:repeat(7,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));grid-auto-flow:row}
.opening-machine-wide{grid-column:auto}
@media(max-width:700px),(max-width:1100px) and (orientation:portrait){.opening-cabinets{width:96%;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(7,minmax(0,1fr));height:84svh;top:46%;gap:8px 10px}}
@media(max-height:550px) and (orientation:landscape){.opening-cabinets{width:97%;grid-template-columns:repeat(7,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));height:70svh;top:46%}}
/* Compensate transparent margins while preserving the complete new cabinets. */
.opening-cabinets .machine-cutout-balanced>.opening-machine,.machine-cutout-balanced .machine-blueprint-image{width:115%;max-width:none;left:-7.5%}
.opening-cabinets .machine-cutout-portrait>.opening-machine,.machine-cutout-portrait .machine-blueprint-image{width:145%;max-width:none;left:-22.5%}



/* Keep the skip control above the machine scene. */
.brand-intro .intro-topline{top:4px;left:3%;right:3%}
.brand-intro .intro-skip{font-size:8px;padding:4px 8px;gap:14px}
.brand-intro .intro-skip span{font-size:12px}

/* A coordinated neon title pass after every cabinet has fully resolved. */
.machine-title-effect{position:absolute;inset:0;pointer-events:none}
.machine-title-echo{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;filter:grayscale(1) sepia(1) saturate(5) hue-rotate(315deg) brightness(1.35)}
.machine-title-sweep{position:absolute;inset:0;opacity:0;mask-repeat:no-repeat;mask-size:contain;background:linear-gradient(110deg,transparent 33%,#ee273c80 42%,#ffb9afb3 48%,#fff4ece6 51%,#ee273c80 59%,transparent 68%);background-size:300% 100%;background-repeat:no-repeat;mix-blend-mode:screen}
.machine-cutout-balanced .machine-title-effect{width:115%;max-width:none;left:-7.5%}
.machine-cutout-portrait .machine-title-effect{width:145%;max-width:none;left:-22.5%}
.brand-intro.running .machine-title-sweep{animation:machine-title-sweep var(--ensemble-duration) var(--ensemble-start) ease-in-out both}
.brand-intro.running .machine-title-echo{animation:machine-title-echo var(--ensemble-duration) var(--ensemble-start) linear both}
.brand-intro.running .opening-cabinets .opening-machine{animation:blueprint-photo-reveal var(--machine-reveal-duration,2.5s) var(--burst-delay) cubic-bezier(.4,0,.2,1) both,machine-title-tone var(--ensemble-duration) var(--ensemble-start) ease-in-out forwards}
@keyframes machine-title-sweep{0%{opacity:0;background-position:150% 0}18%{opacity:.9}72%{opacity:.7}100%{opacity:0;background-position:-50% 0}}
@keyframes machine-title-echo{0%,17%,27%,53%,65%,100%{opacity:0;transform:translateX(0);clip-path:inset(0)}18%,25%{opacity:.24;transform:translateX(3px);clip-path:inset(28% 0 47%)}55%,62%{opacity:.18;transform:translateX(-3px);clip-path:inset(62% 0 15%)}}
@keyframes machine-title-tone{0%,100%{filter:drop-shadow(0 10px 12px #000b)}28%{filter:drop-shadow(0 10px 12px #000b) saturate(1.26) brightness(1.18) contrast(1.08)}70%{filter:drop-shadow(0 10px 12px #000b) saturate(1.06) brightness(1.04)}}
@media(prefers-reduced-motion:reduce){.machine-title-effect{display:none}.brand-intro.running .opening-cabinets .opening-machine{animation:none!important;opacity:1}}


/* Six large cabinets on compact displays; hidden models never occupy a cell. */
.opening-machine-slot[hidden]{display:none!important}
.brand-intro.intro-mobile .opening-cabinets{width:92%;height:72svh;top:45%;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(3,minmax(0,1fr));gap:14px 18px}
.brand-intro.intro-mobile .opening-cabinets .opening-machine,.brand-intro.intro-mobile .machine-blueprint-image,.brand-intro.intro-mobile .machine-title-effect{width:100%;height:100%;left:0;max-width:100%;object-position:center}
.brand-intro.intro-mobile .opening-world:before{filter:blur(22px);opacity:.22;background:radial-gradient(ellipse at 32% 40%,#a8132466,transparent 55%),radial-gradient(ellipse at 70% 60%,#37101b66,transparent 60%)}
.brand-intro.intro-mobile .cinema-grain{display:none}
.brand-intro.intro-mobile .intro-topline{top:max(10px,env(safe-area-inset-top));left:16px;right:16px}
.brand-intro.intro-mobile .intro-skip{font-size:13px;min-height:44px;padding:10px 12px;gap:12px;background:#0a080acc}
.brand-intro.intro-mobile .opening-signature{width:88vw;max-width:88%;top:46%}
.brand-intro.intro-mobile .opening-tape{bottom:max(25px,env(safe-area-inset-bottom));height:48px}
.brand-intro.intro-mobile .opening-tape-names{font-size:21px}
.brand-intro.intro-mobile .opening-tape-services{font-size:25px;--services-duration:11s}
.brand-intro.intro-mobile .intro-bottomline{bottom:max(6px,env(safe-area-inset-bottom))}
@media(max-height:550px) and (orientation:landscape){
 .brand-intro.intro-mobile .opening-cabinets{width:87%;height:66svh;top:45%;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:10px 20px}
 .brand-intro.intro-mobile .opening-signature{width:min(55vw,68svh)}
 .brand-intro.intro-mobile .opening-tape{height:36px;bottom:12px}
 .brand-intro.intro-mobile .opening-tape-names{font-size:18px}
 .brand-intro.intro-mobile .opening-tape-services{font-size:22px}
}

/* Mobile finale: one pre-rendered logo and compositor-only transform/opacity. */
.brand-intro.intro-mobile .opening-logo-fragments,
.brand-intro.intro-mobile .opening-finale-ring,
.brand-intro.intro-mobile .opening-finale-sparks,
.brand-intro.intro-mobile .opening-signature:before,
.brand-intro.intro-mobile .opening-signature h2:after{display:none!important}
.brand-intro.intro-mobile .opening-signature h2{filter:none!important;will-change:transform,opacity;backface-visibility:hidden}
.brand-intro.intro-mobile.running .opening-signature h2{animation:mobile-logo-release 1.1s var(--logo-burst) cubic-bezier(.22,.61,.36,1) both}
.brand-intro.intro-mobile .opening-finale-glow{width:min(76vw,340px);height:min(76vw,340px);background:radial-gradient(ellipse,#ffb8a84d,#e62a3b30 30%,transparent 69%);filter:none!important;box-shadow:none;mix-blend-mode:normal;will-change:transform,opacity}
.brand-intro.intro-mobile.running .opening-finale-glow{animation:mobile-logo-glow 1.6s var(--logo-burst) ease-out both}
.brand-intro.intro-mobile::backdrop{background:transparent;animation:none!important}
.brand-intro.intro-mobile .opening-world:before{filter:none!important}
.brand-intro.intro-mobile.running .opening-cabinets{animation:mobile-machines-clear .65s var(--machines-clear) ease-out both}
.brand-intro.intro-mobile .opening-machine-slot,
.brand-intro.intro-mobile .opening-cabinets .opening-machine{will-change:auto!important}
@keyframes mobile-logo-release{0%{opacity:1;transform:scale(1)}24%{opacity:1;transform:scale(1.1)}100%{opacity:0;transform:scale(1.72)}}
@keyframes mobile-logo-glow{0%{opacity:0;transform:scale(.75)}22%{opacity:.8;transform:scale(1)}100%{opacity:0;transform:scale(1.75)}}
@keyframes mobile-machines-clear{0%{opacity:1;visibility:visible}100%{opacity:0;visibility:hidden}}
@media(prefers-reduced-motion:reduce){.brand-intro.intro-mobile.running .opening-signature h2,.brand-intro.intro-mobile.running .opening-finale-glow{animation:none!important}.brand-intro.intro-mobile.running .opening-cabinets{animation:none!important}}