:root{
  --bg:#0a0a0a;
  --bg-2:#111111;
  --bg-3:#1a1a1a;
  --ink:#f5f3ee;
  --ink-2:#a8a39a;
  --ink-3:#6b6760;
  --green:#4ade80;
  --green-deep:#16a34a;
  --green-glow:rgba(74,222,128,.18);
  --orange:#ff7a1a;
  --orange-deep:#e0590a;
  --line:rgba(245,243,238,.08);
  --line-2:rgba(245,243,238,.14);
  --display:'Bricolage Grotesque', system-ui, sans-serif;
  --serif:'Instrument Serif', Georgia, serif;
  --mono:'JetBrains Mono', ui-monospace, monospace;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:var(--display);
  background:var(--bg);
  color:var(--ink);
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}

/* ============ NAV ============ */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  padding:18px 40px;
  display:flex;align-items:center;justify-content:space-between;
  backdrop-filter:blur(16px);
  background:rgba(10,10,10,.55);
  border-bottom:1px solid var(--line);
  transition:padding .3s ease;
}
.nav.scrolled{padding:12px 40px;background:rgba(10,10,10,.85)}
.logo{
  display:flex;align-items:center;gap:10px;
  height:44px;
}
.logo svg{height:36px;width:auto}
.logo-text{
  font-family:var(--display);
  font-weight:700;font-size:20px;letter-spacing:.06em;
  color:var(--ink);
}
.nav-links{display:flex;gap:4px;align-items:center}
.nav-link{
  font-size:13px;color:var(--ink-2);transition:color .2s;font-weight:500;
  padding:8px 12px;border-radius:8px;
  display:flex;align-items:center;gap:4px;
}
.nav-link:hover{color:var(--ink);background:rgba(255,255,255,.04)}
.dd-arrow{font-size:10px;opacity:.5}
.nav-dropdown{position:relative}
.dropdown-panel{
  display:none;
  position:absolute;top:100%;left:0;
  min-width:220px;
  background:rgba(20,20,20,.97);
  backdrop-filter:blur(20px);
  border:1px solid var(--line-2);
  border-radius:14px;
  padding:12px;
  margin-top:8px;
  box-shadow:0 20px 40px rgba(0,0,0,.5);
  z-index:200;
}
.nav-dropdown:hover .dropdown-panel{display:block}
.dropdown-panel a{
  display:block;padding:8px 12px;
  font-size:13px;color:var(--ink-2);
  border-radius:8px;transition:all .15s;
}
.dropdown-panel a:hover{color:var(--ink);background:rgba(255,255,255,.06)}
.dd-label{
  font-family:var(--mono);font-size:10px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink-3);
  padding:4px 12px;display:block;margin-top:8px;
}
.dd-label:first-child{margin-top:0}
.dd-cta{
  margin-top:8px;padding-top:10px!important;
  border-top:1px solid var(--line);
  color:var(--green)!important;font-weight:500;
}
.nav-right{display:flex;align-items:center;gap:14px}
.nav-phone{
  font-family:var(--mono);font-size:12px;color:var(--ink-3);
  letter-spacing:.02em;transition:color .2s;
}
.nav-phone:hover{color:var(--green)}
.nav-cta{
  background:var(--green);
  color:#0a0a0a;
  padding:10px 16px;
  border-radius:999px;
  font-weight:600;font-size:13px;
  display:flex;align-items:center;gap:6px;
  transition:transform .2s, box-shadow .2s;
  white-space:nowrap;
}
.nav-cta:hover{transform:translateY(-1px);box-shadow:0 8px 24px var(--green-glow)}

/* Hamburger */
.hamburger{
  display:none;
  width:40px;height:40px;
  flex-direction:column;justify-content:center;gap:5px;
  align-items:center;
  background:rgba(255,255,255,.06);
  border:1px solid var(--line-2);
  border-radius:10px;
}
.hamburger span{width:18px;height:2px;background:var(--ink);border-radius:2px;transition:all .3s}

/* Mobile bottom sticky bar */
.mobile-bar{
  display:none;
  position:fixed;bottom:0;left:0;right:0;z-index:95;
  padding:10px 16px;
  background:rgba(10,10,10,.95);
  backdrop-filter:blur(16px);
  border-top:1px solid var(--line);
  gap:10px;
}
.mobile-bar a{
  flex:1;
  padding:14px;
  border-radius:12px;
  font-weight:600;font-size:14px;
  text-align:center;
  display:flex;align-items:center;justify-content:center;gap:8px;
}
.mobile-bar .mb-wa{background:var(--green);color:#0a0a0a}
.mobile-bar .mb-call{background:rgba(255,255,255,.08);color:var(--ink);border:1px solid var(--line-2)}

/* ============ HERO ============ */
.hero{
  min-height:100vh;
  position:relative;
  padding:120px 40px 80px;
  display:flex;align-items:center;
  overflow:hidden;
  background:#0a0a0a;
}
.hero-bg{
  position:absolute;inset:0;z-index:0;
  background:
    radial-gradient(ellipse 90% 70% at 75% 35%, rgba(74,222,128,.10), transparent 55%),
    radial-gradient(ellipse 70% 50% at 15% 85%, rgba(255,122,26,.05), transparent 60%),
    linear-gradient(180deg,#0c0c0c 0%,#0a0a0a 60%,#080808 100%);
}
.hero-vignette{
  position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(ellipse 100% 100% at 50% 50%, transparent 50%, rgba(0,0,0,.5) 100%);
}
.hero-inner{
  position:relative;z-index:2;
  width:100%;max-width:1400px;margin:0 auto;
  display:grid;grid-template-columns:1.1fr .9fr;gap:60px;align-items:center;
}
.hero-eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  padding:8px 14px;
  border:1px solid var(--line-2);
  border-radius:999px;
  font-family:var(--mono);font-size:11px;
  letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-2);
  margin-bottom:28px;
  animation:fadeUp .8s ease both;
}
.dot{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 12px var(--green)}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.4}}
.dot{animation:pulse 2s ease-in-out infinite}

.hero h1{
  font-family:var(--display);
  font-size:clamp(48px,7vw,104px);
  font-weight:300;
  line-height:.95;letter-spacing:-.04em;
  margin-bottom:24px;
}
.hero h1 .accent{
  font-family:var(--serif);
  font-style:italic;
  font-weight:400;
  background:linear-gradient(120deg,var(--green) 0%,#86efac 50%,var(--green) 100%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
}
.hero h1 .strike{position:relative;display:inline-block}
.hero h1 .strike::after{
  content:'';position:absolute;left:-4%;right:-4%;top:55%;
  height:6px;background:var(--orange);
  transform:rotate(-3deg);
  box-shadow:0 0 20px var(--orange);
}
.hero-line{
  display:block;
  animation:fadeUp .9s ease both;
}
.hero-line:nth-child(2){animation-delay:.1s}
.hero-line:nth-child(3){animation-delay:.2s}
.hero-line:nth-child(4){animation-delay:.3s}

@keyframes fadeUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}

.hero-sub{
  font-size:18px;line-height:1.55;
  color:var(--ink-2);
  max-width:560px;
  margin-bottom:40px;
  animation:fadeUp 1s .4s ease both;
}
.hero-sub strong{color:var(--ink);font-weight:600}

.hero-ctas{
  display:flex;gap:14px;flex-wrap:wrap;
  margin-bottom:48px;
  animation:fadeUp 1s .5s ease both;
}
.btn{
  padding:16px 26px;
  border-radius:999px;
  font-weight:600;font-size:15px;
  display:inline-flex;align-items:center;gap:10px;
  transition:all .25s ease;
  white-space:nowrap;
}
.btn-primary{
  background:var(--green);color:#0a0a0a;
  box-shadow:0 0 0 0 var(--green-glow);
}
.btn-primary:hover{
  transform:translateY(-2px);
  box-shadow:0 12px 32px var(--green-glow), 0 0 0 1px var(--green);
}
.btn-secondary{
  background:rgba(255,255,255,.06);
  color:var(--ink);
  border:1px solid var(--line-2);
  backdrop-filter:blur(8px);
}
.btn-secondary:hover{background:rgba(255,255,255,.1);transform:translateY(-2px)}

.hero-stats{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:32px;max-width:560px;
  padding-top:36px;
  border-top:1px solid var(--line);
  animation:fadeUp 1s .6s ease both;
}
.stat-num{
  font-family:var(--display);
  font-size:36px;font-weight:600;letter-spacing:-.03em;
  color:var(--ink);
  display:flex;align-items:baseline;gap:2px;
}
.stat-num .unit{font-size:18px;color:var(--green);font-weight:500;margin-left:2px}
.stat-num .currency{font-family:var(--serif);font-style:italic;font-weight:400;color:var(--ink-2);font-size:24px}
.stat-label{font-size:12px;color:var(--ink-3);margin-top:4px;letter-spacing:.05em;text-transform:uppercase;font-family:var(--mono)}

/* hero visual side */
.hero-visual{
  position:relative;
  aspect-ratio:1/1.05;
  animation:fadeUp 1.2s .3s ease both;
}
.scooter-stage{
  position:absolute;inset:0;
  display:grid;place-items:center;
  padding:5%;
}
.scooter-stage::before{
  content:'';position:absolute;
  inset:8% 8% 8% 8%;
  background:radial-gradient(ellipse 60% 50% at 50% 60%, rgba(74,222,128,.25), transparent 70%);
  filter:blur(40px);
  z-index:1;
}
.scooter-glow{
  position:absolute;inset:10% 5% 5% 5%;
  background:radial-gradient(ellipse 50% 40% at 50% 60%, rgba(74,222,128,.12), transparent 70%);
  filter:blur(60px);
}
.scooter-img{
  position:relative;z-index:2;
  width:100%;
  height:auto;
  object-fit:contain;
  border-radius:24px;
  animation:float 7s ease-in-out infinite;
}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}

.price-tag{
  position:absolute;
  top:8%;right:-2%;
  z-index:3;
  background:rgba(10,10,10,.85);
  backdrop-filter:blur(12px);
  border:1px solid var(--green);
  border-radius:14px;
  padding:14px 18px;
  box-shadow:0 20px 40px rgba(0,0,0,.5), 0 0 30px var(--green-glow);
  animation:fadeUp 1s .8s ease both;
}
.price-tag .label{
  font-family:var(--mono);font-size:10px;letter-spacing:.15em;
  text-transform:uppercase;color:var(--ink-3);margin-bottom:4px;
}
.price-tag .value{
  font-family:var(--display);font-size:28px;font-weight:600;
  letter-spacing:-.02em;
  display:flex;align-items:baseline;gap:2px;
}
.price-tag .value .rs{font-family:var(--serif);font-style:italic;font-weight:400;color:var(--green);font-size:22px}

.no-tag{
  position:absolute;
  bottom:14%;left:-3%;
  z-index:3;
  background:rgba(255,122,26,.18);
  border:1px solid rgba(255,122,26,.45);
  backdrop-filter:blur(12px);
  border-radius:14px;
  padding:12px 16px;
  animation:fadeUp 1s 1s ease both;
}
.no-tag .x{
  font-size:18px;color:var(--orange);margin-right:6px;
}
.no-tag span{font-size:13px;font-weight:600;color:var(--orange)}

.scroll-cue{
  position:absolute;bottom:30px;left:50%;transform:translateX(-50%);
  z-index:3;
  font-family:var(--mono);font-size:10px;letter-spacing:.2em;
  color:var(--ink-3);text-transform:uppercase;
  display:flex;flex-direction:column;align-items:center;gap:8px;
}
.scroll-cue::after{
  content:'';width:1px;height:32px;background:linear-gradient(to bottom,var(--ink-3),transparent);
  animation:scrollLine 2s ease-in-out infinite;
}
@keyframes scrollLine{0%{height:0;opacity:0}50%{height:32px;opacity:1}100%{height:0;opacity:0;transform:translateY(32px)}}

/* ============ MARQUEE TRUST BAR ============ */
.marquee{
  background:var(--bg-2);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  padding:24px 0;
  overflow:hidden;
  position:relative;
}
.marquee-track{
  display:flex;gap:64px;
  animation:scroll 30s linear infinite;
  white-space:nowrap;
}
@keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.marquee-item{
  display:inline-flex;align-items:center;gap:14px;
  font-family:var(--display);
  font-size:24px;font-weight:400;
  color:var(--ink-2);
}
.marquee-item .num{color:var(--green);font-weight:600}
.marquee-item .star{color:var(--orange);font-size:18px}

/* ============ SECTION SCAFFOLDING ============ */
.section{padding:140px 40px;position:relative}
.container{max-width:1400px;margin:0 auto}

.section-eyebrow{
  font-family:var(--mono);font-size:11px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--green);
  display:inline-flex;align-items:center;gap:10px;
  margin-bottom:24px;
}
.section-eyebrow::before{
  content:'';width:24px;height:1px;background:var(--green);
}
.section-heading{
  font-family:var(--display);
  font-size:clamp(40px,5vw,72px);
  font-weight:300;letter-spacing:-.03em;line-height:1;
  margin-bottom:24px;max-width:900px;
}
.section-heading .it{font-family:var(--serif);font-style:italic;font-weight:400}
.section-heading .grad{
  background:linear-gradient(120deg,var(--green) 0%,#86efac 100%);
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
}
.section-sub{
  font-size:17px;line-height:1.6;color:var(--ink-2);
  max-width:640px;margin-bottom:60px;
}

/* ============ WHY BONJO — 6 PILLARS ============ */
.why{background:var(--bg-2)}
.pillars{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:1px;background:var(--line);
  border:1px solid var(--line);
  border-radius:24px;overflow:hidden;
}
.pillar{
  background:var(--bg-2);
  padding:40px 32px;
  position:relative;
  transition:background .3s ease;
  cursor:default;
  min-height:280px;
  display:flex;flex-direction:column;
}
.pillar:hover{background:var(--bg-3)}
.pillar-num{
  font-family:var(--mono);font-size:11px;
  color:var(--ink-3);letter-spacing:.15em;
  margin-bottom:24px;
}
.pillar-icon{
  width:48px;height:48px;
  border-radius:12px;
  background:linear-gradient(135deg,var(--green-glow),transparent);
  border:1px solid rgba(74,222,128,.3);
  display:grid;place-items:center;
  margin-bottom:24px;
  font-size:24px;
}
.pillar h3{
  font-family:var(--display);
  font-size:24px;font-weight:500;
  letter-spacing:-.02em;line-height:1.15;
  margin-bottom:12px;
}
.pillar p{
  font-size:14.5px;line-height:1.6;color:var(--ink-2);
  flex:1;
}
.pillar-tags{
  display:flex;gap:6px;flex-wrap:wrap;
  margin-top:20px;
}
.pillar-tag{
  font-family:var(--mono);font-size:10px;
  padding:4px 8px;
  background:rgba(74,222,128,.08);
  border:1px solid rgba(74,222,128,.2);
  border-radius:999px;
  color:var(--green);
  letter-spacing:.05em;
}

/* ============ ROI / CALCULATOR ============ */
.roi{
  background:linear-gradient(180deg,var(--bg) 0%,var(--bg-2) 100%);
  position:relative;overflow:hidden;
}
.roi::before{
  content:'₹';
  position:absolute;
  font-family:var(--serif);font-style:italic;
  font-size:600px;
  color:rgba(74,222,128,.04);
  top:-100px;right:-50px;
  pointer-events:none;
  font-weight:400;
}
.calc{
  display:grid;grid-template-columns:1fr 1.2fr;
  gap:60px;align-items:start;
  position:relative;z-index:2;
}
.calc-controls{
  background:var(--bg-3);
  border:1px solid var(--line);
  border-radius:20px;
  padding:36px;
}
.control-row{margin-bottom:32px}
.control-row:last-child{margin-bottom:0}
.control-label{
  display:flex;justify-content:space-between;align-items:baseline;
  margin-bottom:14px;
}
.control-label span:first-child{
  font-family:var(--mono);font-size:11px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink-2);
}
.control-label .val{
  font-family:var(--display);font-size:28px;font-weight:600;
  color:var(--green);letter-spacing:-.02em;
}
.control-label .val .u{font-size:14px;color:var(--ink-3);font-weight:400;margin-left:4px}

.slider{
  -webkit-appearance:none;appearance:none;
  width:100%;height:4px;
  background:var(--line-2);
  border-radius:999px;
  outline:none;
}
.slider::-webkit-slider-thumb{
  -webkit-appearance:none;appearance:none;
  width:24px;height:24px;border-radius:50%;
  background:var(--green);
  cursor:pointer;
  box-shadow:0 0 0 6px rgba(74,222,128,.15), 0 4px 12px rgba(0,0,0,.4);
  transition:transform .15s;
}
.slider::-webkit-slider-thumb:hover{transform:scale(1.15)}
.slider::-moz-range-thumb{
  width:24px;height:24px;border-radius:50%;
  background:var(--green);cursor:pointer;border:none;
  box-shadow:0 0 0 6px rgba(74,222,128,.15);
}

.toggle-group{display:flex;gap:8px;margin-top:8px}
.toggle{
  flex:1;
  padding:12px;
  border:1px solid var(--line-2);
  border-radius:12px;
  font-size:13px;font-weight:500;
  color:var(--ink-2);
  transition:all .2s;
}
.toggle.active{
  background:var(--green);
  color:#0a0a0a;
  border-color:var(--green);
  font-weight:600;
}

.calc-output{position:relative}
.compare-row{
  display:grid;grid-template-columns:1fr auto;
  align-items:center;gap:20px;
  padding:20px 24px;
  border:1px solid var(--line);
  border-radius:14px;
  margin-bottom:10px;
  background:var(--bg-3);
  transition:all .3s;
}
.compare-row.win{
  border-color:rgba(74,222,128,.4);
  background:linear-gradient(90deg,rgba(74,222,128,.08),transparent);
}
.compare-row .name{
  font-family:var(--display);font-size:15px;font-weight:500;
  color:var(--ink);
}
.compare-row .name small{display:block;font-size:11px;color:var(--ink-3);font-weight:400;margin-top:2px;font-family:var(--mono);letter-spacing:.05em}
.compare-row .cost{
  font-family:var(--display);font-size:22px;font-weight:600;
  letter-spacing:-.02em;
  color:var(--ink);
}
.compare-row.win .cost{color:var(--green)}
.compare-row.lose .cost{color:var(--orange)}
.bar-track{
  position:absolute;left:0;bottom:0;height:3px;
  background:currentColor;border-radius:0 0 14px 14px;
  opacity:.3;
}

.savings-card{
  margin-top:32px;
  padding:32px;
  background:linear-gradient(135deg,rgba(74,222,128,.12),rgba(74,222,128,.03));
  border:1px solid rgba(74,222,128,.3);
  border-radius:20px;
  position:relative;overflow:hidden;
}
.savings-card::before{
  content:'';position:absolute;top:-50%;right:-20%;width:300px;height:300px;
  background:radial-gradient(circle,var(--green-glow),transparent 70%);
  filter:blur(40px);
}
.savings-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:24px;
  position:relative;z-index:2;
}
.save-stat .label{
  font-family:var(--mono);font-size:10px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--ink-2);margin-bottom:8px;
}
.save-stat .num{
  font-family:var(--display);font-size:32px;font-weight:600;
  letter-spacing:-.03em;color:var(--green);
  display:flex;align-items:baseline;gap:2px;
}
.save-stat .num .rs{font-family:var(--serif);font-style:italic;font-weight:400;font-size:22px;color:var(--green-deep)}
.save-tag{
  margin-top:24px;
  font-family:var(--serif);font-style:italic;font-size:18px;
  color:var(--ink-2);position:relative;z-index:2;
  line-height:1.5;
}
.save-tag::before{content:'"';color:var(--green);font-size:32px;line-height:0;margin-right:4px}

/* ============ RANGE — 8 MODELS ============ */
.range{background:var(--bg)}
.tier-tabs{
  display:inline-flex;gap:4px;
  padding:4px;
  background:var(--bg-3);
  border:1px solid var(--line);
  border-radius:999px;
  margin-bottom:48px;
}
.tier-tab{
  padding:10px 20px;
  border-radius:999px;
  font-size:13px;font-weight:500;
  color:var(--ink-2);
  transition:all .25s;
}
.tier-tab.active{
  background:var(--ink);color:var(--bg);font-weight:600;
}

.models{
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:20px;
}
.model-card{
  background:var(--bg-2);
  border:1px solid var(--line);
  border-radius:20px;
  padding:24px;
  position:relative;
  transition:all .35s ease;
  cursor:pointer;
  overflow:hidden;
}
.model-card::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 60%,rgba(74,222,128,.06) 100%);
  opacity:0;transition:opacity .35s;
  pointer-events:none;
}
.model-card:hover{
  border-color:rgba(74,222,128,.3);
  transform:translateY(-4px);
}
.model-card:hover::before{opacity:1}

.model-card.flagship{
  background:linear-gradient(180deg,var(--bg-2) 0%,#0d1410 100%);
  border-color:rgba(74,222,128,.25);
}
.model-card.flagship::after{
  content:'FLAGSHIP';
  position:absolute;top:20px;right:20px;
  font-family:var(--mono);font-size:9px;letter-spacing:.2em;
  padding:4px 8px;background:var(--green);color:#0a0a0a;
  border-radius:4px;font-weight:700;
}

.model-img{
  aspect-ratio:1.2/1;
  border-radius:14px;
  margin-bottom:20px;
  background:#0a0a0a;
  position:relative;
  display:grid;place-items:center;
  overflow:hidden;
  border:1px solid var(--line);
}
.model-img::after{
  content:'';position:absolute;inset:auto 0 0 0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(74,222,128,.25),transparent);
  z-index:3;
}
.model-photo{
  width:100%;
  height:100%;
  object-fit:cover;
  position:relative;z-index:2;
  transition:transform .6s ease;
}
.model-card:hover .model-photo{transform:scale(1.05)}
.model-tier{
  position:absolute;top:12px;left:12px;
  font-family:var(--mono);font-size:9px;letter-spacing:.15em;
  padding:4px 8px;
  background:rgba(255,255,255,.06);backdrop-filter:blur(8px);
  border:1px solid var(--line-2);
  border-radius:4px;
  color:var(--ink-2);text-transform:uppercase;
}

