/* ARKA electric studio — progressive enhancement over the original site. */
:root{--accent:#c4f46b;--accent-soft:#d3ff87;--bg:#101310;--bg-2:#171c17;--panel:#1d241c;--ink:#f3f5ed;--ink-soft:#b4bdaf;--maxw:1360px;--r:12px;--sp-section:clamp(4rem,8vw,7rem)}
body{background:var(--bg)}
.bg-fx{background:radial-gradient(ellipse at 80% 10%,#26341c55,transparent 45%)}
.bg-fx::after{display:none}
.skip-link{position:fixed;left:20px;top:-70px;z-index:100;background:var(--accent);color:#101310;padding:12px 20px;border-radius:8px}
.skip-link:focus{top:12px}
:focus-visible{outline:2px solid var(--accent);outline-offset:5px}
section[id]{scroll-margin-top:100px}
.site-head{padding:18px max(5vw,20px);background:#101310e8;border-bottom:1px solid #ffffff12;backdrop-filter:blur(20px)}
.brand{gap:12px}.brand-ring{padding:0}.brand-ring::before,.brand-ring::after{display:none}.brand-lockup{height:46px;width:46px;object-fit:contain}
.brand-wordmark{font-family:var(--font-display);font-size:23px;font-weight:700;letter-spacing:.15em;line-height:1.1}.brand-wordmark small{display:block;font-size:8px;font-weight:500;letter-spacing:.38em;margin-top:5px;color:var(--ink-soft)}
.site-nav{gap:2.2rem}.site-nav a{font-size:11px;letter-spacing:.06em;text-transform:none}.site-head .btn{background:transparent;color:var(--ink);border-color:#ffffff40;border-radius:30px;padding:11px 20px;font-size:10px}
main{padding-top:83px}.hero-studio{position:relative;max-width:1600px;margin:auto;min-height:720px;display:grid;grid-template-columns:1fr 1.15fr;align-items:center;padding:80px 5vw 100px;overflow:hidden;background:transparent}
.hero-copy{position:relative;z-index:2;padding-bottom:22px;pointer-events:none}.hero-copy a{pointer-events:auto}
.eyebrow{font:500 10px var(--font-display);letter-spacing:.17em;text-transform:uppercase;display:flex;align-items:center;gap:10px;margin-bottom:30px;color:var(--ink-soft)}
.status-dot{width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 14px #c4f46770}
.hero-studio h1{font-size:clamp(48px,5.8vw,88px);font-weight:500;line-height:1.02;letter-spacing:-.055em;margin-bottom:26px;text-wrap:initial;overflow-wrap:normal;word-break:normal}
.hero-studio h1 em{font-style:normal;color:var(--accent)}
.hero-studio .lede{font-size:15px;line-height:1.8;max-width:355px;margin:0;color:#a5afa0}
.hero-studio .hero-actions{justify-content:flex-start;margin-top:30px;gap:14px}.btn{border-radius:40px;text-transform:none;letter-spacing:0;font-size:13px;font-weight:600;padding:15px 25px}.btn-lg{padding:16px 25px;font-size:13px}.btn-accent{color:#14200a}.btn .arrow{margin-left:16px;font-size:20px;line-height:1}.btn-wa{border-color:#ffffff2c}
.hero-note{display:flex;gap:12px;align-items:center;color:#87917f;font-size:10px;margin-top:28px}.hero-note span+span{border-left:1px solid #ffffff25;padding-left:12px}
.scene-wrap{position:relative;height:530px;min-width:0;isolation:isolate;background:radial-gradient(ellipse at 50% 52%,#c4f46b12,transparent 65%)}
.scene-watermark{position:absolute;top:12%;left:0;right:0;text-align:center;font-family:var(--font-display);font-size:clamp(80px,12vw,175px);letter-spacing:-.06em;font-weight:700;color:#ffffff03;-webkit-text-stroke:1px #c4f46b15;z-index:-1;pointer-events:none}
#ev-scene{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:0;transition:opacity .7s;touch-action:pan-y;cursor:grab}#ev-scene:active{cursor:grabbing}.scene-ready #ev-scene{opacity:1}
.scene-fallback{position:absolute;inset:15%;display:flex;align-items:center;justify-content:center;transition:opacity .3s}.scene-fallback img{width:100%;filter:drop-shadow(0 20px 30px #0008)}.scene-ready .scene-fallback{opacity:0;pointer-events:none}
.scene-tag{position:absolute;pointer-events:none;font:10px var(--font-display);letter-spacing:.05em;padding:12px 15px;background:#182016b8;border:1px solid #c4f46b25;backdrop-filter:blur(10px);border-radius:8px;box-shadow:0 10px 25px #0002}.scene-tag small{display:block;color:#929d88;font-size:8px;letter-spacing:.14em;margin-bottom:5px;text-transform:uppercase}.scene-tag strong{font-size:11px;font-weight:500}.tag-battery{top:17%;right:3%}.tag-motor{bottom:20%;left:1%}.tag-battery strong::before{content:'●';color:var(--accent);margin-right:7px}
.scene-controls{position:absolute;bottom:4px;left:0;right:0;display:flex;align-items:center;justify-content:center;gap:12px}.scene-controls button{border:1px solid #ffffff25;background:#171c17;color:#c4cfba;border-radius:22px;font:10px var(--font-display);padding:9px 13px;cursor:pointer}.scene-controls button:hover{border-color:var(--accent);color:var(--accent)}.scene-controls button:disabled{opacity:.4;cursor:default}.scene-hint{font:9px var(--font-display);letter-spacing:.07em;color:#8a967e}
.hero-bottom{position:absolute;bottom:28px;left:5vw;right:5vw;display:flex;justify-content:space-between;align-items:center;border-top:1px solid #ffffff15;padding-top:20px;color:#798672;font:9px var(--font-display);letter-spacing:.13em;text-transform:uppercase}.hero-bottom a{color:#b6c2ad}
.marquee-wrap{padding:23px 0;background:#c4f46b;border:0;color:#1b2810}.strip-label{color:#45602b;font-size:9px;letter-spacing:.15em;margin-bottom:14px}.marquee-track span{color:#213110;font-size:20px;letter-spacing:-.02em}.marquee-track span::after{background:#446328}.marquee-track{animation-duration:55s}
.section-head h2{max-width:650px;font-size:clamp(30px,4vw,53px);font-weight:500;letter-spacing:-.045em;line-height:1.12}.kicker{font-size:10px;color:#a0b28c;letter-spacing:.15em;margin-bottom:18px}
.section-head{margin-bottom:40px}.bento{gap:14px}.tile{min-height:215px;padding:28px;border-color:#ffffff16;background:linear-gradient(145deg,#20271e,#141a13);border-radius:12px;transform-style:preserve-3d;transition:transform .25s,border-color .25s,box-shadow .25s}.tile::before{display:none}.tile:hover{border-color:#c4f46b70;box-shadow:0 20px 40px #0004;background:linear-gradient(145deg,#273322,#171e14)}.tile h3{font-size:19px;font-weight:500;letter-spacing:-.02em;margin-bottom:10px}.tile p{font-size:13px;color:#9da996;line-height:1.8}.tile-lg{justify-content:flex-start;min-height:240px;background:radial-gradient(ellipse at 100% 100%,#6a96332b,transparent 70%),#20291b}.tile-lg h3{font-size:26px}.tile-lg p{max-width:52ch;font-size:14px}.service-symbol{font:26px var(--font-display);color:var(--accent);margin-bottom:28px;display:block}.tile .tag{position:absolute;top:25px;right:20px;color:#9da996;border-color:#ffffff30;font-size:8px}
.section.band{background:#191f16;border-color:#ffffff12}.chips li{padding:10px 18px;font-size:12px;border-color:#ffffff22}.why-grid{border:0;background:transparent;gap:20px;grid-template-columns:repeat(4,1fr)}.why-item{background:transparent;padding:24px 0;border-top:1px solid #c4f46b35}.why-item:hover{background:transparent}.why-no{color:var(--accent);font-size:12px;margin-bottom:30px}.why-item h3{font-size:18px;font-weight:500}.why-item p{font-size:13px;color:#9da996}
.faq{max-width:100%}.faq details{border:0;border-bottom:1px solid #ffffff20;background:transparent;border-radius:0;padding:24px 0}.faq details[open]{background:transparent;box-shadow:none}.faq summary{font-size:17px;font-weight:500}.faq details p{max-width:750px;color:#aab69f;line-height:1.9}.quote-panel{border-color:#c4f46b35;border-radius:18px;background:radial-gradient(ellipse at 0 0,#78974822,transparent 60%),#192017;box-shadow:none}.quote-copy h2{font-weight:500;letter-spacing:-.04em;font-size:36px}.quote-copy>p{font-size:14px}.field input,.field select,.field textarea{background-color:#10160e;border-color:#ffffff24;border-radius:7px}.field label{font-size:9px}.wa-inline{border-radius:7px;background:var(--accent);text-transform:none;letter-spacing:0;font-size:13px}.site-foot{background:#0c100b;border-color:#ffffff15}.wa-float{background:var(--accent);animation:none;font-size:10px}.foot-brand img{width:65px}.foot-brand p{font-size:13px}
/* Content remains visible when JavaScript or WebGL is unavailable. */
.reveal,.bento .tile,.why-grid .why-item{opacity:1;transform:none}.js-motion .reveal:not(.is-in){opacity:0;transform:translateY(20px)}.js-motion .bento.reveal:not(.is-in){opacity:1;transform:none}.bento.is-in .tile{transition-delay:0s}
@media(min-width:1500px){.hero-studio{padding-left:80px;padding-right:80px}}
@media(max-width:1050px){.hero-studio{min-height:620px;grid-template-columns:1fr 1fr;padding-top:55px}.hero-studio h1{font-size:58px}.scene-wrap{height:470px}.scene-tag{padding:9px}.tag-battery{right:0}.scene-hint{display:none}.hero-studio .hero-actions .btn-lg{width:auto;padding:14px 20px}.why-grid{grid-template-columns:1fr 1fr}}
@media(max-width:720px){.site-head{padding:14px 5vw}.brand-lockup{width:34px;height:34px}.brand-wordmark{font-size:19px}.brand-wordmark small{font-size:6px}.site-head .btn{font-size:9px;padding:10px 14px}main{padding-top:73px}.hero-studio{grid-template-columns:1fr;padding:42px 6vw 78px;min-height:0}.hero-copy{padding:0}.eyebrow{font-size:8px;margin-bottom:23px}.hero-studio h1{font-size:clamp(48px,10.5vw,72px);max-width:560px;margin-bottom:20px}.hero-studio .lede{font-size:13px;max-width:330px}.hero-studio .hero-actions{margin-top:22px}.hero-note{margin-top:18px;font-size:9px}.scene-wrap{height:390px;margin:0 -4vw -3px}.scene-watermark{font-size:25vw}.tag-battery{top:20%;right:3%}.tag-motor{left:3%;bottom:22%}.scene-controls{bottom:6px}.hero-bottom{font-size:7px;bottom:22px}.hero-bottom span{max-width:55%}.section{padding-left:6vw;padding-right:6vw}.section-head{margin-bottom:28px}.why-grid{gap:20px}.why-item h3{font-size:16px}.why-item p{font-size:12px}.quote-panel{padding:25px 20px}.quote-copy h2{font-size:30px}.faq summary{font-size:15px}.marquee-track span{font-size:17px}.hero-studio .hero-actions .btn-lg{font-size:11px;padding:13px 19px}.scene-tag strong{font-size:10px}}
@media(prefers-reduced-motion:reduce){.js-motion .reveal:not(.is-in){opacity:1;transform:none}.marquee-track{animation:none}.tile{transform:none!important}}
/* Interactive vehicle workshop */
.hero-studio{grid-template-columns:.9fr 1.1fr;gap:24px;padding-top:44px;padding-bottom:100px;align-items:start}.hero-copy{padding-top:85px}.vehicle-lab{height:auto;background:transparent;min-width:0}.vehicle-picker{display:flex;width:max-content;max-width:100%;margin:0 auto;padding:5px;border:1px solid #ffffff1c;background:#1b2319;border-radius:30px;gap:4px}.vehicle-picker button{border:0;background:transparent;color:#aab6a1;border-radius:24px;padding:10px 20px;font:500 12px var(--font-display);cursor:pointer}.vehicle-picker button[aria-pressed=true]{background:var(--accent);color:#17200e;box-shadow:0 4px 14px #0002}.vehicle-picker button:disabled{opacity:.4}.scene-stage{height:440px;position:relative;background:radial-gradient(ellipse at 50% 65%,#c4f46b13,transparent 66%);isolation:isolate}.scene-watermark{top:19%;font-size:clamp(70px,8.5vw,125px)}.scene-fallback{flex-direction:column;gap:20px}.scene-fallback p{font-size:12px;color:var(--ink-soft);text-align:center}.scene-controls{bottom:12px;right:10px;left:auto;gap:6px}.scene-controls button{font-size:9px;padding:8px 11px}.model-caption{position:absolute;left:12px;bottom:20px;font:9px var(--font-display);color:#94a287;letter-spacing:.13em;pointer-events:none}.part-hover{position:absolute;top:18px;left:50%;transform:translateX(-50%);padding:6px 12px;border-radius:15px;border:1px solid #c4f46b40;background:#172010e8;color:var(--accent);font-size:10px;pointer-events:none;opacity:0}.part-hover:not(:empty){opacity:1}.assembly-control{display:flex;align-items:center;gap:18px;padding:17px 0;border-block:1px solid #ffffff15}.assembly-control>button{flex-shrink:0;border:1px solid var(--accent);border-radius:24px;padding:12px 18px;font:600 11px var(--font-display);color:#17200e;background:var(--accent);cursor:pointer;min-width:150px}.assembly-control>button[aria-pressed=true]{color:var(--accent);background:transparent}.assembly-range{flex:1;min-width:0}.assembly-range label{display:flex;justify-content:space-between;font:9px var(--font-display);color:#929f87;margin-bottom:6px}.assembly-range output{color:var(--accent)}.assembly-range input{display:block;width:100%;accent-color:var(--accent);cursor:ew-resize;height:18px}.lab-hint{text-align:center;font-size:9px;color:#85947b;margin:12px 0;letter-spacing:.04em}.part-picker{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}.part-picker button{border:1px solid #ffffff24;border-radius:18px;padding:8px 12px;background:#192015;color:#b4c0a9;font:10px var(--font-display);cursor:pointer}.part-picker button:hover{border-color:#c4f46b80}.part-picker button[aria-pressed=true]{background:#c4f46b15;border-color:var(--accent);color:var(--accent)}.vehicle-lab button:disabled{opacity:.45;cursor:not-allowed}.component-info{background:linear-gradient(130deg,#26331d80,#182014);border:1px solid #c4f46b25;border-radius:12px;padding:18px 20px;min-height:180px}.component-heading{display:flex;align-items:center;gap:10px;margin-bottom:8px}.component-heading h2{font-size:17px;font-weight:500;letter-spacing:-.02em}.component-index{color:var(--accent);font:16px var(--font-display)}.component-info>p{font-size:11px;color:#a9b79d;line-height:1.7}.component-info #component-symptoms{margin-top:12px;display:grid;grid-template-columns:85px 1fr;gap:8px}.component-info #component-symptoms[hidden]{display:none}.component-info #component-symptoms span{font:8px var(--font-display);letter-spacing:.1em;color:#edbe7a;padding-top:3px}.component-info #component-symptoms p{font-size:11px;color:#d0c6b4;line-height:1.7}.component-info .concept-note{font-size:9px;color:#7e8b73;margin-top:12px;padding-top:10px;border-top:1px solid #ffffff10}.scene-ready .scene-fallback{visibility:hidden}#ev-scene{outline-offset:-3px}.vehicle-lab:has(#ev-scene:focus-visible){border-radius:10px}
@media(max-width:1100px){.hero-studio{grid-template-columns:.8fr 1.2fr;gap:12px}.hero-studio h1{font-size:49px}.hero-copy{padding-top:65px}.hero-studio .hero-actions{flex-direction:column;align-items:flex-start}.hero-studio .hero-actions .btn-lg{width:auto}.scene-stage{height:400px}.vehicle-picker button{font-size:11px;padding:9px 15px}.assembly-control{gap:10px}.assembly-control>button{padding:11px 12px;min-width:125px;font-size:10px}}
@media(max-width:720px){.hero-studio{grid-template-columns:1fr;padding-top:32px;gap:30px}.hero-copy{padding-top:0}.hero-studio h1{font-size:clamp(44px,10.5vw,72px)}.hero-studio .hero-actions{flex-direction:row;gap:9px}.hero-studio .hero-actions .btn-lg{padding:13px 16px;font-size:10px}.vehicle-lab{margin:0;height:auto}.scene-stage{height:350px;margin:0 -4vw}.scene-watermark{font-size:19vw}.model-caption{font-size:8px;left:15px}.scene-controls{right:13px}.scene-controls button{font-size:8px}.vehicle-picker{width:100%;justify-content:center}.vehicle-picker button{flex:1;padding:10px 8px;font-size:11px}.assembly-control{gap:12px}.assembly-control>button{font-size:10px;min-width:128px}.assembly-range label{font-size:8px}.component-info{padding:15px;min-height:170px}.part-picker{gap:6px}.part-picker button{font-size:9px;padding:9px 10px}.component-heading h2{font-size:16px}.component-info #component-symptoms{grid-template-columns:1fr;gap:3px}.lab-hint{font-size:8px}.hero-bottom{bottom:25px}}