:root{--navy:#062a4d;--navy2:#031d36;--blue:#0b4d83;--copper:#ef8b2c;--ink:#102033;--muted:#607084;--line:#dce4eb;--soft:#f3f6f8;--white:#fff;--max:1180px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Arial,sans-serif;color:var(--ink);background:#fff}img{display:block;width:100%}a{text-decoration:none;color:inherit}.site-header{height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 max(24px,calc((100% - var(--max))/2));position:sticky;top:0;z-index:10;background:rgba(255,255,255,.96);border-bottom:1px solid #e7edf2}.brand{display:flex;gap:10px;align-items:center}.brand-mark{font-size:34px;color:var(--copper);font-weight:900}.brand strong{font-size:21px;letter-spacing:.3px}.brand small{display:block;font-size:9px;letter-spacing:1.7px;color:var(--muted);margin-top:2px}.nav{display:flex;align-items:center;gap:24px;font-size:14px;font-weight:700}.menu-btn{display:none;border:0;background:none;font-size:25px}.btn{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:7px;padding:13px 20px;background:var(--copper);color:#102033;font-weight:800;cursor:pointer}.btn-small{padding:10px 15px}.btn-outline{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.75)}.hero{background:linear-gradient(120deg,var(--navy2),var(--navy));color:#fff;display:grid;grid-template-columns:1fr 1fr;min-height:560px}.hero-copy{padding:92px max(36px,calc((100vw - var(--max))/2)) 70px max(36px,calc((100vw - var(--max))/2));padding-right:50px}.hero h1{font-size:clamp(48px,5vw,74px);line-height:.98;margin:14px 0 24px;letter-spacing:-2px}.hero h1 span{color:var(--copper)}.lead{font-size:19px;line-height:1.6;max-width:610px;color:#dce9f4}.eyebrow{font-size:12px;letter-spacing:2px;font-weight:900;color:#ffb66f}.eyebrow.dark{color:var(--blue)}.actions{display:flex;gap:12px;margin-top:30px}.hero-image{min-height:560px;overflow:hidden;position:relative}.hero-image:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--navy) 0%,transparent 32%)}.hero-image img{height:100%;object-fit:cover}.cap-strip{display:grid;grid-template-columns:repeat(5,1fr);background:#07233e;color:#fff;padding:24px max(24px,calc((100% - var(--max))/2));gap:24px}.cap-strip div{border-left:2px solid var(--copper);padding-left:12px}.cap-strip b,.cap-strip span{display:block}.cap-strip b{font-size:14px}.cap-strip span{font-size:11px;color:#9fb5c8;margin-top:4px}.section{max-width:var(--max);margin:auto;padding:78px 24px}.section-head{display:flex;justify-content:space-between;gap:50px;align-items:end;margin-bottom:30px}.section-head h2,.section h2,.procurement h2{font-size:38px;margin:6px 0}.section-head>p{max-width:460px;color:var(--muted);line-height:1.6}.project-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.project-grid figure{margin:0;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff}.project-grid img{aspect-ratio:4/3;object-fit:cover}.project-grid figcaption{padding:13px;font-weight:800}.tinted{max-width:none;background:var(--soft);padding-left:max(24px,calc((100% - var(--max))/2));padding-right:max(24px,calc((100% - var(--max))/2))}.two-cards{display:grid;grid-template-columns:1fr 1fr;gap:20px}.service-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:28px;box-shadow:0 10px 30px rgba(11,40,64,.05)}.service-card h3{font-size:24px;margin:0 0 12px}.service-card p{color:var(--muted);line-height:1.6}.service-card>a{color:var(--blue);font-weight:900}.process{text-align:center}.steps{display:flex;justify-content:center;align-items:center;gap:13px;flex-wrap:wrap;margin:35px 0}.steps span{padding:13px 17px;border:1px solid var(--line);border-radius:999px;font-weight:800;background:#fff}.steps i{color:var(--copper);font-style:normal;font-size:22px}.note{color:var(--muted)}.feature{background:var(--navy2);color:#fff}.split{display:grid;grid-template-columns:1fr 1fr}.split img{height:100%;min-height:520px;object-fit:cover}.split>div{padding:70px max(40px,calc((100vw - var(--max))/2));padding-left:60px}.split h2{font-size:40px;line-height:1.1}.split p,.split li{color:#c8d8e5;line-height:1.7}.split li::marker{color:var(--copper)}.service-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.service-tiles article{border:1px solid var(--line);border-radius:12px;overflow:hidden}.service-tiles img{aspect-ratio:16/10;object-fit:cover}.service-tiles h3,.service-tiles p{margin-left:20px;margin-right:20px}.service-tiles p{color:var(--muted);line-height:1.5;margin-bottom:22px}.procurement{background:linear-gradient(120deg,#0a3b68,#06233e);color:#fff;padding:70px max(24px,calc((100% - var(--max))/2));display:grid;grid-template-columns:2fr 1fr;gap:50px;align-items:center}.procurement p{color:#c9d9e6;line-height:1.7}.proc-card{border:1px solid rgba(255,255,255,.22);border-radius:12px;padding:28px;border-top:3px solid var(--copper)}.proc-card b,.proc-card span{display:block}.proc-card b{font-size:22px}.proc-card span{margin-top:10px;color:#c9d9e6}.calculator label{display:grid;grid-template-columns:1fr 130px;align-items:center;margin:12px 0;font-weight:700}.calculator input,form input,form textarea{width:100%;border:1px solid #cdd7df;border-radius:7px;padding:12px;font:inherit}.estimate{font-size:18px}.estimate strong{font-size:30px;color:var(--blue)}small{color:var(--muted);line-height:1.5}form{display:grid;gap:10px}form textarea{min-height:110px;resize:vertical}footer{background:#07192b;color:#fff;padding:42px max(24px,calc((100% - var(--max))/2));display:flex;justify-content:space-between;gap:30px}footer p{color:#9fb3c5}.start{padding-bottom:90px}
@media(max-width:900px){.nav{display:none;position:absolute;top:72px;left:0;right:0;background:#fff;padding:20px 24px;flex-direction:column;align-items:stretch;border-bottom:1px solid var(--line)}.nav.open{display:flex}.menu-btn{display:block}.hero{grid-template-columns:1fr}.hero-copy{padding:70px 28px 40px}.hero-image{min-height:360px;order:-1}.hero-image:after{background:linear-gradient(0deg,var(--navy2),transparent 55%)}.cap-strip{grid-template-columns:repeat(2,1fr)}.project-grid{grid-template-columns:repeat(2,1fr)}.split{grid-template-columns:1fr}.split>div{padding:55px 28px}.service-tiles{grid-template-columns:1fr 1fr}.procurement{grid-template-columns:1fr}.section-head{display:block}.two-cards{grid-template-columns:1fr}}
@media(max-width:560px){.site-header{padding:0 18px}.brand strong{font-size:18px}.hero h1{font-size:45px}.hero-image{min-height:280px}.actions{flex-direction:column;align-items:stretch}.cap-strip{grid-template-columns:1fr}.section{padding:58px 18px}.section h2,.section-head h2,.procurement h2{font-size:31px}.project-grid,.service-tiles{grid-template-columns:1fr}.project-grid figure:nth-child(n+4){display:none}.split img{min-height:310px}.split h2{font-size:32px}.calculator label{grid-template-columns:1fr}.calculator input{margin-top:6px}.procurement{padding:55px 20px}footer{flex-direction:column}.steps i{display:none}.steps span{width:46%}}

/* v2: SMD Works logo + PCB assembly landing page */
.brand-logo{display:block;width:190px;max-height:58px;object-fit:contain}
.landing-hero{min-height:560px}
.landing-proof{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:#d9e1e8;border:1px solid #d9e1e8;border-radius:14px;overflow:hidden;margin-top:-34px;position:relative;z-index:2}
.landing-proof div{background:#fff;padding:24px;text-align:center}.landing-proof b{display:block;color:#092f52;font-size:1.05rem}.landing-proof span{display:block;color:#647383;margin-top:5px;font-size:.9rem}
.landing-process{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;margin-top:30px}.landing-process article{background:#fff;border:1px solid #dde4ea;border-radius:14px;overflow:hidden}.landing-process img{width:100%;height:145px;object-fit:cover}.landing-process div{padding:16px}.landing-process b{color:#ef7c22}.landing-process h3{font-size:1.05rem;margin:5px 0 7px}.landing-process p{font-size:.9rem;color:#63707b;margin:0}
.capability-list{display:grid;grid-template-columns:1fr 1fr;gap:14px 28px;margin:24px 0 0;padding:0;list-style:none}.capability-list li:before{content:'✓';color:#ef7c22;font-weight:800;margin-right:10px}
.landing-cta{background:#082f52;color:white;border-radius:18px;padding:34px}.landing-cta h2{color:white}.landing-cta .eyebrow{color:#f39a4c}
@media(max-width:900px){.landing-process{grid-template-columns:1fr 1fr}.landing-proof{grid-template-columns:1fr}.capability-list{grid-template-columns:1fr}}
@media(max-width:600px){.brand-logo{width:150px}.landing-process{grid-template-columns:1fr}.landing-hero{min-height:auto}.landing-proof{margin-top:0}}

/* v3: consolidated single-page direction */
.process{text-align:left}
.process .landing-process{margin-top:34px}
.feature .capability-list{grid-template-columns:1fr 1fr;list-style:none;padding:0;margin-top:28px}
.feature .capability-list li{color:#c8d8e5}
.start-kicker{margin:0 0 8px!important;color:var(--blue)!important;font-size:12px;font-weight:900;letter-spacing:1.5px}
.footer-note{max-width:520px;font-size:13px}
@media(max-width:900px){.feature .capability-list{grid-template-columns:1fr}}

/* Anchor offset for fixed header */
#quote {
  scroll-margin-top: 160px;
}

/* v4: Electronics Tools page */

.tools-page{
  background: #e9eef3;
}

.nav-active{
  color:var(--blue);
}

.tools-hero{
  max-width:var(--max);
  margin:auto;
  padding:72px 24px 36px;
  text-align:center;
}

.tools-hero h1{
  margin:8px 0 14px;
  font-size:clamp(38px,5vw,58px);
  letter-spacing:-1.5px;
  color:var(--navy2);
}

.tools-hero>p:last-child{
  max-width:720px;
  margin:0 auto;
  color:var(--muted);
  font-size:18px;
  line-height:1.6;
}

.tools-grid{
  max-width:var(--max);
  margin:0 auto;
  padding:20px 24px 90px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:22px;
}

.tool-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 10px 30px rgba(11,40,64,.06);
}

.tool-card-head{
  min-height:104px;
  padding:22px 24px;
  display:flex;
  align-items:center;
  gap:17px;
  background:linear-gradient(135deg,#f8fbfd,#eef4f8);
  border-bottom:1px solid var(--line);
}

.tool-card-head h2{
  margin:0 0 5px;
  font-size:21px;
  color:var(--navy);
}

.tool-card-head p{
  margin:0;
  color:var(--muted);
  font-size:14px;
  line-height:1.45;
}

.tool-icon{
  width:52px;
  height:52px;
  flex:0 0 52px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:12px;
  background:var(--navy);
  color:#fff;
  font-weight:900;
  font-size:20px;
}

.tool-placeholder{
  min-height:230px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:25px;
  color:#8a98a6;
  font-size:14px;
  text-align:center;
  background:#fff;
}

@media(max-width:900px){
  .tools-grid{
    grid-template-columns:1fr;
  }

  .tools-hero{
    padding-top:55px;
  }
}

@media(max-width:560px){
  .tools-grid{
    padding:10px 18px 60px;
    gap:16px;
  }

  .tools-hero{
    padding:45px 18px 25px;
  }

  .tools-hero h1{
    font-size:36px;
  }

  .tool-card-head{
    padding:18px;
  }

  .tool-card-head h2{
    font-size:19px;
  }

  .tool-placeholder{
    min-height:190px;
  }
}

/* v5: functional calculator controls */

.tool-body{
  padding:24px;
  background:#fff;
}

.calc-fields{
  display:grid;
  gap:13px;
}

.calc-fields label{
  display:grid;
  grid-template-columns:145px 1fr;
  gap:14px;
  align-items:center;
  color:var(--ink);
  font-size:14px;
  font-weight:700;
}

.value-unit{
  display:grid;
  grid-template-columns:1fr 78px;
}

.value-unit input,
.value-unit select{
  min-width:0;
  height:42px;
  border:1px solid #ccd7e0;
  background:#fff;
  padding:0 11px;
  font:inherit;
  color:var(--ink);
}

.value-unit input{
  border-radius:7px 0 0 7px;
}

.value-unit select{
  border-left:0;
  border-radius:0 7px 7px 0;
  color:var(--muted);
  cursor:pointer;
}

.value-unit input:focus,
.value-unit select:focus{
  outline:2px solid rgba(11,77,131,.15);
  border-color:var(--blue);
}

.calc-results{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-top:20px;
}

.calc-results>div{
  padding:15px;
  border-radius:9px;
  background:#f3f6f8;
  border:1px solid #e2e8ed;
}

.calc-results span{
  display:block;
  margin-bottom:5px;
  color:var(--muted);
  font-size:12px;
  font-weight:700;
}

.calc-results strong{
  display:block;
  color:var(--navy);
  font-size:21px;
}

.calc-results .result-primary{
  background:#eef5fa;
  border-color:#d5e5f1;
}

.calc-formula{
  margin:18px 0 0;
  padding-top:15px;
  border-top:1px solid var(--line);
  text-align:center;
  color:var(--muted);
  font-size:13px;
}

@media(max-width:560px){
  .tool-body{
    padding:18px;
  }

  .calc-fields label{
    grid-template-columns:1fr;
    gap:6px;
  }

  .calc-results{
    grid-template-columns:1fr;
  }
}

/* v6: Unit Converter + SMD Resistor Lookup */

.converter-type label,
.smd-code-entry label{
  display:grid;
  gap:7px;
  color:var(--ink);
  font-size:14px;
  font-weight:700;
}

.converter-type select,
.smd-code-entry input{
  width:100%;
  height:42px;
  border:1px solid #ccd7e0;
  border-radius:7px;
  background:#fff;
  padding:0 11px;
  font:inherit;
  color:var(--ink);
}

.converter-row{
  display:grid;
  grid-template-columns:1fr 32px 1fr;
  gap:10px;
  align-items:end;
  margin-top:18px;
}

.field-label{
  display:block;
  margin-bottom:7px;
  color:var(--ink);
  font-size:14px;
  font-weight:700;
}

.converter-arrow{
  height:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--blue);
  font-size:22px;
  font-weight:900;
}

.converter-result{
  grid-template-columns:1fr;
}

.smd-code-entry input{
  font-size:20px;
  font-weight:800;
  letter-spacing:2px;
}

.tool-note{
  margin:12px 0 0;
  color:var(--muted);
  font-size:12px;
  line-height:1.5;
}

@media(max-width:560px){
  .converter-row{
    grid-template-columns:1fr;
  }

  .converter-arrow{
    height:20px;
    transform:rotate(90deg);
  }
}

/* v7: Air-Core Inductance Calculator */

.single-input{
  grid-template-columns:1fr;
}

.single-input input{
  border-radius:7px;
}

.coil-sketch{
  position:relative;
  margin:22px auto 4px;
  padding:28px 20px 25px;
  max-width:330px;
  text-align:center;
}

.coil-wire{
  height:72px;
  display:flex;
  justify-content:center;
  align-items:center;
}

.coil-wire span{
  width:25px;
  height:64px;
  margin-left:-7px;
  border:3px solid var(--copper);
  border-radius:50%;
  background:transparent;
}

.coil-wire span:first-child{
  margin-left:0;
}

.coil-dimension{
  color:var(--muted);
  font-size:11px;
  font-weight:700;
}

.diameter-label{
  position:absolute;
  right:4px;
  top:50%;
  transform:translateY(-50%) rotate(90deg);
}

.length-label{
  margin-top:8px;
}

/* v8: PCB Trace Width Calculator */

/* v10: PCB trace icon + corrected top-view trace diagram */

.trace-icon-simple{
  font-size:32px;
  line-height:1;
}

.trace-diagram{
  margin:22px auto 8px;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:12px;
}

.trace-diagram-board{
  position:relative;
  width:230px;
  height:78px;
  border:1px solid #d9e2e8;
  border-radius:8px;
  background:#f4f7f8;
}

.trace-diagram-pad{
  position:absolute;
  left:24px;
  top:22px;
  width:34px;
  height:34px;
  box-sizing:border-box;
  border:9px solid var(--copper);
  border-radius:50%;
  background:#f4f7f8;
}

.trace-diagram-track{
  position:absolute;
  left:49px;
  top:31px;
  width:155px;
  height:16px;
  border-radius:0 8px 8px 0;
  background:var(--copper);
}

.trace-width-marker{
  height:78px;
  display:flex;
  align-items:center;
  gap:7px;
  color:var(--muted);
}

.trace-width-arrow{
  display:flex;
  align-items:center;
  justify-content:center;
  height:16px;
  color:var(--copper);
  font-size:20px;
  line-height:16px;
}

.trace-width-marker > div{
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.trace-width-marker b{
  color:var(--navy);
  font-size:18px;
  line-height:1;
}

.trace-width-marker > div > span{
  margin-top:4px;
  color:var(--muted);
  font-size:11px;
  font-weight:700;
  white-space:nowrap;
}

@media(max-width:560px){
  .trace-diagram{
    gap:8px;
  }

  .trace-diagram-board{
    width:185px;
  }

  .trace-diagram-track{
    width:112px;
  }

  .trace-width-marker > div > span{
    font-size:10px;
  }
}

/* v11: Ripple / Spike Filter Calculator */

.ripple-tool-body{
  padding-top:20px;
}

.ripple-mode-switch{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:4px;
  padding:4px;
  margin-bottom:18px;
  border:1px solid #d8e1e8;
  border-radius:9px;
  background:#f3f6f8;
}

.ripple-mode-switch button{
  height:38px;
  border:0;
  border-radius:6px;
  background:transparent;
  color:var(--muted);
  font:inherit;
  font-size:13px;
  font-weight:800;
  cursor:pointer;
}

.ripple-mode-switch button.active{
  background:var(--navy);
  color:#fff;
}

.ripple-fields{
  gap:10px;
}

.filter-wave-panel{
  margin-top:18px;
  padding:12px 14px 10px;
  border:1px solid #d8e1e8;
  border-radius:9px;
  background:#f8fafb;
}

.filter-wave-legend{
  display:flex;
  align-items:center;
  gap:15px;
  margin-bottom:7px;
  color:var(--muted);
  font-size:11px;
  font-weight:700;
}

.filter-wave-legend span{
  display:flex;
  align-items:center;
  gap:5px;
}

.filter-wave-legend i{
  width:15px;
  height:3px;
  display:inline-block;
  border-radius:2px;
}

.wave-before-dot{
  background:#d84a3a;
}

.wave-after-dot{
  background:#2f8b57;
}

.filter-wave-legend small{
  margin-left:auto;
  color:#8a9aa8;
  font-size:10px;
  font-weight:600;
}

#filter-wave-canvas{
  display:block;
  width:100%;
  height:145px;
}

.ripple-results{
  margin-top:14px;
}

@media(max-width:560px){
  .filter-wave-legend{
    gap:9px;
  }

  .filter-wave-legend small{
    display:none;
  }

  #filter-wave-canvas{
    height:125px;
  }
}
/* v12: Mode-dependent fields and results */
.ripple-tool-body [hidden]{display:none !important;}

/* v13: Full border for standalone select controls */

.value-unit.single-input select{
  border-left:1px solid #ccd7e0;
  border-radius:7px;
}

/* v14: Voltage divider and helical coil diagrams */

.divider-diagram,
.coil-helix-diagram{
  width:100%;
  max-width:460px;
  margin:24px auto 12px;
}

.divider-diagram svg,
.coil-helix-diagram svg{
  display:block;
  width:100%;
  height:auto;
}

.divider-diagram{
  margin-top:34px;
  margin-bottom:24px;
}

.coil-helix-diagram{
  margin-top:25px;
  margin-bottom:20px;
}

/* v22: Align Two Ways to Start introduction with the right-hand card */
@media (min-width:901px) {
  .tinted .section-head {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:20px;
    align-items:end;
  }
  .tinted .section-head > p {
    max-width:none;
    margin:0;
    padding-left:28px;
    transform:translateY(12px);
  }
}

/* Calculator revision 12 */
.calculator #estimate-form{display:grid;gap:10px;margin:12px 0}.calculator #estimate-form>label{margin:0;gap:12px}.calculator .estimate-method{border:1px solid var(--line);border-radius:8px;padding:12px;margin:0 0 4px}.calculator .estimate-method legend{font-weight:800;padding:0 5px}.calculator .estimate-method label{display:flex;align-items:center;gap:8px;margin:8px 0;font-weight:600}.calculator .estimate-method input{width:auto;accent-color:var(--blue)}.calculator #estimate-form button{justify-self:start}.calculator #estimate-status{font-size:13px;margin:4px 0;color:var(--muted)}