.model-name{
  font-family:var(--display);
  font-size:24px;font-weight:500;
  letter-spacing:-.02em;margin-bottom:4px;
}
.model-tagline{
  font-family:var(--serif);font-style:italic;
  font-size:14px;color:var(--ink-2);
  margin-bottom:16px;
}
.model-price{
  font-family:var(--display);
  font-size:22px;font-weight:600;letter-spacing:-.02em;
  color:var(--green);
  margin-bottom:16px;
  display:flex;align-items:baseline;gap:2px;
}
.model-price .rs{font-family:var(--serif);font-style:italic;font-weight:400;font-size:18px}
.model-price small{font-size:12px;color:var(--ink-3);margin-left:6px;font-weight:400}

.model-specs{
  display:flex;gap:14px;flex-wrap:wrap;
  padding-top:16px;border-top:1px solid var(--line);
}
.spec{
  font-size:11px;color:var(--ink-2);
  font-family:var(--mono);letter-spacing:.05em;
  display:flex;align-items:center;gap:4px;
}
.spec strong{color:var(--ink);font-weight:600}

/* ============ HOW IT WORKS ============ */
.how{background:var(--bg-2);position:relative}
.steps{
  display:grid;grid-template-columns:repeat(4,1fr);
  gap:24px;
  position:relative;
}
.steps::before{
  content:'';position:absolute;top:36px;left:5%;right:5%;height:1px;
  background:repeating-linear-gradient(90deg,var(--line-2) 0 6px,transparent 6px 14px);
  z-index:1;
}
.step{
  position:relative;z-index:2;
  text-align:left;
}
.step-num{
  width:72px;height:72px;
  border-radius:50%;
  background:var(--bg-2);
  border:1px solid var(--line-2);
  display:grid;place-items:center;
  font-family:var(--display);
  font-size:28px;font-weight:300;
  color:var(--green);
  margin-bottom:24px;
  position:relative;
}
.step-num::after{
  content:'';position:absolute;inset:-4px;
  border-radius:50%;border:1px solid rgba(74,222,128,.2);
}
.step.whatsapp .step-num{
  background:var(--green);color:#0a0a0a;font-weight:600;
  border-color:var(--green);
  box-shadow:0 0 24px var(--green-glow);
}
.step h4{
  font-family:var(--display);
  font-size:20px;font-weight:500;
  letter-spacing:-.02em;
  margin-bottom:8px;
}
.step p{
  font-size:14px;line-height:1.55;color:var(--ink-2);
}
.step-badge{
  display:inline-block;
  margin-top:10px;
  font-family:var(--mono);font-size:9px;letter-spacing:.15em;
  padding:3px 8px;
  background:rgba(74,222,128,.12);
  color:var(--green);
  border-radius:4px;
}

/* ============ COMPARISON ============ */
.compare{background:var(--bg)}
.table-wrap{
  border:1px solid var(--line);
  border-radius:24px;
  overflow:hidden;
  background:var(--bg-2);
}
.compare-table{
  width:100%;
  border-collapse:collapse;
}
.compare-table th{
  padding:24px;
  text-align:left;
  font-family:var(--mono);font-size:11px;letter-spacing:.15em;
  text-transform:uppercase;color:var(--ink-2);
  font-weight:500;
  border-bottom:1px solid var(--line);
  background:var(--bg-3);
}
.compare-table th.bonjo-col{
  background:linear-gradient(180deg,rgba(74,222,128,.15),rgba(74,222,128,.05));
  color:var(--green);
}
.compare-table td{
  padding:20px 24px;
  border-bottom:1px solid var(--line);
  font-size:15px;
  color:var(--ink);
}
.compare-table td:first-child{
  font-weight:500;color:var(--ink-2);
  font-size:14px;
}
.compare-table tr:last-child td{border-bottom:none}
.compare-table .bonjo{
  background:rgba(74,222,128,.04);
  color:var(--green);font-weight:600;
}
.check{color:var(--green);font-weight:700}
.x{color:var(--orange);font-weight:700}

.compare-foot{
  text-align:center;
  margin-top:32px;
  font-family:var(--serif);font-style:italic;
  font-size:24px;color:var(--ink-2);
}
.compare-foot strong{color:var(--ink);font-style:normal;font-family:var(--display);font-weight:500}

/* ============ COVERAGE ============ */
.coverage{
  background:linear-gradient(180deg,var(--bg) 0%,var(--bg-2) 100%);
  position:relative;
}
.coverage-grid{
  display:grid;grid-template-columns:.9fr 1.1fr;
  gap:60px;align-items:center;
}
.map-frame{
  position:relative;
  border:1px solid var(--line);
  border-radius:24px;
  overflow:hidden;
  background:#0a0a0a;
}
.india-map-img{
  width:100%;
  height:auto;
  display:block;
  opacity:.9;
  transition:opacity .4s;
}
.map-frame:hover .india-map-img{opacity:1}

.states-list{
  display:grid;grid-template-columns:repeat(3,1fr);gap:8px;
  margin:32px 0;
}
.state-pill{
  font-size:12px;
  padding:10px 14px;
  background:var(--bg-3);
  border:1px solid var(--line);
  border-radius:999px;
  color:var(--ink-2);
  display:flex;align-items:center;gap:6px;
  font-family:var(--mono);
  letter-spacing:.02em;
}
.state-pill::before{
  content:'';width:5px;height:5px;border-radius:50%;background:var(--green);
}

/* ============ TESTIMONIALS ============ */
.testimonials{background:var(--bg-2)}
.t-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:24px;
}
.t-card{
  background:var(--bg);
  border:1px solid var(--line);
  border-radius:20px;
  padding:32px;
  position:relative;
}
.t-card::before{
  content:'"';
  position:absolute;top:16px;right:24px;
  font-family:var(--serif);font-style:italic;
  font-size:80px;line-height:1;
  color:var(--green);opacity:.3;
}
.stars{display:flex;gap:2px;margin-bottom:20px;color:var(--orange)}
.t-quote{
  font-family:var(--serif);
  font-size:20px;line-height:1.45;font-style:italic;
  color:var(--ink);
  margin-bottom:24px;
}
.t-author{
  display:flex;align-items:center;gap:14px;
  padding-top:24px;border-top:1px solid var(--line);
}
.t-avatar{
  width:48px;height:48px;border-radius:50%;
  background:linear-gradient(135deg,var(--green),var(--green-deep));
  display:grid;place-items:center;
  font-family:var(--display);font-weight:600;color:#0a0a0a;
  font-size:18px;
}
.t-meta .n{font-weight:600;font-size:14px;letter-spacing:-.01em}
.t-meta .c{font-size:12px;color:var(--ink-3);font-family:var(--mono);margin-top:2px}

.t-foot{
  margin-top:48px;text-align:center;
  font-family:var(--serif);font-style:italic;
  font-size:22px;color:var(--ink-2);
}
.t-foot strong{font-style:normal;font-family:var(--display);color:var(--green);font-weight:500}

/* ============ FAQ ============ */
.faq{background:var(--bg)}
.faq-grid{
  max-width:900px;margin:0 auto;
}
.faq-item{
  border-top:1px solid var(--line);
  padding:24px 0;
  cursor:pointer;
}
.faq-item:last-child{border-bottom:1px solid var(--line)}
.faq-q{
  display:flex;justify-content:space-between;align-items:center;gap:24px;
  font-family:var(--display);
  font-size:20px;font-weight:500;letter-spacing:-.01em;
}
.faq-toggle{
  width:32px;height:32px;flex-shrink:0;
  border-radius:50%;
  border:1px solid var(--line-2);
  display:grid;place-items:center;
  font-size:18px;color:var(--ink-2);
  transition:all .25s;
}
.faq-item.open .faq-toggle{
  background:var(--green);color:#0a0a0a;border-color:var(--green);transform:rotate(45deg);
}
.faq-a{
  max-height:0;overflow:hidden;
  transition:max-height .35s ease, margin .35s ease;
  font-size:16px;line-height:1.6;color:var(--ink-2);
}
.faq-item.open .faq-a{max-height:200px;margin-top:14px}

/* ============ FINAL CTA ============ */
.final{
  background:var(--bg);
  position:relative;overflow:hidden;
}
.final::before{
  content:'';position:absolute;inset:0;
  background:
    radial-gradient(ellipse 70% 60% at 50% 40%, var(--green-glow), transparent 70%),
    radial-gradient(ellipse 40% 30% at 80% 70%, rgba(255,122,26,.1), transparent 70%);
}
.final-inner{
  position:relative;z-index:2;
  text-align:center;
  max-width:900px;margin:0 auto;
}
.final h2{
  font-family:var(--display);
  font-size:clamp(48px,6vw,88px);
  font-weight:300;letter-spacing:-.04em;line-height:1;
  margin-bottom:24px;
}
.final h2 .it{font-family:var(--serif);font-style:italic;font-weight:400}
.final p{
  font-size:19px;line-height:1.55;color:var(--ink-2);
  max-width:600px;margin:0 auto 40px;
}
.final-ctas{
  display:flex;gap:14px;justify-content:center;flex-wrap:wrap;
  margin-bottom:32px;
}
.btn-call{
  background:transparent;
  color:var(--ink);
  border:1px solid var(--line-2);
  font-family:var(--mono);
  letter-spacing:.05em;
  font-size:14px;
}
.btn-call:hover{border-color:var(--green);color:var(--green)}
.final-trust{
  font-family:var(--serif);font-style:italic;
  font-size:16px;color:var(--ink-3);
}

/* ============ FOOTER ============ */
footer{
  background:var(--bg-2);
  border-top:1px solid var(--line);
  padding:80px 40px 40px;
}
.foot-grid{
  max-width:1400px;margin:0 auto;
  display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr 1.2fr;
  gap:40px;
  padding-bottom:48px;
  border-bottom:1px solid var(--line);
}
.foot-brand .logo{margin-bottom:12px}
.foot-tag{
  font-family:var(--serif);font-style:italic;
  font-size:18px;color:var(--ink-2);
  max-width:280px;line-height:1.4;
}
.foot-col h5{
  font-family:var(--mono);font-size:10px;letter-spacing:.15em;
  text-transform:uppercase;color:var(--ink-3);
  margin-bottom:16px;font-weight:500;
}
.foot-col a{
  display:block;font-size:13px;color:var(--ink-2);
  margin-bottom:8px;transition:color .2s;
}
.foot-col a:hover{color:var(--green)}

.trust-strip{
  max-width:1400px;margin:0 auto;
  display:flex;flex-wrap:wrap;gap:24px;
  justify-content:center;
  padding:32px 0;
  border-bottom:1px solid var(--line);
}
.trust-item{
  font-family:var(--mono);font-size:11px;letter-spacing:.08em;
  color:var(--ink-3);
  display:flex;align-items:center;gap:6px;
}
.trust-item::before{
  content:'✓';color:var(--green);font-size:12px;font-weight:700;
}

.foot-bottom{
  max-width:1400px;margin:0 auto;
  padding-top:24px;
  display:flex;justify-content:space-between;align-items:center;
  font-family:var(--mono);font-size:11px;color:var(--ink-3);
  flex-wrap:wrap;gap:16px;
}
.foot-legal{display:flex;gap:20px}
.foot-legal a{color:var(--ink-3);transition:color .2s}
.foot-legal a:hover{color:var(--ink-2)}

/* ============ STICKY WHATSAPP ============ */
.sticky-wa{
  position:fixed;bottom:24px;right:24px;z-index:90;
  display:flex;flex-direction:column;gap:10px;align-items:flex-end;
}
.wa-bubble{
  background:var(--bg-2);
  border:1px solid var(--line-2);
  padding:10px 14px;
  border-radius:12px;
  font-size:12px;color:var(--ink);
  font-family:var(--display);
  box-shadow:0 8px 24px rgba(0,0,0,.4);
  animation:fadeUp .6s ease;
}
.wa-btn{
  width:60px;height:60px;border-radius:50%;
  background:#25D366;
  display:grid;place-items:center;
  box-shadow:0 8px 24px rgba(37,211,102,.4), 0 0 0 0 rgba(37,211,102,.4);
  animation:waPulse 2.5s infinite;
  transition:transform .2s;
}
.wa-btn:hover{transform:scale(1.08)}
@keyframes waPulse{
  0%{box-shadow:0 8px 24px rgba(37,211,102,.4), 0 0 0 0 rgba(37,211,102,.5)}
  70%{box-shadow:0 8px 24px rgba(37,211,102,.4), 0 0 0 18px rgba(37,211,102,0)}
  100%{box-shadow:0 8px 24px rgba(37,211,102,.4), 0 0 0 0 rgba(37,211,102,0)}
}

/* ============ RESPONSIVE ============ */
@media(max-width:1024px){
  .hero-inner,.calc,.coverage-grid{grid-template-columns:1fr;gap:40px}
  .pillars{grid-template-columns:repeat(2,1fr)}
  .models{grid-template-columns:repeat(2,1fr)}
  .steps{grid-template-columns:repeat(2,1fr)}
  .steps::before{display:none}
  .t-grid{grid-template-columns:1fr}
  .foot-grid{grid-template-columns:1fr 1fr;gap:40px}
  .nav-phone{display:none}
}
@media(max-width:640px){
  .nav{padding:14px 20px}
  .nav-links,.nav-right{display:none}
  .hamburger{display:flex}
  .mobile-bar{display:flex}
  body{padding-bottom:70px}
  .hero{padding:100px 20px 60px}
  .section{padding:80px 20px}
  .pillars{grid-template-columns:1fr}
  .models{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr}
  .savings-grid{grid-template-columns:1fr;gap:18px}
  .hero-stats{grid-template-columns:repeat(3,1fr);gap:16px}
  .stat-num{font-size:24px}
  .compare-table th,.compare-table td{padding:14px}
  .compare-table th{font-size:9px}
  .compare-table td{font-size:13px}
  .foot-grid{grid-template-columns:1fr;padding-bottom:40px}
  .marquee-item{font-size:18px}
  footer{padding:60px 20px 30px}
  .sticky-wa{bottom:80px}
  .states-list{grid-template-columns:repeat(2,1fr)}
}

/* ============================================================
   BONJO EV — ENHANCED MOTION + SPA + NEW PAGES  (appended block)
   ============================================================ */

/* ---- reduced motion respect ---- */
@media (prefers-reduced-motion: reduce){
  *{animation-duration:.001s!important;animation-iteration-count:1!important;transition-duration:.001s!important}
  .cursor-glow{display:none!important}
}

/* ---- NO-JS / restricted-viewer SAFETY ----
   If JavaScript does not run (e.g. some in-app file viewers, Google Drive
   preview), every piece of content must still be fully visible. These rules
   only apply when the <html> element does NOT have the "js" class. ---- */
html:not(.js) .reveal{opacity:1!important;transform:none!important}
html:not(.js) .faq-a{max-height:none!important;margin-top:14px!important}
html:not(.js) .cursor-glow{display:none!important}
html:not(.js) .bc-bar{height:auto!important;min-height:60px}

/* ---- SPA pages ---- */
/*.page{display:none} */
.page.active{display:block;animation:pageIn .55s cubic-bezier(.2,.7,.2,1) both}
@keyframes pageIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:translateY(0)}}

/* ---- cursor glow ---- */
.cursor-glow{
  position:fixed;top:0;left:0;width:520px;height:520px;
  margin:-260px 0 0 -260px;border-radius:50%;
  background:radial-gradient(circle, rgba(74,222,128,.10), rgba(74,222,128,.04) 40%, transparent 70%);
  pointer-events:none;z-index:80;
  transition:opacity .4s ease;opacity:0;
  will-change:transform;
}
@media(hover:hover){.cursor-glow{opacity:1}}
@media(max-width:900px){.cursor-glow{display:none}}

/* ---- scroll reveal ---- */
.reveal{opacity:0;transform:translateY(30px);transition:opacity .8s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}
.reveal.d1{transition-delay:.08s}
.reveal.d2{transition-delay:.16s}
.reveal.d3{transition-delay:.24s}
.reveal.d4{transition-delay:.32s}
.reveal.d5{transition-delay:.40s}

/* ---- parallax ---- */
.parallax{will-change:transform}

/* ---- magnetic ---- */
.magnetic{transition:transform .3s cubic-bezier(.2,.8,.2,1)}

/* ---- 3D tilt ---- */
.tilt{
  transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateZ(0);
  transition:transform .2s cubic-bezier(.2,.8,.2,1), border-color .35s, box-shadow .35s;
  transform-style:preserve-3d;
  position:relative;
}
.tilt .tilt-glare{
  position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:radial-gradient(circle at var(--gx,50%) var(--gy,50%), rgba(255,255,255,.12), transparent 55%);
  opacity:0;transition:opacity .35s;z-index:4;
}
.tilt.tilting .tilt-glare{opacity:1}
.tilt.tilting{box-shadow:0 30px 60px rgba(0,0,0,.45)}
/* keep the tilt transform winning over base :hover transforms */
.model-card.tilt:hover, .t-card.tilt:hover, .tier-card.tilt:hover,
.support-card.tilt:hover, .cert-badge.tilt:hover, .india-map-wrap.tilt:hover,
.ph-img.tilt:hover{
  transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateZ(0);
}

/* ---- count-up helper ---- */
.count{font-variant-numeric:tabular-nums}

/* ---- nav active state ---- */
.nav-link.active{color:var(--ink);background:rgba(74,222,128,.10)}
.nav-link.active::after{
  content:'';position:absolute;left:12px;right:12px;bottom:2px;height:1px;background:var(--green);
}
.nav-link{position:relative}

/* ---- mobile menu drawer ---- */
.mobile-menu{
  position:fixed;inset:0;z-index:300;
  background:rgba(8,8,8,.98);
  backdrop-filter:blur(20px);
  display:flex;flex-direction:column;
  padding:90px 24px 24px;
  transform:translateX(100%);
  transition:transform .4s cubic-bezier(.2,.7,.2,1);
  overflow-y:auto;
}
.mobile-menu.open{transform:translateX(0)}
.mm-close{
  position:absolute;top:20px;right:20px;width:44px;height:44px;
  border-radius:12px;background:rgba(255,255,255,.06);border:1px solid var(--line-2);
  display:grid;place-items:center;font-size:22px;color:var(--ink);
}
.mm-link{
  display:flex;justify-content:space-between;align-items:center;
  padding:18px 6px;font-family:var(--display);font-size:22px;font-weight:400;
  color:var(--ink);border-bottom:1px solid var(--line);
}
.mm-link .chev{color:var(--ink-3);font-size:15px}
.mm-sub{display:none;padding:4px 0 12px 14px}
.mm-sub.open{display:block}
.mm-sub a{display:block;padding:11px 6px;font-size:15px;color:var(--ink-2)}
.mm-sub a:hover{color:var(--green)}
.mm-foot{margin-top:auto;padding-top:24px;display:flex;flex-direction:column;gap:10px}
.mm-foot a{
  padding:16px;border-radius:14px;text-align:center;font-weight:600;font-size:15px;
  display:flex;align-items:center;justify-content:center;gap:8px;
}
.mm-foot .mm-wa{background:var(--green);color:#0a0a0a}
.mm-foot .mm-call{background:rgba(255,255,255,.06);border:1px solid var(--line-2);color:var(--ink)}

/* ---- generic sub-page hero ---- */
.page-hero{
  position:relative;overflow:hidden;
  padding:150px 40px 70px;
  background:linear-gradient(180deg,#0c0c0c 0%,var(--bg) 70%);
  border-bottom:1px solid var(--line);
}
.page-hero::before{
  content:'';position:absolute;inset:0;z-index:0;
  background:radial-gradient(ellipse 70% 60% at 80% 10%, rgba(74,222,128,.10), transparent 60%),
             radial-gradient(ellipse 50% 50% at 10% 90%, rgba(255,122,26,.06), transparent 60%);
}
.page-hero .container{position:relative;z-index:2}
.crumb{
  font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-3);margin-bottom:22px;display:flex;gap:8px;align-items:center;flex-wrap:wrap;
}
.crumb a{color:var(--ink-3);transition:color .2s}
.crumb a:hover{color:var(--green)}
.crumb .sep{opacity:.5}
.page-hero h1{
  font-family:var(--display);font-size:clamp(40px,5.5vw,80px);
  font-weight:300;letter-spacing:-.04em;line-height:1;margin-bottom:20px;max-width:14ch;
}
.page-hero h1 .it{font-family:var(--serif);font-style:italic;font-weight:400}
.page-hero h1 .grad{
  background:linear-gradient(120deg,var(--green) 0%,#86efac 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.page-hero p.lead{font-size:18px;line-height:1.6;color:var(--ink-2);max-width:620px}
.page-hero .hero-ctas{margin-top:34px;margin-bottom:0}

/* ---- tier cards (models hub) ---- */
.tier-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:80px}
.tier-card{
  background:var(--bg-2);border:1px solid var(--line);border-radius:22px;
  padding:34px 30px;display:flex;flex-direction:column;cursor:pointer;
  transition:border-color .35s, background .35s;
}
.tier-card:hover{border-color:rgba(74,222,128,.32);background:var(--bg-3)}
.tier-card .tc-eye{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--green);margin-bottom:18px}
.tier-card h3{font-family:var(--display);font-size:30px;font-weight:400;letter-spacing:-.02em;margin-bottom:8px}
.tier-card .tc-pitch{font-family:var(--serif);font-style:italic;font-size:16px;color:var(--ink-2);margin-bottom:18px}
.tier-card .tc-models{font-size:13.5px;color:var(--ink-2);line-height:1.7;flex:1}
.tier-card .tc-from{margin-top:20px;font-family:var(--display);font-size:20px;font-weight:600;color:var(--green)}
.tier-card .tc-from .rs{font-family:var(--serif);font-style:italic;font-weight:400;font-size:16px}
.tier-card .tc-go{margin-top:16px;font-size:13px;font-weight:600;color:var(--ink);display:flex;align-items:center;gap:6px;transition:gap .25s}
.tier-card:hover .tc-go{gap:12px;color:var(--green)}

/* ---- placeholder model image tile ---- */
.ph-img{
  aspect-ratio:1.3/1;border-radius:14px;margin-bottom:20px;position:relative;overflow:hidden;
  background:
    radial-gradient(ellipse 60% 50% at 50% 65%, rgba(74,222,128,.18), transparent 70%),
    linear-gradient(160deg,#141414,#0b0b0b);
  border:1px solid var(--line);display:grid;place-items:center;
}
.ph-img .ph-mark{
  font-family:var(--display);font-size:30px;font-weight:600;letter-spacing:-.02em;
  color:rgba(245,243,238,.16);
}
.ph-img .ph-note{
  position:absolute;bottom:8px;left:8px;
  font-family:var(--mono);font-size:8px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--ink-3);background:rgba(0,0,0,.5);padding:3px 6px;border-radius:4px;
}
.ph-img.lg{aspect-ratio:1.5/1}
.ph-img.lg .ph-mark{font-size:48px}

/* generic placeholder note tag */
.ph-tag{
  display:inline-flex;align-items:center;gap:5px;
  font-family:var(--mono);font-size:9px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--orange);background:rgba(255,122,26,.1);border:1px solid rgba(255,122,26,.3);
  padding:3px 8px;border-radius:5px;
}

