/* JIAODA component trading counter - dark bench lacquer theme */
:root{
  --bench:#181C1B;
  --lacquer:#101312;
  --mylar:#E6E9E4;
  --spark:#D07A2E;
  --lead:#8A908C;
  --drawer:#232927;
  --drawerline:#2E3533;
  --tin:#EDEFE9;
  --cabinet:#2C3230;
  --cabband:#222725;
  --text:#E6E9E4;
  --mute:#AEB4AE;
  --wood:#4A3322;
  --woodline:#3A2918;
  --brassdark:#000000;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-size:16px;
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  background:var(--bench);
  color:var(--mylar);
  line-height:1.6;
  overflow-x:hidden;
}
a{color:var(--spark);text-decoration:none}
a:hover{color:var(--tin)}
img{max-width:100%;display:block}
ul,ol{padding-left:1.3em}
h1,h2,h3,h4{font-weight:700;line-height:1.18;color:var(--tin)}
.layout{max-width:1200px;margin:0 auto;padding:0 24px}
.notoggle{display:none}

/* hide reveal-ready elements by default, JS adds .sr-visible. noscript shows them */
.sr-item{opacity:0;transform:translateY(14px);transition:opacity .6s ease,transform .6s ease}
.sr-item.sr-visible{opacity:1;transform:none}
.no-js .sr-item{opacity:1;transform:none}

