/* Lead Funnel composition, adapted to Tesla's own images and violet identity. */
.join-funnel{--funnel-radius:780px;--funnel-push:420px;--funnel-sway:0deg;--funnel-photo-width:460px;position:relative;isolation:isolate;overflow:clip;overflow-anchor:none;padding:0!important;background:#160d25;color:#fff;min-height:880px;scroll-margin-top:-30px}
.join-funnel:before{content:'';position:absolute;inset:0;z-index:-2;background:radial-gradient(ellipse at 12% 82%,#8439bd68,transparent 48%),radial-gradient(ellipse at 88% 30%,#4233936e,transparent 50%),radial-gradient(ellipse at 58% 96%,#a77bc53a,transparent 52%),linear-gradient(150deg,#170c24,#251139 58%,#170e25);pointer-events:none}
.join-funnel:after{content:'';position:absolute;inset:0;z-index:-1;background:url('assets/wins-ornament.svg') left center/530px 770px repeat;opacity:.035;mask-image:linear-gradient(145deg,transparent 22%,#000 65%,transparent);pointer-events:none}
.join-funnel [hidden]{display:none!important}
.join-funnel .section-kicker{margin:0 5%;padding:29px 0 18px;border:0;font-size:9px;color:#c5b2d6;letter-spacing:.7px}
.join-funnel .section-kicker span:last-child{display:inline}
.join-funnel .join-layout{display:flex;flex-direction:column;gap:0;padding:45px 0 0;min-height:calc(100svh - 75px);position:relative}
.join-funnel .join-copy{display:contents}
.join-funnel h2{order:0;font-size:clamp(28px,3.15vw,49px);font-weight:550!important;line-height:1.35;letter-spacing:-.055em;text-align:center;margin:0 auto 30px;padding:0 5%;max-width:1000px;transition:opacity .45s,transform .55s,filter .45s}
.join-funnel h2 em{color:#d7b7f0;font-style:normal}
.join-funnel.is-writing h2{opacity:.5;transform:translateY(-7px) scale(.96);filter:blur(1px)}
.join-funnel #join-form,.join-funnel #form-result{order:1;width:min(640px,88%);max-width:640px;margin:0 auto;position:relative;z-index:4;text-align:center}
.join-funnel #join-form{min-height:320px}
.join-funnel .form-progress{display:flex;justify-content:center;gap:7px;margin:0 0 20px;height:3px}
.join-funnel .form-progress span{width:28px;height:2px;background:#ffffff24;border-radius:10px}
.join-funnel .form-progress span.current{background:#ceb0eb;box-shadow:0 0 12px #cfa1ef40}
.join-funnel .step-number{font-size:9px;letter-spacing:1.5px;color:#c1a8d5;line-height:12px;margin:0 0 12px}
.join-funnel .form-step{min-height:0}
.join-funnel .form-step label{font-size:12px;font-weight:500;line-height:18px;letter-spacing:.2px;margin:0 0 6px;color:#e2d5ed}
.join-funnel .form-step input,.join-funnel .form-step select{display:block;width:100%;height:80px;border:0;border-bottom:1px solid #ffffff2d;background:transparent;padding:5px 63px 18px;text-align:center;text-align-last:center;font-family:var(--body);font-size:clamp(30px,3.7vw,56px);font-weight:450;line-height:1.2;letter-spacing:-.05em;outline-offset:5px;color:#fff;border-radius:0;caret-color:#d0a4ec}
.join-funnel .form-step input::placeholder{color:#9987ad;font-size:inherit;opacity:.7;letter-spacing:-.05em}
.join-funnel .form-step #applicant-contact{font-size:clamp(22px,2.8vw,43px)}
.join-funnel .form-step select{font-size:clamp(25px,2.9vw,44px);appearance:none;cursor:pointer}
.join-funnel .form-step select option{font-size:16px;letter-spacing:0}
.join-funnel .form-hint{color:#c6b3d5;font-size:11px;line-height:1.6;min-height:18px;margin:15px auto 0;max-width:32em}
.join-funnel #form-error{font-size:11px;min-height:16px;line-height:1.5;margin:9px 55px 0;color:#ffd1df}
.join-funnel .form-actions{height:0;display:block}
.join-funnel .form-actions #form-next{position:absolute;top:85px;right:3px;width:48px;height:48px;min-width:48px;min-height:48px;border:1px solid #ffffffb0;padding:0;display:grid;place-items:center;border-radius:50%;background:#f9f5ff;color:#51276c;font-size:0;opacity:.4;transform:translateY(5px);transition:opacity .35s,transform .45s,background .3s;box-shadow:0 0 30px #d5a4ff14}
.join-funnel .form-actions #form-next:after{content:'→';font-size:25px;font-weight:400;line-height:1}
.join-funnel .has-answer .form-actions #form-next,.join-funnel .form-actions #form-next:hover,.join-funnel .form-actions #form-next:focus-visible{opacity:1;transform:translateY(0)}
.join-funnel .form-actions .form-back{position:absolute;left:0;top:94px;font-size:11px;padding:8px 0;color:#c9b5d9;text-decoration:none}
.join-funnel .form-actions .form-back:before{content:'← ';font-size:13px}
.funnel-directions{display:flex;flex-wrap:wrap;justify-content:center;gap:7px;margin:18px -40px 0}
.funnel-directions button{display:inline-flex;align-items:center;gap:6px;border:1px solid #ffffff25;background:#ffffff05;color:#d4c1e2;border-radius:30px;padding:8px 12px;font-size:10px;line-height:1.2;transition:background .2s,border-color .2s,color .2s}
.funnel-directions button svg{width:18px;height:18px}
.funnel-directions button:hover,.funnel-directions button[aria-pressed=true]{background:#e1c6fb18;color:#fff;border-color:#d6b7ed80}
.join-funnel .orbit-area{order:2;position:relative;width:100%;height:440px;min-height:410px;margin:15px 0 0;flex:1;align-self:auto;transform:none;perspective:none}
.join-funnel .orbit-area:before{left:8%;right:8%;width:auto;bottom:26%;height:10%;background:#c391e21a;filter:blur(30px)}
.join-funnel .orbit-scene{position:absolute;inset:0 0 90px;display:flex;align-items:center;justify-content:center;perspective:1000px;touch-action:pan-y pinch-zoom;cursor:grab;overflow:clip;transform-style:preserve-3d}
.join-funnel .orbit-scene:active{cursor:grabbing}
.join-funnel .orbit-ring{position:absolute;width:var(--funnel-photo-width);height:auto;aspect-ratio:16/10;transform-style:preserve-3d;will-change:transform}
.join-funnel .orbit-card,.join-funnel .funnel-symbol{position:absolute;inset:0;transform:rotateY(var(--angle)) translateZ(calc(-1 * var(--funnel-radius))) rotateZ(var(--funnel-sway));backface-visibility:hidden}
.join-funnel .orbit-card{background:#1a1029;border:1px solid #ffffff17;border-radius:10px;box-shadow:0 12px 35px #0004;overflow:hidden;padding:0;cursor:pointer}
.join-funnel .orbit-card img{width:100%;height:100%;object-fit:contain;object-position:center;user-select:none;-webkit-user-drag:none}
.join-funnel .orbit-area[data-stage=contact] .orbit-card img{object-position:center}
.join-funnel .funnel-symbol{display:grid;place-items:center;color:#dbc9ec;pointer-events:none;filter:drop-shadow(0 0 10px #d7a8ff38)}
.join-funnel .funnel-symbol svg{width:100px;height:100px;filter:drop-shadow(0 3px 0 #67467c)}
.join-funnel .funnel-edge{position:absolute;top:0;bottom:0;width:16%;pointer-events:none;z-index:3}
.join-funnel .funnel-edge--left{left:0;background:linear-gradient(90deg,#1d102df0,transparent);mask-image:linear-gradient(90deg,#000,transparent);backdrop-filter:blur(3px)}
.join-funnel .funnel-edge--right{right:0;background:linear-gradient(270deg,#211432f0,transparent);mask-image:linear-gradient(270deg,#000,transparent);backdrop-filter:blur(3px)}
.join-funnel .orbit-heading{position:absolute;inset:auto 20% 60px;text-align:center;padding:0;pointer-events:none}
.join-funnel .orbit-heading .eyebrow{font-size:8px;letter-spacing:1px;color:#cbb0e0}
.join-funnel .orbit-heading h3{font-family:var(--body);font-size:13px;font-weight:500;letter-spacing:0;line-height:1.5;margin:5px 0 0;color:#e2d3ed}
.join-funnel .orbit-heading p{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.join-funnel .orbit-controls{position:absolute;bottom:15px;left:5%;right:5%;display:flex;justify-content:center;gap:18px;align-items:center;color:#d2bddf}
.join-funnel .orbit-controls .circle-button{width:28px;height:28px;font-size:14px;border-color:#ffffff35}
.join-funnel .orbit-controls span{font-size:8px;letter-spacing:.6px;color:#c0a9d2}
.funnel-motion{background:transparent;border:0;color:#d2bddf;font-size:14px;width:28px;height:28px;position:absolute;right:0;padding:0}
.funnel-motion:disabled{opacity:.45;cursor:default}
.join-funnel .orbit-ring.single-photo{transform:none!important}
.join-funnel .single-photo .orbit-card{position:absolute;inset:0;width:100%;height:100%;transform:none}
.join-funnel .single-photo .funnel-symbol{transform:none;left:-145px;right:auto;width:100px}
.join-funnel .single-photo .funnel-symbol:last-child{left:auto;right:-145px}
.join-funnel #form-result .step-number{margin-bottom:8px}
.join-funnel #form-result h3{font-family:var(--body);font-size:18px;font-weight:550;margin:0 0 7px}
.join-funnel #form-result p{font-size:12px;line-height:1.6;margin:7px 0;color:#d1bfdc}
.join-funnel #application-text{height:115px;min-height:100px;font-size:12px;line-height:1.6;background:#ffffff0a;color:#f1e8f6;border:1px solid #ffffff26;border-radius:10px;padding:12px 16px}
.join-funnel .result-actions{justify-content:center;gap:9px;margin-top:10px}
.join-funnel .result-actions .button{min-width:0;font-size:11px;padding:10px 17px;min-height:37px}
.join-funnel #edit-application{font-size:10px;padding:6px}
.join-funnel.is-complete .orbit-area{opacity:.6}
.join-funnel :focus-visible{outline:2px solid #d5afea;outline-offset:5px}
.join-funnel .form-step input:focus,.join-funnel .form-step select:focus{outline:none;border-bottom-color:#d5afea;box-shadow:0 1px 0 #d5afea}
@media(max-width:1050px){.join-funnel{--funnel-radius:660px;--funnel-push:360px;--funnel-photo-width:410px}.join-funnel .orbit-scene{perspective:900px}}
@media(max-width:760px){
 .join-funnel{--funnel-radius:450px;--funnel-push:180px;--funnel-sway:0deg;--funnel-photo-width:min(345px,calc(100vw - 32px));min-height:780px}
 .join-funnel .section-kicker{padding:24px 0 14px;font-size:8px}.join-funnel .section-kicker span:last-child{display:none}
 .join-funnel .join-layout{padding-top:35px;min-height:calc(100svh - 62px)}
 .join-funnel h2{font-size:clamp(26px,5.6vw,38px);line-height:1.4;margin-bottom:25px;max-width:90%;padding:0}
 .join-funnel.is-writing h2{filter:none;opacity:.65;transform:translateY(-3px) scale(.98)}
 .join-funnel #join-form,.join-funnel #form-result{width:88%}
 .join-funnel .form-progress{margin-bottom:18px}.join-funnel .step-number{margin-bottom:11px}
 .join-funnel .form-step input,.join-funnel .form-step select{height:74px;font-size:31px;padding:6px 48px 15px}
 .join-funnel .form-step select{font-size:25px;padding-left:44px;padding-right:44px}
 .join-funnel .form-step #applicant-contact{font-size:22px}
 .join-funnel .form-step #applicant-contact::placeholder{font-size:17px}
 .join-funnel .form-actions #form-next{width:39px;height:39px;min-width:39px;min-height:39px;top:84px;right:0}
 .join-funnel .form-actions .form-back{font-size:10px;top:89px}.join-funnel .form-hint{font-size:10px;max-width:27em;min-height:32px}
 .funnel-directions{margin:15px 0 0;gap:6px}.funnel-directions button{font-size:9px;padding:7px 9px;gap:4px}.funnel-directions button svg{width:16px;height:16px}
 .join-funnel .orbit-area{height:345px;min-height:330px;margin-top:4px;flex-grow:1}
 .join-funnel .orbit-scene{inset:0 0 83px;perspective:650px}
 .join-funnel .orbit-card,.join-funnel .funnel-symbol{transform:rotateY(var(--angle)) translateZ(calc(-1 * var(--funnel-radius)))}
 .join-funnel .funnel-symbol{filter:none}.join-funnel .funnel-symbol svg{width:75px;height:75px;filter:none}
 .join-funnel .funnel-edge{width:10%;backdrop-filter:none}
 .join-funnel .orbit-heading{left:8%;right:8%;bottom:53px}.join-funnel .orbit-heading h3{font-size:11px}.join-funnel .orbit-heading p{display:none}
 .join-funnel .orbit-controls{bottom:12px;gap:13px}.join-funnel .orbit-controls span{font-size:7px}
 .join-funnel .single-photo .funnel-symbol{left:-90px;width:70px}.join-funnel .single-photo .funnel-symbol:last-child{right:-90px}
 .join-funnel .result-actions .button{width:auto;min-width:0;font-size:10px;padding:10px 13px}
}
@media(prefers-reduced-motion:reduce){.join-funnel h2,.join-funnel .form-actions #form-next,.funnel-directions button{transition:none}}
