/* JESH EV enhancements. Load AFTER your inline <style>:
   <link rel="stylesheet" href="assets/jesh-enhance.css"> */

/* Optional: brand colours from your brief (uncomment to apply)
:root{--primary:#65C900;--primary-glow:#A5F500;--accent:#A5F500;--dark:#050505;--darker:#000} */

html{scroll-padding-top:84px}
.hero{height:100vh;height:100svh}

/* Charging-bar scroll progress */
.charge-bar{position:fixed;top:0;left:0;height:3px;width:0;z-index:1100;
  background:linear-gradient(90deg,var(--primary),var(--primary-glow));box-shadow:0 0 12px var(--primary-glow)}

/* Nav: compact on scroll, active link */
nav{transition:padding .3s,background .3s}
nav.scrolled{padding-top:.5rem;padding-bottom:.5rem;background:rgba(5,8,6,.96)}
.nav-links a.active{color:var(--primary-glow)}
.menu-btn{display:none;width:44px;height:44px;border-radius:10px;font-size:1.2rem;cursor:pointer;
  background:none;border:1px solid var(--border);color:var(--text-main)}
a:focus-visible,button:focus-visible,select:focus-visible,input:focus-visible,textarea:focus-visible{
  outline:2px solid var(--primary-glow);outline-offset:3px}

@media(max-width:768px){
  .menu-btn{display:block}
  nav>.cta-btn{display:none}
  nav .nav-links{display:flex;position:fixed;top:68px;left:0;right:0;flex-direction:column;gap:0;
    background:rgba(5,8,6,.98);border-bottom:1px solid var(--border);
    max-height:0;overflow:hidden;visibility:hidden;transition:max-height .35s,visibility .35s}
  nav .nav-links.open{max-height:80vh;visibility:visible}
  nav .nav-links a{display:block;padding:1rem 5%;font-size:1.05rem}
}

/* Cursor spotlight on cards */
.infra-card,.facility-card,.ev-card{position:relative;overflow:hidden}
.infra-card::after,.facility-card::after,.ev-card::after{content:"";position:absolute;inset:0;pointer-events:none;
  opacity:0;transition:opacity .3s;
  background:radial-gradient(260px circle at var(--mx,50%) var(--my,50%),rgba(52,211,153,.16),transparent 70%)}
.infra-card:hover::after,.facility-card:hover::after,.ev-card:hover::after{opacity:1}

/* Lightning bolt canvas */
#bolt-canvas{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1;
  opacity:0;transition:opacity .4s ease-out}

/* Charge-time calculator */
.calc{margin-top:3rem;background:var(--card-bg);border:1px solid var(--border);border-radius:24px;padding:2.5rem}
.calc h3{font-family:'Orbitron',sans-serif;font-size:1.4rem;margin-bottom:.4rem}
.calc>p{color:var(--text-muted);margin-bottom:1.8rem}
.calc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.2rem}
.calc label{display:block;font-size:.85rem;color:var(--text-muted);margin-bottom:.4rem}
.calc select{width:100%;padding:.85rem;background:rgba(0,0,0,.35);color:#fff;border:1px solid var(--border);border-radius:10px;font-size:1rem}
.calc input[type=range]{width:100%;accent-color:var(--primary)}
.calc-out{margin-top:2rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:1rem}
.calc-out div{background:rgba(16,185,129,.08);border:1px solid var(--border);border-radius:14px;padding:1.1rem;text-align:center}
.calc-out b{display:block;font-family:'Orbitron',sans-serif;font-size:1.6rem;color:var(--primary-glow)}
.calc-out small{color:var(--text-muted)}
.calc-bat{height:14px;border-radius:8px;background:#0a120d;border:1px solid var(--border);margin-top:1.6rem;overflow:hidden}
.calc-bat i{display:block;height:100%;border-radius:8px;background:linear-gradient(90deg,var(--primary),var(--primary-glow));transition:width .4s}
.calc-note{margin-top:1rem;font-size:.8rem;color:var(--text-muted)}

/* Photosensitivity + motion preferences */
@media(prefers-reduced-motion:reduce){
  #weather-canvas,#bolt-canvas,.shock-overlay{display:none!important}
  *{scroll-behavior:auto!important;transition-duration:.01ms!important}
}

/* Sound toggle */
.sound-btn{position:fixed;left:24px;bottom:30px;z-index:1000;display:inline-flex;align-items:center;gap:8px;
  padding:.65rem 1.1rem;border-radius:50px;cursor:pointer;font-weight:600;font-size:.85rem;
  background:rgba(9,13,11,.85);backdrop-filter:blur(8px);color:var(--text-main);border:1px solid var(--border);transition:var(--transition)}
.sound-btn:hover,.sound-btn[aria-pressed=true]{border-color:var(--primary);color:var(--primary-glow)}