/* ========= PARTS WALL NAV (.partswall) ========= */
.partswall{
  position:sticky;top:0;z-index:60;
  background:var(--bench);
  border-bottom:2px double var(--lead);
}
.partsnav{
  max-width:1248px;margin:0 auto;padding:12px 24px 10px;
  display:flex;align-items:center;justify-content:space-between;gap:20px;
}
.partsnav .brand{
  display:flex;align-items:center;gap:12px;
}
.pbrand-group{display:flex;align-items:center;gap:12px}
.brandplate{
  background:var(--tin);color:var(--bench);
  font-weight:800;letter-spacing:.18em;
  padding:8px 14px;border-radius:4px;font-size:1.05rem;
}
.coilglyph{width:44px;height:34px;position:relative}
.sparkturn{position:absolute;left:2px;right:2px;height:6px;border-radius:8px;background:var(--spark)}
.sparkturn.t1{top:2px}
.sparkturn.t2{top:14px;background:#E0A050}
.sparkturn.t3{top:26px}
.sparklinks{display:flex;align-items:center;gap:6px}
.drawertab{
  position:relative;
  background:var(--drawer);color:var(--mylar);
  border:1px solid var(--drawerline);border-radius:6px;
  padding:10px 18px;min-width:86px;text-align:center;
  font-weight:600;transition:background .2s,transform .2s;
}
.drawertab::before{
  content:"";position:absolute;top:5px;left:50%;
  width:7px;height:7px;border-radius:50%;
  background:var(--lead);transform:translateX(-50%);
}
.drawertab.active,.drawertab:hover{background:var(--spark);color:var(--bench);transform:translateY(-2px)}
.drawertab.active::before,.drawertab:hover::before{background:var(--bench)}
.sparkchip{
  background:var(--spark);color:var(--bench);
  font-weight:700;padding:9px 16px;border-radius:6px;letter-spacing:.04em;
}
.sparkchip:hover{background:var(--tin);color:var(--bench)}
.navtoggle{
  display:none;background:none;border:1px solid var(--lead);
  color:var(--mylar);font-size:1.5rem;padding:4px 12px;border-radius:6px;cursor:pointer;
}

/* ========= COIL BENCH HERO (.coilbench) ========= */
.coilbench{background:var(--bench)}
.workwall{
  max-width:1248px;margin:0 auto;padding:0 24px;
  display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;
}
.partsgrid{
  display:grid;grid-template-columns:repeat(6,1fr);gap:10px;
  padding:22px;background:var(--cabinet);border-radius:8px;
  border-top:14px solid var(--wood);position:relative;
}
.partsgrid::before{
  content:"";position:absolute;top:-14px;left:0;right:0;height:14px;
  background:var(--wood);border-radius:3px 3px 0 0;
}
.partdrawer{
  background:var(--drawer);border:1px solid var(--drawerline);
  border-radius:5px;min-height:74px;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:6px;padding:6px;
}
.partdrawer .knob{width:10px;height:10px;border-radius:50%;background:var(--lead)}
.partdrawer .dcode{
  background:var(--tin);color:var(--bench);font-size:.6rem;font-weight:700;
  padding:2px 5px;border-radius:3px;letter-spacing:.04em;
}
.benchright{display:flex;flex-direction:column;gap:26px}
.coilwinder{
  background:var(--cabinet);border-radius:8px;padding:20px;
  display:flex;align-items:center;justify-content:center;gap:14px;
}
.coilpost{width:12px;height:120px;background:var(--drawer);border:1px solid var(--drawerline);border-radius:4px}
.coildrum{width:130px;height:120px;position:relative;display:flex;flex-direction:column;justify-content:center;gap:8px}
.coilturn{height:10px;border-radius:10px;background:var(--spark)}
.sparkgap{
  background:var(--cabinet);border-radius:8px;padding:18px 22px;
  display:flex;align-items:center;justify-content:space-between;gap:10px;
}
.gappost{
  width:26px;height:96px;background:var(--drawer);
  border:1px solid var(--drawerline);border-radius:6px;display:flex;align-items:center;
  justify-content:center;color:var(--mylar);font-size:1.6rem;
}
.gaparc{
  flex:1;height:3px;background:linear-gradient(90deg,var(--drawer),var(--spark),var(--drawer));
  border-radius:3px;background-color:var(--spark);
}
.crystal{
  background:var(--cabinet);border-radius:8px;padding:12px 20px;
  display:flex;align-items:center;gap:14px;
}
.crystal-clamp{width:60px;height:26px;background:var(--drawer);border-radius:4px;display:flex;align-items:center;justify-content:center;color:var(--mylar);font-size:.8rem;letter-spacing:.1em}
.crystal-note{font-size:.9rem;color:var(--mute)}

/* the counter slab */
.counterslab{background:var(--tin);color:var(--bench);padding:44px 24px;margin-top:26px}
.countin{
  max-width:1248px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;
  gap:34px;align-items:center;position:relative;
}
.eyebrow{
  display:inline-block;color:var(--bench);font-weight:700;letter-spacing:.2em;
  font-size:.72rem;text-transform:uppercase;border:1px solid var(--lead);
  padding:4px 10px;border-radius:20px;margin-bottom:16px;opacity:1;color:#2B2E2B;
}
.counthead{display:flex;align-items:center;gap:14px}
.lotstamp{
  width:66px;height:66px;border-radius:50%;flex:0 0 auto;
  background:var(--spark);color:var(--bench);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  font-weight:800;font-size:.62rem;letter-spacing:.06em;text-align:center;
  border:3px solid #B76A22;box-shadow:0 0 0 3px var(--tin);
}
.counthead h1{
  font-size:2.7rem;letter-spacing:-.01em;color:var(--bench);line-height:1.05;
}
.countin p.leadline{
  color:#2B2E2B;font-size:1.05rem;margin:14px 0 0;opacity:1;
}
.ctabuttons{display:flex;gap:14px;margin-top:22px;flex-wrap:wrap}
.btnspark{
  background:var(--drawer);color:var(--spark);
  font-weight:700;padding:13px 22px;border-radius:50px;
  border:2px solid var(--drawer);transition:.2s;
}
.btnspark:hover{background:var(--spark);color:var(--bench)}
.btntin{
  border:2px solid #4A4F4B;color:#2B2E2B;font-weight:600;
  padding:13px 22px;border-radius:50px;
}
.btntin:hover{background:#4A4F4B;color:var(--tin)}
.benchright{color:var(--mylar)}
.benchtools{background:var(--cabinet);border-radius:10px;padding:16px;display:flex;gap:12px;align-items:center;justify-content:center;border:1px solid var(--drawerline)}
.partstray{
  background:var(--bench);border:1px solid var(--drawerline);border-radius:6px;
  display:flex;gap:8px;padding:14px;flex:1;
}
.microchip{
  width:34px;height:24px;border-radius:3px;background:var(--tin);
  position:relative;
}
.microchip::before,.microchip::after{
  content:"";position:absolute;width:6px;height:4px;background:var(--lead);border-radius:2px;
}
.microchip::before{top:9px;left:-6px}
.microchip::after{top:9px;right:-6px}
.tweezers{width:90px;height:6px;background:var(--lead);border-radius:6px;transform:rotate(8deg);}
.kick{
  max-width:100%;margin-top:40px;background:var(--cabinet);border-top:1px solid var(--drawerline);
  padding:20px 24px;
}
.kickin{
  max-width:1248px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:20px;text-align:center;
}
.hstat b{font-size:1.9rem;color:var(--spark);display:block}
.hstat span{color:var(--mylar);font-size:.85rem;letter-spacing:.05em}
.hstat .sepdash{color:var(--spark)}

/* ========= STATEMENT SILL ========= */
.statement{
  background:var(--spark);color:#2A1A08;padding:52px 24px;
}
.statmentin{
  max-width:1100px;margin:0 auto;display:grid;grid-template-columns:auto 1fr;gap:40px;align-items:center;
}
.bigfig{
  font-size:clamp(4rem,10vw,8rem);font-weight:900;letter-spacing:-.02em;line-height:.9;color:#2A1A08;
}
.statmentin p{color:#35200a;font-size:1.15rem;max-width:60ch}
.statement .bigfig{white-space:nowrap}
.endorsetag{display:block;font-weight:800;margin-top:14px;color:#241504}
.statlabel{letter-spacing:.2em;font-size:.7rem;text-transform:uppercase;font-weight:800}

/* ========= LOT LEDGER ROWS (.lotledger) ========= */
.lotledger{background:var(--bench);padding:70px 0}
.lotledger .lead h2{font-size:2rem;margin-bottom:.5rem;color:var(--mylar)}
.lotledger .lead p{color:var(--mute);max-width:70ch}
.prelabel{color:var(--spark);letter-spacing:.2em;font-weight:700;font-size:.75rem;text-transform:uppercase}
.ledger{
  margin-top:40px;display:flex;flex-direction:column;gap:26px;
}
.ledgerrow{
  background:var(--drawer);border-radius:10px;padding:26px 28px;
  display:grid;grid-template-columns:auto 1fr auto;gap:22px;align-items:start;
  border:1px solid var(--drawerline);transition:transform .2s,border-color .2s;
  max-width:100%;
}
.ledgerrow:nth-child(even){transform:translateX(40px)}
.ledgerrow:hover{border-color:var(--spark)}
.lotmark{
  flex:0 0 auto;display:flex;flex-direction:column;align-items:center;gap:8px;
}
.stampcircle{
  width:74px;height:74px;border-radius:50%;display:flex;flex-direction:column;
  align-items:center;justify-content:center;text-align:center;
  background:var(--spark);color:var(--bench);
  font-size:.66rem;font-weight:800;line-height:1.15;letter-spacing:.03em;
  border:3px solid #B76A22;
}
.bincode{
  background:var(--tin);color:var(--bench);font-weight:700;font-size:.62rem;
  padding:3px 7px;border-radius:3px;letter-spacing:.05em;
}
.rowbody h3{color:var(--mylar);font-size:1.35rem;margin-bottom:.5rem}
.rowbody p{color:var(--mute);font-size:1rem}
.probemark{color:var(--lead);font-size:.75rem;text-transform:uppercase;letter-spacing:.08em;margin-top:6px}
.readlink{color:var(--spark);font-weight:700;white-space:nowrap;margin-left:auto}
.readlink:hover{color:var(--tin)}
.testerpair{flex:0 0 auto;display:flex;flex-direction:column;gap:8px;align-items:center;min-width:52px}
.testlead{width:4px;height:52px;background:var(--spark);border-radius:4px;position:relative}
.testlead::after{content:"";position:absolute;top:52px;left:-3px;width:10px;height:8px;background:var(--spark);clip-path:polygon(50% 100%,0 0,100% 0);}
.testlead.l2{background:var(--lead)}
.testlead.l2::after{background:var(--lead)}

/* ========= TEST BENCH RUN ========= */
.testbench{background:var(--cabinet);padding:64px 0;border-top:1px solid var(--drawerline)}
.testbench .lead h2{font-size:2rem;color:var(--mylar);margin-bottom:.5rem}
.testbench .lead p{color:var(--mute)}
.runband{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;position:relative;padding-top:34px}
.runtime{
  position:absolute;top:52px;left:3%;right:3%;height:3px;
  background:var(--spark);border-radius:3px;
}
.station{text-align:center;position:relative;z-index:2;flex:1;min-width:0}
.station .bin{
  width:100%;background:var(--drawer);border:1px solid var(--drawerline);border-radius:6px;
  color:var(--tin);padding:10px 4px;font-weight:700;font-size:.9rem;
  position:relative;display:inline-block;
}
.station .bin::before{
  content:"";position:absolute;top:-26px;left:50%;transform:translateX(-50%);
  width:12px;height:12px;border-radius:50%;background:var(--spark);
  box-shadow:0 0 0 4px var(--cabinet);
}
.station .bin .knobdot{
  width:8px;height:8px;border-radius:50%;background:var(--lead);
  margin:0 auto 6px;
}
.station.cap .bin{background:var(--spark);color:var(--bench);border-color:#B76A22}
.station p{color:var(--mute);font-size:.8rem;margin-top:8px}
.station .knob,.bin .knobdot{color:transparent}

/* ========= PARTS DRAWER CTA ========= */
.ctaband{background:var(--spark);color:#2A1A08;padding:56px 24px}
.ctain{
  max-width:1100px;margin:0 auto;display:flex;flex-direction:column;gap:14px;align-items:center;text-align:center;
}
.imprint{
  text-align:center;font-weight:900;letter-spacing:.14em;text-transform:uppercase;
  color:#2A1A08;font-size:.82rem;
}
.ctain h2{color:#2A1A08;font-size:2rem}
.ctain .btnline{
  background:var(--drawer);color:var(--spark);font-weight:700;
  padding:14px 28px;border-radius:50px;margin-top:10px;
}
.ctain .btnline:hover{background:var(--bench);color:var(--mylar)}
.ctain small{color:#40270d;font-weight:600}

/* generic sections on subpages */
.pagewrap{background:var(--bench);padding:64px 24px}
.pagehead{max-width:1000px;margin:0 auto 34px}
.pagehead h1{font-size:2.6rem;color:var(--mylar);margin-bottom:.4rem}
.pagehead .crumb{color:var(--lead);font-size:.85rem}
.pagehead .crumb a{color:var(--spark)}
.pagerow{max-width:1000px;margin:0 auto;background:var(--drawer);border:1px solid var(--drawerline);border-radius:10px;padding:30px;margin-bottom:24px}
.pagerow h2{color:var(--spark);font-size:1.5rem;margin-bottom:.6rem}
.pagerow p{color:var(--mute);margin-bottom:.8rem}
.pagerow p:last-child{margin-bottom:0}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
.chip{background:var(--cabinet);border:1px solid var(--drawerline);color:var(--tin);padding:5px 12px;border-radius:20px;font-size:.85rem}
.cnums{display:flex;flex-wrap:wrap;gap:18px;margin-top:16px}
.cnum{flex:1;min-width:180px;background:var(--cabinet);border:1px solid var(--drawerline);border-radius:8px;padding:16px;text-align:center}
.cnum b{font-size:1.6rem;color:var(--spark);display:block}
.cnum span{color:var(--mute);font-size:.85rem}
.checklist{margin:12px 0;color:var(--mylar)}
.checklist li{color:var(--mute);margin-bottom:.3rem}

/* process overview */
.procsteps{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;margin-top:18px}
.procstep{background:var(--cabinet);border:1px solid var(--drawerline);border-radius:8px;padding:16px;text-align:center}
.procstep b{color:var(--spark);display:block;font-size:1rem;margin-bottom:.2rem}
.procstep span{color:var(--mute);font-size:.8rem}

/* ========= CONTACT ========= */
.contactgrid{max-width:1040px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:start}
.contactpanel{background:var(--drawer);border:1px solid var(--drawerline);border-radius:10px;padding:30px}
.contactpanel h2{color:var(--spark);font-size:1.45rem;margin-bottom:1rem}
.field{display:block;margin-bottom:18px}
.field label{display:block;color:var(--mylar);font-weight:600;margin-bottom:6px;font-size:.9rem}
.field input,.field textarea,.field select{
  width:100%;background:var(--bench);border:1px solid var(--drawerline);border-radius:6px;
  color:var(--mylar);padding:11px 12px;font-size:1rem;font-family:inherit;
}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--spark)}
.textarea-in label{color:var(--mylar)}
.submitbtn{
  background:var(--spark);color:var(--bench);border:none;border-radius:6px;
  font-weight:700;padding:13px 22px;font-size:1rem;cursor:pointer;
}
.submitbtn:hover{background:var(--tin)}
.formnote{color:var(--lead);font-size:.82rem;margin-top:12px}
.contactinforow{background:var(--drawer);border:1px solid var(--drawerline);border-radius:10px;padding:30px;margin-bottom:18px}
.contactinfo{list-style:none;margin:12px 0}
.contactinfo li{color:var(--mute);margin-bottom:.6rem;padding-left:20px;position:relative}
.contactinfo li::before{content:"";position:absolute;left:0;top:.6em;width:9px;height:3px;background:var(--spark)}
.contactinfo li b{color:var(--tin)}
.contactinfo a{color:var(--spark);font-weight:600}
.hoursbox{background:var(--cabinet);border:1px solid var(--drawerline);border-radius:8px;padding:16px}
.hoursbox li{color:var(--mute)}
.faqitem{border-top:1px solid var(--drawerline);padding:16px 0}
.faqitem:first-of-type{border-top:none}
.faqitem h3{font-size:1.1rem;color:var(--tin);margin-bottom:.4rem}
.qa-row{background:var(--drawer);border:1px solid var(--drawerline);border-radius:10px;padding:22px;margin-top:34px}
.faq-question{color:var(--tin);font-weight:700}

/* accordion */
.acc-item{border-bottom:1px solid var(--drawerline)}
.acc-q{
  width:100%;text-align:left;background:var(--drawer);border:none;
  color:var(--mylar);padding:16px 0;font-size:1.05rem;font-weight:700;cursor:pointer;
}
.acc-panel{display:block;overflow:hidden}
.acc-panel p{color:var(--mute)}

/* ========= DRAWER CABINET FOOTER (.drawercabinet) ========= */
.drawercabinet{background:var(--bench);border-top:2px solid var(--tin)}
.footcornice{border-top:8px solid var(--drawerline);background:var(--bench)}
.cabface{
  max-width:1248px;margin:0 auto;display:flex;align-items:center;gap:12px;padding:18px 24px 8px;
}
.minidrawer{
  width:58px;background:var(--drawer);border:1px solid var(--drawerline);border-radius:4px;
  text-align:center;color:var(--drawer);font-size:.5rem;letter-spacing:.08em;padding:5px 2px;
}
.minidrawer .mknob{width:10px;height:3px;background:var(--lead);border-radius:2px;margin:0 auto 4px}
.minidrawer.moto{color:var(--mylar)}
.motoquote{color:var(--mylar);letter-spacing:.22em;font-weight:800;font-size:.78rem;margin-left:6px;white-space:nowrap}
.footcols{
  max-width:1248px;margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:24px;padding:24px 24px 30px;
}
.footcol h4{
  color:var(--spark);letter-spacing:.08em;font-size:.9rem;text-transform:uppercase;margin-bottom:12px;
  border-left:3px solid var(--spark);padding-left:10px;
}
.footcol ul{list-style:none;padding:0}
.footcol li{margin-bottom:7px}
.footcol a{color:var(--mute)}
.footcol a:hover{color:var(--tin)}
.footcol p{color:var(--mute);font-size:.92rem}
.baseplate{
  background:var(--tin);color:var(--bench);padding:22px 24px;
}
.platein{
  max-width:1248px;margin:0 auto;display:flex;flex-wrap:wrap;gap:12px;align-items:flex-start;
  justify-content:space-between;
}
.platein .co{font-weight:800;color:#2B2E2B}
.platein .addr{color:#4A4F4B;font-size:.88rem;max-width:400px;line-height:1.5}
.people{color:#2B2E2B;font-size:.95rem}
.people a{color:#2B2E2B;font-weight:700;text-decoration:underline}
.sparkbottom{text-align:center;background:var(--tin);color:var(--spark);font-size:.82rem;padding:0 24px 14px;font-weight:600}
.copylabel{color:#7a3c12}

/* back to top */
.totop{display:inline-block;color:var(--spark);font-weight:700;margin-top:6px}

/* responsive */
@media(max-width:900px){
  .navtoggle{display:block}
  .sparklinks{position:absolute;top:62px;left:0;right:0;flex-direction:column;background:var(--bench);padding:14px;gap:10px;display:none;border-bottom:1px solid var(--drawerline)}
  .sparklinks.open{display:flex}
  .partsnav{flex-wrap:wrap}
  .workwall{grid-template-columns:1fr}
  .kickin{grid-template-columns:1fr}
  .ledgerrow:nth-child(even){transform:none}
  .statmentin{grid-template-columns:1fr;gap:20px}
  .runband{flex-direction:column;align-items:stretch;gap:28px}
  .runtime{display:none}
  .footcols{grid-template-columns:1fr;gap:18px}
  .contactgrid{grid-template-columns:1fr}
  .countin{grid-template-columns:1fr}
  .ledgerrow{grid-template-columns:1fr}
  .testerpair,.readlink{display:none}
  .partsgrid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:560px){
  .partsgrid{grid-template-columns:repeat(2,1fr)}
  .kickin{grid-template-columns:1fr;gap:16px}
}