/* XD Battery — Dark Industrial theme */
:root{
  --bg:#101114; --panel:#17181c; --panel2:#1e2025; --ink:#ece9e2; --mut:#a49e90;
  --amber:#f5b301; --amber2:#ffcf3f; --line:#2c2e33; --dark:#0a0a0b;
}
*{box-sizing:border-box}
body{margin:0;font-family:"Segoe UI",system-ui,-apple-system,Arial,sans-serif;color:var(--ink);background:var(--bg);line-height:1.65}
a{color:var(--amber2);text-decoration:none}
a:hover{text-decoration:underline}
header{background:var(--dark);border-bottom:3px solid var(--amber);position:sticky;top:0;z-index:50}
.hin{max-width:1240px;margin:0 auto;display:flex;align-items:center;gap:26px;padding:0 20px;min-height:66px}
.logo{display:inline-flex;align-items:center;gap:11px;color:#fff;font-weight:800;letter-spacing:.05em;text-transform:uppercase}
.logo .mark{background:var(--amber);color:#111;padding:4px 9px;font-weight:900;border-radius:2px}
.logo small{display:block;font-weight:600;font-size:10.5px;color:var(--mut);letter-spacing:.2em}
nav{margin-left:auto}
ul.nav{list-style:none;margin:0;padding:0;display:flex;gap:2px}
ul.nav>li{position:relative}
ul.nav>li>a{color:#e8e4d8;display:block;padding:23px 12px;font-size:15px;font-weight:600}
ul.nav>li>a:hover{color:var(--amber2);text-decoration:none;background:rgba(245,179,1,.07)}
ul.nav .car{font-size:10px;color:var(--amber)}
ul.nav ul.menu{display:none;position:absolute;left:0;top:100%;background:var(--panel2);min-width:255px;list-style:none;margin:0;padding:8px 0;box-shadow:0 16px 36px rgba(0,0,0,.55);border-top:3px solid var(--amber);z-index:60}
ul.nav li.has-menu:hover ul.menu,ul.nav li.has-menu:focus-within ul.menu{display:block}
ul.nav ul.menu a{color:var(--ink);display:block;padding:8px 18px;font-size:14px}
ul.nav ul.menu a:hover{background:rgba(245,179,1,.1);text-decoration:none;color:var(--amber2)}
.hcta{background:var(--amber);color:#141414!important;padding:10px 18px;border-radius:2px;font-weight:800;white-space:nowrap;text-transform:uppercase;font-size:13px;letter-spacing:.05em}
.hcta:hover{background:var(--amber2);text-decoration:none}
.hero{background:radial-gradient(1100px 480px at 85% -10%,rgba(245,179,1,.16),transparent 60%),linear-gradient(165deg,#151619 0%,#0c0c0e 75%);border-bottom:1px solid var(--line)}
.hero-in{max-width:1240px;margin:0 auto;padding:66px 20px 26px}
.kicker{text-transform:uppercase;letter-spacing:.24em;font-size:12px;color:var(--amber);margin:0 0 12px;font-weight:700}
.hero h1{font-size:47px;line-height:1.1;margin:0 0 18px;max-width:840px;color:#fff;text-transform:uppercase;letter-spacing:.01em}
.lede{font-size:18px;max-width:780px;color:#c9c4b4}
.hero-cta{display:flex;gap:14px;margin:26px 0 6px;flex-wrap:wrap}
.btn{background:var(--amber);color:#141414;padding:13px 28px;border-radius:2px;font-weight:800;display:inline-block;text-transform:uppercase;font-size:14px;letter-spacing:.05em}
.btn:hover{background:var(--amber2);text-decoration:none}
.btn.ghost{background:transparent;border:1px solid #55534a;color:#e8e4d8}
.evidence{max-width:1240px;margin:0 auto;padding:8px 20px 54px}
.rail{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:26px}
.rail .cell{border:1px solid var(--line);background:var(--panel);padding:12px 16px;min-width:150px}
.rail .cell b{display:block;font-size:21px;color:#fff}
.rail .cell span{font-size:11.5px;color:var(--mut);text-transform:uppercase;letter-spacing:.1em}
.charge{display:flex;align-items:center;gap:12px;margin:4px 0 8px}
.charge .segs{display:flex;gap:4px}
.charge .segs i{width:26px;height:14px;background:var(--amber);display:block;transform:skewX(-14deg)}
.charge .segs i.off{background:#33322c}
.charge label{font-size:12px;color:var(--mut);text-transform:uppercase;letter-spacing:.16em}
.hero .hero-fig{max-width:1240px;margin:0 auto;padding:0 20px 52px}
.hero-fig img{width:100%;max-height:400px;object-fit:cover;display:block;border:1px solid var(--line)}
main{max-width:1240px;margin:0 auto;padding:0 20px}
.phead{padding:46px 0 6px;border-bottom:3px solid var(--amber);margin-bottom:6px}
.phead h1{font-size:38px;line-height:1.14;margin:0 0 12px;text-transform:uppercase;color:#fff}
.crumb{font-size:12px;color:var(--mut);margin:0 0 16px;text-transform:uppercase;letter-spacing:.14em}
.crumb a{color:var(--mut)}
.phead .hero-fig{margin:20px 0 8px}
.phead .hero-fig img{width:100%;max-height:340px;object-fit:cover;display:block;border:1px solid var(--line)}
.prose{max-width:900px}
.prose h2{font-size:25px;margin:38px 0 12px;padding-top:18px;border-top:1px solid var(--line);color:#fff;text-transform:uppercase;letter-spacing:.02em}
.prose p{margin:0 0 16px;color:#d8d3c4}
ul.ticks{list-style:none;padding:0;margin:0 0 18px}
ul.ticks li{padding:7px 0 7px 26px;position:relative;border-bottom:1px dashed #33322c}
ul.ticks li::before{content:"";position:absolute;left:2px;top:15px;width:11px;height:7px;background:var(--amber);transform:skewX(-14deg)}
.specwrap{overflow-x:auto;margin:0 0 22px}
table.spec{border-collapse:collapse;width:100%;background:var(--panel);border:1px solid var(--line)}
table.spec th{text-align:left;background:var(--panel2);color:var(--amber2);padding:9px 14px;border-bottom:1px solid var(--line);width:34%;vertical-align:top;font-size:13.5px;text-transform:uppercase;letter-spacing:.06em}
table.spec td{padding:9px 14px;border-bottom:1px solid var(--line);font-size:15px}
.faq details{background:var(--panel);border:1px solid var(--line);margin:0 0 10px;padding:4px 18px}
.faq summary{cursor:pointer;font-weight:700;padding:10px 0;color:#fff}
.faq details p{margin:0 0 14px}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(258px,1fr));gap:16px;margin:6px 0 26px}
.card{background:var(--panel);border:1px solid var(--line);border-top:3px solid #3a3b40;padding:20px;display:flex;flex-direction:column;gap:8px;color:var(--ink)}
.card:hover{text-decoration:none;border-top-color:var(--amber);background:var(--panel2)}
.card-t{font-weight:800;font-size:17px;color:#fff;text-transform:uppercase;letter-spacing:.02em}
.card-x{font-size:14px;color:var(--mut);flex:1}
.card-go{font-size:12px;color:var(--amber);text-transform:uppercase;letter-spacing:.14em;font-weight:700}
.related{max-width:900px;background:var(--panel);border:1px solid var(--line);border-left:4px solid var(--amber);padding:18px 24px;margin:26px 0}
.related h3{margin:0 0 8px;font-size:15px;text-transform:uppercase;letter-spacing:.12em;color:#fff}
.related ul{margin:0;padding-left:18px}
.ctaband{background:linear-gradient(120deg,#1c1503,#141414 55%);border:1px solid var(--line);border-left:5px solid var(--amber);padding:34px 30px;margin:36px 0 54px}
.ctaband h2{margin:0 0 8px;color:#fff;text-transform:uppercase}
.ctaband p{max-width:640px;color:#c9c4b4}
footer{background:var(--dark);color:#98927f;border-top:3px solid var(--amber)}
.finner{max-width:1240px;margin:0 auto;padding:46px 20px 26px;display:flex;gap:44px;flex-wrap:wrap}
.fbrand{max-width:310px}
.fbrand p{font-size:14px}
.fcontact{font-size:13px;color:#d8d3c4}
.fcol h4{color:#fff;font-size:13.5px;text-transform:uppercase;letter-spacing:.13em;margin:4px 0 12px}
.fcol ul{list-style:none;margin:0;padding:0}
.fcol li{margin:0 0 7px}
.fcol a{color:#98927f;font-size:14px}
.fcol a:hover{color:var(--amber2)}
.fbar{border-top:1px solid var(--line);padding:16px 20px;max-width:1240px;margin:0 auto;display:flex;justify-content:space-between;font-size:12px;color:#6f6a5c}
form.inq{background:var(--panel);border:1px solid var(--line);padding:26px;max-width:680px}
form.inq label{display:block;font-weight:700;margin:0 0 6px;font-size:14px}
form.inq input,form.inq textarea,form.inq select{width:100%;padding:11px 12px;border:1px solid #3c3d42;margin:0 0 18px;font:inherit;background:#101114;color:var(--ink)}
form.inq button{background:var(--amber);color:#141414;border:0;padding:13px 30px;font-weight:800;cursor:pointer;text-transform:uppercase}
@media (max-width:820px){
  .hin{flex-wrap:wrap;padding:10px 16px;gap:10px}
  nav{margin-left:0;width:100%;overflow-x:auto}
  ul.nav{flex-wrap:nowrap}
  ul.nav>li>a{padding:10px 8px;font-size:14px;white-space:nowrap}
  .hcta{display:none}
  .hero h1{font-size:31px}
  .phead h1{font-size:28px}
  .charge .segs i{width:18px}
  .fbar{flex-direction:column;gap:6px}
}

/* i18n language switcher (rightmost nav item, overlay dropdown) */
ul.nav li.lang-menu{margin-left:6px}
ul.nav li.lang-menu>a{color:var(--amber2);font-weight:800;letter-spacing:.06em}
ul.nav li.lang-menu ul.menu{left:auto;right:0;min-width:180px}
ul.nav li.lang-menu ul.menu a[aria-current]{color:var(--amber2);font-weight:700}
.charge label{min-width:0;overflow-wrap:break-word}
@media (max-width:820px){.charge{flex-wrap:wrap}}