/* ---- model detail page ---- */
.md-hero{display:grid;grid-template-columns:1.05fr .95fr;gap:50px;align-items:center}
.md-info h1{margin-bottom:12px}
.md-tagline{font-family:var(--serif);font-style:italic;font-size:22px;color:var(--ink-2);margin-bottom:20px}
.md-price{font-family:var(--display);font-size:40px;font-weight:600;color:var(--green);letter-spacing:-.02em;margin-bottom:8px}
.md-price .rs{font-family:var(--serif);font-style:italic;font-weight:400;font-size:28px}
.md-price small{font-size:14px;color:var(--ink-3);font-weight:400;margin-left:6px}
.spec-strip{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);
  border:1px solid var(--line);border-radius:18px;overflow:hidden;margin:60px 0;
}

.model_specs .spec-strip
{
  display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--line) !important;
  border:1px solid var(--line);border-radius:18px;overflow:hidden;margin:0px 0;
}

.model_specs .spec-strip.grid-4
{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line) !important;
  border:1px solid var(--line);border-radius:18px;overflow:hidden;margin:0px 0;
}
.model_specs .spec-strip.grid-3
{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line) !important;
  border:1px solid var(--line);border-radius:18px;overflow:hidden;margin:0px 0;
}
.model_specs .spec-cell .sc-val
{
font-size:16px !important;
}


.spec-cell{background:var(--bg-2);padding:26px 22px}
.spec-cell .sc-label{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);margin-bottom:8px}
.spec-cell .sc-val{font-family:var(--display);font-size:22px;font-weight:500;color:var(--ink)}
.spec-cell .sc-val .u{font-size:13px;color:var(--green);margin-left:3px}
.persona{
  background:linear-gradient(135deg,rgba(74,222,128,.10),rgba(74,222,128,.02));
  border:1px solid rgba(74,222,128,.25);border-radius:20px;padding:36px;margin-bottom:24px;
}
.persona h4{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--green);margin-bottom:14px}
.persona p{font-family:var(--serif);font-style:italic;font-size:22px;line-height:1.45;color:var(--ink)}
.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:20px;overflow:hidden}
.feature-cell{background:var(--bg-2);padding:30px 26px;transition:background .3s}
.feature-cell:hover{background:var(--bg-3)}
.feature-cell .fc-icon{font-size:26px;margin-bottom:14px}
.feature-cell h5{font-family:var(--display);font-size:18px;font-weight:500;margin-bottom:8px}
.feature-cell p{font-size:14px;line-height:1.6;color:var(--ink-2)}
.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}

/* ---- battery customiser block ---- */
.battery-block{
  background:var(--bg-3);border:1px solid var(--line);border-radius:22px;padding:40px;
  display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;
}
.battery-block .bb-readout{
  text-align:center;padding:30px;background:var(--bg-2);border-radius:18px;border:1px solid var(--line);
}
.battery-block .bb-readout .bb-range{font-family:var(--display);font-size:54px;font-weight:600;color:var(--green);letter-spacing:-.03em}
.battery-block .bb-readout .bb-type{font-family:var(--mono);font-size:12px;letter-spacing:.1em;color:var(--ink-2);margin-top:6px;text-transform:uppercase}

