/* MidasToken unified energy product visual system. Reference: corporate homepage V3.
   Product-site navigation remains independent; no injected corporate nav. */
:root{
  --bg:#071326;--bg2:#0b1d36;--bg3:#102a4a;
  --panel:rgba(15,37,64,.88);--panelSolid:#102a4a;
  --nav:rgba(7,19,38,.92);--text:#f3f8ff;--muted:#a0b6d1;--muted2:#7894b2;
  --line:rgba(137,183,220,.21);--lime:#168ff7;--lime2:#3fbaff;
  --cyan:#3fbaff;--glow:rgba(22,143,247,.20);
  --shadow:0 28px 90px rgba(0,0,0,.27);--canvas:#0e2034;
  --cardGrad:linear-gradient(154deg,rgba(15,37,64,.85),rgba(11,29,54,.98));
  --gridlines:rgba(104,167,222,.11);
}
html[data-theme="light"]{
  --bg:#f4f8fd;--bg2:#eaf2fa;--bg3:#edf5fc;
  --panel:rgba(255,255,255,.94);--panelSolid:#fff;
  --nav:rgba(252,254,255,.93);--text:#10243b;--muted:#516a83;--muted2:#7088a0;
  --line:rgba(38,102,158,.19);--lime:#087be0;--lime2:#168ff7;
  --cyan:#087be0;--glow:rgba(22,143,247,.13);
  --shadow:0 25px 80px rgba(46,84,127,.11);--canvas:#0e2034;
  --cardGrad:linear-gradient(154deg,#fff,#f4f8fd);--gridlines:rgba(37,118,193,.12);
}
body{font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft JhengHei","PingFang TC","Noto Sans CJK TC",sans-serif;letter-spacing:.005em;line-height:1.64;background:var(--bg)}
body::before{content:"";position:absolute;top:0;left:0;right:0;bottom:auto;height:1150px;background-image:linear-gradient(var(--gridlines) 1px,transparent 1px),linear-gradient(90deg,var(--gridlines) 1px,transparent 1px);background-size:52px 52px;mask-image:linear-gradient(#000b 0%,#0008 60%,transparent 100%);pointer-events:none;z-index:0}
.topline{height:3px;background:linear-gradient(90deg,#168ff7,#3fbaff,transparent 66%)}
.header{top:3px;background:var(--nav)}
.header-inner{height:76px;gap:17px}
.logo{width:clamp(180px,18vw,244px);max-width:244px}
.nav{gap:16px}.nav a{font-size:13px;font-weight:700}
.nav a.active:after{background:var(--cyan);bottom:-13px}
.lang-select button.active{background:var(--lime);color:#fff}
.mobile-nav a.active{color:var(--cyan)}
.round-btn,.btn,.card,.product-card,.hero-art,.hero-float{transition-duration:.2s}
.btn{border-radius:12px;font-size:14px;padding:13px 20px}
.btn-primary{background:#087be0;color:white;border-color:#087be0;box-shadow:0 10px 28px rgba(22,143,247,.17)}
html[data-theme="dark"] .btn-primary{background:#168ff7;border-color:#168ff7}
.btn-primary:hover{background:#168ff7;box-shadow:0 15px 32px rgba(22,143,247,.23)}
.btn-outline{color:var(--cyan);border-color:var(--cyan)}
.hero{padding:73px 0 70px;overflow:visible}
.hero-grid{grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:24px;min-height:490px}
.hero h1{font-size:clamp(38px,3.6vw,54px);line-height:1.2;max-width:660px;letter-spacing:-.045em;margin:22px 0 23px;overflow-wrap:normal}
.hero h1 .outline{background:linear-gradient(106deg,#168ff7,#43c0ff 66%,#77d0ff);-webkit-background-clip:text;background-clip:text;color:transparent}
html[data-theme="light"] .hero h1 .outline{background:linear-gradient(106deg,#087be0,#168ff7 75%,#126ec6);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero .lead{font-size:16px;line-height:1.94;max-width:610px}
.hero-art{min-height:470px;overflow:visible}
.hero-art:before{background:radial-gradient(circle,rgba(22,143,247,.17),transparent 66%)}
.hero-art img{width:100%;max-width:100%;max-height:465px;object-fit:contain;object-position:center}
.hero-float{background:var(--panel);border-color:var(--line)}
.section{padding:92px 0}.section.sm{padding:64px 0}
.section-head h2{font-size:clamp(30px,3vw,42px);line-height:1.22;letter-spacing:-.035em}
.section-title{font-size:clamp(30px,3vw,42px)}
.subhero{background:radial-gradient(circle at 82% 13%,rgba(22,143,247,.09),transparent 43%);padding:65px 0 60px}
.subhero h1{font-size:clamp(34px,4vw,54px);line-height:1.23;max-width:1030px}
.card,.product-card{border-radius:18px;background:var(--cardGrad)}
.card.hover:hover,.product-card:hover{border-color:rgba(22,143,247,.50)}
.card.pad{padding:26px}
.product-card .meta strong,.eyebrow,.source,.lime,.cyan{color:var(--cyan)}
.product-art{background:#0a2038!important;object-fit:contain!important}
.footer{background:var(--bg2)}
.footer .logo{width:220px}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--lime)}
a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
@media(max-width:1170px){.logo{width:220px}.hero h1{font-size:clamp(37px,4.2vw,52px)}.hero-grid{gap:13px}}
@media(max-width:920px){.header-inner{height:70px}.hero-grid{grid-template-columns:1fr}.hero h1{font-size:clamp(38px,5.1vw,52px)}.hero-art{min-height:330px}.section{padding:70px 0}}
@media(max-width:620px){.header-inner{height:65px}.logo{width:min(190px,47vw)}.hero{padding:46px 0 45px}.hero h1{font-size:clamp(31px,8.5vw,42px);line-height:1.24}.hero-art{min-height:250px}.hero-art img{max-height:285px}.section-head h2,.section-title{font-size:29px}.subhero h1{font-size:clamp(30px,8vw,39px)}.card.pad{padding:21px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
/* Override residual legacy green accent on hero information pills. */
.hero-float{border-color:var(--line);background:var(--panel);color:var(--text)}
.hero-float b{color:var(--cyan)}
.hero-float small{color:var(--muted)}

/* V12 final cascade: sitewide spacing tokens loaded after product CSS */
:root{--block-space:76px;--block-compact:58px;--hero-space:62px}
.hero{padding-block:var(--hero-space)}
.hero-grid{min-height:440px}
.hero-art{min-height:400px}
.hero-art img{max-height:430px}
.section{padding-block:var(--block-space)}
.section.sm{padding-block:var(--block-compact)}
.section-head{margin-bottom:30px}
.subhero{padding-block:62px}
@media(max-width:1100px){:root{--block-space:68px;--block-compact:52px;--hero-space:52px}}
@media(max-width:920px){:root{--block-space:62px;--block-compact:48px;--hero-space:46px}.hero-grid{min-height:0}.hero-art{min-height:325px}}
@media(max-width:620px){:root{--block-space:52px;--block-compact:40px;--hero-space:42px}.hero-grid{min-height:0}.hero-art{min-height:230px}.hero-art img{max-height:290px}.subhero{padding-block:45px}}