/* K-CARZ: assemble, accelerate, then become the real header logo. */
.kc-opening{--kc-duration:1500ms;--kc-logo-width:min(620px,82vw);position:fixed;inset:0;width:100%;height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;overflow:hidden;isolation:isolate;background:transparent;color:#f5f3e9;overscroll-behavior:contain}
.kc-opening[open]{display:block}.kc-opening:not([open]){display:none}.kc-opening:not([open]) *{animation:none!important}.kc-opening::backdrop{background:transparent}
html.kc-opening-active{overflow:hidden}.kc-intro-pending body{background:#080c0d}.kc-intro-pending .header,.kc-intro-pending main,.kc-intro-pending footer{visibility:hidden}
.kc-opening-panel{position:absolute;top:0;bottom:0;width:calc(50% + 1px);background:#080c0d;will-change:transform}
.kc-panel-left{left:0;animation:kc-open-left var(--kc-duration) cubic-bezier(.76,0,.2,1) both}.kc-panel-right{right:0;animation:kc-open-right var(--kc-duration) cubic-bezier(.76,0,.2,1) both}
.kc-atmosphere{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 44%,#a4863c18 0%,#080c0d00 58%);animation:kc-atmosphere var(--kc-duration) ease both;pointer-events:none}
.kc-road{position:absolute;top:calc(45% + var(--kc-logo-width) * .15);left:12%;right:12%;height:1px;background:linear-gradient(90deg,transparent,#c6a95e55,transparent);animation:kc-road var(--kc-duration) ease both}
.kc-road:after{content:'';position:absolute;top:-1px;left:0;width:20%;height:2px;background:linear-gradient(90deg,transparent,#f9dfa2);filter:drop-shadow(0 0 8px #deb965);animation:kc-streak var(--kc-duration) cubic-bezier(.3,0,.65,1) both}
.kc-intro-logo{position:absolute;z-index:2;left:50%;top:45%;width:var(--kc-logo-width);aspect-ratio:3/1;transform:translate(-50%,-50%);transform-origin:center;pointer-events:none;will-change:transform,opacity;animation:kc-logo-to-header var(--kc-duration) cubic-bezier(.7,0,.18,1) both}
.kc-logo-piece,.kc-logo-complete{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;pointer-events:none;mix-blend-mode:normal}
.kc-logo-k{clip-path:inset(34% 64% 32% 0);animation:kc-k-join var(--kc-duration) cubic-bezier(.16,1,.3,1) both}
.kc-logo-carz{clip-path:inset(34% 0 32% 36%);animation:kc-carz-join var(--kc-duration) cubic-bezier(.16,1,.3,1) both}
.kc-logo-roof{clip-path:inset(0 0 66%);animation:kc-roof-reveal var(--kc-duration) cubic-bezier(.25,0,.1,1) both}
.kc-logo-caption{clip-path:inset(68% 0 0);animation:kc-caption-reveal var(--kc-duration) ease both}
.kc-logo-complete{animation:kc-complete var(--kc-duration) linear both}
.kc-driving-car{position:absolute;z-index:3;left:0;top:-16%;width:44%;height:auto;overflow:visible;filter:drop-shadow(0 0 12px #d1aa4b35);animation:kc-drive var(--kc-duration) cubic-bezier(.25,.1,.45,1) both}
.kc-driving-car .kc-wheel{transform-box:fill-box;transform-origin:center;animation:kc-wheel-turn 240ms linear infinite}
.kc-intro-caption{position:absolute;top:calc(45% + var(--kc-logo-width) * .22);left:20px;right:20px;text-align:center;color:#c0ad7d;font-size:9px;letter-spacing:4px;line-height:1.5;animation:kc-line-in var(--kc-duration) ease both}
.kc-intro-controls{position:absolute;z-index:4;bottom:max(25px,env(safe-area-inset-bottom));left:5%;right:5%;display:flex;justify-content:space-between;align-items:center;gap:20px;color:#727c6c;font-size:8px;letter-spacing:2px;animation:kc-controls var(--kc-duration) ease both}
.kc-intro-skip{min-width:70px;min-height:40px;border-radius:30px;border:1px solid #c7b47730;background:#0b100e;color:#b9c2b0;font-size:11px;padding:10px 17px;letter-spacing:0}.kc-intro-skip:hover{border-color:#d1b270;color:#e3c88e}
.kc-intro-skip:focus-visible{outline:2px solid #d1b270;outline-offset:4px}
.kc-replay{display:inline-flex;align-items:center;gap:8px;background:none;color:#a8b39e;padding:0;border:0;font-size:10px;line-height:1.6}.kc-replay svg{width:14px;height:14px}.kc-replay:hover{color:#d1b270}.footer-replay{display:flex;gap:28px;align-items:center}.footer-replay>a{font-size:10px}
.logo-crop{background-image:url('assets/kcarz-gold-logo-transparent.svg');mix-blend-mode:normal}
.kc-home-revealing .header .logo-crop{animation:kc-header-logo var(--kc-duration,1500ms) linear both}
.kc-home-revealing .hero-copy>*,.kc-home-revealing .hero-bottom{animation:kc-page-rise 500ms cubic-bezier(.16,1,.3,1) 850ms both}
.kc-home-revealing .hero-copy h1{animation-delay:900ms}.kc-home-revealing .hero-copy>p{animation-delay:970ms}.kc-home-revealing .hero-copy>.button,.kc-home-revealing .hero-location{animation-delay:1040ms}.kc-home-revealing .hero-bottom{animation-delay:1050ms}
@keyframes kc-k-join{0%,3%{opacity:0;transform:translateX(-90px) skewX(-14deg)}26%{opacity:1;transform:translateX(5px)}34%,100%{opacity:1;transform:none}}
@keyframes kc-carz-join{0%,7%{opacity:0;transform:translateX(120px) skewX(-12deg)}30%{opacity:1;transform:translateX(-4px)}38%,100%{opacity:1;transform:none}}
@keyframes kc-roof-reveal{0%,25%{opacity:0;clip-path:inset(0 100% 66% 0);transform:translateX(-12px)}46%,100%{opacity:1;clip-path:inset(0 0 66% 0);transform:none}}
@keyframes kc-caption-reveal{0%,37%{opacity:0;transform:translateY(10px)}53%,100%{opacity:1;transform:none}}
@keyframes kc-complete{0%,52%{opacity:0}54%,100%{opacity:1}}
@keyframes kc-drive{0%,6%{opacity:0;transform:translateX(-130%) translateY(18%) scale(.8)}12%{opacity:1}29%{opacity:1;transform:translateX(60%) translateY(0) scale(1)}43%{opacity:1;transform:translateX(170%) translateY(-3%) scale(.92)}51%,100%{opacity:0;transform:translateX(260%) translateY(-3%) scale(.8)}}
@keyframes kc-wheel-turn{to{rotate:360deg}}
@keyframes kc-road{0%,8%{opacity:0;scale:.75 1}30%,50%{opacity:1;scale:1 1}66%,100%{opacity:0;scale:1.1 1}}
@keyframes kc-streak{0%,6%{opacity:0;translate:-40% 0}15%,38%{opacity:1}50%,100%{opacity:0;translate:500% 0}}
@keyframes kc-atmosphere{0%{opacity:0}24%,58%{opacity:1}85%,100%{opacity:0}}
@keyframes kc-line-in{0%,40%{opacity:0;translate:0 8px}54%,62%{opacity:1;translate:0 0}76%,100%{opacity:0;translate:0 -5px}}
@keyframes kc-controls{0%,65%{opacity:1}95%,100%{opacity:0}}
@keyframes kc-logo-to-header{0%,62%{transform:translate(-50%,-50%);opacity:1}97%{transform:translate(calc(-50% + var(--kc-target-x,0px)),calc(-50% + var(--kc-target-y,0px))) scale(var(--kc-target-scale,.3));opacity:1}100%{transform:translate(calc(-50% + var(--kc-target-x,0px)),calc(-50% + var(--kc-target-y,0px))) scale(var(--kc-target-scale,.3));opacity:0}}
@keyframes kc-open-left{0%,61%{transform:none}100%{transform:translateX(-101%)}}
@keyframes kc-open-right{0%,61%{transform:none}100%{transform:translateX(101%)}}
@keyframes kc-header-logo{0%,96%{opacity:0}98%,100%{opacity:1}}
@keyframes kc-page-rise{from{opacity:0;translate:0 12px}to{opacity:1;translate:0 0}}
@media(max-width:680px){.kc-opening{--kc-logo-width:min(360px,88vw)}.kc-intro-caption{font-size:7px;letter-spacing:2.5px;top:calc(45% + var(--kc-logo-width) * .24)}.kc-intro-controls{left:6%;right:6%;bottom:max(20px,env(safe-area-inset-bottom));font-size:7px;letter-spacing:1.4px}.footer-replay{flex-direction:column;align-items:flex-end;gap:10px}.kc-driving-car{top:-22%;width:48%}}
@media(max-height:450px){.kc-opening{--kc-logo-width:min(380px,72vh)}.kc-intro-controls{bottom:12px}.kc-intro-caption{font-size:7px}}
@media(prefers-reduced-motion:reduce){.kc-opening{display:none!important}.kc-intro-pending .header,.kc-intro-pending main,.kc-intro-pending footer{visibility:visible}.kc-home-revealing .header .logo-crop,.kc-home-revealing .hero-copy>*,.kc-home-revealing .hero-bottom{animation:none!important;opacity:1;translate:none}.kc-replay{display:none}}