/* ---- why-bonjo deep blocks ---- */
.deep-block{
  display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center;
  padding:70px 0;border-bottom:1px solid var(--line);
}
.deep-block:nth-child(even){direction:rtl}
.deep-block:nth-child(even) > *{direction:ltr}
.deep-block:last-child{border-bottom:none}
.deep-block .db-eye{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--green);margin-bottom:18px}
.deep-block h3{font-family:var(--display);font-size:clamp(30px,3.4vw,46px);font-weight:300;letter-spacing:-.03em;line-height:1.05;margin-bottom:18px}
.deep-block h3 .it{font-family:var(--serif);font-style:italic;font-weight:400}
.deep-block p{font-size:16px;line-height:1.65;color:var(--ink-2);margin-bottom:18px}
.db-points{display:flex;flex-direction:column;gap:10px;margin-top:20px}
.db-point{display:flex;gap:12px;align-items:flex-start;font-size:14.5px;color:var(--ink-2)}
.db-point::before{content:'';flex-shrink:0;width:18px;height:18px;border-radius:50%;background:rgba(74,222,128,.14);border:1px solid var(--green);margin-top:2px;background-image:radial-gradient(circle,var(--green) 30%,transparent 32%)}
.db-visual{
  aspect-ratio:1.2/1;border-radius:22px;border:1px solid var(--line);overflow:hidden;position:relative;
  background:radial-gradient(ellipse 60% 50% at 50% 60%, rgba(74,222,128,.16), transparent 70%),linear-gradient(160deg,#141414,#0a0a0a);
  display:grid;place-items:center;
}
.db-visual .dbv-icon{font-size:84px;filter:saturate(.4) brightness(1.2);opacity:.5}

/* ---- savings page chart ---- */
.savings-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:50px;align-items:start}
.chart-card{background:var(--bg-3);border:1px solid var(--line);border-radius:22px;padding:34px}
.chart-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:24px}
.chart-head h4{font-family:var(--display);font-size:20px;font-weight:500}
.chart-head .ch-total{font-family:var(--display);font-size:26px;font-weight:600;color:var(--green)}
.bar-chart{display:flex;align-items:flex-end;gap:10px;height:240px;padding-top:10px}
.bc-col{flex:1;display:flex;flex-direction:column;align-items:center;gap:8px;height:100%;justify-content:flex-end}
.bc-bar{
  width:100%;border-radius:8px 8px 0 0;
  background:linear-gradient(180deg,var(--green),var(--green-deep));
  height:0;transition:height 1s cubic-bezier(.2,.8,.2,1);
  position:relative;min-height:3px;
}
.bc-bar.petrol{background:linear-gradient(180deg,#ff7a1a,#e0590a)}
.bc-bar .bc-val{
  position:absolute;top:-22px;left:0;right:0;text-align:center;
  font-family:var(--mono);font-size:10px;color:var(--ink-2);opacity:0;transition:opacity .5s .6s;
}
.bc-bar.show .bc-val{opacity:1}
.bc-label{font-family:var(--mono);font-size:10px;letter-spacing:.06em;color:var(--ink-3);text-transform:uppercase;text-align:center}
.share-row{
  margin-top:24px;display:flex;gap:12px;flex-wrap:wrap;align-items:center;
  padding-top:24px;border-top:1px solid var(--line);
}
.share-row .sr-label{font-size:13px;color:var(--ink-2)}

/* ---- dealers — india map ---- */
.dealer-layout{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:start}
.india-map-wrap{
  background:var(--bg-2);border:1px solid var(--line);border-radius:24px;padding:24px;position:relative;
}
.india-map-wrap svg{width:100%;height:auto;display:block}
.in-state{fill:#1a1a1a;stroke:#0a0a0a;stroke-width:1.4;transition:fill .25s,transform .25s;cursor:pointer;transform-origin:center}
.in-state.covered{fill:rgba(74,222,128,.30)}
.in-state.covered:hover{fill:var(--green)}
.in-state.active{fill:var(--green)}
.map-pin{fill:var(--orange);stroke:#0a0a0a;stroke-width:1.5;cursor:pointer;transition:r .2s}
.map-pin:hover{r:7}
.map-legend{display:flex;gap:18px;margin-top:14px;flex-wrap:wrap}
.map-legend span{display:flex;align-items:center;gap:7px;font-family:var(--mono);font-size:10px;letter-spacing:.06em;color:var(--ink-3);text-transform:uppercase}
.map-legend i{width:11px;height:11px;border-radius:3px;display:inline-block}
.dealer-search{
  display:flex;gap:10px;margin-bottom:20px;
}
.dealer-search input{
  flex:1;background:var(--bg-3);border:1px solid var(--line-2);border-radius:12px;
  padding:14px 16px;color:var(--ink);font-family:var(--display);font-size:14px;outline:none;
  transition:border-color .25s;
}
.dealer-search input:focus{border-color:var(--green)}
.dealer-search select{
  background:var(--bg-3);border:1px solid var(--line-2);border-radius:12px;
  padding:14px 16px;color:var(--ink);font-family:var(--display);font-size:14px;outline:none;cursor:pointer;
}
.dealer-list{display:flex;flex-direction:column;gap:12px;max-height:560px;overflow-y:auto;padding-right:6px}
.dealer-card{
  background:var(--bg-2);border:1px solid var(--line);border-radius:16px;padding:22px;
  transition:border-color .3s,transform .3s;
}
.dealer-card:hover{border-color:rgba(74,222,128,.3);transform:translateX(4px)}
.dealer-card .dc-top{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:10px}
.dealer-card .dc-name{font-family:var(--display);font-size:17px;font-weight:500}
.dealer-card .dc-state{font-family:var(--mono);font-size:10px;letter-spacing:.08em;color:var(--green);text-transform:uppercase;flex-shrink:0;margin-top:3px}
.dealer-card .dc-addr{font-size:13px;color:var(--ink-2);line-height:1.5;margin-bottom:14px}
.dealer-card .dc-actions{display:flex;gap:10px;flex-wrap:wrap}
.dc-mini{
  font-family:var(--mono);font-size:11px;padding:8px 12px;border-radius:9px;
  display:inline-flex;align-items:center;gap:6px;
}
.dc-mini.wa{background:var(--green);color:#0a0a0a;font-weight:600}
.dc-mini.call{background:rgba(255,255,255,.06);border:1px solid var(--line-2);color:var(--ink-2)}

/* ---- support hub ---- */
.support-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:70px}
.support-card{
  background:var(--bg-2);border:1px solid var(--line);border-radius:20px;padding:32px;
  cursor:pointer;transition:border-color .35s,background .35s;
  display:flex;flex-direction:column;min-height:210px;
}
.support-card:hover{border-color:rgba(74,222,128,.3);background:var(--bg-3)}
.support-card .sup-icon{
  width:48px;height:48px;border-radius:12px;display:grid;place-items:center;font-size:22px;
  background:linear-gradient(135deg,var(--green-glow),transparent);border:1px solid rgba(74,222,128,.3);
  margin-bottom:20px;
}
.support-card h3{font-family:var(--display);font-size:21px;font-weight:500;margin-bottom:8px}
.support-card p{font-size:14px;line-height:1.6;color:var(--ink-2);flex:1}
.support-card .sup-go{margin-top:16px;font-size:12px;font-weight:600;color:var(--green);display:flex;gap:6px;align-items:center;transition:gap .25s}
.support-card:hover .sup-go{gap:11px}

/* ---- about timeline ---- */
.timeline{max-width:760px;margin:0 auto;position:relative;padding-left:34px}
.timeline::before{content:'';position:absolute;left:8px;top:6px;bottom:6px;width:1px;background:var(--line-2)}
.tl-item{position:relative;padding-bottom:42px}
.tl-item:last-child{padding-bottom:0}
.tl-item::before{
  content:'';position:absolute;left:-30px;top:4px;width:16px;height:16px;border-radius:50%;
  background:var(--bg);border:1px solid var(--green);
  background-image:radial-gradient(circle,var(--green) 32%,transparent 34%);
}
.tl-item .tl-year{font-family:var(--mono);font-size:12px;letter-spacing:.1em;color:var(--green);margin-bottom:6px}
.tl-item h4{font-family:var(--display);font-size:21px;font-weight:500;margin-bottom:6px}
.tl-item p{font-size:14.5px;line-height:1.6;color:var(--ink-2)}
.cert-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:20px}
.cert-badge{
  background:var(--bg-2);border:1px solid var(--line);border-radius:16px;padding:26px 18px;text-align:center;
  transition:border-color .3s;
}
.cert-badge:hover{border-color:rgba(74,222,128,.3)}
.cert-badge .cb-icon{font-size:30px;margin-bottom:12px}
.cert-badge .cb-name{font-family:var(--display);font-size:14px;font-weight:500;margin-bottom:4px}
.cert-badge .cb-sub{font-family:var(--mono);font-size:9px;letter-spacing:.06em;color:var(--ink-3);text-transform:uppercase}

/* ---- contact ---- */
.contact-layout{display:grid;grid-template-columns:1fr 1.1fr;gap:50px;align-items:start}
.contact-info{display:flex;flex-direction:column;gap:14px}
.ci-card{
  background:var(--bg-2);border:1px solid var(--line);border-radius:16px;padding:24px;
  display:flex;gap:16px;align-items:flex-start;transition:border-color .3s,transform .3s;
}
.ci-card:hover{border-color:rgba(74,222,128,.3);transform:translateX(4px)}
.ci-card .ci-icon{
  width:42px;height:42px;border-radius:11px;flex-shrink:0;display:grid;place-items:center;font-size:19px;
  background:linear-gradient(135deg,var(--green-glow),transparent);border:1px solid rgba(74,222,128,.3);
}
.ci-card .ci-label{font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);margin-bottom:4px}
.ci-card .ci-val{font-family:var(--display);font-size:16px;font-weight:500;color:var(--ink)}
.ci-card .ci-val small{display:block;font-size:12px;color:var(--ink-2);font-weight:400;margin-top:2px}
.contact-form{background:var(--bg-3);border:1px solid var(--line);border-radius:22px;padding:36px}
.field{margin-bottom:20px}
.field label{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-2);margin-bottom:8px}
.field input,.field textarea{
  width:100%;background:var(--bg-2);border:1px solid var(--line-2);border-radius:12px;
  padding:14px 16px;color:var(--ink);font-family:var(--display);font-size:14px;outline:none;
  transition:border-color .25s;
}
.field input:focus,.field textarea:focus{border-color:var(--green)}
.field textarea{resize:vertical;min-height:110px}
.form-note{font-size:12px;color:var(--ink-3);margin-top:8px}
.map-embed{
  margin-top:24px;aspect-ratio:2/1;border-radius:18px;border:1px solid var(--line);overflow:hidden;
  background:radial-gradient(ellipse 50% 60% at 50% 50%, rgba(74,222,128,.12), transparent 70%),linear-gradient(160deg,#141414,#0a0a0a);
  display:grid;place-items:center;
}

/* generic section divider on inner pages */
.inner-section{padding:90px 40px;position:relative}
.inner-section.alt{background:var(--bg-2)}

/* small helper */
.center-cta{text-align:center;margin-top:50px}
.section-mini-head{font-family:var(--display);font-size:clamp(28px,3vw,42px);font-weight:300;letter-spacing:-.03em;margin-bottom:14px}
.section-mini-head .grad{background:linear-gradient(120deg,var(--green),#86efac);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.section-mini-sub{font-size:16px;color:var(--ink-2);max-width:600px;margin-bottom:44px;line-height:1.6}

/* ---- responsive for new blocks ---- */
@media(max-width:1024px){
  .tier-cards{grid-template-columns:1fr}
  .md-hero{grid-template-columns:1fr;gap:34px}
  .spec-strip{grid-template-columns:repeat(2,1fr)}
  .feature-grid{grid-template-columns:repeat(2,1fr)}
  .deep-block,.deep-block:nth-child(even){grid-template-columns:1fr;direction:ltr;gap:30px}
  .savings-layout,.dealer-layout,.contact-layout{grid-template-columns:1fr;gap:34px}
  .battery-block{grid-template-columns:1fr;gap:28px}
  .support-grid{grid-template-columns:repeat(2,1fr)}
  .cert-grid{grid-template-columns:repeat(2,1fr)}
  .gallery{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:640px){
  .page-hero{padding:120px 20px 50px}
  .inner-section{padding:60px 20px}
  .spec-strip{grid-template-columns:1fr 1fr;margin:36px 0}
  .feature-grid{grid-template-columns:1fr}
  .support-grid{grid-template-columns:1fr}
  .cert-grid{grid-template-columns:1fr 1fr}
  .tier-cards{margin-bottom:50px}
  .bar-chart{height:180px}
  .timeline{padding-left:28px}
}

/* ============================================================
   HERO REDESIGN — minimal cinematic full-bleed (home page only)
   ============================================================ */
.hero{
  min-height:100vh;
  padding:90px 0 70px;
  display:flex;align-items:center;
  position:relative;overflow:hidden;
  background:var(--bg);
}
.hero-scene{
  position:absolute;top:-10%;left:0;right:0;height:118%;
  z-index:0;overflow:hidden;background:#0a0a0a;
}
.hs-photo{
  position:absolute;inset:0;
  background:#0a0a0a url('../images/hero.jpg') center 40% / cover no-repeat;
}
.hs-sky{
  position:absolute;inset:0;
  background:
    radial-gradient(ellipse 80% 60% at 70% 16%, rgba(255,170,90,.16), transparent 60%),
    linear-gradient(180deg,rgba(20,17,13,.55) 0%,rgba(14,13,11,.42) 42%,rgba(10,10,10,.72) 100%);
}
.hs-horizon{
  position:absolute;left:-10%;right:-10%;top:40%;height:130px;
  transform:translateY(-50%);
  background:linear-gradient(90deg,transparent,rgba(255,180,110,.12),rgba(120,150,255,.08),rgba(255,180,110,.12),transparent);
  filter:blur(28px);
}
.hs-road{
  position:absolute;left:0;right:0;bottom:0;height:44%;
  background:
    radial-gradient(ellipse 60% 100% at 50% 122%, rgba(74,222,128,.09), transparent 70%),
    linear-gradient(180deg,transparent,#141310 55%,#0c0b0a 100%);
}
.hs-streaks{position:absolute;inset:0}
.hs-streaks span{
  position:absolute;left:0;top:var(--t);
  width:var(--w,45%);height:2px;
  background:linear-gradient(90deg,transparent,rgba(255,245,235,.7),transparent);
  filter:blur(1.5px);
  opacity:var(--o,.5);
  animation:heroStreak var(--d,5s) linear infinite;
}
@keyframes heroStreak{
  0%{transform:translateX(72vw) scaleX(.6);opacity:0}
  14%{opacity:var(--o,.5)}
  86%{opacity:var(--o,.5)}
  100%{transform:translateX(-175%) scaleX(1.5);opacity:0}
}
.hs-glow{position:absolute;border-radius:50%;filter:blur(80px);pointer-events:none}
.hs-glow-green{
  width:520px;height:420px;right:5%;top:16%;
  background:radial-gradient(circle,rgba(74,222,128,.18),transparent 70%);
}
.hs-glow-orange{
  width:380px;height:320px;left:6%;bottom:16%;
  background:radial-gradient(circle,rgba(255,122,26,.11),transparent 70%);
}
.hs-vignette{
  position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 115% 105% at 62% 44%, transparent 42%, rgba(0,0,0,.68) 100%);
}
.hs-scrim{
  position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg, rgba(8,8,8,.93) 0%, rgba(8,8,8,.62) 38%, rgba(8,8,8,.16) 68%, transparent 100%);
}
.hero-fade{
  position:absolute;left:0;right:0;bottom:0;height:40%;z-index:1;
  background:linear-gradient(to bottom, transparent, var(--bg) 92%);
  pointer-events:none;
}
.hs-ph-note{
  position:absolute;right:18px;bottom:18px;z-index:4;
  font-family:var(--mono);font-size:9px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-3);background:rgba(0,0,0,.55);
  border:1px solid var(--line-2);padding:5px 9px;border-radius:6px;
}
.hero-inner{
  position:relative;z-index:2;
  width:100%;max-width:1400px;margin:0 auto;
  padding:0 40px;display:block;
}
.hero-copy{max-width:660px}
.hero-title{
  font-family:var(--display);font-weight:300;
  font-size:clamp(54px,8.4vw,116px);
  line-height:.96;letter-spacing:-.045em;margin-bottom:0;
}
.hero-title .ht-line{display:block;animation:fadeUp .9s ease both}
.hero-title .ht-line:nth-child(2){animation-delay:.12s}
.hero-title .ht-accent{
  font-family:var(--serif);font-style:italic;font-weight:400;letter-spacing:-.02em;
  background:linear-gradient(115deg,var(--green) 0%,#86efac 55%,var(--green) 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.hero-sub{
  font-size:18px;line-height:1.6;color:var(--ink-2);
  max-width:500px;margin:26px 0 36px;
  animation:fadeUp 1s .3s ease both;
}
.hero-sub strong{color:var(--ink);font-weight:600}
.hero-ctas{
  display:flex;gap:14px;flex-wrap:wrap;margin-bottom:0;
  animation:fadeUp 1s .42s ease both;
}
.btn-hero-ghost{
  background:transparent;border:1px solid var(--line-2);color:var(--ink);
  letter-spacing:.03em;font-weight:500;backdrop-filter:blur(6px);
}
.btn-hero-ghost:hover{border-color:var(--ink);transform:translateY(-2px)}
.hero-strip{
  background:var(--bg);padding:0 40px;
  position:relative;z-index:3;
}
.hero-strip .hero-stats{
  max-width:1400px;margin:0 auto;
  display:grid;grid-template-columns:repeat(3,1fr);gap:32px;
  padding:34px 0;
  border-top:1px solid var(--line);border-bottom:1px solid var(--line);
}
html:not(.js) .hs-streaks{display:none}
@media(max-width:1024px){
  .hero-inner{padding:0 32px}
}
@media(max-width:640px){
  .hero{padding:120px 0 50px;min-height:90vh}
  .hero-inner{padding:0 20px}
  .hs-scrim{background:linear-gradient(180deg, rgba(8,8,8,.5) 0%, rgba(8,8,8,.74) 58%, rgba(8,8,8,.92) 100%)}
  .hero-sub{font-size:16px;margin:20px 0 28px;max-width:none}
  .hero-strip{padding:0 20px}
  .hero-strip .hero-stats{gap:14px;padding:26px 0}
  .hero-strip .stat-num{font-size:22px}
}


/* ============================================================
   LIGHT THEME OVERRIDE
   Mostly-light warm cream surface, with dark accent sections
   (savings calculator, comparison table, final CTA, footer)
   for rhythm. Applied site-wide on top of the dark base.
   ============================================================ */

:root{
  --bg:#f5f0e6;
  --bg-2:#ede5d7;
  --bg-3:#ffffff;
  --ink:#1a1612;
  --ink-2:#5a544c;
  --ink-3:#8c8478;
  --line:rgba(26,22,18,.10);
  --line-2:rgba(26,22,18,.18);
  --green-deep:#16a34a;
  --green-glow:rgba(74,222,128,.22);
}

body{background:var(--bg);color:var(--ink)}

/* nav — light translucent */
.nav{background:rgba(245,240,230,.85);border-bottom:1px solid var(--line)}
.nav.scrolled{background:rgba(245,240,230,.97)}
.logo-text{color:#1a1612}
.nav-link{color:#5a544c}
.nav-link:hover{color:#1a1612;background:rgba(26,22,18,.05)}
.nav-link.active{color:#1a1612;background:rgba(74,222,128,.20)}
.nav-link.active::after{background:#16a34a}
.nav-phone{color:#8c8478}
.nav-phone:hover{color:#16a34a}
.dropdown-panel{background:#ffffff;border:1px solid var(--line-2);box-shadow:0 22px 44px rgba(0,0,0,.14)}
.dropdown-panel a{color:#5a544c}
.dropdown-panel a:hover{color:#1a1612;background:rgba(26,22,18,.05)}
.dd-cta{color:#16a34a!important;border-top:1px solid var(--line)}
.dd-label{color:#8c8478}

/* buttons */
.nav-cta{background:#16a34a;color:#ffffff}
.nav-cta:hover{box-shadow:0 8px 24px rgba(22,163,74,.32)}
.btn-primary{background:#16a34a;color:#ffffff}
.btn-primary:hover{background:#15803d;box-shadow:0 12px 32px rgba(22,163,74,.28)}
.btn-secondary{background:rgba(26,22,18,.04);color:#1a1612;border:1px solid var(--line-2)}
.btn-secondary:hover{background:rgba(26,22,18,.08)}
.btn-hero-ghost{background:rgba(255,255,255,.55);border:1px solid var(--line-2);color:#1a1612;backdrop-filter:blur(6px)}
.btn-hero-ghost:hover{border-color:#1a1612;background:rgba(255,255,255,.78)}

/* HAMBURGER */
.hamburger{background:rgba(26,22,18,.06);border:1px solid var(--line-2)}
.hamburger span{background:#1a1612}

/* ============ HERO — bright outdoor photo + light scrim ============ */
.hs-photo{background:#e6dfd1 url('../images/hero.jpg') center 38% / cover no-repeat!important}
.hs-sky,.hs-horizon,.hs-road,.hs-streaks,.hs-glow-green,.hs-glow-orange{display:none!important}
.hs-vignette{background:radial-gradient(ellipse 115% 105% at 50% 50%, transparent 50%, rgba(0,0,0,.30) 100%)!important}
.hs-scrim{background:linear-gradient(90deg, rgba(245,240,230,.94) 0%, rgba(245,240,230,.62) 32%, rgba(245,240,230,.12) 62%, transparent 82%)!important}
.hero-fade{background:linear-gradient(to bottom, transparent, var(--bg) 92%)!important}
.hs-ph-note{background:rgba(255,255,255,.72);color:#5a544c;border:1px solid var(--line-2)}
.hero-title .ht-line:first-child{color:#1a1612}
.hero-title .ht-accent{background:linear-gradient(115deg,#16a34a 0%,#22c55e 55%,#16a34a 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.hero-sub{color:#3a342c}
.hero-sub strong{color:#1a1612}

/* hero stat strip */
.hero-strip{background:var(--bg)}
.hero-strip .hero-stats{border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.stat-num{color:#1a1612}
.stat-num .unit{color:#16a34a}
.stat-num .currency{color:#5a544c}
.stat-label{color:#8c8478}

/* MARQUEE — slim dark ribbon for rhythm */
.marquee{background:#1a1612;border-top:none;border-bottom:none}
.marquee-item{color:#d6cfc2}
.marquee-item .num{color:#4ade80}

/* WHY — light cards */
.why{background:#fbf7ef}
.pillars{background:transparent;border:none;gap:18px}
.pillar{background:#ffffff;border:1px solid var(--line);border-radius:18px}
.pillar:hover{background:#faf5e9;border-color:rgba(22,163,74,.30)}
.pillar h3{color:#1a1612}
.pillar p{color:#5a544c}
.pillar-num{color:#8c8478}
.pillar-icon{background:linear-gradient(135deg, rgba(74,222,128,.22), rgba(74,222,128,.04));border:1px solid rgba(74,222,128,.32)}
.pillar-tag{background:rgba(74,222,128,.10);color:#16a34a;border:1px solid rgba(74,222,128,.28)}

/* ROI / SAVINGS — KEEP DARK accent */
.roi{background:linear-gradient(180deg,#1a1612 0%,#0f0c09 100%)!important;color:#f1ede4}
.roi::before{color:rgba(74,222,128,.05)}
.roi .section-eyebrow{color:#4ade80}
.roi .section-eyebrow::before{background:#4ade80}
.roi .section-heading{color:#f1ede4}
.roi .section-heading .grad{background:linear-gradient(120deg,#4ade80,#86efac);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.roi .section-heading .it{color:#b8b0a3}
.roi .section-sub{color:#b8b0a3}
.calc-controls{background:#0a0805;border-color:rgba(255,255,255,.08)}
.control-label span:first-child{color:#b8b0a3}
.control-label .val{color:#4ade80}
.slider{background:rgba(255,255,255,.14)}
.toggle{border-color:rgba(255,255,255,.12);color:#b8b0a3}
.toggle.active{background:#4ade80;color:#0a0805}
.compare-row{background:#100d09;border-color:rgba(255,255,255,.08)}
.compare-row.win{border-color:rgba(74,222,128,.4);background:linear-gradient(90deg,rgba(74,222,128,.10),transparent)}
.compare-row .name{color:#f1ede4}
.compare-row .name small{color:#8c8478}
.compare-row .cost{color:#f1ede4}
.compare-row.win .cost{color:#4ade80}
.compare-row.lose .cost{color:#ff9a3c}
.savings-card{background:linear-gradient(135deg,rgba(74,222,128,.18),rgba(74,222,128,.04));border-color:rgba(74,222,128,.32)}
.save-stat .label{color:#b8b0a3}
.save-stat .num{color:#4ade80}
.save-tag{color:#b8b0a3}

/* RANGE — light */
.range{background:var(--bg)}
.tier-tabs{background:#ffffff;border:1px solid var(--line)}
.tier-tab{color:#5a544c}
.tier-tab.active{background:#1a1612;color:#ffffff}
.model-card{background:#ffffff;border:1px solid var(--line)}
.model-card:hover{border-color:rgba(22,163,74,.32)}
.model-card::before{background:linear-gradient(180deg,transparent 60%,rgba(74,222,128,.08) 100%)}
.model-card.flagship{background:linear-gradient(180deg,#ffffff 0%,#f7f1e3 100%);border-color:rgba(22,163,74,.28)}
.model-card.flagship::after{background:#16a34a;color:#ffffff}
.model-name{color:#1a1612}
.model-tagline{color:#5a544c}
.model-price{color:#16a34a}
.model-price .rs{color:#16a34a}
.model-price small{color:#8c8478}
.spec{color:#5a544c}
.spec strong{color:#1a1612}
.model-tier{background:rgba(26,22,18,.06);color:#5a544c;border-color:var(--line-2);backdrop-filter:blur(6px)}
.model-img{background:#f0eadd;border-color:var(--line)}
.model-specs{border-top-color:var(--line)}

/* HOW IT WORKS — light */
.how{background:#fbf7ef}
.steps::before{background:repeating-linear-gradient(90deg,var(--line-2) 0 6px,transparent 6px 14px)}
.step-num{background:#ffffff;border:1px solid var(--line-2);color:#16a34a}
.step-num::after{border-color:rgba(74,222,128,.28)}
.step.whatsapp .step-num{background:#16a34a;color:#ffffff;border-color:#16a34a;box-shadow:0 0 24px rgba(22,163,74,.32)}
.step h4{color:#1a1612}
.step p{color:#5a544c}
.step-badge{background:rgba(74,222,128,.16);color:#16a34a}

/* COMPARISON — KEEP DARK accent */
.compare{background:#1a1612!important;color:#f1ede4}
.compare .section-eyebrow{color:#4ade80}
.compare .section-eyebrow::before{background:#4ade80}
.compare .section-heading{color:#f1ede4}
.compare .section-heading .grad{background:linear-gradient(120deg,#4ade80,#86efac);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.compare .section-heading .it{color:#b8b0a3}
.compare .section-sub{color:#b8b0a3}
.table-wrap{background:#0f0c09;border-color:rgba(255,255,255,.08)}
.compare-table th{background:#100d09;color:#b8b0a3;border-color:rgba(255,255,255,.08)}
.compare-table th.bonjo-col{background:linear-gradient(180deg,rgba(74,222,128,.18),rgba(74,222,128,.05));color:#4ade80}
.compare-table td{color:#f1ede4;border-color:rgba(255,255,255,.06)}
.compare-table td:first-child{color:#b8b0a3}
.compare-table .bonjo{background:rgba(74,222,128,.06);color:#4ade80}
.compare-foot{color:#b8b0a3}
.compare-foot strong{color:#f1ede4}

/* COVERAGE — light */
.coverage{background:linear-gradient(180deg,var(--bg) 0%,#fbf7ef 100%)}
.state-pill{background:#ffffff;color:#5a544c;border-color:var(--line)}
.state-pill::before{background:#16a34a}
.map-frame{background:#ffffff;border-color:var(--line)}
.india-map-img{opacity:1}

/* TESTIMONIALS — light */
.testimonials{background:#fbf7ef}
.t-card{background:#ffffff;border-color:var(--line)}
.t-card::before{color:#16a34a;opacity:.35}
.stars{color:#ff9a3c}
.t-quote{color:#1a1612}
.t-author{border-top-color:var(--line)}
.t-meta .c{color:#8c8478}
.t-foot{color:#5a544c}
.t-foot strong{color:#16a34a}

/* FAQ — light */
.faq{background:var(--bg)}
.faq-item{border-color:var(--line)}
.faq-item:last-child{border-color:var(--line)}
.faq-q{color:#1a1612}
.faq-a{color:#5a544c}
.faq-toggle{border-color:var(--line-2);color:#5a544c}
.faq-item.open .faq-toggle{background:#16a34a;color:#ffffff;border-color:#16a34a}

/* FINAL CTA — KEEP DARK accent */
.final{background:linear-gradient(180deg,#1a1612 0%,#0a0805 100%)!important;color:#f1ede4}
.final::before{background:radial-gradient(ellipse 70% 60% at 50% 40%, rgba(74,222,128,.20), transparent 70%),radial-gradient(ellipse 40% 30% at 80% 70%, rgba(255,122,26,.10), transparent 70%)}
.final h2{color:#f1ede4}
.final h2 .it{color:#b8b0a3}
.final p{color:#b8b0a3}
.final-trust{color:#8c8478}
.btn-call{color:#f1ede4;border-color:rgba(255,255,255,.18)}
.btn-call:hover{border-color:#4ade80;color:#4ade80}

/* FOOTER — dark */
footer{background:#1a1612;border-color:transparent}
.foot-tag{color:#b8b0a3}
.foot-col h5{color:#8c8478}
.foot-col a{color:#b8b0a3}
.foot-col a:hover{color:#4ade80}
.foot-brand p{color:#8c8478}
.trust-strip{border-color:rgba(255,255,255,.06)}
.trust-item{color:#8c8478}
.trust-item::before{color:#4ade80}
.foot-bottom{color:#8c8478}
.foot-legal a{color:#8c8478}
.foot-legal a:hover{color:#b8b0a3}

/* SUB-PAGES (.page-hero on models/why/savings/dealers/support/about/contact) */
.page-hero{background:linear-gradient(180deg,#fbf7ef 0%,var(--bg) 70%);border-bottom:1px solid var(--line)}
.page-hero::before{background:radial-gradient(ellipse 70% 60% at 80% 10%, rgba(74,222,128,.14), transparent 60%),radial-gradient(ellipse 50% 50% at 10% 90%, rgba(255,122,26,.06), transparent 60%)}
.page-hero h1{color:#1a1612}
.page-hero h1 .grad{background:linear-gradient(120deg,#16a34a 0%,#22c55e 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.page-hero h1 .it{color:#5a544c}
.page-hero p.lead{color:#5a544c}
.crumb{color:#8c8478}
.crumb a{color:#8c8478}
.crumb a:hover{color:#16a34a}

/* new-page sections / generic */
.inner-section{background:var(--bg)}
.inner-section.alt{background:#fbf7ef}
.section-eyebrow{color:#16a34a}
.section-eyebrow::before{background:#16a34a}
.section-heading,.section-mini-head{color:#1a1612}
.section-heading .grad,.section-mini-head .grad{background:linear-gradient(120deg,#16a34a 0%,#22c55e 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.section-heading .it,.section-mini-head .it{color:#5a544c}
.section-sub,.section-mini-sub{color:#5a544c}

/* tier / support / cert / contact / feature cards — light */
.tier-card,.support-card,.cert-badge,.ci-card,.dealer-card,.chart-card,.india-map-wrap,.contact-form{background:#ffffff;border:1px solid var(--line)}
.tier-card:hover,.support-card:hover{background:#faf5e9;border-color:rgba(22,163,74,.30)}
.tier-card h3,.support-card h3,.feature-cell h5,.dealer-card .dc-name,.ci-card .ci-val{color:#1a1612}
.tier-card .tc-pitch,.tier-card .tc-models,.support-card p,.feature-cell p,.dealer-card .dc-addr,.ci-card .ci-val small{color:#5a544c}
.tier-card .tc-eye,.support-card .sup-go{color:#16a34a}
.support-card .sup-icon{background:linear-gradient(135deg,rgba(74,222,128,.22),rgba(74,222,128,.04));border:1px solid rgba(74,222,128,.32)}
.tier-card .tc-go{color:#1a1612}
.tier-card .tc-from{color:#16a34a}
.dealer-card .dc-state{color:#16a34a}
.ci-card .ci-icon{background:linear-gradient(135deg,rgba(74,222,128,.22),rgba(74,222,128,.04));border:1px solid rgba(74,222,128,.32)}
.ci-card .ci-label{color:#8c8478}

/* feature grid — light divider */
.feature-grid{background:var(--line);border:1px solid var(--line)}
.feature-cell{background:#ffffff}
.feature-cell:hover{background:#faf5e9}

/* spec strip */
.spec-strip{background:var(--line);border:1px solid var(--line)}
.spec-cell{background:#ffffff}
.spec-cell .sc-label{color:#8c8478}
.spec-cell .sc-val{color:#1a1612}
.spec-cell .sc-val .u{color:#16a34a}

/* persona block */
.persona{background:linear-gradient(135deg,rgba(74,222,128,.14),rgba(74,222,128,.03));border:1px solid rgba(74,222,128,.32)}
.persona h4{color:#16a34a}
.persona p{color:#1a1612}

/* battery block */
.battery-block{background:#ffffff;border:1px solid var(--line)}
.battery-block .bb-readout{background:#fbf7ef;border-color:var(--line)}
.battery-block .bb-readout .bb-range{color:#16a34a}
.battery-block .bb-readout .bb-type{color:#5a544c}

/* why-bonjo deep blocks */
.deep-block{border-bottom:1px solid var(--line)}
.deep-block .db-eye{color:#16a34a}
.deep-block h3{color:#1a1612}
.deep-block h3 .it{color:#5a544c}
.deep-block p{color:#5a544c}
.db-point{color:#5a544c}
.db-point::before{background:rgba(74,222,128,.18);border:1px solid #16a34a;background-image:radial-gradient(circle,#16a34a 30%,transparent 32%)}
.db-visual{background:radial-gradient(ellipse 60% 50% at 50% 60%, rgba(74,222,128,.18), transparent 70%),linear-gradient(160deg,#ffffff,#f0eadd);border:1px solid var(--line)}
.db-visual .dbv-icon{opacity:.6;filter:none;color:#16a34a}

/* savings page chart */
.chart-card{background:#ffffff}
.chart-head h4{color:#1a1612}
.chart-head .ch-total{color:#16a34a}
.bc-bar{background:linear-gradient(180deg,#22c55e,#16a34a)}
.bc-bar.petrol{background:linear-gradient(180deg,#ff9a3c,#e0590a)}
.bc-bar .bc-val{color:#5a544c}
.bc-label{color:#8c8478}
.share-row{border-top-color:var(--line)}
.share-row .sr-label{color:#5a544c}

/* dealer page map */
.in-state{fill:#e6ddc9;stroke:#cdc1a9;stroke-width:1.2}
.in-state.covered{fill:rgba(74,222,128,.45)}
.in-state.covered:hover{fill:#22c55e}
.map-pin{fill:#ea580c;stroke:#ffffff;stroke-width:1.6}
.map-legend span{color:#8c8478}

/* dealer search inputs */
.dealer-search input,.dealer-search select{background:#ffffff;border:1px solid var(--line-2);color:#1a1612}
.dealer-search input::placeholder{color:#a39a8c}
.dealer-search input:focus,.dealer-search select:focus{border-color:#16a34a}

/* timeline */
.timeline::before{background:var(--line-2)}
.tl-item::before{background:var(--bg);border-color:#16a34a;background-image:radial-gradient(circle,#16a34a 32%,transparent 34%)}
.tl-item .tl-year{color:#16a34a}
.tl-item h4{color:#1a1612}
.tl-item p{color:#5a544c}

/* certs */
.cert-badge{background:#ffffff}
.cert-badge:hover{border-color:rgba(22,163,74,.30)}
.cert-badge .cb-name{color:#1a1612}
.cert-badge .cb-sub{color:#8c8478}

/* contact form fields */
.field label{color:#5a544c}
.field input,.field textarea{background:#ffffff;border:1px solid var(--line-2);color:#1a1612}
.field input::placeholder,.field textarea::placeholder{color:#a39a8c}
.field input:focus,.field textarea:focus{border-color:#16a34a}
.form-note{color:#8c8478}
.map-embed{background:radial-gradient(ellipse 50% 60% at 50% 50%, rgba(74,222,128,.16), transparent 70%),linear-gradient(160deg,#ffffff,#f0eadd);border-color:var(--line)}
.map-embed div{color:#8c8478}

/* placeholder note tag (orange) */
.ph-tag{color:#c2410c;background:rgba(255,122,26,.10);border:1px solid rgba(255,122,26,.32)}

/* placeholder image tiles (light) */
.ph-img{background:radial-gradient(ellipse 60% 50% at 50% 65%, rgba(74,222,128,.16), transparent 70%),linear-gradient(160deg,#f0eadd,#dccdb3);border-color:var(--line)}
.ph-img .ph-mark{color:rgba(26,22,18,.22)}
.ph-img .ph-note{background:rgba(255,255,255,.78);color:#8c8478}

/* sticky WhatsApp bubble */
.wa-bubble{background:#ffffff;color:#1a1612;border:1px solid var(--line-2);box-shadow:0 8px 24px rgba(0,0,0,.10)}

/* mobile bar — light */
.mobile-bar{background:rgba(245,240,230,.95);border-top:1px solid var(--line)}
.mobile-bar .mb-wa{background:#16a34a;color:#ffffff}
.mobile-bar .mb-call{background:#ffffff;color:#1a1612;border:1px solid var(--line-2)}

/* mobile menu — light */
.mobile-menu{background:rgba(245,240,230,.98)}
.mm-link{color:#1a1612;border-bottom:1px solid var(--line)}
.mm-close{background:#ffffff;color:#1a1612;border:1px solid var(--line-2)}
.mm-sub a{color:#5a544c}
.mm-sub a:hover{color:#16a34a}
.mm-foot .mm-wa{background:#16a34a;color:#ffffff}
.mm-foot .mm-call{background:#ffffff;color:#1a1612;border:1px solid var(--line-2)}

/* cursor glow softer */
.cursor-glow{background:radial-gradient(circle, rgba(74,222,128,.16), rgba(74,222,128,.04) 40%, transparent 70%)}

/* tilt glare softer + lighter shadow */
.tilt .tilt-glare{background:radial-gradient(circle at var(--gx,50%) var(--gy,50%), rgba(255,255,255,.55), transparent 55%)}
.tilt.tilting{box-shadow:0 22px 50px rgba(0,0,0,.18)}

/* scroll-cue (if visible) */
.scroll-cue{color:#8c8478}

/* original hero strikethrough red kept — but it's hidden in new hero markup */
.hero h1 .strike::after{background:#ff7a1a}

/* fix any inadvertent dark backgrounds left from original */
.calc-output .compare-row .name small{color:#a8a39a}

/* dot used in hero-eyebrow original */
.dot{background:#16a34a;box-shadow:0 0 12px rgba(22,163,74,.5)}


/* ============================================================
   PALETTE V2 — NO BLACK ANYWHERE
   Cream base + soft mint, alt-cream, soft peach, warm sand
   tinted washes (replacing the old dark accent sections).
   Forest-green headlines + warm-brown body (no near-black text).
   Brand green/orange pushed for energy.
   ============================================================ */

:root{
  --bg:#f5f0e6;
  --bg-2:#fbf7ef;
  --bg-3:#ffffff;
  --bg-mint:#ecf5e0;
  --bg-peach:#fceadb;
  --bg-sand:#ddc9a5;
  --bg-cream-alt:#ede4cf;
  --ink:#1f3d2e;
  --ink-2:#5a4a3a;
  --ink-3:#9b8c78;
  --line:rgba(31,61,46,.10);
  --line-2:rgba(31,61,46,.20);
  --green:#16a34a;
  --green-deep:#15803d;
  --green-glow:rgba(74,222,128,.26);
  --orange:#ea580c;
}

body{ background:#f5f0e6; color:#5a4a3a; }

/* ---- NAV ---- */
.nav{ background:rgba(245,240,230,.85); border-bottom:1px solid rgba(31,61,46,.10); }
.nav.scrolled{ background:rgba(245,240,230,.97); }
.logo-text{ color:#1f3d2e; }
.nav-link{ color:#5a4a3a; }
.nav-link:hover{ color:#1f3d2e; background:rgba(31,61,46,.05); }
.nav-link.active{ color:#1f3d2e; background:rgba(74,222,128,.22); }
.nav-link.active::after{ background:#16a34a; }
.nav-phone{ color:#9b8c78; }
.nav-phone:hover{ color:#16a34a; }
.dropdown-panel{ background:#ffffff; border:1px solid rgba(31,61,46,.16); box-shadow:0 22px 44px rgba(31,61,46,.14); }
.dropdown-panel a{ color:#5a4a3a; }
.dropdown-panel a:hover{ color:#1f3d2e; background:rgba(31,61,46,.05); }
.dd-cta{ color:#16a34a!important; border-top:1px solid rgba(31,61,46,.10); }
.dd-label{ color:#9b8c78; }
.hamburger{ background:rgba(31,61,46,.06); border:1px solid rgba(31,61,46,.18); }
.hamburger span{ background:#1f3d2e; }

/* ---- BUTTONS (boosted energy) ---- */
.nav-cta{ background:linear-gradient(135deg,#16a34a,#15803d); color:#ffffff; box-shadow:0 4px 14px rgba(22,163,74,.28); }
.nav-cta:hover{ box-shadow:0 10px 26px rgba(22,163,74,.40); }
.btn-primary{ background:linear-gradient(135deg,#16a34a,#15803d); color:#ffffff; box-shadow:0 4px 14px rgba(22,163,74,.28); }
.btn-primary:hover{ background:linear-gradient(135deg,#15803d,#14532d); box-shadow:0 12px 32px rgba(22,163,74,.40); transform:translateY(-2px); }
.btn-secondary{ background:rgba(31,61,46,.04); color:#1f3d2e; border:1px solid rgba(31,61,46,.18); }
.btn-secondary:hover{ background:rgba(31,61,46,.08); }
.btn-hero-ghost{ background:rgba(255,255,255,.55); border:1px solid rgba(31,61,46,.20); color:#1f3d2e; backdrop-filter:blur(6px); }
.btn-hero-ghost:hover{ border-color:#1f3d2e; background:rgba(255,255,255,.78); }
.btn-call{ color:#1f3d2e; border:1px solid rgba(31,61,46,.20); }
.btn-call:hover{ border-color:#16a34a; color:#16a34a; }

/* ---- HERO ---- */
.hs-scrim{ background:linear-gradient(90deg, rgba(245,240,230,.94) 0%, rgba(245,240,230,.62) 32%, rgba(245,240,230,.12) 62%, transparent 82%)!important; }
.hs-vignette{ background:radial-gradient(ellipse 115% 105% at 50% 50%, transparent 50%, rgba(0,0,0,.18) 100%)!important; }
.hero-fade{ background:linear-gradient(to bottom, transparent, #f5f0e6 92%)!important; }
.hero-title .ht-line:first-child{ color:#1f3d2e; }
.hero-title .ht-accent{ background:linear-gradient(115deg,#15803d 0%,#22c55e 55%,#15803d 100%); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.hero-sub{ color:#5a4a3a; }
.hero-sub strong{ color:#1f3d2e; }
.hs-ph-note{ background:rgba(255,255,255,.78); color:#5a4a3a; border:1px solid rgba(31,61,46,.18); }
.dot{ background:#16a34a; box-shadow:0 0 12px rgba(22,163,74,.5); }
.scroll-cue{ color:#9b8c78; }

/* ---- HERO STAT STRIP ---- */
.hero-strip{ background:#f5f0e6; }
.hero-strip .hero-stats{ border-top:1px solid rgba(31,61,46,.10); border-bottom:1px solid rgba(31,61,46,.10); }
.stat-num{ color:#1f3d2e; }
.stat-num .unit{ color:#16a34a; }
.stat-num .currency{ color:#5a4a3a; }
.stat-label{ color:#9b8c78; }

/* ---- MARQUEE: warm-sand slim strip (was dark) ---- */
.marquee{ background:#ddc9a5!important; border-top:none; border-bottom:none; }
.marquee-item{ color:#5a4a3a; }
.marquee-item .num{ color:#15803d; font-weight:600; }
.marquee-item .star{ color:#ea580c; }

/* ---- WHY pillars ---- */
.why{ background:#fbf7ef; }
.pillar{ background:#ffffff; border:1px solid rgba(31,61,46,.10); }
.pillar:hover{ background:#faf5e9; border-color:rgba(22,163,74,.30); }
.pillar h3{ color:#1f3d2e; }
.pillar p{ color:#5a4a3a; }
.pillar-num{ color:#9b8c78; }
.pillar-icon{ background:linear-gradient(135deg, rgba(74,222,128,.24), rgba(74,222,128,.06)); border:1px solid rgba(22,163,74,.32); }
.pillar-tag{ background:rgba(74,222,128,.10); color:#15803d; border:1px solid rgba(22,163,74,.30); }

/* ---- ROI / SAVINGS — soft MINT wash (was dark) ---- */
.roi{ background:linear-gradient(180deg, #ecf5e0 0%, #e2efd2 100%)!important; color:#5a4a3a; }
.roi::before{ color:rgba(22,163,74,.06)!important; }
.roi .section-eyebrow{ color:#15803d; }
.roi .section-eyebrow::before{ background:#15803d; }
.roi .section-heading{ color:#1f3d2e; }
.roi .section-heading .grad{ background:linear-gradient(120deg,#15803d,#22c55e); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.roi .section-heading .it{ color:#5a4a3a; }
.roi .section-sub{ color:#5a4a3a; }
.calc-controls{ background:#ffffff; border-color:rgba(31,61,46,.10); }
.control-label span:first-child{ color:#5a4a3a; }
.control-label .val{ color:#15803d; }
.slider{ background:rgba(31,61,46,.14); }
.toggle{ background:#ffffff; border-color:rgba(31,61,46,.18); color:#5a4a3a; }
.toggle.active{ background:#16a34a; color:#ffffff; border-color:#16a34a; }
.compare-row{ background:#ffffff; border-color:rgba(31,61,46,.10); }
.compare-row.win{ border-color:rgba(22,163,74,.40); background:linear-gradient(90deg, rgba(22,163,74,.12), transparent); }
.compare-row .name{ color:#1f3d2e; }
.compare-row .name small{ color:#9b8c78; }
.compare-row .cost{ color:#1f3d2e; }
.compare-row.win .cost{ color:#15803d; }
.compare-row.lose .cost{ color:#ea580c; }
.savings-card{ background:linear-gradient(135deg, rgba(22,163,74,.16), rgba(22,163,74,.04)); border-color:rgba(22,163,74,.32); }
.savings-card::before{ background:radial-gradient(circle, rgba(74,222,128,.30), transparent 70%); }
.save-stat .label{ color:#5a4a3a; }
.save-stat .num{ color:#15803d; }
.save-stat .num .rs{ color:#16a34a; }
.save-tag{ color:#5a4a3a; }
.save-tag::before{ color:#16a34a; }

/* ---- RANGE / models ---- */
.range{ background:#f5f0e6; }
.tier-tabs{ background:#ffffff; border:1px solid rgba(31,61,46,.10); }
.tier-tab{ color:#5a4a3a; }
.tier-tab.active{ background:#1f3d2e; color:#ffffff; }
.model-card{ background:#ffffff; border:1px solid rgba(31,61,46,.10); }
.model-card:hover{ border-color:rgba(22,163,74,.32); }
.model-card.flagship{ background:linear-gradient(180deg,#ffffff 0%,#f7f1e3 100%); border-color:rgba(22,163,74,.28); }
.model-card.flagship::after{ background:#16a34a; color:#ffffff; }
.model-name{ color:#1f3d2e; }
.model-tagline{ color:#5a4a3a; }
.model-price{ color:#15803d; }
.model-price .rs{ color:#16a34a; }
.model-price small{ color:#9b8c78; }
.spec{ color:#5a4a3a; }
.spec strong{ color:#1f3d2e; }
.model-tier{ background:rgba(31,61,46,.06); color:#5a4a3a; border-color:rgba(31,61,46,.18); }
.model-img{ background:#f0eadd; border-color:rgba(31,61,46,.10); }
.model-specs{ border-top-color:rgba(31,61,46,.10); }

/* ---- HOW IT WORKS ---- */
.how{ background:#fbf7ef; }
.step-num{ background:#ffffff; border:1px solid rgba(31,61,46,.18); color:#15803d; }
.step-num::after{ border-color:rgba(22,163,74,.28); }
.step.whatsapp .step-num{ background:#16a34a; color:#ffffff; border-color:#16a34a; box-shadow:0 0 24px rgba(22,163,74,.32); }
.step h4{ color:#1f3d2e; }
.step p{ color:#5a4a3a; }
.step-badge{ background:rgba(74,222,128,.16); color:#15803d; }

/* ---- COMPARISON — alt-cream wash (was dark) ---- */
.compare{ background:#ede4cf!important; color:#5a4a3a; }
.compare .section-eyebrow{ color:#15803d; }
.compare .section-eyebrow::before{ background:#15803d; }
.compare .section-heading{ color:#1f3d2e; }
.compare .section-heading .grad{ background:linear-gradient(120deg,#15803d,#22c55e); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.compare .section-heading .it{ color:#5a4a3a; }
.compare .section-sub{ color:#5a4a3a; }
.table-wrap{ background:#ffffff; border-color:rgba(31,61,46,.10); }
.compare-table th{ background:#fbf7ef; color:#5a4a3a; border-color:rgba(31,61,46,.10); }
.compare-table th.bonjo-col{ background:linear-gradient(180deg, rgba(22,163,74,.18), rgba(22,163,74,.05)); color:#15803d; }
.compare-table td{ color:#1f3d2e; border-color:rgba(31,61,46,.06); }
.compare-table td:first-child{ color:#5a4a3a; }
.compare-table .bonjo{ background:rgba(22,163,74,.08); color:#15803d; }
.compare-table .check{ color:#15803d; }
.compare-table .x{ color:#ea580c; }
.compare-foot{ color:#5a4a3a; }
.compare-foot strong{ color:#1f3d2e; }

/* ---- COVERAGE ---- */
.coverage{ background:linear-gradient(180deg,#f5f0e6 0%,#fbf7ef 100%); }
.state-pill{ background:#ffffff; color:#5a4a3a; border-color:rgba(31,61,46,.10); }
.state-pill::before{ background:#16a34a; }
.map-frame{ background:#ffffff; border-color:rgba(31,61,46,.10); }

/* ---- TESTIMONIALS ---- */
.testimonials{ background:#fbf7ef; }
.t-card{ background:#ffffff; border-color:rgba(31,61,46,.10); }
.t-card::before{ color:#16a34a; opacity:0.30; }
.stars{ color:#ea580c; }
.t-quote{ color:#1f3d2e; }
.t-author{ border-top:1px solid rgba(31,61,46,.10); }
.t-meta .n{ color:#1f3d2e; }
.t-meta .c{ color:#9b8c78; }
.t-foot{ color:#5a4a3a; }
.t-foot strong{ color:#15803d; }

/* ---- FAQ ---- */
.faq{ background:#f5f0e6; }
.faq-item{ border-color:rgba(31,61,46,.10); }
.faq-q{ color:#1f3d2e; }
.faq-a{ color:#5a4a3a; }
.faq-toggle{ border-color:rgba(31,61,46,.18); color:#5a4a3a; }
.faq-item.open .faq-toggle{ background:#16a34a; color:#ffffff; border-color:#16a34a; }

/* ---- FINAL CTA — soft PEACH wash (was dark) ---- */
.final{ background:linear-gradient(180deg, #fceadb 0%, #f7d9bf 100%)!important; color:#5a4a3a; }
.final::before{ background:radial-gradient(ellipse 70% 60% at 50% 40%, rgba(22,163,74,.14), transparent 70%), radial-gradient(ellipse 40% 30% at 80% 70%, rgba(234,88,12,.14), transparent 70%)!important; }
.final h2{ color:#1f3d2e; }
.final h2 .it{ color:#5a4a3a; }
.final p{ color:#5a4a3a; }
.final-trust{ color:#9b8c78; }

/* ---- FOOTER — warm SAND (was dark) ---- */
footer{ background:#ddc9a5; border-color:transparent; }
.foot-brand .logo-text{ color:#1f3d2e; }
.foot-tag{ color:#5a4a3a; }
.foot-brand p{ color:#5a4a3a; }
.foot-col h5{ color:#5a4a3a; }
.foot-col a{ color:#5a4a3a; }
.foot-col a:hover{ color:#15803d; }
.trust-strip{ border-top:1px solid rgba(31,61,46,.16); border-bottom:1px solid rgba(31,61,46,.16); }
.trust-item{ color:#5a4a3a; }
.trust-item::before{ color:#15803d; }
.foot-bottom{ color:#5a4a3a; }
.foot-legal a{ color:#5a4a3a; }
.foot-legal a:hover{ color:#1f3d2e; }

/* ---- SUB-PAGES (.page-hero etc) ---- */
.page-hero{ background:linear-gradient(180deg,#fbf7ef 0%,#f5f0e6 70%); border-bottom:1px solid rgba(31,61,46,.10); }
.page-hero::before{ background:radial-gradient(ellipse 70% 60% at 80% 10%, rgba(74,222,128,.16), transparent 60%), radial-gradient(ellipse 50% 50% at 10% 90%, rgba(234,88,12,.08), transparent 60%); }
.page-hero h1{ color:#1f3d2e; }
.page-hero h1 .grad{ background:linear-gradient(120deg,#15803d 0%,#22c55e 100%); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.page-hero h1 .it{ color:#5a4a3a; }
.page-hero p.lead{ color:#5a4a3a; }
.crumb{ color:#9b8c78; }
.crumb a{ color:#9b8c78; }
.crumb a:hover{ color:#16a34a; }

/* ---- GENERIC SECTION TYPOGRAPHY ---- */
.inner-section{ background:#f5f0e6; }
.inner-section.alt{ background:#fbf7ef; }
.section-eyebrow{ color:#15803d; }
.section-eyebrow::before{ background:#15803d; }
.section-heading, .section-mini-head{ color:#1f3d2e; }
.section-heading .grad, .section-mini-head .grad{ background:linear-gradient(120deg,#15803d 0%,#22c55e 100%); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.section-heading .it, .section-mini-head .it{ color:#5a4a3a; }
.section-sub, .section-mini-sub{ color:#5a4a3a; }

/* ---- TIER cards ---- */
.tier-card{ background:#ffffff; border:1px solid rgba(31,61,46,.10); }
.tier-card:hover{ background:#faf5e9; border-color:rgba(22,163,74,.32); }
.tier-card .tc-eye{ color:#15803d; }
.tier-card h3{ color:#1f3d2e; }
.tier-card .tc-pitch{ color:#5a4a3a; }
.tier-card .tc-models{ color:#5a4a3a; }
.tier-card .tc-from{ color:#15803d; }
.tier-card .tc-go{ color:#1f3d2e; }
.tier-card:hover .tc-go{ color:#15803d; }

/* ---- SUPPORT cards ---- */
.support-card{ background:#ffffff; border:1px solid rgba(31,61,46,.10); }
.support-card:hover{ background:#faf5e9; border-color:rgba(22,163,74,.32); }
.support-card .sup-icon{ background:linear-gradient(135deg, rgba(74,222,128,.24), rgba(74,222,128,.06)); border:1px solid rgba(22,163,74,.32); }
.support-card h3{ color:#1f3d2e; }
.support-card p{ color:#5a4a3a; }
.support-card .sup-go{ color:#15803d; }

/* ---- PERSONA, FEATURE GRID, SPEC STRIP, BATTERY ---- */
.persona{ background:linear-gradient(135deg, rgba(74,222,128,.14), rgba(74,222,128,.03)); border:1px solid rgba(22,163,74,.32); }
.persona h4{ color:#15803d; }
.persona p{ color:#1f3d2e; }
.feature-grid{ background:rgba(31,61,46,.10); border:1px solid rgba(31,61,46,.10); }
.feature-cell{ background:#ffffff; }
.feature-cell:hover{ background:#faf5e9; }
.feature-cell h5{ color:#1f3d2e; }
.feature-cell p{ color:#5a4a3a; }
.spec-strip{ background:rgba(31,61,46,.10); border:1px solid rgba(31,61,46,.10); }
.spec-cell{ background:#ffffff; }
.spec-cell .sc-label{ color:#9b8c78; }
.spec-cell .sc-val{ color:#1f3d2e; }
.spec-cell .sc-val .u{ color:#16a34a; }
.battery-block{ background:#ffffff; border:1px solid rgba(31,61,46,.10); }
.battery-block .bb-readout{ background:#fbf7ef; border-color:rgba(31,61,46,.10); }
.battery-block .bb-readout .bb-range{ color:#15803d; }
.battery-block .bb-readout .bb-type{ color:#5a4a3a; }

/* ---- DEEP blocks (why-bonjo) ---- */
.deep-block{ border-bottom:1px solid rgba(31,61,46,.10); }
.deep-block .db-eye{ color:#15803d; }
.deep-block h3{ color:#1f3d2e; }
.deep-block h3 .it{ color:#5a4a3a; }
.deep-block p{ color:#5a4a3a; }
.db-point{ color:#5a4a3a; }
.db-point::before{ background:rgba(74,222,128,.18); border:1px solid #15803d; background-image:radial-gradient(circle,#15803d 30%,transparent 32%); }
.db-visual{ background:radial-gradient(ellipse 60% 50% at 50% 60%, rgba(74,222,128,.18), transparent 70%), linear-gradient(160deg,#ffffff,#f0eadd); border:1px solid rgba(31,61,46,.10); }
.db-visual .dbv-icon{ color:#15803d; opacity:0.7; }

/* ---- SAVINGS PAGE chart ---- */
.chart-card{ background:#ffffff; border:1px solid rgba(31,61,46,.10); }
.chart-head h4{ color:#1f3d2e; }
.chart-head .ch-total{ color:#15803d; }
.bc-bar{ background:linear-gradient(180deg,#22c55e,#15803d); }
.bc-bar.petrol{ background:linear-gradient(180deg,#ea580c,#c2410c); }
.bc-bar .bc-val{ color:#5a4a3a; }
.bc-label{ color:#9b8c78; }
.share-row{ border-top:1px solid rgba(31,61,46,.10); }
.share-row .sr-label{ color:#5a4a3a; }

/* ---- DEALERS map + list ---- */
.india-map-wrap{ background:#ffffff; border:1px solid rgba(31,61,46,.10); }
.in-state{ fill:#e6ddc9; stroke:#cdc1a9; stroke-width:1.2; }
.in-state.covered{ fill:rgba(74,222,128,.45); }
.in-state.covered:hover{ fill:#22c55e; }
.map-pin{ fill:#ea580c; stroke:#ffffff; stroke-width:1.6; }
.map-legend span{ color:#9b8c78; }
.dealer-search input, .dealer-search select{ background:#ffffff; border:1px solid rgba(31,61,46,.18); color:#1f3d2e; }
.dealer-search input::placeholder{ color:#9b8c78; }
.dealer-search input:focus, .dealer-search select:focus{ border-color:#16a34a; }
.dealer-card{ background:#ffffff; border-color:rgba(31,61,46,.10); }
.dealer-card:hover{ border-color:rgba(22,163,74,.32); }
.dealer-card .dc-name{ color:#1f3d2e; }
.dealer-card .dc-state{ color:#15803d; }
.dealer-card .dc-addr{ color:#5a4a3a; }

/* ---- ABOUT timeline + certs ---- */
.timeline::before{ background:rgba(31,61,46,.18); }
.tl-item::before{ background:#f5f0e6; border:1px solid #15803d; background-image:radial-gradient(circle,#15803d 32%,transparent 34%); }
.tl-item .tl-year{ color:#15803d; }
.tl-item h4{ color:#1f3d2e; }
.tl-item p{ color:#5a4a3a; }
.cert-badge{ background:#ffffff; border:1px solid rgba(31,61,46,.10); }
.cert-badge:hover{ border-color:rgba(22,163,74,.30); }
.cert-badge .cb-name{ color:#1f3d2e; }
.cert-badge .cb-sub{ color:#9b8c78; }

/* ---- CONTACT ---- */
.ci-card{ background:#ffffff; border:1px solid rgba(31,61,46,.10); }
.ci-card:hover{ border-color:rgba(22,163,74,.32); }
.ci-card .ci-icon{ background:linear-gradient(135deg, rgba(74,222,128,.24), rgba(74,222,128,.06)); border:1px solid rgba(22,163,74,.32); }
.ci-card .ci-label{ color:#9b8c78; }
.ci-card .ci-val{ color:#1f3d2e; }
.ci-card .ci-val small{ color:#5a4a3a; }
.contact-form{ background:#ffffff; border:1px solid rgba(31,61,46,.10); }
.field label{ color:#5a4a3a; }
.field input, .field textarea{ background:#fbf7ef; border:1px solid rgba(31,61,46,.18); color:#1f3d2e; }
.field input::placeholder, .field textarea::placeholder{ color:#9b8c78; }
.field input:focus, .field textarea:focus{ border-color:#16a34a; }
.form-note{ color:#9b8c78; }
.map-embed{ background:radial-gradient(ellipse 50% 60% at 50% 50%, rgba(74,222,128,.16), transparent 70%), linear-gradient(160deg,#ffffff,#f0eadd); border-color:rgba(31,61,46,.10); }
.map-embed div{ color:#9b8c78; }

/* ---- placeholder bits ---- */
.ph-tag{ color:#c2410c; background:rgba(234,88,12,.10); border:1px solid rgba(234,88,12,.32); }
.ph-img{ background:radial-gradient(ellipse 60% 50% at 50% 65%, rgba(74,222,128,.16), transparent 70%), linear-gradient(160deg,#f0eadd,#dccdb3); border-color:rgba(31,61,46,.10); }
.ph-img .ph-mark{ color:rgba(31,61,46,.22); }
.ph-img .ph-note{ background:rgba(255,255,255,.78); color:#5a4a3a; }

/* ---- STICKY / MOBILE ---- */
.wa-bubble{ background:#ffffff; color:#1f3d2e; border:1px solid rgba(31,61,46,.18); box-shadow:0 8px 24px rgba(31,61,46,.10); }
.mobile-bar{ background:rgba(245,240,230,.95); border-top:1px solid rgba(31,61,46,.10); }
.mobile-bar .mb-wa{ background:#16a34a; color:#ffffff; }
.mobile-bar .mb-call{ background:#ffffff; color:#1f3d2e; border:1px solid rgba(31,61,46,.18); }
.mobile-menu{ background:rgba(245,240,230,.98); }
.mm-link{ color:#1f3d2e; border-bottom:1px solid rgba(31,61,46,.10); }
.mm-close{ background:#ffffff; color:#1f3d2e; border:1px solid rgba(31,61,46,.18); }
.mm-sub a{ color:#5a4a3a; }
.mm-sub a:hover{ color:#15803d; }
.mm-foot .mm-wa{ background:#16a34a; color:#ffffff; }
.mm-foot .mm-call{ background:#ffffff; color:#1f3d2e; border:1px solid rgba(31,61,46,.18); }

/* ---- effects: cursor glow + tilt ---- */
.cursor-glow{ background:radial-gradient(circle, rgba(74,222,128,.20), rgba(74,222,128,.05) 40%, transparent 70%); }
.tilt .tilt-glare{ background:radial-gradient(circle at var(--gx,50%) var(--gy,50%), rgba(255,255,255,.60), transparent 55%); }
.tilt.tilting{ box-shadow:0 22px 50px rgba(31,61,46,.18); }


/* ============================================================
   PALETTE V3 — VIBRANT LIGHT (no pastel, no black)
   Warm bright off-white base + vivid gradient washes for
   accent sections (green/lime, sky, amber/peach), pale-green
   footer, brighter brand greens & orange, gradient CTAs.
   Designed for "lively, energetic, uplifting".
   ============================================================ */

:root{
  --bg:#FBFAF5;
  --bg-2:#F5F2EA;
  --bg-3:#FFFFFF;
  --ink:#14532d;
  --ink-2:#3f3f46;
  --ink-3:#71717a;
  --line:rgba(20,83,45,.08);
  --line-2:rgba(20,83,45,.18);
  --green:#22c55e;
  --green-deep:#16a34a;
  --green-darker:#15803d;
  --green-lime:#84cc16;
  --green-glow:rgba(34,197,94,.28);
  --orange:#f97316;
  --orange-deep:#ea580c;
  --amber:#f59e0b;
  --sky:#0ea5e9;
}

body{ background:#FBFAF5; color:#3f3f46; }

/* ============ NAV ============ */
.nav{ background:rgba(251,250,245,.85); border-bottom:1px solid rgba(20,83,45,.08); }
.nav.scrolled{ background:rgba(251,250,245,.97); }
.logo-text{ color:#14532d; }
.nav-link{ color:#3f3f46; }
.nav-link:hover{ color:#14532d; background:rgba(34,197,94,.08); }
.nav-link.active{ color:#14532d; background:rgba(34,197,94,.18); }
.nav-link.active::after{ background:#22c55e; }
.nav-phone{ color:#71717a; }
.nav-phone:hover{ color:#16a34a; }
.dropdown-panel{ background:#ffffff; border:1px solid rgba(20,83,45,.14); box-shadow:0 22px 44px rgba(20,83,45,.10); }
.dropdown-panel a{ color:#3f3f46; }
.dropdown-panel a:hover{ color:#14532d; background:rgba(34,197,94,.08); }
.dd-cta{ color:#16a34a!important; border-top:1px solid rgba(20,83,45,.08); }
.dd-label{ color:#71717a; }
.hamburger{ background:rgba(20,83,45,.06); border:1px solid rgba(20,83,45,.18); }
.hamburger span{ background:#14532d; }

/* ============ BUTTONS — big punch ============ */
.nav-cta{ background:linear-gradient(135deg,#22c55e,#16a34a); color:#ffffff; box-shadow:0 6px 18px rgba(34,197,94,.34); }
.nav-cta:hover{ box-shadow:0 12px 28px rgba(34,197,94,.45); transform:translateY(-1px); }
.btn-primary{ background:linear-gradient(135deg,#22c55e,#16a34a); color:#ffffff; box-shadow:0 6px 18px rgba(34,197,94,.30); }
.btn-primary:hover{ background:linear-gradient(135deg,#16a34a,#15803d); box-shadow:0 16px 36px rgba(34,197,94,.45); transform:translateY(-2px); }
.btn-secondary{ background:#ffffff; color:#14532d; border:1px solid rgba(20,83,45,.18); }
.btn-secondary:hover{ background:#f5fdf7; border-color:#22c55e; color:#16a34a; }
.btn-hero-ghost{ background:rgba(255,255,255,.65); border:1px solid rgba(20,83,45,.22); color:#14532d; backdrop-filter:blur(6px); }
.btn-hero-ghost:hover{ border-color:#16a34a; background:rgba(255,255,255,.85); color:#16a34a; }
.btn-call{ color:#14532d; border:1px solid rgba(20,83,45,.20); }
.btn-call:hover{ border-color:#22c55e; color:#16a34a; }

/* ============ HERO ============ */
.hs-scrim{ background:linear-gradient(90deg, rgba(251,250,245,.94) 0%, rgba(251,250,245,.66) 32%, rgba(251,250,245,.14) 62%, transparent 82%)!important; }
.hs-vignette{ background:radial-gradient(ellipse 115% 105% at 50% 50%, transparent 50%, rgba(0,0,0,.12) 100%)!important; }
.hero-fade{ background:linear-gradient(to bottom, transparent, #FBFAF5 92%)!important; }
.hero-title .ht-line:first-child{ color:#14532d; }
.hero-title .ht-accent{
  background:linear-gradient(120deg, #16a34a 0%, #22c55e 45%, #84cc16 100%);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.hero-sub{ color:#3f3f46; }
.hero-sub strong{ color:#14532d; }
.hs-ph-note{ background:rgba(255,255,255,.85); color:#3f3f46; border:1px solid rgba(20,83,45,.16); }
.dot{ background:#22c55e; box-shadow:0 0 14px rgba(34,197,94,.65); }

/* hero stat strip */
.hero-strip{ background:#FBFAF5; }
.hero-strip .hero-stats{ border-top:1px solid rgba(20,83,45,.08); border-bottom:1px solid rgba(20,83,45,.08); }
.stat-num{ color:#14532d; }
.stat-num .unit{ color:#22c55e; }
.stat-num .currency{ color:#3f3f46; }
.stat-label{ color:#71717a; }

/* ============ MARQUEE — soft amber/sunshine strip ============ */
.marquee{ background:linear-gradient(90deg,#fef3c7 0%,#fde68a 50%,#fef3c7 100%)!important; border-top:none; border-bottom:none; }
.marquee-item{ color:#14532d; font-weight:500; }
.marquee-item .num{ color:#16a34a; font-weight:700; }
.marquee-item .star{ color:#f97316; }

/* ============ WHY — light cards on warm-white ============ */
.why{ background:#F5F2EA; }
.pillar{ background:#ffffff; border:1px solid rgba(20,83,45,.08); }
.pillar:hover{ background:#f7fef8; border-color:rgba(34,197,94,.34); box-shadow:0 14px 32px rgba(34,197,94,.08); }
.pillar h3{ color:#14532d; }
.pillar p{ color:#3f3f46; }
.pillar-num{ color:#71717a; }
.pillar-icon{ background:linear-gradient(135deg, rgba(34,197,94,.32), rgba(132,204,22,.10)); border:1px solid rgba(34,197,94,.36); }
.pillar-tag{ background:rgba(34,197,94,.14); color:#15803d; border:1px solid rgba(34,197,94,.32); }

/* ============ ROI / SAVINGS — vivid GREEN-LIME gradient wash ============ */
.roi{ background:linear-gradient(135deg, #bbf7d0 0%, #ecfccb 100%)!important; color:#3f3f46; }
.roi::before{ color:rgba(22,163,74,.08)!important; }
.roi .section-eyebrow{ color:#15803d; }
.roi .section-eyebrow::before{ background:#22c55e; }
.roi .section-heading{ color:#14532d; }
.roi .section-heading .grad{ background:linear-gradient(120deg,#16a34a,#22c55e,#84cc16); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.roi .section-heading .it{ color:#3f3f46; }
.roi .section-sub{ color:#3f3f46; }
.calc-controls{ background:#ffffff; border-color:rgba(20,83,45,.10); box-shadow:0 12px 28px rgba(20,83,45,.06); }
.control-label span:first-child{ color:#3f3f46; }
.control-label .val{ color:#16a34a; }
.slider{ background:rgba(20,83,45,.14); }
.toggle{ background:#ffffff; border-color:rgba(20,83,45,.18); color:#3f3f46; }
.toggle.active{ background:#22c55e; color:#ffffff; border-color:#22c55e; }
.compare-row{ background:#ffffff; border-color:rgba(20,83,45,.08); }
.compare-row.win{ border-color:#22c55e; background:linear-gradient(90deg, rgba(34,197,94,.14), transparent); }
.compare-row .name{ color:#14532d; }
.compare-row .name small{ color:#71717a; }
.compare-row .cost{ color:#14532d; }
.compare-row.win .cost{ color:#16a34a; }
.compare-row.lose .cost{ color:#f97316; }
.savings-card{ background:linear-gradient(135deg, rgba(34,197,94,.22), rgba(132,204,22,.10)); border:1px solid rgba(34,197,94,.40); }
.savings-card::before{ background:radial-gradient(circle, rgba(34,197,94,.32), transparent 70%); }
.save-stat .label{ color:#3f3f46; }
.save-stat .num{ color:#16a34a; font-weight:700; }
.save-stat .num .rs{ color:#22c55e; }
.save-tag{ color:#3f3f46; }
.save-tag::before{ color:#22c55e; }

/* ============ RANGE ============ */
.range{ background:#FBFAF5; }
.tier-tabs{ background:#ffffff; border:1px solid rgba(20,83,45,.10); box-shadow:0 4px 12px rgba(20,83,45,.04); }
.tier-tab{ color:#3f3f46; }
.tier-tab.active{ background:linear-gradient(135deg,#14532d,#16a34a); color:#ffffff; }
.model-card{ background:#ffffff; border:1px solid rgba(20,83,45,.08); }
.model-card:hover{ border-color:rgba(34,197,94,.36); box-shadow:0 18px 38px rgba(34,197,94,.10); }
.model-card.flagship{ background:linear-gradient(180deg,#ffffff 0%,#f0fdf4 100%); border-color:rgba(34,197,94,.30); }
.model-card.flagship::after{ background:#22c55e; color:#ffffff; }
.model-name{ color:#14532d; }
.model-tagline{ color:#3f3f46; }
.model-price{ color:#16a34a; font-weight:700; }
.model-price .rs{ color:#22c55e; }
.model-price small{ color:#71717a; }
.spec{ color:#3f3f46; }
.spec strong{ color:#14532d; }
.model-tier{ background:rgba(20,83,45,.06); color:#3f3f46; border-color:rgba(20,83,45,.16); }
.model-img{ background:#f0fdf4; border-color:rgba(20,83,45,.08); }
.model-specs{ border-top-color:rgba(20,83,45,.08); }

/* ============ HOW IT WORKS ============ */
.how{ background:#F5F2EA; }
.step-num{ background:#ffffff; border:1px solid rgba(20,83,45,.18); color:#16a34a; }
.step-num::after{ border-color:rgba(34,197,94,.32); }
.step.whatsapp .step-num{ background:linear-gradient(135deg,#22c55e,#16a34a); color:#ffffff; border-color:#22c55e; box-shadow:0 0 28px rgba(34,197,94,.40); }
.step h4{ color:#14532d; }
.step p{ color:#3f3f46; }
.step-badge{ background:rgba(34,197,94,.18); color:#15803d; }

/* ============ COMPARISON — sky-blue gradient wash ============ */
.compare{ background:linear-gradient(135deg, #bae6fd 0%, #e0f2fe 60%, #f0f9ff 100%)!important; color:#3f3f46; }
.compare .section-eyebrow{ color:#0369a1; }
.compare .section-eyebrow::before{ background:#0ea5e9; }
.compare .section-heading{ color:#14532d; }
.compare .section-heading .grad{ background:linear-gradient(120deg,#16a34a,#22c55e); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.compare .section-heading .it{ color:#3f3f46; }
.compare .section-sub{ color:#3f3f46; }
.table-wrap{ background:#ffffff; border-color:rgba(20,83,45,.10); box-shadow:0 12px 28px rgba(14,165,233,.10); }
.compare-table th{ background:#f0f9ff; color:#3f3f46; border-color:rgba(20,83,45,.08); }
.compare-table th.bonjo-col{ background:linear-gradient(180deg, rgba(34,197,94,.22), rgba(34,197,94,.06)); color:#15803d; }
.compare-table td{ color:#14532d; border-color:rgba(20,83,45,.06); }
.compare-table td:first-child{ color:#3f3f46; }
.compare-table .bonjo{ background:rgba(34,197,94,.10); color:#16a34a; }
.compare-table .check{ color:#22c55e; }
.compare-table .x{ color:#f97316; }
.compare-foot{ color:#3f3f46; }
.compare-foot strong{ color:#14532d; }

/* ============ COVERAGE ============ */
.coverage{ background:linear-gradient(180deg,#FBFAF5 0%,#F5F2EA 100%); }
.state-pill{ background:#ffffff; color:#3f3f46; border-color:rgba(20,83,45,.08); }
.state-pill::before{ background:#22c55e; }
.map-frame{ background:#ffffff; border-color:rgba(20,83,45,.10); }

/* ============ TESTIMONIALS ============ */
.testimonials{ background:#F5F2EA; }
.t-card{ background:#ffffff; border-color:rgba(20,83,45,.08); }
.t-card::before{ color:#22c55e; opacity:0.36; }
.stars{ color:#f97316; }
.t-quote{ color:#14532d; }
.t-author{ border-top:1px solid rgba(20,83,45,.08); }
.t-avatar{ background:linear-gradient(135deg,#22c55e,#16a34a); color:#ffffff; }
.t-meta .n{ color:#14532d; }
.t-meta .c{ color:#71717a; }
.t-foot{ color:#3f3f46; }
.t-foot strong{ color:#16a34a; }

/* ============ FAQ ============ */
.faq{ background:#FBFAF5; }
.faq-item{ border-color:rgba(20,83,45,.10); }
.faq-q{ color:#14532d; }
.faq-a{ color:#3f3f46; }
.faq-toggle{ border-color:rgba(20,83,45,.18); color:#3f3f46; }
.faq-item.open .faq-toggle{ background:#22c55e; color:#ffffff; border-color:#22c55e; }

/* ============ FINAL CTA — amber/peach gradient wash ============ */
.final{ background:linear-gradient(135deg, #fdba74 0%, #fde68a 60%, #fef3c7 100%)!important; color:#3f3f46; }
.final::before{ background:radial-gradient(ellipse 70% 60% at 50% 40%, rgba(34,197,94,.16), transparent 70%), radial-gradient(ellipse 40% 30% at 80% 70%, rgba(249,115,22,.16), transparent 70%)!important; }
.final h2{ color:#14532d; }
.final h2 .it{ color:#3f3f46; }
.final p{ color:#3f3f46; }
.final-trust{ color:#71717a; }
.final .btn-call{ color:#14532d; border:1px solid rgba(20,83,45,.22); }
.final .btn-call:hover{ border-color:#16a34a; color:#16a34a; }

/* ============ FOOTER — pale green tint ============ */
footer{ background:#e7f5e1; border-color:transparent; }
.foot-brand .logo-text{ color:#14532d; }
.foot-tag{ color:#15803d; }
.foot-brand p{ color:#3f3f46; }
.foot-col h5{ color:#15803d; }
.foot-col a{ color:#3f3f46; }
.foot-col a:hover{ color:#16a34a; }
.trust-strip{ border-top:1px solid rgba(20,83,45,.12); border-bottom:1px solid rgba(20,83,45,.12); }
.trust-item{ color:#3f3f46; }
.trust-item::before{ color:#16a34a; }
.foot-bottom{ color:#3f3f46; }
.foot-legal a{ color:#3f3f46; }
.foot-legal a:hover{ color:#14532d; }

/* ============ SUB-PAGES ============ */
.page-hero{ background:linear-gradient(180deg,#F5F2EA 0%,#FBFAF5 70%); border-bottom:1px solid rgba(20,83,45,.08); }
.page-hero::before{ background:radial-gradient(ellipse 70% 60% at 80% 10%, rgba(34,197,94,.20), transparent 60%), radial-gradient(ellipse 50% 50% at 10% 90%, rgba(249,115,22,.10), transparent 60%); }
.page-hero h1{ color:#14532d; }
.page-hero h1 .grad{ background:linear-gradient(120deg,#16a34a 0%,#22c55e 50%,#84cc16 100%); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.page-hero h1 .it{ color:#3f3f46; }
.page-hero p.lead{ color:#3f3f46; }
.crumb{ color:#71717a; }
.crumb a{ color:#71717a; }
.crumb a:hover{ color:#16a34a; }

/* ============ GENERIC ============ */
.inner-section{ background:#FBFAF5; }
.inner-section.alt{ background:#F5F2EA; }
.section-eyebrow{ color:#16a34a; }
.section-eyebrow::before{ background:#22c55e; }
.section-heading, .section-mini-head{ color:#14532d; }
.section-heading .grad, .section-mini-head .grad{ background:linear-gradient(120deg,#16a34a 0%,#22c55e 50%,#84cc16 100%); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.section-heading .it, .section-mini-head .it{ color:#3f3f46; }
.section-sub, .section-mini-sub{ color:#3f3f46; }

/* ============ TIER cards ============ */
.tier-card{ background:#ffffff; border:1px solid rgba(20,83,45,.08); }
.tier-card:hover{ background:#f7fef8; border-color:rgba(34,197,94,.36); box-shadow:0 16px 36px rgba(34,197,94,.10); }
.tier-card .tc-eye{ color:#16a34a; }
.tier-card h3{ color:#14532d; }
.tier-card .tc-pitch{ color:#3f3f46; }
.tier-card .tc-models{ color:#3f3f46; }
.tier-card .tc-from{ color:#16a34a; font-weight:700; }
.tier-card .tc-go{ color:#14532d; }
.tier-card:hover .tc-go{ color:#16a34a; }

/* ============ SUPPORT cards ============ */
.support-card{ background:#ffffff; border:1px solid rgba(20,83,45,.08); }
.support-card:hover{ background:#f7fef8; border-color:rgba(34,197,94,.36); box-shadow:0 16px 36px rgba(34,197,94,.10); }
.support-card .sup-icon{ background:linear-gradient(135deg, rgba(34,197,94,.32), rgba(132,204,22,.10)); border:1px solid rgba(34,197,94,.36); }
.support-card h3{ color:#14532d; }
.support-card p{ color:#3f3f46; }
.support-card .sup-go{ color:#16a34a; }

/* ============ persona / feature grid / spec strip / battery ============ */
.persona{ background:linear-gradient(135deg, rgba(34,197,94,.18), rgba(132,204,22,.06)); border:1px solid rgba(34,197,94,.36); }
.persona h4{ color:#16a34a; }
.persona p{ color:#14532d; }
.feature-grid{ background:rgba(20,83,45,.08); border:1px solid rgba(20,83,45,.08); }
.feature-cell{ background:#ffffff; }
.feature-cell:hover{ background:#f7fef8; }
.feature-cell h5{ color:#14532d; }
.feature-cell p{ color:#3f3f46; }
.spec-strip{ background:rgba(20,83,45,.08); border:1px solid rgba(20,83,45,.08); }
.spec-cell{ background:#ffffff; }
.spec-cell .sc-label{ color:#71717a; }
.spec-cell .sc-val{ color:#14532d; }
.spec-cell .sc-val .u{ color:#22c55e; }
.battery-block{ background:#ffffff; border:1px solid rgba(20,83,45,.08); }
.battery-block .bb-readout{ background:linear-gradient(135deg,#ecfccb,#d9f99d); border:1px solid rgba(34,197,94,.30); }
.battery-block .bb-readout .bb-range{ color:#16a34a; font-weight:700; }
.battery-block .bb-readout .bb-type{ color:#15803d; }

/* ============ DEEP blocks (why-bonjo) ============ */
.deep-block{ border-bottom:1px solid rgba(20,83,45,.08); }
.deep-block .db-eye{ color:#16a34a; }
.deep-block h3{ color:#14532d; }
.deep-block h3 .it{ color:#3f3f46; }
.deep-block p{ color:#3f3f46; }
.db-point{ color:#3f3f46; }
.db-point::before{ background:rgba(34,197,94,.22); border:1px solid #22c55e; background-image:radial-gradient(circle,#16a34a 30%,transparent 32%); }
.db-visual{ background:radial-gradient(ellipse 60% 50% at 50% 60%, rgba(34,197,94,.22), transparent 70%), linear-gradient(160deg,#ffffff,#ecfccb); border:1px solid rgba(20,83,45,.08); }
.db-visual .dbv-icon{ color:#16a34a; opacity:0.78; }

/* ============ SAVINGS PAGE chart ============ */
.chart-card{ background:#ffffff; border:1px solid rgba(20,83,45,.08); box-shadow:0 12px 28px rgba(20,83,45,.06); }
.chart-head h4{ color:#14532d; }
.chart-head .ch-total{ color:#16a34a; font-weight:700; }
.bc-bar{ background:linear-gradient(180deg,#22c55e,#16a34a); }
.bc-bar.petrol{ background:linear-gradient(180deg,#f97316,#ea580c); }
.bc-bar .bc-val{ color:#3f3f46; }
.bc-label{ color:#71717a; }
.share-row{ border-top:1px solid rgba(20,83,45,.08); }
.share-row .sr-label{ color:#3f3f46; }

/* ============ DEALERS ============ */
.india-map-wrap{ background:#ffffff; border:1px solid rgba(20,83,45,.08); }
.in-state{ fill:#e7eee0; stroke:#cdd9be; stroke-width:1.2; }
.in-state.covered{ fill:rgba(34,197,94,.45); }
.in-state.covered:hover{ fill:#22c55e; }
.map-pin{ fill:#f97316; stroke:#ffffff; stroke-width:1.6; }
.map-legend span{ color:#71717a; }
.dealer-search input, .dealer-search select{ background:#ffffff; border:1px solid rgba(20,83,45,.18); color:#14532d; }
.dealer-search input::placeholder{ color:#9ca3af; }
.dealer-search input:focus, .dealer-search select:focus{ border-color:#22c55e; box-shadow:0 0 0 3px rgba(34,197,94,.18); }
.dealer-card{ background:#ffffff; border-color:rgba(20,83,45,.08); }
.dealer-card:hover{ border-color:rgba(34,197,94,.36); }
.dealer-card .dc-name{ color:#14532d; }
.dealer-card .dc-state{ color:#16a34a; }
.dealer-card .dc-addr{ color:#3f3f46; }

/* ============ ABOUT timeline + certs ============ */
.timeline::before{ background:rgba(20,83,45,.20); }
.tl-item::before{ background:#FBFAF5; border:2px solid #22c55e; background-image:radial-gradient(circle,#22c55e 32%,transparent 34%); }
.tl-item .tl-year{ color:#16a34a; font-weight:600; }
.tl-item h4{ color:#14532d; }
.tl-item p{ color:#3f3f46; }
.cert-badge{ background:#ffffff; border:1px solid rgba(20,83,45,.08); }
.cert-badge:hover{ border-color:rgba(34,197,94,.34); }
.cert-badge .cb-name{ color:#14532d; }
.cert-badge .cb-sub{ color:#71717a; }

/* ============ CONTACT ============ */
.ci-card{ background:#ffffff; border:1px solid rgba(20,83,45,.08); }
.ci-card:hover{ border-color:rgba(34,197,94,.34); box-shadow:0 12px 28px rgba(34,197,94,.08); }
.ci-card .ci-icon{ background:linear-gradient(135deg, rgba(34,197,94,.32), rgba(132,204,22,.10)); border:1px solid rgba(34,197,94,.36); }
.ci-card .ci-label{ color:#71717a; }
.ci-card .ci-val{ color:#14532d; }
.ci-card .ci-val small{ color:#3f3f46; }
.contact-form{ background:#ffffff; border:1px solid rgba(20,83,45,.08); box-shadow:0 12px 28px rgba(20,83,45,.04); }
.field label{ color:#3f3f46; }
.field input, .field textarea{ background:#FBFAF5; border:1px solid rgba(20,83,45,.16); color:#14532d; }
.field input::placeholder, .field textarea::placeholder{ color:#9ca3af; }
.field input:focus, .field textarea:focus{ border-color:#22c55e; box-shadow:0 0 0 3px rgba(34,197,94,.18); }
.form-note{ color:#71717a; }
.map-embed{ background:radial-gradient(ellipse 50% 60% at 50% 50%, rgba(34,197,94,.18), transparent 70%), linear-gradient(160deg,#ffffff,#ecfccb); border-color:rgba(20,83,45,.08); }
.map-embed div{ color:#71717a; }

/* ============ placeholder bits ============ */
.ph-tag{ color:#c2410c; background:rgba(249,115,22,.10); border:1px solid rgba(249,115,22,.32); }
.ph-img{ background:radial-gradient(ellipse 60% 50% at 50% 65%, rgba(34,197,94,.18), transparent 70%), linear-gradient(160deg,#f0fdf4,#dcfce7); border-color:rgba(20,83,45,.08); }
.ph-img .ph-mark{ color:rgba(20,83,45,.22); }
.ph-img .ph-note{ background:rgba(255,255,255,.85); color:#3f3f46; }

/* ============ STICKY / MOBILE ============ */
.wa-bubble{ background:#ffffff; color:#14532d; border:1px solid rgba(20,83,45,.16); box-shadow:0 8px 24px rgba(34,197,94,.14); }
.wa-btn{ box-shadow:0 8px 24px rgba(37,211,102,.42), 0 0 0 0 rgba(37,211,102,.4); }
.mobile-bar{ background:rgba(251,250,245,.95); border-top:1px solid rgba(20,83,45,.10); }
.mobile-bar .mb-wa{ background:linear-gradient(135deg,#22c55e,#16a34a); color:#ffffff; }
.mobile-bar .mb-call{ background:#ffffff; color:#14532d; border:1px solid rgba(20,83,45,.18); }
.mobile-menu{ background:rgba(251,250,245,.98); }
.mm-link{ color:#14532d; border-bottom:1px solid rgba(20,83,45,.10); }
.mm-close{ background:#ffffff; color:#14532d; border:1px solid rgba(20,83,45,.18); }
.mm-sub a{ color:#3f3f46; }
.mm-sub a:hover{ color:#16a34a; }
.mm-foot .mm-wa{ background:linear-gradient(135deg,#22c55e,#16a34a); color:#ffffff; }
.mm-foot .mm-call{ background:#ffffff; color:#14532d; border:1px solid rgba(20,83,45,.18); }

/* ============ effects ============ */
.cursor-glow{ background:radial-gradient(circle, rgba(34,197,94,.26), rgba(132,204,22,.08) 40%, transparent 70%); }
.tilt .tilt-glare{ background:radial-gradient(circle at var(--gx,50%) var(--gy,50%), rgba(255,255,255,.70), transparent 55%); }
.tilt.tilting{ box-shadow:0 22px 50px rgba(34,197,94,.18); }


/* ============================================================
   CONTEMPORARY — locked palette + Manrope type
   Warm off-white foundation. Brand green (#047857) as the
   constant hero. Single green family (petrol teal removed). No pure black.
   Loud moments: forest marquee, GREEN compare, green-gradient
   final CTA. Savings card = clean white. Type = Manrope.
   ============================================================ */

:root{
  --bg:#FBFAF7;
  --bg-2:#F4F2EC;
  --bg-3:#FFFFFF;
  --ink:#16271D;
  --ink-2:#3F4A43;
  --ink-3:#5E6A62;
  --line:rgba(22,39,29,.08);
  --line-2:rgba(22,39,29,.16);
  --green:#047857;
  --green-deep:#065F46;
  --green-bright:#059669;
  --green-soft:#ECFDF5;
  --green-soft-2:#D1FAE5;
  --teal:#065F46;
  --teal-deep:#065F46;
  --orange:#047857;        /* heritage orange neutralised to brand green (single-green lock) */
  --orange-deep:#065F46;
  --forest:#0F3D2E;
  --display:'Manrope', system-ui, -apple-system, sans-serif;
  --serif:'Manrope', system-ui, sans-serif;
}
/* dealer map: emerald pins on off-white stroke (no orange, no pure black) */
.map-pin{ fill:#047857 !important; stroke:#FBFAF7 !important; }
.map-pin:hover{ fill:#065F46 !important; }
.in-state.covered{ fill:rgba(4,120,87,.16) !important; }

body{ background:#FBFAF7; color:#3F4A43; }

/* ============ TYPE — Manrope across the board (Ather-alike) ============ */
body, input, textarea, select, button{ font-family:'Manrope', system-ui, -apple-system, sans-serif; }
h1,h2,h3,h4,h5,h6, .logo-text, .hero-title, .hero-sub, .section-heading, .section-mini-head,
.compare .section-heading, .final h2, .page-hero h1, .marquee-item, .nav-link, .btn{
  font-family:'Manrope', system-ui, -apple-system, sans-serif !important;
}
.it{ font-style:normal !important; }
.hero-title, .section-heading, .section-mini-head, .compare .section-heading, .final h2, .page-hero h1{
  font-weight:800 !important; letter-spacing:-.02em !important;
}

/* ============ CTAs — 8px corners, brand green gradient ============ */
.btn{
  border-radius:999px!important;
  font-weight:700!important;
  letter-spacing:.005em;
  padding:16px 28px!important;
  transition:transform .2s cubic-bezier(.2,.8,.2,1), box-shadow .25s, background .25s!important;
}
.nav-cta, .btn-primary{
  background:linear-gradient(135deg, #059669, #047857)!important;
  color:#ffffff!important;
  border:none!important;
  border-radius:999px!important;
  box-shadow:0 6px 18px rgba(4,120,87,.28)!important;
  font-weight:700!important;
}
.nav-cta:hover, .btn-primary:hover{
  background:linear-gradient(135deg, #047857, #065F46)!important;
  box-shadow:0 14px 32px rgba(4,120,87,.40)!important;
  transform:translateY(-2px)!important;
}
.btn-secondary{
  background:#ffffff!important; color:#16271D!important;
  border:1.5px solid #16271D!important;
  border-radius:999px!important; font-weight:700!important;
}
.btn-secondary:hover{
  background:#16271D!important; color:#ffffff!important;
  transform:translateY(-2px)!important;
  box-shadow:0 10px 24px rgba(22,39,29,.22)!important;
}
.btn-hero-ghost{
  background:rgba(255,255,255,.65)!important; color:#16271D!important;
  border:1.5px solid #16271D!important;
  border-radius:999px!important; font-weight:700!important;
  backdrop-filter:blur(6px)!important;
}
.btn-hero-ghost:hover{
  background:#16271D!important; color:#ffffff!important;
  transform:translateY(-2px)!important;
}
.btn-call{
  border-radius:999px!important;
  border:1.5px solid #16271D!important;
  color:#16271D!important; font-weight:700!important;
}
.btn-call:hover{ background:#16271D!important; color:#ffffff!important; }
.nav-cta{ padding:10px 18px!important; box-shadow:0 4px 12px rgba(4,120,87,.24)!important; }
.nav-cta:hover{ box-shadow:0 10px 24px rgba(4,120,87,.36)!important; }

/* ============ NAV ============ */
.nav{ background:rgba(251,250,247,.88); border-bottom:1px solid rgba(22,39,29,.08); }
.nav.scrolled{ background:rgba(251,250,247,.98); }
.logo-text{ color:#16271D; font-weight:700; letter-spacing:.04em; }
.nav-link{ color:#3F4A43; font-weight:600; }
.nav-link:hover{ color:#16271D; background:#ECFDF5; }
.nav-link.active{ color:#16271D; background:#ECFDF5; }
.nav-link.active::after{ background:#047857; height:2px; }
.nav-phone{ color:#5E6A62; font-weight:600; }
.nav-phone:hover{ color:#047857; }
.dropdown-panel{
  background:#ffffff;
  border:1px solid rgba(22,39,29,.10);
  border-radius:10px;
  box-shadow:0 24px 48px rgba(22,39,29,.10);
}
.dropdown-panel a{ color:#3F4A43; font-weight:500; }
.dropdown-panel a:hover{ color:#16271D; background:#ECFDF5; }
.dd-cta{ color:#047857!important; font-weight:700; }
.dd-label{ color:#5E6A62; font-weight:600; }
.hamburger{ background:#ffffff; border:1.5px solid #16271D; border-radius:8px; }
.hamburger span{ background:#16271D; }

/* ============ HERO ============ */
.hs-scrim{ background:linear-gradient(90deg, rgba(251,250,247,.95) 0%, rgba(251,250,247,.66) 32%, rgba(251,250,247,.14) 62%, transparent 82%)!important; }
.hs-vignette{ background:radial-gradient(ellipse 115% 105% at 50% 50%, transparent 50%, rgba(22,39,29,.12) 100%)!important; }
.hero-fade{ background:linear-gradient(to bottom, transparent, #FBFAF7 92%)!important; }
.hero-title{ font-weight:800!important; letter-spacing:-.045em!important; }
.hero-title .ht-line:first-child{ color:#16271D; font-weight:800; }
.hero-title .ht-accent{
  background:linear-gradient(120deg, #047857 0%, #065F46 100%)!important;
  -webkit-background-clip:text!important; background-clip:text!important;
  -webkit-text-fill-color:transparent!important;
  font-weight:800!important; font-style:normal!important;
  font-family:'Manrope',system-ui,sans-serif!important;
}
.hero-sub{ color:#3F4A43; font-size:18px; }
.hero-sub strong{ color:#16271D; }
/* enlarged, brand-green hero tagline — high visibility on the bright photo region */
.hero-sub-em{
  display:inline-block; margin-top:8px;
  font-size:clamp(23px,2.6vw,31px) !important; line-height:1.12;
  font-weight:800 !important; color:#047857 !important;
  letter-spacing:-.012em;
}
.hs-ph-note{ display:none !important; }  /* placeholder ribbon removed — real photo is in place */
.dot{ background:#047857; box-shadow:0 0 0 4px rgba(4,120,87,.18); }

/* hero stat strip */
.hero-strip{ background:#FBFAF7; }
.hero-strip .hero-stats{ border-top:1px solid rgba(22,39,29,.10); border-bottom:1px solid rgba(22,39,29,.10); }
.stat-num{ color:#16271D; font-weight:800; }
.stat-num .unit{ color:#047857; }
.stat-num .currency{ color:#3F4A43; }
.stat-label{ color:#5E6A62; font-weight:600; letter-spacing:.08em; }

/* ============ MARQUEE — SOLID FOREST ribbon (loud moment #1) ============ */
.marquee{ background:#0F3D2E!important; border-top:none; border-bottom:none; }
.marquee-item{ color:#CFE3DA; font-weight:700; }
.marquee-item .num{ color:#FFFFFF; font-weight:800; }
.marquee-item .star{ color:#34D399; }

/* ============ WHY pillars — refined editorial cards ============ */
.why{ background:#FBFAF7; }
.pillars{ background:transparent; border:none; gap:20px; }
.pillar{
  background:#ffffff;
  border:1px solid rgba(22,39,29,.10);
  border-radius:14px;
  box-shadow:0 4px 14px rgba(22,39,29,.04);
  transition:transform .25s cubic-bezier(.2,.8,.2,1), box-shadow .3s, border-color .3s;
}
.pillar:hover{
  transform:translateY(-4px);
  border-color:rgba(4,120,87,.36);
  box-shadow:0 18px 36px rgba(4,120,87,.14);
}
.pillar h3{ color:#16271D; font-weight:800; }
.pillar p{ color:#3F4A43; }
.pillar-num{ color:#5E6A62; font-weight:700; letter-spacing:.10em; }
.pillar-icon{
  background:#ECFDF5; color:#047857;
  border:none; border-radius:8px;
  box-shadow:0 4px 12px rgba(4,120,87,.14);
}
.pillar-tag{ background:#ECFDF5; color:#065F46; border:1px solid rgba(4,120,87,.28); border-radius:4px; font-weight:700; }

/* ============ SAVINGS — clean white with green accents ============ */
.roi{ background:#FBFAF7!important; color:#3F4A43; }
.roi::before{ color:rgba(4,120,87,.06)!important; }
.roi .section-eyebrow{ color:#065F46; font-weight:700; }
.roi .section-eyebrow::before{ background:#047857; }
.roi .section-heading{ color:#16271D; font-weight:800; }
.roi .section-heading .grad{
  background:linear-gradient(120deg, #047857, #065F46)!important;
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent;
}
.roi .section-heading .it{ color:#3F4A43; font-style:normal; }
.roi .section-sub{ color:#3F4A43; }
.calc-controls{
  background:#ffffff; border:1px solid rgba(22,39,29,.10);
  border-radius:14px; box-shadow:0 8px 24px rgba(22,39,29,.06);
}
.control-label span:first-child{ color:#3F4A43; font-weight:600; }
.control-label .val{ color:#047857; font-weight:700; }
.slider{ background:rgba(22,39,29,.14); }
.toggle{
  background:#ffffff; border:1px solid rgba(22,39,29,.14);
  color:#3F4A43; border-radius:8px; font-weight:600;
}
.toggle.active{ background:#047857; color:#ffffff; border-color:#047857; }
.compare-row{
  background:#ffffff;
  border:1px solid rgba(22,39,29,.08); border-radius:10px;
}
.compare-row.win{
  background:linear-gradient(90deg, rgba(4,120,87,.12), rgba(4,120,87,.01));
  border:1.5px solid #047857;
}
.compare-row .name{ color:#16271D; }
.compare-row .name small{ color:#5E6A62; }
.compare-row .cost{ color:#16271D; font-weight:700; }
.compare-row.win .cost{ color:#065F46; font-weight:800; }
.compare-row.lose .cost{ color:#E11D48; }
.savings-card{
  background:#FCFCFB;
  border:1.5px solid #047857; border-radius:14px;
  box-shadow:0 12px 32px rgba(4,120,87,.16);
  color:#16271D;
}
.savings-card::before{ display:none; }
.save-stat .label{ color:#065F46; font-weight:700; letter-spacing:.08em; }
.save-stat .num{ color:#065F46; font-weight:800; }
.save-stat .num .rs{ color:#047857; }
.save-tag{ color:#3F4A43; font-style:normal; font-weight:500; }
.save-tag::before{ color:#047857; }

/* ============ RANGE — refined cards ============ */
.range{ background:#FBFAF7; }
.tier-tabs{
  background:#ffffff; border:1px solid rgba(22,39,29,.10);
  border-radius:10px; padding:4px;
}
.tier-tab{ color:#3F4A43; border-radius:6px; font-weight:700; }
.tier-tab.active{ background:#16271D; color:#ffffff; }
.model-card{
  background:#ffffff;
  border:1px solid rgba(22,39,29,.08);
  border-radius:14px;
  box-shadow:0 4px 14px rgba(22,39,29,.04);
  transition:transform .25s, box-shadow .3s, border-color .3s;
}
.model-card:hover{
  transform:translateY(-4px);
  border-color:rgba(4,120,87,.36);
  box-shadow:0 18px 40px rgba(4,120,87,.16);
}
.model-card.flagship{
  background:linear-gradient(180deg, #ffffff 0%, #ECFDF5 100%);
  border-color:rgba(4,120,87,.30);
}
.model-card.flagship::after{ background:#16271D; color:#ffffff; border-radius:6px; font-weight:700; }
.model-name{ color:#16271D; font-weight:800; }
.model-tagline{ color:#3F4A43; }
.model-price{ color:#065F46; font-weight:800; }
.model-price .rs{ color:#047857; }
.model-price small{ color:#5E6A62; }
.spec{ color:#3F4A43; }
.spec strong{ color:#16271D; }
.model-tier{ background:#ECFDF5; color:#065F46; border-color:rgba(4,120,87,.28); border-radius:4px; font-weight:700; }
.model-img{ background:#F4F2EC; border:1px solid rgba(22,39,29,.06); border-radius:10px; }
.model-specs{ border-top:1px solid rgba(22,39,29,.08); }

/* ============ HOW — warm pale alt ============ */
.how{ background:#F4F2EC; }
.steps::before{ background:repeating-linear-gradient(90deg, rgba(22,39,29,.18) 0 6px, transparent 6px 14px); }
.step-num{
  background:#ffffff;
  border:1.5px solid #16271D; border-radius:10px;
  color:#047857; font-weight:800;
  box-shadow:0 4px 12px rgba(22,39,29,.06);
}
.step-num::after{ display:none; }
.step.whatsapp .step-num{
  background:linear-gradient(135deg, #059669, #047857);
  color:#ffffff; border-color:#16271D;
  box-shadow:0 8px 22px rgba(4,120,87,.34);
}
.step h4{ color:#16271D; font-weight:800; }
.step p{ color:#3F4A43; }
.step-badge{ background:#ECFDF5; color:#065F46; border:1px solid rgba(4,120,87,.28); border-radius:4px; font-weight:800; }

/* ============ COMPARISON — now uses the Loud 3 green (teal removed) ============ */
.compare{ background:linear-gradient(135deg, #047857 0%, #065F46 100%)!important; color:#FFFFFF; }
.compare .section-eyebrow{ color:#D1FAE5; font-weight:700; opacity:1; }
.compare .section-eyebrow::before{ background:#A7F3D0; }
.compare .section-heading{ color:#FFFFFF; font-weight:800; }
.compare .section-heading .grad{
  color:#FFFFFF!important; background:none!important;
  -webkit-text-fill-color:#FFFFFF!important;
  text-decoration:underline; text-decoration-color:#A7F3D0;
  text-decoration-thickness:4px; text-underline-offset:6px;
}
.compare .section-heading .it{ color:rgba(255,255,255,.82); font-style:normal; }
.compare .section-sub{ color:rgba(255,255,255,.88); }
.table-wrap{
  background:#ffffff;
  border:1px solid rgba(22,39,29,.10); border-radius:14px;
  box-shadow:0 16px 40px rgba(8,51,68,.30);
}
.compare-table th{ background:#FBFAF7; color:#16271D; border-color:rgba(22,39,29,.10); font-weight:700; }
.compare-table th.bonjo-col{ background:#047857; color:#ffffff; }
.compare-table td{ color:#16271D; border-color:rgba(22,39,29,.06); }
.compare-table td:first-child{ color:#3F4A43; font-weight:500; }
.compare-table .bonjo{ background:#ECFDF5; color:#065F46; font-weight:700; }
.compare-table .check{ color:#047857; font-weight:800; }
.compare-table .x{ color:#E11D48; font-weight:800; }
.compare-foot{ color:rgba(255,255,255,.9); }
.compare-foot strong{ color:#FFFFFF; }

/* ============ COVERAGE ============ */
.coverage{ background:#FBFAF7; }
.state-pill{
  background:#ffffff; color:#3F4A43;
  border:1px solid rgba(22,39,29,.10); border-radius:6px;
  font-weight:500;
}
.state-pill::before{ background:#047857; }
.map-frame{
  background:#ffffff; border:1px solid rgba(22,39,29,.10);
  border-radius:14px; box-shadow:0 12px 32px rgba(22,39,29,.06);
}

/* ============ TESTIMONIALS ============ */
.testimonials{ background:#F4F2EC; }
.t-card{
  background:#ffffff; border:1px solid rgba(22,39,29,.08);
  border-radius:14px; box-shadow:0 4px 14px rgba(22,39,29,.04);
  transition:transform .25s, box-shadow .3s, border-color .3s;
}
.t-card:hover{ transform:translateY(-3px); border-color:rgba(4,120,87,.30); box-shadow:0 16px 36px rgba(4,120,87,.12); }
.t-card::before{ color:#A7F3D0; opacity:.9; }
.stars{ color:#065F46; }
.t-quote{ color:#16271D; font-style:normal; font-weight:500; }
.t-author{ border-top:1px solid rgba(22,39,29,.08); }
.t-avatar{
  background:linear-gradient(135deg, #059669, #047857);
  color:#ffffff; border-radius:8px; font-weight:700;
}
.t-meta .n{ color:#16271D; font-weight:800; }
.t-meta .c{ color:#5E6A62; font-weight:600; }
.t-foot{ color:#3F4A43; }
.t-foot strong{ color:#065F46; }

/* ============ FAQ ============ */
.faq{ background:#FBFAF7; }
.faq-item{ border-color:rgba(22,39,29,.10); }
.faq-q{ color:#16271D; font-weight:800; }
.faq-a{ color:#3F4A43; }
.faq-toggle{
  background:#ffffff; border:1px solid rgba(22,39,29,.14);
  color:#3F4A43; border-radius:8px;
}
.faq-item.open .faq-toggle{ background:#047857; color:#ffffff; border-color:#047857; }

/* ============ FINAL CTA — green-gradient block (loud moment #3) ============ */
.final{ background:linear-gradient(135deg, #047857 0%, #065F46 100%)!important; color:#FFFFFF; }
.final::before{
  background:radial-gradient(ellipse 60% 50% at 50% 40%, rgba(255,255,255,.10), transparent 70%),
             radial-gradient(ellipse 30% 30% at 80% 70%, rgba(52,211,153,.28), transparent 70%)!important;
}
.final h2{ color:#FFFFFF; font-weight:800; }
.final h2 .it{ color:rgba(255,255,255,.80); font-style:normal; }
.final p{ color:#D1FAE5; }
.final-trust{ color:rgba(255,255,255,.66); }
.final .btn-primary{
  background:#FFFFFF!important; color:#065F46!important;
  border:none!important;
  box-shadow:0 8px 22px rgba(0,0,0,.18)!important;
}
.final .btn-primary:hover{
  background:#ECFDF5!important; color:#065F46!important;
  box-shadow:0 14px 32px rgba(0,0,0,.24)!important;
  transform:translateY(-2px)!important;
}
.final .btn-secondary{ background:transparent!important; color:#FFFFFF!important; border:1.5px solid rgba(255,255,255,.7)!important; }
.final .btn-secondary:hover{ background:#FFFFFF!important; color:#065F46!important; }
.final .btn-call{ color:#FFFFFF!important; border:1.5px solid rgba(255,255,255,.7)!important; }
.final .btn-call:hover{ background:#FFFFFF!important; color:#065F46!important; }

/* ============ FOOTER — warm pale ============ */
footer{ background:#F4F2EC; border-color:transparent; }
.foot-brand .logo-text{ color:#16271D; }
.foot-tag{ color:#047857; font-weight:700; }
.foot-brand p{ color:#3F4A43; }
.foot-col h5{ color:#16271D; font-weight:800; letter-spacing:.10em; }
.foot-col a{ color:#3F4A43; font-weight:500; }
.foot-col a:hover{ color:#047857; }
.trust-strip{ border-top:1px solid rgba(22,39,29,.12); border-bottom:1px solid rgba(22,39,29,.12); }
.trust-item{ color:#3F4A43; font-weight:600; }
.trust-item::before{ color:#047857; }
.foot-bottom{ color:#5E6A62; }
.foot-legal a{ color:#5E6A62; }
.foot-legal a:hover{ color:#16271D; }

/* ============ SUB-PAGES (ready for the sitewide roll; harmless on index) ============ */
.page-hero{ background:#FBFAF7; border-bottom:1px solid rgba(22,39,29,.10); }
.page-hero::before{ background:radial-gradient(ellipse 60% 50% at 80% 10%, rgba(4,120,87,.16), transparent 60%), radial-gradient(ellipse 50% 50% at 10% 90%, rgba(6,95,70,.10), transparent 60%); }
.page-hero h1{ color:#16271D; font-weight:800; }
.page-hero h1 .grad{ background:linear-gradient(120deg, #047857, #065F46); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.page-hero h1 .it{ color:#3F4A43; font-style:normal; }
.page-hero p.lead{ color:#3F4A43; }
/* model-detail hero (md-*) */
.md-info h1{ color:#16271D; font-weight:800; }
.md-tagline{ color:#5E6A62; font-weight:600; }
.md-price{ color:#065F46; font-weight:800; }
.md-price .rs{ color:#047857; }
.md-price small{ color:#5E6A62; font-weight:600; }
.crumb{ color:#5E6A62; font-weight:600; }
.crumb a:hover{ color:#047857; }

/* ============ generic sections ============ */
.inner-section{ background:#FBFAF7; }
.inner-section.alt{ background:#F4F2EC; }
.section-eyebrow{ color:#065F46; font-weight:700; }
.section-eyebrow::before{ background:#047857; }
.section-heading, .section-mini-head{ color:#16271D; font-weight:800; }
.section-heading .grad, .section-mini-head .grad{
  background:linear-gradient(120deg, #047857, #065F46);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
}
.section-heading .it, .section-mini-head .it{ color:#3F4A43; font-style:normal; }
.section-sub, .section-mini-sub{ color:#3F4A43; }

/* cards across sub-pages */
.tier-card, .support-card, .cert-badge, .ci-card, .dealer-card, .chart-card, .contact-form, .battery-block, .india-map-wrap{
  background:#ffffff;
  border:1px solid rgba(22,39,29,.08);
  border-radius:14px;
  box-shadow:0 4px 14px rgba(22,39,29,.04);
  transition:transform .25s, box-shadow .3s, border-color .3s;
}
.tier-card:hover, .support-card:hover, .ci-card:hover, .dealer-card:hover, .cert-badge:hover{
  transform:translateY(-3px);
  border-color:rgba(4,120,87,.32);
  box-shadow:0 18px 38px rgba(4,120,87,.14);
}
.tier-card .tc-eye, .support-card .sup-go, .dealer-card .dc-state{ color:#065F46; font-weight:700; }
.tier-card h3, .support-card h3, .feature-cell h5, .dealer-card .dc-name, .ci-card .ci-val, .cert-badge .cb-name{ color:#16271D; font-weight:800; }
.tier-card .tc-pitch, .tier-card .tc-models, .support-card p, .feature-cell p, .dealer-card .dc-addr, .ci-card .ci-val small{ color:#3F4A43; }
.tier-card .tc-from{ color:#065F46; font-weight:800; }
.tier-card .tc-go{ color:#16271D; font-weight:700; }
.tier-card:hover .tc-go{ color:#047857; }
.support-card .sup-icon, .ci-card .ci-icon{ background:#ECFDF5; color:#047857; border:none; border-radius:10px; }
.ci-card .ci-label{ color:#5E6A62; font-weight:600; letter-spacing:.08em; }
.cert-badge .cb-sub{ color:#5E6A62; font-weight:600; }

/* persona / feature / spec / battery */
.persona{
  background:linear-gradient(135deg, #ECFDF5, #FFFFFF);
  border:1px solid rgba(4,120,87,.28); border-radius:14px;
  box-shadow:0 8px 24px rgba(4,120,87,.08);
}
.persona h4{ color:#065F46; font-weight:800; }
.persona p{ color:#16271D; font-style:normal; }
.feature-grid{ background:rgba(22,39,29,.08); border:1px solid rgba(22,39,29,.08); border-radius:14px; gap:1px; }
.feature-cell{ background:#ffffff; }
.feature-cell:hover{ background:#ECFDF5; }
.feature-cell h5{ color:#16271D; font-weight:800; }
.feature-cell p{ color:#3F4A43; }
.spec-strip{ background:rgba(22,39,29,.08); border:1px solid rgba(22,39,29,.08); border-radius:14px; gap:1px; }
.spec-cell{ background:#ffffff; }
.spec-cell .sc-label{ color:#5E6A62; font-weight:600; }
.spec-cell .sc-val{ color:#16271D; font-weight:800; }
.spec-cell .sc-val .u{ color:#047857; }
.battery-block .bb-readout{
  background:#ECFDF5; border:1px solid rgba(4,120,87,.28); color:#16271D;
}
.battery-block .bb-readout .bb-range{ color:#065F46; font-weight:800; }
.battery-block .bb-readout .bb-type{ color:#3F4A43; }

/* deep blocks (why-bonjo) */
.deep-block{ border-bottom:1px solid rgba(22,39,29,.10); }
.deep-block .db-eye{ color:#065F46; font-weight:700; }
.deep-block h3{ color:#16271D; font-weight:800; }
.deep-block h3 .it{ color:#3F4A43; font-style:normal; }
.deep-block p{ color:#3F4A43; }
.db-point{ color:#3F4A43; }
.db-point::before{ background:#047857; border:none; background-image:none; }
.db-visual{
  background:linear-gradient(160deg, #ECFDF5, #FFFFFF);
  border:1px solid rgba(4,120,87,.22); border-radius:14px;
  box-shadow:0 8px 24px rgba(4,120,87,.10);
}
.db-visual .dbv-icon{ color:#065F46; opacity:.85; }

/* chart */
.chart-head h4{ color:#16271D; font-weight:800; }
.chart-head .ch-total{ color:#047857; font-weight:800; }
.bc-bar{ background:linear-gradient(180deg, #34D399, #047857); border-radius:6px 6px 0 0; }
.bc-bar.petrol{ background:linear-gradient(180deg, #FB7185, #E11D48); border-radius:6px 6px 0 0; }
.bc-bar .bc-val{ color:#16271D; font-weight:700; }
.bc-label{ color:#5E6A62; font-weight:600; }
.share-row{ border-top:1px solid rgba(22,39,29,.10); }
.share-row .sr-label{ color:#3F4A43; font-weight:500; }

/* dealers map */
.in-state{ fill:#F4F2EC; stroke:#16271D; stroke-width:1.2; }
.in-state.covered{ fill:#047857; }
.in-state.covered:hover{ fill:#065F46; }
.map-pin{ fill:#16271D; stroke:#ffffff; stroke-width:2; }
.map-legend span{ color:#5E6A62; font-weight:600; }
.dealer-search input, .dealer-search select{
  background:#ffffff; border:1px solid rgba(22,39,29,.14);
  border-radius:8px; color:#16271D; font-weight:500;
}
.dealer-search input::placeholder{ color:#5E6A62; }
.dealer-search input:focus, .dealer-search select:focus{ border-color:#047857; box-shadow:0 0 0 3px rgba(4,120,87,.18); }

/* timeline */
.timeline::before{ background:rgba(22,39,29,.20); }
.tl-item::before{
  background:#047857; border:1.5px solid #16271D;
  background-image:none; border-radius:4px; width:14px; height:14px;
}
.tl-item .tl-year{ color:#065F46; font-weight:800; }
.tl-item h4{ color:#16271D; font-weight:800; }
.tl-item p{ color:#3F4A43; }

/* contact form */
.field label{ color:#16271D; font-weight:700; letter-spacing:.06em; }
.field input, .field textarea{
  background:#FBFAF7; border:1px solid rgba(22,39,29,.14);
  border-radius:8px; color:#16271D; font-weight:500;
}
.field input::placeholder, .field textarea::placeholder{ color:#5E6A62; }
.field input:focus, .field textarea:focus{ border-color:#047857; box-shadow:0 0 0 3px rgba(4,120,87,.18); }
.form-note{ color:#5E6A62; }
.map-embed{
  background:linear-gradient(160deg, #ECFDF5, #FFFFFF);
  border:1px solid rgba(4,120,87,.22); border-radius:14px;
}
.map-embed div{ color:#065F46; font-weight:700; }

/* placeholders */
.ph-tag{
  color:#E11D48; background:#FFE4E6;
  border:1px solid rgba(225,29,72,.30); border-radius:4px; font-weight:700;
}
.ph-img{
  background:linear-gradient(160deg, #ECFDF5, #F4F2EC);
  border:1px solid rgba(22,39,29,.08); border-radius:10px;
}
.ph-img .ph-mark{ color:rgba(22,39,29,.24); font-weight:800; }
.ph-img .ph-note{ background:#16271D; color:#ffffff; font-weight:700; border-radius:4px; }

/* sticky / mobile */
.wa-bubble{
  background:#047857; color:#ffffff;
  border:1px solid #047857; border-radius:10px;
  box-shadow:0 8px 24px rgba(4,120,87,.24);
}
.mobile-bar{ background:rgba(251,250,247,.96); border-top:1px solid rgba(22,39,29,.10); }
.mobile-bar .mb-wa{ background:linear-gradient(135deg, #059669, #047857); color:#ffffff; border-radius:8px; font-weight:700; }
.mobile-bar .mb-call{ background:#ffffff; color:#16271D; border:1.5px solid #16271D; border-radius:8px; font-weight:700; }
.mobile-menu{ background:#FBFAF7; }
.mm-link{ color:#16271D; border-bottom:1px solid rgba(22,39,29,.10); font-weight:700; }
.mm-close{ background:#ffffff; color:#16271D; border:1.5px solid #16271D; border-radius:8px; }
.mm-sub a{ color:#3F4A43; font-weight:500; }
.mm-sub a:hover{ color:#047857; }
.mm-foot .mm-wa{ background:linear-gradient(135deg, #059669, #047857); color:#ffffff; border-radius:8px; font-weight:700; }
.mm-foot .mm-call{ background:#ffffff; color:#16271D; border:1.5px solid #16271D; border-radius:8px; font-weight:700; }

/* effects */
.cursor-glow{ background:radial-gradient(circle, rgba(4,120,87,.22), rgba(6,95,70,.06) 40%, transparent 70%); }
.tilt .tilt-glare{ background:radial-gradient(circle at var(--gx,50%) var(--gy,50%), rgba(255,255,255,.70), transparent 55%); }
.tilt.tilting{ box-shadow:0 22px 50px rgba(4,120,87,.18); }

/* ============================================================
   ROBUST ACCENT TEXT — fixes the invisible "Bonjo saves you".
   Gradient-clipped text (-webkit-text-fill-color:transparent +
   background-clip:text) renders INVISIBLE on some mobile /
   embedded browsers. Force every accent word to a solid green so
   it is 100% visible everywhere. The comparison block sits on
   green, so its accent word stays white.
   ============================================================ */
.grad, .ht-accent, .hero-title .ht-accent,
.section-heading .grad, .section-mini-head .grad,
.roi .section-heading .grad, .page-hero h1 .grad,
.deep-block h3 .grad{
  background:none !important; background-image:none !important;
  -webkit-background-clip:border-box !important; background-clip:border-box !important;
  -webkit-text-fill-color:#047857 !important; color:#047857 !important;
}
.compare .section-heading .grad{
  background:none !important; background-image:none !important;
  -webkit-background-clip:border-box !important; background-clip:border-box !important;
  -webkit-text-fill-color:#FFFFFF !important; color:#FFFFFF !important;
}
/* flagship / tier badge must sit ABOVE the model photo */
.model-img{ position:relative; }
.model-img .model-tier{ position:absolute; top:12px; left:12px; z-index:4; }
.model-card.flagship::after, .model-card .model-tier{ z-index:4 !important; }

/* ===== BLOG DETAIL / ARTICLE ===== */
.article-wrap{ display:grid; grid-template-columns:1fr 320px; gap:48px; align-items:start; max-width:1080px; margin:0 auto; }
.article-main{ min-width:0; }
.article-cat{ font-family:var(--mono); font-size:12px; letter-spacing:.14em; text-transform:uppercase; color:#065F46; font-weight:700; }
.article-title{ font-family:'Manrope',system-ui,sans-serif; font-weight:800; color:#16271D; font-size:clamp(30px,4vw,46px); line-height:1.1; letter-spacing:-.02em; margin:10px 0 14px; }
.article-meta{ color:#5E6A62; font-size:14px; font-weight:600; margin-bottom:28px; }
.toc{ background:#F4F2EC; border:1px solid rgba(22,39,29,.08); border-radius:14px; padding:18px 22px; margin-bottom:32px; }
.toc-title{ font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:#5E6A62; font-weight:700; margin-bottom:8px; }
.toc a{ display:block; color:#065F46; font-weight:600; text-decoration:none; padding:6px 0; font-size:15px; border-bottom:1px solid rgba(22,39,29,.06); }
.toc a:last-child{ border-bottom:none; }
.toc a:hover{ color:#047857; }
.article-body{ color:#3F4A43; font-size:16.5px; line-height:1.8; }
.article-body h2{ color:#16271D; font-weight:800; font-size:24px; margin:34px 0 12px; letter-spacing:-.01em; scroll-margin-top:90px; }
.article-body p{ margin:0 0 18px; }
.article-body ul{ margin:0 0 18px 22px; }
.article-body li{ margin-bottom:8px; }
.author-box{ display:flex; gap:16px; align-items:center; margin-top:46px; padding-top:26px; border-top:1px solid rgba(22,39,29,.10); }
.author-box .av{ width:54px; height:54px; border-radius:50%; background:linear-gradient(135deg,#059669,#047857); color:#fff; display:flex; align-items:center; justify-content:center; font-weight:800; font-size:22px; flex:none; }
.author-box .an{ color:#16271D; font-weight:800; }
.author-box .ab{ color:#5E6A62; font-size:14px; line-height:1.5; }
.article-side{ position:sticky; top:96px; }
.side-cta{ background:linear-gradient(135deg,#047857,#065F46); color:#fff; border-radius:18px; padding:28px 24px; box-shadow:0 16px 40px rgba(4,120,87,.18); }
.side-cta h4{ color:#fff; font-weight:800; font-size:20px; margin-bottom:8px; }
.side-cta p{ color:#D1FAE5; font-size:14px; line-height:1.6; margin-bottom:18px; }
.side-cta .btn{ width:100%; justify-content:center; background:#fff !important; color:#065F46 !important; border-radius:999px !important; }
.related-posts{ max-width:1080px; margin:66px auto 0; }
.related-posts h3{ color:#16271D; font-weight:800; font-size:24px; margin-bottom:22px; letter-spacing:-.01em; }
@media(max-width:880px){ .article-wrap{ grid-template-columns:1fr; } .article-side{ position:static; margin-top:32px; } }

/* ===== responsive hardening + how-it-works 4-step row ===== */
body{ overflow-x:hidden; }
.table-wrap{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
.steps-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:rgba(22,39,29,.08); border:1px solid rgba(22,39,29,.08); border-radius:14px; overflow:hidden; }
@media(max-width:1024px){ .steps-grid{ grid-template-columns:repeat(2,1fr); } }
@media(max-width:640px){ .steps-grid{ grid-template-columns:1fr; } }
@media(max-width:480px){ .hero-strip .hero-stats{ gap:10px; } .hero-strip .stat-num{ font-size:20px; } }

/* deploy build: external hero image (replaces base64) */
/*
.hs-photo{ background:#0F3D2E url('../images/hero.jpg') center 46%/cover no-repeat !important; }
*/
 
.hs-photo{ background:#0F3D2E url('https://bonjoev.com/wp-content/uploads/2026/06/Bonjoev_hero.jpg') center 46%/cover no-repeat !important; }



p:has(.ph-tag){
    display:none !important;
}