:root{--teal:#00a0b6;--ink:#081a20;--muted:#53666d;--line:#dce5e7;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:white}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0}button,input,textarea{font:inherit}button,a,input,textarea{-webkit-tap-highlight-color:transparent}a{color:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #008da2;outline-offset:5px}.container{max-width:1280px;width:calc(100% - 80px);margin:auto}.site-header{background:#fff;border-bottom:1px solid var(--line)}.header-inner{min-height:100px;display:flex;align-items:center;gap:40px}.brand{text-decoration:none;white-space:nowrap}.brand strong{display:block;font-size:30px;letter-spacing:-1.3px;font-weight:900;color:#070d10}.brand strong span{color:var(--teal)}.brand small{display:block;font-size:10px;letter-spacing:1.7px;margin-top:3px}.header-inner nav{display:flex;justify-content:flex-end;gap:30px;flex:1}.header-inner nav a,.site-footer nav a{font-size:15px;text-decoration:none}.header-inner nav a:hover,.site-footer nav a:hover{color:var(--teal)}.button{display:inline-flex;align-items:center;justify-content:center;min-height:49px;padding:15px 23px;border:1px solid transparent;border-radius:2px;text-decoration:none;font-size:14px;font-weight:700;letter-spacing:.3px}.primary{background:var(--teal);color:white}.primary:hover{background:#007f94}.outline{border-color:#bac8cc;color:white;background:#081a2033}.outline:hover{background:#ffffff18}.menu-toggle{display:none}.hero{position:relative;color:white;background:linear-gradient(90deg,#020e15ed 0%,#020e15bd 40%,#020e1520 74%),url('components-banner.webp') center/cover;min-height:590px}.hero-inner{padding-top:64px;padding-bottom:60px}.eyebrow{font-size:12px;font-weight:700;letter-spacing:2px;margin:0 0 20px}.teal{color:#008a9e}h1{font-size:clamp(40px,4.7vw,67px);line-height:1.02;letter-spacing:-2.5px;margin:0 0 23px;font-weight:900}h1 span,h2 span{color:var(--teal)}.hero-copy{font-size:19px;line-height:1.5;color:#e0e8eb;margin:0 0 25px}.category-line{display:flex;align-items:center;flex-wrap:wrap;gap:13px;font-size:12px;letter-spacing:1px;margin:28px 0}.category-line i{height:12px;border-left:1px solid var(--teal)}.hero-actions{display:flex;gap:15px}.hero-actions .button{min-width:190px}h2{font-size:36px;line-height:1.08;letter-spacing:-1.2px;margin:0;font-weight:900}.intro{text-align:center;padding-top:62px;padding-bottom:58px}.intro>p:not(.eyebrow){max-width:700px;margin:20px auto 36px;font-size:17px;line-height:1.65;color:var(--muted)}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);text-align:left;margin-top:40px}.service-grid article{padding:6px 35px;border-right:1px solid var(--line)}.service-grid article:last-child{border:0}.service-number{color:var(--teal);font-size:14px;font-weight:bold}.service-grid h3{font-size:22px;line-height:1.2;letter-spacing:-.4px;margin:16px 0 10px}.service-grid p{font-size:16px;line-height:1.6;color:var(--muted);margin:0;max-width:270px}.products-section{background:#f2f6f7;padding:55px 0 60px}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:30px}.section-heading p:not(.eyebrow){font-size:15px;color:var(--muted);margin:0 0 3px}.section-heading .eyebrow{margin-bottom:12px}.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.product-card{text-align:left;position:relative;background:white;padding:23px;border:1px solid #dce5e7;color:var(--ink);overflow:hidden;transition:transform .15s,box-shadow .15s}.product-card:hover{transform:translateY(-4px);box-shadow:0 10px 25px #183e4212;border-color:var(--teal)}.product-index{font-size:12px;letter-spacing:1px;color:#71848a}.family-symbol{display:block;font-size:77px;font-weight:900;color:#00a0b6;margin:18px 0 25px;line-height:1;letter-spacing:-5px}.product-card h3{font-size:18px;margin:0 0 12px;letter-spacing:-.4px}.product-card p{font-size:14px;line-height:1.7;color:var(--muted);margin:0 0 22px}.category-action{display:block;font-size:12px;font-weight:700;border-top:1px solid var(--line);padding-top:17px;color:#007b90}.parent-section{padding-top:58px;padding-bottom:60px}.parent-layout{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center}.parent-layout p{max-width:500px;color:var(--muted);line-height:1.65;font-size:17px;margin:0 0 17px}.text-link{font-size:14px;font-weight:700;text-underline-offset:5px;color:#007d91}.contact-section{background:linear-gradient(90deg,#05161bef,#07252cdd),url('components-banner.webp') center/cover;color:white;padding:55px 0}.contact-inner{display:flex;align-items:center;justify-content:space-between;gap:30px}.contact-inner p:not(.eyebrow){font-size:17px;line-height:1.6;color:#bdcfd4;margin:20px 0 0}.contact-inner .button{min-width:225px}.site-footer{background:#061318;color:#b4c7cc;padding:35px 0 0}.footer-inner{display:flex;justify-content:space-between;align-items:center;padding-bottom:30px;gap:30px}.site-footer .brand strong{color:white;font-size:25px}.site-footer .brand small{font-size:9px}.site-footer nav{display:flex;gap:30px}.footer-bottom{border-top:1px solid #244049;padding:20px 0;display:flex;justify-content:space-between;gap:20px;font-size:12px}.skip-link{position:absolute;top:-80px;left:15px;z-index:9;background:white;padding:15px}.skip-link:focus{top:10px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}dialog{border:0;border-top:4px solid var(--teal);border-radius:5px;padding:35px;max-width:560px;width:calc(100% - 30px);max-height:90vh;overflow:auto;color:var(--ink)}dialog::backdrop{background:#00151bc9}dialog h2{font-size:29px}.dialog-close{position:absolute;top:10px;right:15px;border:0;background:none;font-size:28px}.dialog-intro{font-size:14px;line-height:1.5;color:var(--muted)}form label{display:block;font-size:13px;font-weight:bold;margin:14px 0}form input,form textarea{width:100%;margin-top:7px;border:1px solid #bdced3;border-radius:3px;padding:11px;color:var(--ink)}form input:focus,form textarea:focus{outline:2px solid var(--teal)}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:15px}#quote-result{font-size:14px;line-height:1.5;color:#007b80}.part-search{display:flex;max-width:560px;margin-bottom:20px}.part-search input{margin:0;flex:1;min-width:0}.part-search button{background:var(--teal);color:white;border:0;padding:12px 20px;font-weight:bold}@media(max-width:1050px){.container{width:calc(100% - 48px)}.header-inner{gap:25px}.brand strong{font-size:25px}.brand small{font-size:8px}.header-inner nav{gap:20px}.header-quote{padding:13px;font-size:12px}.hero{background-position:62% center}.hero-inner{padding-top:55px}.product-grid{gap:12px}.product-card{padding:17px}.product-card h3{font-size:16px}}@media(max-width:760px){html{scroll-padding-top:20px}.container{width:calc(100% - 36px)}.header-inner{flex-wrap:wrap;min-height:82px;padding:18px 0;gap:18px}.brand{flex:1}.brand strong{font-size:25px}.brand small{font-size:8px}.header-quote{display:none}.menu-toggle{display:block;background:white;border:1px solid #bdced3;padding:9px 13px;border-radius:2px;color:var(--ink);font-size:14px}.header-inner nav{display:none;flex-basis:100%;justify-content:flex-start;padding:10px 0}.header-inner nav.is-open{display:flex}.hero{min-height:530px;background-image:linear-gradient(90deg,#020e15f2,#020e158f),url('components-banner.webp');background-position:65% center}.hero-inner{padding-top:48px;padding-bottom:45px}h1{font-size:41px;letter-spacing:-1.6px}.hero .eyebrow{font-size:10px;letter-spacing:1.3px}.hero-copy{font-size:16px}.category-line{font-size:10px;gap:8px;letter-spacing:.4px}.hero-actions{flex-wrap:wrap;gap:10px}.hero-actions .button{min-width:0;font-size:12px;padding:13px 16px}h2{font-size:29px}.intro{padding-top:42px;padding-bottom:40px}.intro>p:not(.eyebrow){font-size:16px}.service-grid{grid-template-columns:1fr;gap:25px;margin-top:30px}.service-grid article{border-right:0;border-bottom:1px solid var(--line);padding:0 0 24px}.service-grid h3 br{display:none}.service-grid h3{font-size:20px;margin:10px 0}.service-grid p{max-width:none}.section-heading{display:block}.section-heading>p{margin-top:16px!important}.products-section{padding:40px 0}.product-grid{grid-template-columns:1fr 1fr;gap:12px}.family-symbol{font-size:60px;margin:15px 0 20px}.product-card h3{font-size:15px}.product-card p{font-size:13px}.category-action{font-size:11px}.parent-section{padding:40px 0}.parent-layout{grid-template-columns:1fr;gap:25px}.parent-layout p{font-size:16px}.contact-inner{display:block}.contact-inner .button{margin-top:25px;min-width:0}.contact-section{padding:40px 0}.footer-inner{display:block}.site-footer nav{margin-top:25px}.footer-bottom{flex-direction:column;gap:10px;font-size:11px}dialog{padding:28px 22px}.form-row{grid-template-columns:1fr;gap:0}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* Product imagery and supporting industrial icon accents */
.category-image{display:block;width:calc(100% + 46px);max-width:none;height:auto;aspect-ratio:1.25;object-fit:cover;margin:15px -23px 24px;background:#e6e9eb}.product-card .product-index{position:relative;z-index:1}.service-heading{display:flex;align-items:center;gap:15px}.service-cog{display:block;flex:none}.service-number{letter-spacing:1px}.product-card:hover .category-image{filter:brightness(1.025)}
@media(max-width:1050px){.category-image{width:calc(100% + 34px);margin:15px -17px 22px}}@media(max-width:760px){.category-image{aspect-ratio:1.05;margin-bottom:20px}.service-cog{width:36px;height:36px}}

/* Layered industrial backgrounds, coordinated with the reference concept */
body{background:#edf2f3}.site-header{background:#fcfdfd}.intro{position:relative;isolation:isolate;background:radial-gradient(ellipse at 50% 0%,#ffffffee 0%,#edf3f4 78%);max-width:none;width:100%;padding-left:max(40px,calc((100vw - 1200px)/2));padding-right:max(40px,calc((100vw - 1200px)/2));overflow:hidden}.intro:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#eef4f5f5 0%,#eef4f5e8 55%,#eef4f5ce),url('components-banner.webp') right center/cover no-repeat;opacity:.33;pointer-events:none}.service-grid article{border-color:#c5d7dc}.products-section{position:relative;background:radial-gradient(ellipse at 85% 15%,#cbe5e9aa,transparent 55%),linear-gradient(135deg,#e5edef,#f2f5f5 55%,#dfeaec);border-top:1px solid #d3e0e3;border-bottom:1px solid #cddde1}.product-card{background:#f9fbfc;border-color:#cbdade;box-shadow:0 4px 14px #102e3608}.category-image{mix-blend-mode:multiply}.parent-section{position:relative;isolation:isolate;max-width:none;width:100%;padding-left:max(40px,calc((100vw - 1200px)/2));padding-right:max(40px,calc((100vw - 1200px)/2));background:#e8f0f2;overflow:hidden}.parent-section:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#e8f0f2 15%,#e8f0f2e8 55%,#e8f0f2c7),url('components-banner.webp') right 60%/cover no-repeat;pointer-events:none}.contact-section{background-image:linear-gradient(90deg,#04171ded 0%,#06252bc9 55%,#04232b88),url('components-banner.webp');background-position:center,center 60%;border-top:3px solid #00a0b6}.parent-layout p{color:#425d65}.intro>p:not(.eyebrow){color:#475f67}@media(max-width:1050px){.intro,.parent-section{padding-left:24px;padding-right:24px}}@media(max-width:760px){.intro,.parent-section{padding-left:18px;padding-right:18px}.intro:before{opacity:.2}.parent-section:before{background-image:linear-gradient(90deg,#e8f0f2f5,#e8f0f2df),url('components-banner.webp')}.contact-section{background-position:65% center}}

/* Distinct section treatments: reserve reel photography for the hero. */
.intro{background:linear-gradient(180deg,#f4f7f8,#e8eff1)}
.intro:before{display:none}
.products-section{background:radial-gradient(ellipse at 95% 0%,#c8e4e9a6,transparent 60%),#e3ecef}
.parent-section{background:linear-gradient(115deg,#eaf1f2 0%,#d9e9ed 100%)}
.parent-section:before{display:block;background:repeating-linear-gradient(135deg,transparent 0,transparent 45px,#008fa308 46px,#008fa308 47px);opacity:1}
.contact-section{position:relative;overflow:hidden;isolation:isolate;background:radial-gradient(ellipse at 95% 100%,#075664 0%,transparent 58%),linear-gradient(110deg,#07191f,#10343e);border-top:3px solid #00a0b6}
.contact-section:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:linear-gradient(#73d6e00b 1px,transparent 1px),linear-gradient(90deg,#73d6e00b 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(90deg,transparent,#000);-webkit-mask-image:linear-gradient(90deg,transparent,#000)}

/* Rich teal service band behind the gear icons. */
.intro{background:radial-gradient(ellipse at 90% 5%,#176271 0%,transparent 60%),linear-gradient(120deg,#102c36,#123f4b);color:#f4fafb;border-bottom:1px solid #215766}
.intro>.eyebrow{color:#67dce7}.intro h2 span{color:#42c6d7}.intro>p:not(.eyebrow){color:#ccdde2}
.intro .service-grid article{border-color:#3b626e}.intro .service-grid h3{color:#fff}.intro .service-grid p{color:#c4d9df}.intro .service-number{color:#69d6e1}
.intro .service-cog{background:#dff5f6;border:1px solid #8adce4;border-radius:12px;padding:8px;width:56px;height:56px;box-shadow:0 5px 15px #00151d26}
@media(max-width:760px){.intro .service-cog{width:48px;height:48px;padding:7px}}

/* Three separate service panels, replacing the continuous teal block. */
.intro{background:linear-gradient(180deg,#f2f6f7,#e5edef);color:#102d36;border-bottom:1px solid #ccdce0}
.intro>.eyebrow{color:#008597}.intro h2 span{color:#008fa3}.intro>p:not(.eyebrow){color:#506970}
.intro .service-grid{gap:22px;align-items:stretch}
.intro .service-grid article{position:relative;overflow:hidden;padding:29px;border:1px solid #c9dade;border-radius:5px;box-shadow:0 8px 22px #143a4408;background:linear-gradient(140deg,#ffffff,#e3eff2)}
.intro .service-grid article:nth-child(2){background:linear-gradient(140deg,#d7eef0,#b9dce1);border-color:#a7cdd4}
.intro .service-grid article:nth-child(3){background:linear-gradient(130deg,#173a45,#216173);border-color:#285966}
.intro .service-grid article:after{content:"";position:absolute;width:160px;height:160px;right:-85px;top:-85px;border:1px solid #008fa31c;border-radius:50%;box-shadow:0 0 0 22px #008fa307,0 0 0 44px #008fa305;pointer-events:none}
.intro .service-grid h3{color:#163641;font-size:22px;margin-top:24px}.intro .service-grid p{color:#4c6872}.intro .service-number{color:#007b90}
.intro .service-grid article:nth-child(3) h3{color:#fff}.intro .service-grid article:nth-child(3) p{color:#d1e5e9}.intro .service-grid article:nth-child(3) .service-number{color:#8ee5ed}
.intro .service-cog{background:#ffffffb3;border-color:#aacfd6;box-shadow:none}.intro .service-grid article:nth-child(3) .service-cog{background:#dcf4f6}
/* Slow cinematic light drift, isolated behind the callout content. */
.contact-section{position:relative;isolation:isolate;background:#071e28}
.contact-section:before{inset:-65%;z-index:-1;background:radial-gradient(ellipse at 35% 45%,#00bfd359 0%,transparent 35%),radial-gradient(ellipse at 68% 60%,#14778a88 0%,transparent 32%),linear-gradient(115deg,#061a24,#103c4d 55%,#061a24);background-size:100% 100%;mask-image:none;-webkit-mask-image:none;animation:banner-light-drift 18s ease-in-out infinite alternate;will-change:transform}
.contact-section:after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:repeating-linear-gradient(115deg,transparent 0,transparent 100px,#8bdfe208 101px,transparent 102px)}
.contact-inner{position:relative}.motion-toggle{position:absolute;right:0;bottom:-32px;background:#061b2580;border:1px solid #7ba4b16b;color:#d1e6ec;padding:7px 11px;border-radius:3px;font-size:12px;min-height:32px}
.contact-section.motion-paused:before{animation-play-state:paused}
@keyframes banner-light-drift{0%{transform:translate(-4%,-3%) rotate(-7deg) scale(1)}100%{transform:translate(7%,5%) rotate(9deg) scale(1.12)}}
@media(max-width:760px){.intro .service-grid{gap:16px}.intro .service-grid article{padding:24px}.intro .service-grid h3{margin-top:18px}.contact-section{padding-bottom:65px}.motion-toggle{bottom:-43px;right:0}}
@media(prefers-reduced-motion:reduce){.contact-section:before{animation:none;will-change:auto}.motion-toggle{display:none}}

/* Lightweight interaction polish. Content remains visible without JavaScript. */
.product-card{transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}.category-image{transition:transform .45s ease;transform-origin:center}.product-card:hover .category-image,.product-card:focus-visible .category-image{transform:scale(1.035)}.product-card:focus-visible{transform:translateY(-3px);border-color:var(--teal)}
.button{transition:background-color .18s ease,box-shadow .18s ease,transform .18s ease}.button:hover{box-shadow:0 5px 14px #001c2520}.button:active{transform:translateY(1px)}
.header-inner nav a{position:relative;padding-bottom:6px}.header-inner nav a:after{content:"";position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--teal);transform:scaleX(0);transform-origin:left;transition:transform .2s ease}.header-inner nav a:hover:after,.header-inner nav a:focus-visible:after{transform:scaleX(1)}
.reveal-ready{opacity:0;transform:translateY(20px);transition:opacity .55s ease,transform .55s cubic-bezier(.2,.65,.3,1);transition-delay:var(--reveal-delay,0ms)}.reveal-ready.is-revealed,.reveal-ready:focus-within{opacity:1;transform:none}
.contact-section.motion-offscreen:before{animation-play-state:paused}
@media(hover:none){.product-card:hover{transform:none}.product-card:hover .category-image{transform:none}}
@media(prefers-reduced-motion:reduce){.reveal-ready{opacity:1;transform:none;transition:none}.category-image,.product-card,.button,.header-inner nav a:after{transition:none}.product-card:hover .category-image,.product-card:focus-visible .category-image{transform:none}.contact-section:before{animation:none}}

/* Restore the reference design's rhythm without depending on search. */
.hero h1 span{color:#11bdd1}.hero .primary{background:#00a4bb;border-color:#28c5d6}.hero .primary:hover{background:#00869d}.hero .category-line{border-top:1px solid #64dce34d;padding-top:20px;max-width:480px}
.quick-quote-strip{background:#e7f8fa;border-bottom:1px solid #b2dce3;border-top:4px solid #15bbd0}.quick-quote-inner{display:flex;align-items:center;gap:23px;padding-top:23px;padding-bottom:23px}.quote-strip-mark{display:flex;align-items:center;justify-content:center;width:56px;height:56px;flex:none;background:#102f3b;color:#7ee8f1;font-size:16px;font-weight:800;letter-spacing:1px;border-radius:3px}.quick-quote-copy{flex:1}.quick-quote-copy strong{display:block;font-size:19px;letter-spacing:-.3px;color:#10313d}.quick-quote-copy p{margin:6px 0 0;font-size:15px;color:#496771}.quick-quote-inner .button{background:#007f94}.quick-quote-inner .button:hover{background:#006c7e}
.intro{padding-top:48px;padding-bottom:48px;background:#f5f8f9}.intro .service-grid article{border-top:3px solid #0bafc4}.intro .service-grid article:nth-child(2){border-top-color:#178596}.intro .service-grid article:nth-child(3){border-top-color:#70e0e8}
.products-section{background:linear-gradient(120deg,#dfeef2,#edf5f6 60%,#cce9ee)}.section-heading h2:after{content:"";display:block;width:76px;height:4px;background:#00aec5;margin-top:18px}.product-card{border-bottom:3px solid #00a9bd}.category-action{color:#007488}
.parent-section{padding-top:40px;padding-bottom:42px}.parent-section .eyebrow{margin-bottom:14px}.parent-layout h2{font-size:30px}
.contact-section{min-height:350px;padding:58px 0;background:#082a35}.contact-art{position:absolute;left:0;top:0;bottom:0;width:37%;overflow:hidden;z-index:-1;background:#dce7e9}.contact-art img{width:100%;height:100%;object-fit:cover;object-position:center 52%;filter:brightness(.83) saturate(.75)}.contact-art:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#00313b12,#082a3538 55%,#082a35)}.contact-section:before{left:25%;opacity:.5}.contact-section:after{left:37%;opacity:.55}.contact-inner{padding-left:34%;gap:25px}.contact-inner h2{font-size:34px}.contact-inner h2 span{color:#37cede}.contact-inner>.button{min-width:180px;padding-left:17px;padding-right:17px}.contact-inner .eyebrow{color:#9be7ee;font-size:11px}.contact-inner p:not(.eyebrow){font-size:16px}.contact-inner .motion-toggle{bottom:-35px}
@media(max-width:1050px){.contact-inner{flex-wrap:wrap;padding-left:33%}.contact-inner>.button{margin-top:5px}.contact-section{padding:42px 0 58px}.contact-inner h2{font-size:30px}}
@media(max-width:760px){.quick-quote-inner{gap:14px;flex-wrap:wrap;padding-top:20px;padding-bottom:20px}.quick-quote-copy strong{font-size:16px}.quick-quote-copy p{font-size:13px;line-height:1.5}.quick-quote-inner>.button{margin-left:70px;font-size:12px;min-height:43px}.contact-art{width:100%;height:190px;bottom:auto}.contact-art img{object-position:center 49%}.contact-art:after{background:linear-gradient(180deg,#082a3510,#082a3540 50%,#082a35)}.contact-section{padding-top:210px;padding-bottom:65px}.contact-inner{padding-left:0}.contact-section:before{left:-65%;opacity:.35}.contact-inner .motion-toggle{bottom:-43px}.parent-layout h2{font-size:28px}}

/* More expressive introduction: offset typography and layered cyan geometry. */
.intro{position:relative;isolation:isolate;text-align:left;background:linear-gradient(115deg,#d6edf1 0%,#f0f7f8 57%,#c3e7ed 100%);padding-top:62px;padding-bottom:58px;overflow:hidden}
.intro:before{display:block;content:"";position:absolute;inset:0;z-index:-1;opacity:1;background:linear-gradient(125deg,transparent 0%,transparent 67%,#00a7bf1a 67%,#00a7bf1a 80%,transparent 80%),radial-gradient(ellipse at 5% 10%,#69d9e557,transparent 54%);pointer-events:none}
.intro:after{content:"";position:absolute;width:440px;height:440px;right:-85px;top:-170px;border:1px solid #008ba332;border-radius:50%;box-shadow:0 0 0 38px #00a3ba0c,0 0 0 76px #00a3ba08;z-index:-1;pointer-events:none}
.intro>.eyebrow{display:inline-block;color:#006c80;letter-spacing:2.3px;padding-left:39px;position:relative;margin-bottom:20px}.intro>.eyebrow:before{content:"";position:absolute;left:0;top:5px;width:26px;height:3px;background:#009bb1}
.intro>h2{font-size:clamp(32px,3.7vw,50px);max-width:850px;letter-spacing:-1.8px;line-height:1.07;color:#0b303c;border-left:5px solid #00abc1;padding-left:23px}
.intro>h2 span{color:#007f96}.intro>p:not(.eyebrow){max-width:650px;margin:23px 0 0 28px;font-size:17px;line-height:1.65;color:#365d69}
.intro .service-grid{margin-top:35px;gap:22px}.intro .service-grid article{background:#f9fcfdeb;border:1px solid #b8d5dc;border-top:3px solid #00a8c0;box-shadow:0 10px 25px #1553690b}.intro .service-grid article:nth-child(2){background:#d3eef2ed}.intro .service-grid article:nth-child(3){background:linear-gradient(135deg,#124455,#126679)}
@media(max-width:760px){.intro{padding-top:40px;padding-bottom:40px}.intro>h2{font-size:32px;letter-spacing:-1px;padding-left:16px;border-left-width:4px}.intro>p:not(.eyebrow){margin-left:20px;font-size:16px}.intro:after{right:-240px;top:-190px}.intro .service-grid{margin-top:28px;gap:16px}}

/* Service-panel hover treatment; informational panels remain non-clickable. */
.intro .service-grid article{transition:transform .24s ease,box-shadow .24s ease,border-color .24s ease,opacity .55s ease}
.intro .service-cog{transition:transform .38s ease,background-color .24s ease,box-shadow .24s ease}
@media(hover:hover) and (pointer:fine){
.intro .service-grid article:hover{transform:translateY(-6px);border-color:#00a6bf;box-shadow:0 15px 30px #0a526b22}
.intro .service-grid article:hover .service-cog{transform:rotate(18deg);background-color:#fff;box-shadow:0 4px 15px #00a5bd26}
.intro .service-grid article:nth-child(3):hover{border-color:#72e4ee;box-shadow:0 15px 30px #0a526b30}
}
@media(prefers-reduced-motion:reduce){
.intro .service-grid article,.intro .service-cog{transition:none}
.intro .service-grid article:hover,.intro .service-grid article:hover .service-cog{transform:none}
}

/* Smooth color wash on service-panel hover. */
.intro .service-grid article:before{content:"";position:absolute;inset:0;background:#b6e8ee;opacity:0;transition:opacity .25s ease;pointer-events:none;z-index:0}
.intro .service-grid article:nth-child(2):before{background:#a0dde6}
.intro .service-grid article:nth-child(3):before{background:#08768b}
.intro .service-grid article>*{position:relative;z-index:1}
@media(hover:hover) and (pointer:fine){.intro .service-grid article:hover:before{opacity:1}}
@media(prefers-reduced-motion:reduce){.intro .service-grid article:before{transition:none}}

/* One-time staggered headline entrance, using only opacity and transform. */
.intro .intro-headline .headline-line{display:block}
.intro .intro-headline .headline-first{color:#0b303c}
.intro .intro-headline .headline-second{color:#007f96}
.headline-pending .headline-line{opacity:0;transform:translateX(-26px)}
.headline-entered .headline-line{animation:headline-fly-in .65s cubic-bezier(.2,.7,.25,1) both}
.headline-entered .headline-second{animation-delay:.12s}
@keyframes headline-fly-in{from{opacity:0;transform:translateX(-26px)}to{opacity:1;transform:translateX(0)}}
@media(prefers-reduced-motion:reduce){.headline-pending .headline-line,.headline-entered .headline-line{opacity:1;transform:none;animation:none}}

/* Main headline: short, staggered entrance with no layout movement. */
.hero-headline .hero-line{display:block}
.hero .hero-headline .hero-line-first{color:#fff}
@media(prefers-reduced-motion:no-preference){
.hero-headline .hero-line{animation:hero-text-arrive .7s cubic-bezier(.2,.7,.25,1) both}
.hero-headline .hero-line-second{animation-delay:.13s}
.hero-headline .hero-line-third{animation-delay:.26s}
.hero .hero-copy{animation:hero-text-arrive .65s ease .36s both}
.hero .hero-actions{animation:hero-text-arrive .6s ease .46s both}
}
@keyframes hero-text-arrive{from{opacity:0;transform:translateY(17px)}to{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.hero-headline .hero-line,.hero .hero-copy,.hero .hero-actions{animation:none;opacity:1;transform:none}}

/* Slower, more deliberate reel-banner text entrance. */
@media(prefers-reduced-motion:no-preference){
.hero-headline .hero-line{animation-duration:1.5s;animation-delay:.15s}
.hero-headline .hero-line-second{animation-delay:.55s}
.hero-headline .hero-line-third{animation-delay:.95s}
.hero .hero-copy{animation-duration:1.2s;animation-delay:1.35s}
.hero .hero-actions{animation-duration:1.1s;animation-delay:1.65s}
}

/* Give the final hero line a distinct horizontal entrance. */
@keyframes hero-line-slide{from{opacity:0;transform:translateX(-52px)}to{opacity:1;transform:translateX(0)}}
@media(prefers-reduced-motion:no-preference){
.hero-headline .hero-line-third{animation-name:hero-line-slide;animation-duration:1.65s;animation-delay:.95s;animation-timing-function:cubic-bezier(.2,.7,.25,1)}
}

/* White distributor-logo band. Preserve original brand artwork and colors. */
.distributor-section{background:#fff;padding:32px 0 36px;border-top:1px solid #dce5e7}.distributor-title{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:25px}.distributor-title h2{font-size:23px;letter-spacing:-.5px}.distributor-title h2:before{content:"";display:inline-block;width:5px;height:20px;background:#00a5bb;margin-right:12px;vertical-align:-2px}.distributor-title>span{font-size:12px;color:#62747a}.distributor-logos{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));align-items:center;gap:28px}.distributor-logos img{display:block;width:100%;height:72px;object-fit:contain;background:#fff;padding:5px}@media(max-width:900px){.distributor-logos{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 30px}}@media(max-width:480px){.distributor-logos{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.distributor-title{align-items:flex-start;flex-direction:column;gap:8px}.distributor-title h2{font-size:21px}.distributor-logos img{height:64px}}

/* Balanced sizing for the five franchised-distributor reference logos. */
.distributor-logos{grid-template-columns:repeat(5,minmax(0,1fr));gap:36px;min-height:85px}.distributor-logos img{height:85px;padding:4px;max-width:210px;justify-self:center}.distributor-logos img[alt="A2 Global Electronics and Solutions"],.distributor-logos img[alt="NEP Electronics"]{height:65px}@media(max-width:900px){.distributor-logos{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}}@media(max-width:480px){.distributor-logos{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.distributor-logos img{height:72px}}

/* Compact distributor ribbon with an unhurried seamless loop. */
.distributor-section{padding:14px 0;border-bottom:1px solid #e2e9eb}.distributor-section>.container{position:relative;padding-right:56px}.logo-marquee{overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent)}.logo-track{display:flex;width:max-content;animation:logo-drift 38s linear infinite}.logo-group{display:flex;align-items:center;justify-content:space-around;flex:none;width:1100px;gap:55px;padding:0 28px}.logo-group img{display:block;object-fit:contain;width:150px;height:43px;background:#fff}.logo-group img[src*="a2-global"],.logo-group img[src*="nep"]{height:32px}.logo-motion-toggle{position:absolute;right:0;top:50%;transform:translateY(-50%);border:1px solid #d4e0e3;background:#fff;color:#536d75;border-radius:3px;padding:6px;font-size:11px;cursor:pointer}.distributor-section:hover .logo-track,.distributor-section:focus-within .logo-track,.distributor-section.logos-paused .logo-track{animation-play-state:paused}@keyframes logo-drift{to{transform:translateX(-50%)}}@media(max-width:760px){.logo-group{width:850px;gap:35px;padding:0 18px}.logo-group img{width:130px;height:37px}.logo-group img[src*="a2-global"],.logo-group img[src*="nep"]{height:28px}.distributor-section{padding:11px 0}}@media(prefers-reduced-motion:reduce){.logo-track{animation:none;width:100%}.logo-group{width:100%;gap:20px;flex-wrap:wrap;padding:0}.logo-group[aria-hidden="true"]{display:none}.logo-motion-toggle{display:none}.distributor-section>.container{padding-right:0}.logo-marquee{mask-image:none;-webkit-mask-image:none}}

/* All 21 distributors: consistent small logos and constant gentle speed. */
.logo-group{width:4305px;gap:55px;padding:0 27.5px;justify-content:flex-start}.logo-group img{flex:0 0 150px}.logo-track{animation-duration:150s}
@media(max-width:760px){.logo-group{width:3465px;gap:35px;padding:0 17.5px}.logo-group img{flex-basis:130px}.logo-track{animation-duration:130s}}
@media(prefers-reduced-motion:reduce){.logo-group{width:100%;gap:20px;padding:0;justify-content:center}.logo-track{animation:none}.logo-group img{flex:0 1 130px}}

/* Icon-led quote, BOM, and excess-inventory action panels. */
.sourcing-actions{background:#0b2631;color:white;border-top:3px solid #00a6bb;padding:40px 0}.sourcing-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0}.sourcing-grid article{padding:8px 30px;display:flex;gap:17px;border-right:1px solid #37606c}.sourcing-grid article:first-child{padding-left:0}.sourcing-grid article:last-child{padding-right:0;border:0}.sourcing-grid svg{width:38px;height:38px;flex:none;fill:none;stroke:#52d2df;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.sourcing-grid h2{font-size:26px;line-height:1.13;letter-spacing:-.7px}.sourcing-grid h2 span{color:#38c8d9}.sourcing-grid p{color:#cbdee4;font-size:15px;line-height:1.6;min-height:72px;margin:18px 0}.sourcing-grid .button{font-size:11px;padding:12px 14px;min-height:44px}.sourcing-grid article:nth-child(2){background:linear-gradient(135deg,#12435070,transparent)}@media(max-width:1050px){.sourcing-grid article{padding:8px 18px;display:block}.sourcing-grid svg{margin-bottom:18px}.sourcing-grid h2{font-size:23px}}@media(max-width:760px){.sourcing-grid{grid-template-columns:1fr;gap:25px}.sourcing-grid article,.sourcing-grid article:first-child,.sourcing-grid article:last-child{padding:0 0 25px;border:0;border-bottom:1px solid #37606c;display:flex}.sourcing-grid article:last-child{padding-bottom:0;border:0}.sourcing-grid p{min-height:0}.sourcing-grid h2{font-size:26px}.sourcing-grid svg{margin-bottom:0}}

/* Two sourcing actions: quote requests and BOM uploads. */
.sourcing-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:0}.sourcing-grid article{padding:12px 38px;display:flex;gap:22px}.sourcing-grid article:first-child{padding-left:0}.sourcing-grid article:last-child{padding-right:0;border-right:0}.sourcing-grid p{min-height:48px;max-width:380px}.sourcing-grid h2{font-size:28px}@media(max-width:760px){.sourcing-grid{grid-template-columns:1fr;gap:25px}.sourcing-grid article,.sourcing-grid article:first-child,.sourcing-grid article:last-child{padding:0 0 25px}.sourcing-grid article:last-child{padding-bottom:0}.sourcing-grid h2{font-size:26px}.sourcing-grid p{min-height:0}}

/* Prominent part search in the reel banner. */
.hero .part-search{display:flex;align-items:center;position:relative;max-width:610px;margin:22px 0 8px;background:white;border:1px solid #36bfd1;border-radius:4px;box-shadow:0 8px 24px #00182038;overflow:hidden}.hero .part-search .search-icon{width:23px;height:23px;flex:none;margin-left:17px;fill:none;stroke:#59717a;stroke-width:1.8;stroke-linecap:round}.hero .part-search input{border:0;background:white;color:#12323e;padding:19px 14px;font-size:15px;border-radius:0;min-width:0;flex:1;outline-offset:-3px}.hero .part-search button{align-self:stretch;padding:16px 23px;font-size:13px;letter-spacing:.3px;background:#009db5}.hero .part-search button:hover{background:#007f94}.hero .part-search:focus-within{outline:2px solid #63deec;outline-offset:3px}.hero .search-preview-note{font-size:12px;color:#bdd6dc;margin:0 0 21px;line-height:1.4}.hero .hero-actions{margin-top:20px}@media(max-width:520px){.hero .part-search .search-icon{margin-left:11px;width:19px}.hero .part-search input{font-size:13px;padding:17px 10px}.hero .part-search button{font-size:11px;padding:14px 12px}}
/* Compact navigation and an understated return-to-top control. */
.distributor-section>.container{padding-right:0}
.back-to-top{position:fixed;right:20px;bottom:20px;z-index:50;width:44px;height:44px;display:grid;place-items:center;border:1px solid #79b6c080;border-radius:5px;background:#103c4bb3;color:#fff;backdrop-filter:blur(6px);box-shadow:0 3px 12px #071d2920;transition:background-color .2s,color .2s}
.back-to-top[hidden]{display:none}.back-to-top svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.back-to-top:hover,.back-to-top:focus-visible{background:#008a9edb;color:white}
@media(max-width:1199px){
.site-header .header-inner{position:relative;width:calc(100% - 36px);flex-wrap:wrap;gap:16px}
.site-header .menu-toggle{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:44px;height:44px;padding:10px;margin-left:auto;border:1px solid #b8d8dd;background:#e8f5f7;color:#007f94;border-radius:4px}
.menu-toggle span{width:22px;height:2px;background:currentColor;transition:transform .2s,opacity .2s}
.menu-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.menu-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
.menu-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.site-header .menu-toggle:hover,.site-header .menu-toggle:focus-visible,.site-header .menu-toggle[aria-expanded="true"]{background:#007f94;color:#fff}
.site-header #main-nav{display:none;flex:0 0 100%;width:100%;order:4;padding:8px;background:#f3fafb;border:1px solid #c6e0e4;border-radius:5px;margin-bottom:14px;gap:4px}
.site-header #main-nav.is-open{display:flex;flex-direction:column}
.site-header #main-nav a{display:block;padding:14px 16px;border-radius:3px;color:#123b47;text-decoration:none;transition:background-color .2s,color .2s}
.site-header #main-nav a:hover,.site-header #main-nav a:focus-visible,.site-header #main-nav a:active{background:#007f94;color:#fff}
.back-to-top{right:14px;bottom:max(14px,env(safe-area-inset-bottom))}
}

/* Expanded component list: compact, wrapping rows with teal separators. */
.hero .category-line{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:10px 0;max-width:650px;font-size:11px;line-height:1.6;letter-spacing:.65px}
.hero .category-line>span,.hero .category-line>strong{white-space:nowrap;padding:0 11px;border-left:1px solid #24c5d2}
.hero .category-line>span:first-child{padding-left:0;border-left:0}
.hero .category-line>strong{color:#85e5ee;font-weight:700}
@media(max-width:520px){.hero .category-line{font-size:10px;letter-spacing:.35px;gap:9px 0}.hero .category-line>span,.hero .category-line>strong{padding:0 8px}}

/* Frame the category list with matching teal dividers. */
.hero .category-line>span:first-child{padding-left:11px;border-left:1px solid #24c5d2}
.hero .category-line>span:last-child{border-right:1px solid #24c5d2}
@media(max-width:520px){.hero .category-line>span:first-child{padding-left:8px}}
/* Nine component families, without card numbering. */
.product-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.product-card{display:flex;flex-direction:column}
.product-card .category-image{height:200px;aspect-ratio:auto;margin-top:0}
.product-card .stock-category-image{object-fit:contain;background:#fff;mix-blend-mode:normal;padding:16px}
.product-card .category-action{margin-top:auto;width:100%}
.photo-credits{margin-top:18px;font-size:11px;color:#53666d;line-height:1.6}.photo-credits summary{cursor:pointer}.photo-credits p{max-width:900px}
@media(max-width:760px){.product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.product-card .category-image{height:160px}.product-card h3{overflow-wrap:anywhere}}
@media(max-width:420px){.product-grid{grid-template-columns:1fr}.product-card .category-image{height:200px}}
/* Keep the ninth category balanced in the two-column layout. */
@media(min-width:421px) and (max-width:760px){
.product-grid>.product-card:last-child{grid-column:1 / -1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:24px;align-items:start}
.product-grid>.product-card:last-child .category-image{grid-column:1;grid-row:1 / 4;width:100%;height:190px;margin:0;object-fit:contain}
.product-grid>.product-card:last-child h3,.product-grid>.product-card:last-child p,.product-grid>.product-card:last-child .category-action{grid-column:2}
.product-grid>.product-card:last-child h3{padding-top:12px}
}
.product-card .stock-category-image{padding:0;background:#d3d8de;object-fit:cover}
.product-teaser{padding:48px 0;background:linear-gradient(120deg,#dfeef2,#f1f7f8);border-block:1px solid #c4dfe4}.product-teaser>.container{display:flex;align-items:center;justify-content:space-between;gap:32px}.product-teaser p:not(.eyebrow){max-width:590px;color:#496771;line-height:1.65}.product-teaser .button{flex:none}
.products-hero{min-height:360px;background:linear-gradient(90deg,#041822f5,#082937e6 45%,#08293744),url('components-banner.webp') right 65%/cover}.products-hero .hero-inner{padding-top:55px;padding-bottom:55px}.products-hero h1{font-size:clamp(32px,4vw,54px);max-width:900px}.products-hero .hero-copy{max-width:540px}
@media(max-width:760px){.product-teaser>.container{align-items:flex-start;flex-direction:column}.products-hero{min-height:330px}.products-hero .hero-actions{flex-wrap:wrap}.products-hero h1{letter-spacing:-1px}}
.products-hero{background:linear-gradient(90deg,#03121b66,transparent 80%),url("products-banner-capacitors.webp") center/cover}.products-hero h1{font-size:clamp(30px,3.5vw,48px)}@media(max-width:760px){.products-hero{background-position:62% center;background-image:linear-gradient(90deg,#03121be6,#03121b77),url("products-banner-capacitors.webp")}}


/* Full eight-link desktop navigation. */
@media(min-width:1200px){.site-header .header-inner{width:calc(100% - 48px);max-width:1440px;gap:22px;flex-wrap:nowrap}.site-header .brand{flex:none}.site-header .brand strong{font-size:26px}.site-header .brand small{font-size:8px}.site-header #main-nav{display:flex;flex:1;gap:18px;align-items:center;justify-content:center}.site-header #main-nav a{font-size:13px;white-space:nowrap;padding:14px 0}.site-header .header-quote{font-size:11px;padding:12px;white-space:nowrap}.site-header .menu-toggle{display:none}}
@media(min-width:761px) and (max-width:1199px){.site-header .header-inner{padding:16px 0;min-height:84px}.site-header .header-quote{display:none}}
/* Give the primary navigation the space previously used by the quote button. */
@media(min-width:1200px){.site-header .header-inner{gap:38px}.site-header #main-nav{justify-content:flex-end;gap:clamp(20px,2.1vw,32px)}.site-header #main-nav a{font-size:16px;font-weight:600;padding:16px 0;border-bottom:2px solid transparent;transition:color .2s,border-color .2s}.site-header #main-nav a:hover,.site-header #main-nav a:focus-visible{color:#008a9e;border-bottom-color:#00a0b6}}
/* Richer backdrop for the homepage product invitation. */
.product-teaser-feature{position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 82% 20%,#138da0 0%,transparent 52%),linear-gradient(115deg,#092d3b 5%,#10556a 62%,#087b8a);border-block:1px solid #268c9b;color:#fff;padding:58px 0}
.product-teaser-feature:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(125deg,transparent 55%,#7ae6ec12 55%,#7ae6ec12 68%,transparent 68%),linear-gradient(125deg,transparent 73%,#00253524 73%)}
.product-teaser-feature:after{content:"";position:absolute;width:400px;height:400px;right:-70px;top:-135px;border:1px solid #9aebef40;border-radius:50%;box-shadow:0 0 0 45px #8fe9ed0c,0 0 0 90px #8fe9ed08;z-index:-1;pointer-events:none}
.product-teaser-feature .eyebrow{color:#8ae8ef}.product-teaser-feature h2 span{color:#68dce8}.product-teaser-feature p:not(.eyebrow){color:#d7ecf0}.product-teaser-feature .button{background:#edfafd;color:#075366;border-color:#b9f2f5;box-shadow:0 7px 22px #00192333}.product-teaser-feature .button:hover{background:#bceff4;color:#043b4b}
/* Alphabetical logo directory with generous, consistent spacing. */
.manufacturer-directory{padding:52px 0 64px;background:linear-gradient(135deg,#edf4f6,#f8fafb 55%,#e2f0f3)}
.manufacturer-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px}
.manufacturer-card{margin:0;background:#fff;border:1px solid #dce7eb;border-radius:6px;overflow:hidden;box-shadow:0 4px 16px #103d4a06;transition:transform .2s,box-shadow .2s,border-color .2s}
.manufacturer-logo{height:150px;padding:26px 24px;display:flex;align-items:center;justify-content:center;background:#fff}
.manufacturer-logo img{display:block;width:100%;height:100%;object-fit:contain}
.manufacturer-card h3{margin:0;padding:17px 16px;border-top:1px solid #e8eff1;background:#f8fbfc;text-align:center;font-size:14px;line-height:1.45;font-weight:600;color:#264b59}
@media(hover:hover){.manufacturer-card:hover{transform:translateY(-3px);border-color:#46b8c7;box-shadow:0 10px 22px #103d4a12}}
@media(max-width:1050px){.manufacturer-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:760px){.manufacturer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.manufacturer-logo{height:130px;padding:22px 16px}.manufacturer-directory{padding:36px 0 44px}}
@media(max-width:380px){.manufacturer-grid{grid-template-columns:1fr}}
/* Keep all 21 logos balanced: four columns, then a complete five-logo row. */
@media(min-width:1051px){.manufacturer-grid{grid-template-columns:repeat(20,minmax(0,1fr))}.manufacturer-card{grid-column:span 5}.manufacturer-card:nth-last-child(-n+5){grid-column:span 4}.manufacturer-card:nth-last-child(-n+5) .manufacturer-logo{padding:22px 16px}}
@media(min-width:381px) and (max-width:760px){.manufacturer-card:last-child{grid-column:1 / -1}.manufacturer-card:last-child .manufacturer-logo{max-width:280px;margin:auto}}
.manufacturers-hero{background-image:linear-gradient(90deg,#03121b44,transparent 80%),url("manufacturers-banner.webp")}@media(max-width:760px){.manufacturers-hero{background-image:linear-gradient(90deg,#03121be6,#03121b77),url("manufacturers-banner.webp")}}
/* Match the homepage product invitation behind the category cards. */
.products-catalog{position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 82% 12%,#138da0 0%,transparent 52%),linear-gradient(115deg,#092d3b 5%,#10556a 62%,#087b8a);border-block:1px solid #268c9b}
.products-catalog:before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(125deg,transparent 55%,#7ae6ec12 55%,#7ae6ec12 68%,transparent 68%),linear-gradient(125deg,transparent 73%,#00253524 73%)}
.products-catalog:after{content:"";position:absolute;width:500px;height:500px;right:-130px;top:-180px;border:1px solid #9aebef40;border-radius:50%;box-shadow:0 0 0 45px #8fe9ed0c,0 0 0 90px #8fe9ed08;z-index:-1;pointer-events:none}
.products-catalog .section-heading h2{color:#fff}.products-catalog .section-heading h2 span{color:#68dce8}.products-catalog .section-heading .eyebrow{color:#8ae8ef}.products-catalog .section-heading>p{color:#d7ecf0}.products-catalog .product-card{box-shadow:0 8px 22px #00192325}
.hero .hero-more-link{color:#85e5ee;text-decoration:underline;text-decoration-color:#85e5ee80;text-underline-offset:4px;transition:color .2s,text-decoration-color .2s}.hero .hero-more-link:hover,.hero .hero-more-link:focus-visible{color:#fff;text-decoration-color:#fff}
.manufacturer-ribbon .logo-group{width:1435px;gap:55px;padding:0 27.5px}.manufacturer-ribbon .logo-track{animation-duration:50s}.manufacturer-ribbon .logo-group img{width:150px;height:42px;flex:0 0 150px}
.six-manufacturers .manufacturer-logo img{max-width:190px;max-height:75px}.six-manufacturers .manufacturer-logo{height:155px}.six-manufacturers .manufacturer-card{grid-column:auto}
@media(min-width:761px){.six-manufacturers{grid-template-columns:repeat(3,minmax(0,1fr))}}

@media(prefers-reduced-motion:reduce){.manufacturer-ribbon .logo-group{width:100%;gap:25px;padding:0;flex-wrap:wrap}.manufacturer-ribbon .logo-track{animation:none;width:100%}}
.six-manufacturers .manufacturer-logo img[src$="coilcraft.png"]{max-width:100%;max-height:105px;width:100%;object-fit:contain}.manufacturer-ribbon .logo-group img[src$="coilcraft.png"]{transform:scale(1.2)}
/* Consistent visual size and preserved logo proportions in the ribbon. */
.manufacturer-ribbon .logo-group{width:1320px;gap:50px;padding:0 25px}
.manufacturer-ribbon .logo-group img{width:170px;height:54px;flex:0 0 170px;object-fit:contain;transform:none}
.manufacturer-ribbon .logo-group img[src$="vishay.png"]{padding:4px 12px}
.manufacturer-ribbon .logo-group img[src$="murata.svg"]{padding:2px 6px}
.six-manufacturers .manufacturer-logo img[src$="coilcraft-clean.png"]{width:100%;max-width:230px;max-height:85px;object-fit:contain}
@media(prefers-reduced-motion:reduce){.manufacturer-ribbon .logo-group{width:100%;padding:0;gap:25px;flex-wrap:wrap}}
.about-story{padding:60px 0;background:#f0f6f7}.about-story>.container>p:not(.eyebrow){max-width:850px;font-size:18px;line-height:1.8;color:#425e69}.about-story h2{margin-bottom:28px}.about-values{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;margin-top:38px}.about-values article{padding:26px;background:#fff;border-top:3px solid #00a0b6;box-shadow:0 6px 20px #103d4a09}.about-values h3{font-size:17px;line-height:1.4;margin:0 0 14px}.about-values p{font-size:16px;line-height:1.7;color:#496771;margin:0}@media(max-width:760px){.about-values{grid-template-columns:1fr}.about-story{padding:38px 0}}
.contact-page{position:relative;padding:65px 0 75px;background:radial-gradient(ellipse at 12% 80%,#0a627477,transparent 55%),linear-gradient(110deg,#061a25ed,#0a3543e8),url('manufacturers-banner.webp') center/cover;color:#fff}
.contact-page-layout{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:65px;align-items:start}.contact-page-copy{padding-top:38px}.contact-page-copy .eyebrow{color:#83dce7}.contact-page-copy h1{font-size:clamp(36px,4.5vw,60px)}.contact-page-copy h1 span{color:#68dce8}.contact-page-copy>p:not(.eyebrow){font-size:18px;line-height:1.75;color:#cde2e8;max-width:480px}.contact-email{border-top:1px solid #5a929d66;margin-top:34px;padding-top:25px}.contact-email span{display:block;font-size:11px;letter-spacing:2px;color:#80dce5;margin-bottom:12px}.contact-email a{font-size:clamp(16px,1.6vw,21px);text-underline-offset:5px;overflow-wrap:anywhere}
.contact-form-panel{background:#f8fbfc;color:#123440;border:1px solid #cfe7ec;border-radius:10px;padding:35px;box-shadow:0 20px 60px #00111a55}.contact-form-panel h2{font-size:29px}.contact-form-panel .eyebrow{margin-bottom:12px}.contact-demo-note{font-size:13px;line-height:1.6;color:#526d77;margin:15px 0 25px}.contact-form-panel label{display:block;font-size:13px;font-weight:600;margin-bottom:15px}.contact-form-panel input,.contact-form-panel textarea{display:block;width:100%;padding:13px;margin:8px 0 0;border:1px solid #c7d9df;background:#fff;border-radius:4px;color:#173945;font-size:14px;box-sizing:border-box}.contact-form-panel textarea{resize:vertical;min-height:125px}.contact-form-panel .form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}.robot-preview{display:flex;align-items:center;gap:13px;background:#edf3f5;border:1px solid #d2dfe4;border-radius:4px;padding:15px;margin:20px 0;color:#526c76}.robot-preview-box{width:23px;height:23px;border:2px solid #a6bbc2;background:#fff;flex:none}.robot-preview strong{display:block;font-size:14px}.robot-preview small{display:block;font-size:11px;margin-top:4px}.robot-preview svg{width:30px;height:30px;margin-left:auto;fill:none;stroke:#688e98;stroke-width:1.5}.contact-preview-button{width:100%;gap:7px}.contact-preview-button span{font-size:10px;opacity:.85}.contact-preview-result{font-size:13px;line-height:1.6;color:#007589;margin-bottom:0}.contact-preview-result:empty{display:none}
@media(max-width:900px){.contact-page-layout{grid-template-columns:1fr;gap:32px}.contact-page-copy{padding-top:0}.contact-page{padding:38px 0}.contact-page-copy>p:not(.eyebrow){max-width:650px}.contact-email{margin-top:22px}}
@media(max-width:520px){.contact-form-panel{padding:24px 19px}.contact-form-panel .form-row{grid-template-columns:1fr;gap:0}.contact-form-panel h2{font-size:25px}}
.about-hero{background-image:linear-gradient(90deg,#03121b44,transparent 80%),url("about-warehouse-soft.webp")}@media(max-width:760px){.about-hero{background-image:linear-gradient(90deg,#03121be6,#03121b77),url("about-warehouse-soft.webp")}}

.about-hero{background-image:linear-gradient(90deg,#061720 0%,#061720ed 22%,#061720b8 38%,#06172073 51%,#06172033 66%,#0617200d 82%,transparent 100%),url("about-warehouse-soft.webp")}@media(max-width:760px){.about-hero{background-image:linear-gradient(90deg,#061720f2 0%,#061720d9 28%,#061720a6 55%,#06172066 78%,#06172040 100%),url("about-warehouse-soft.webp")}}

.hero.about-hero{background:#e5e9ec url("about-light.webp") center/cover;color:#123440}.hero.about-hero .hero-headline .hero-line-first{color:#123440}.hero.about-hero .hero-headline .hero-line-third{color:#007f94}.hero.about-hero .hero-copy{color:#365562}.hero.about-hero .eyebrow{color:#00788a}@media(max-width:760px){.hero.about-hero{background-image:linear-gradient(90deg,#e9edf0f5,#e9edf0c9 55%,#e9edf05c),url("about-light.webp");background-position:60% center}}
.hero.about-hero{background:#e5e9ec url("about-warehouse-daylight.webp") center/cover}.about-hero .hero-inner{position:relative}.about-hero .hero-inner:before{content:"";position:absolute;inset:0 auto 0 -80px;width:min(850px,85vw);background:linear-gradient(90deg,#edf1f4f5 0%,#edf1f4e8 50%,#edf1f499 78%,#edf1f400 100%);pointer-events:none}.about-hero .hero-inner>*{position:relative}.about-hero h1{max-width:780px}@media(max-width:760px){.hero.about-hero{background-position:60% center}.about-hero .hero-inner:before{left:-18px;width:calc(100% + 36px);background:#edf1f4dd}}
.sourcing-details{background:#fff;padding-top:46px}.sourcing-checklist{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 38px;padding-left:22px;max-width:1000px;margin:25px 0 30px;color:#365562;line-height:1.65}.sourcing-checklist li::marker{color:#009db5}@media(max-width:760px){.sourcing-checklist{grid-template-columns:1fr}}
.sourcing-icon{display:block;width:54px;height:54px;fill:none;stroke:#008fa5;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;margin-bottom:22px;padding:5px;background:#e9f8fa;border-radius:8px}
.sourcing-flow{padding:45px 0;background:linear-gradient(120deg,#d8eef2,#f0f8fa);border-block:1px solid #c7e3e9}.sourcing-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:34px;list-style:none;padding:0;margin:32px 0 0}.sourcing-steps li{display:flex;gap:16px;position:relative}.step-number{display:grid;place-items:center;flex:none;width:48px;height:48px;background:#0b5062;color:#a8f0f5;border-radius:50%;font-size:16px;font-weight:700;box-shadow:0 0 0 5px #ffffff80}.sourcing-steps h3{font-size:17px;margin:2px 0 9px;color:#173f4e}.sourcing-steps p{font-size:15px;line-height:1.6;color:#496771;margin:0}.sourcing-steps li:not(:last-child):after{content:'→';position:absolute;right:-24px;top:10px;color:#148da0;font-size:24px}@media(max-width:760px){.sourcing-steps{grid-template-columns:1fr;gap:28px}.sourcing-steps li:not(:last-child):after{display:none}}
.hero.sourcing-hero{background:#e4e8eb url("sourcing-banner.webp") center/cover;color:#123440}.hero.sourcing-hero .hero-headline .hero-line-first{color:#123440}.hero.sourcing-hero .hero-headline .hero-line-third{color:#007f94}.hero.sourcing-hero .hero-copy{color:#365562;max-width:620px}.hero.sourcing-hero .eyebrow{color:#00788a}.hero.sourcing-hero .outline{color:#075366;border-color:#43828f;background:#edf5f7cc}.hero.sourcing-hero .outline:hover{background:#d6eef2}@media(max-width:760px){.hero.sourcing-hero{background-image:linear-gradient(90deg,#e9edf0f5,#e9edf0d9 55%,#e9edf077),url("sourcing-banner.webp");background-position:60% center}}
/* One-time, lightweight sheen across the header brand. */
.site-header .brand{position:relative;overflow:hidden;isolation:isolate;display:block}
.site-header .brand:after{content:"";position:absolute;inset:-20% auto -20% -65%;width:40%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.88),transparent);transform:skewX(-18deg);pointer-events:none;opacity:0;animation:brand-sheen 1.8s ease-in-out .7s 1 both}
@keyframes brand-sheen{0%{left:-65%;opacity:0}15%{opacity:.9}80%{opacity:.9}100%{left:140%;opacity:0}}
@media(prefers-reduced-motion:reduce){.site-header .brand:after{animation:none;display:none}}
/* A single silver-teal glint, followed by a soft settle. */
.site-header .brand:after{inset:-25% auto -25% 0;width:38%;background:linear-gradient(105deg,transparent 5%,#b5f7ff66 30%,#ffffffed 49%,#6ae3ee99 60%,transparent 90%);transform:translateX(-180%) skewX(-18deg);animation:brand-glint 1.65s cubic-bezier(.2,.65,.3,1) .65s 1 both}
.site-header .brand strong span{animation:brand-glow 2.3s ease-out .65s 1 both}
@keyframes brand-glint{0%{transform:translateX(-180%) skewX(-18deg);opacity:0}12%{opacity:1}78%{opacity:1}100%{transform:translateX(390%) skewX(-18deg);opacity:0}}
@keyframes brand-glow{0%,100%{text-shadow:none}38%{text-shadow:0 0 12px #00bbcf88,0 0 24px #00bbcf33}70%{text-shadow:0 0 5px #00bbcf33}}
@media(prefers-reduced-motion:reduce){.site-header .brand:after{display:none;animation:none}.site-header .brand strong span{animation:none}}

/* Homepage spacing while part search is deferred; other page banners unchanged. */
.home-hero:not(:has(.part-search)){min-height:0}
.home-hero:not(:has(.part-search)) .hero-inner{padding-bottom:30px}

/* Shared inventory search in the contact introduction. */


/* Prominent part search in the reel banner. */
.contact-page-copy .part-search{display:flex;align-items:center;position:relative;max-width:610px;margin:22px 0 8px;background:white;border:1px solid #36bfd1;border-radius:4px;box-shadow:0 8px 24px #00182038;overflow:hidden}
.contact-page-copy .part-search .search-icon{width:23px;height:23px;flex:none;margin-left:17px;fill:none;stroke:#59717a;stroke-width:1.8;stroke-linecap:round}
.contact-page-copy .part-search input{border:0;background:white;color:#12323e;padding:19px 14px;font-size:15px;border-radius:0;min-width:0;flex:1;outline-offset:-3px}
.contact-page-copy .part-search button{align-self:stretch;padding:16px 23px;font-size:13px;letter-spacing:.3px;background:#009db5}
.contact-page-copy .part-search button:hover{background:#007f94}
.contact-page-copy .part-search:focus-within{outline:2px solid #63deec;outline-offset:3px}
.contact-page-copy .search-preview-note{font-size:12px;color:#bdd6dc;margin:0 0 21px;line-height:1.4}
.contact-page-copy .part-search .search-icon{margin-left:11px;width:19px}
.contact-page-copy .part-search input{font-size:13px;padding:17px 10px}
.contact-page-copy .part-search button{font-size:11px;padding:14px 12px}
.contact-page-copy .part-search{max-width:100%;flex-wrap:wrap}.contact-page-copy .part-search input{min-width:130px}.contact-page-copy .search-preview-note{font-size:12px;color:#bdd6dc;line-height:1.5}.contact-page-copy .part-search button{flex-shrink:0}

/* Three sourcing entry points; prices are handled through the contact form. */
.sourcing-three{grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.sourcing-three article,.sourcing-three article:first-child,.sourcing-three article:last-child{padding:26px;border:1px solid #37606c;border-radius:8px;display:flex;flex-direction:column;gap:18px;background:linear-gradient(135deg,#12435070,#0b2631)}.sourcing-three article>div{display:flex;flex-direction:column;align-items:flex-start;flex:1}.sourcing-three h2{font-size:26px}.sourcing-three p{min-height:0;flex:1}.sourcing-three small{display:block;color:#b8d5dc;font-size:12px;margin-top:14px;line-height:1.5}.sourcing-three svg{margin:0}.contact-form-panel#sales-inquiry{scroll-margin-top:120px}@media(max-width:760px){.sourcing-three{grid-template-columns:1fr}.sourcing-three article,.sourcing-three article:first-child,.sourcing-three article:last-child{padding:24px}}

/* Homepage sourcing tools: lighter palette, retaining the three-card layout and icons. */
#sourcing-tools{color:#12343f;border-top:0;background:radial-gradient(ellipse at 15% 10%,#d9f1f1 0,transparent 55%),linear-gradient(120deg,#eef6f7,#f8fafb 55%,#e7eff3);padding:44px 0}
#sourcing-tools .sourcing-three article{background:linear-gradient(145deg,#ffffff,#f2f8f9);border:1px solid #c7dcdf;box-shadow:0 8px 24px #123a4510;transition:background .2s,border-color .2s,box-shadow .2s}
#sourcing-tools .sourcing-three article:hover,#sourcing-tools .sourcing-three article:focus-within{background:#e0f2f2;border-color:#48abb7;box-shadow:0 10px 26px #123a451a}
#sourcing-tools .sourcing-three h2{color:#12343f}#sourcing-tools .sourcing-three h2 span{color:#008a9e}#sourcing-tools .sourcing-three svg{stroke:#008a9e}#sourcing-tools .sourcing-three p{color:#48636d}#sourcing-tools .sourcing-three small{color:#5b747c}
@media(prefers-reduced-motion:reduce){#sourcing-tools .sourcing-three article{transition:none}}

/* Reserve equal caption space so all three sourcing buttons share a baseline. */
@media(min-width:761px){#sourcing-tools .sourcing-three article>div{display:grid;grid-template-rows:auto 1fr auto 36px;align-items:start}#sourcing-tools .sourcing-three .button{grid-row:3;justify-self:start}#sourcing-tools .sourcing-three small{grid-row:4;margin-top:14px}}

/* Balanced Why Passives Direct columns, without clipping copy. */
@media(min-width:761px){.why-direct-grid{grid-template-rows:auto auto 1fr;column-gap:0;row-gap:0}.why-direct-grid article{display:grid;grid-row:span 3;grid-template-rows:subgrid}.why-direct-grid .service-heading{grid-row:1}.why-direct-grid h3{grid-row:2;align-self:start}.why-direct-grid p{grid-row:3;max-width:none}.why-direct-grid .button{grid-row:4;justify-self:start;align-self:start}}

/* Gentle, one-time reel drift; copy and controls stay on a stationary layer. */
.home-hero{overflow:hidden;isolation:isolate;background:#061822}
.home-hero::before{content:"";position:absolute;inset:-3%;z-index:-1;pointer-events:none;background:linear-gradient(90deg,#020e15ed 0%,#020e15bd 40%,#020e1520 74%),url('components-banner.webp') center/cover;transform-origin:65% 50%;animation:reel-drift 28s ease-in-out both}
@keyframes reel-drift{from{transform:scale(1.025) translateX(0)}to{transform:scale(1.085) translateX(-1.2%)}}
.home-hero.motion-offscreen::before{animation-play-state:paused}
#sourcing-tools .sourcing-three article.reveal-ready{transition:opacity .8s ease,transform .8s cubic-bezier(.2,.65,.3,1),background .2s,border-color .2s,box-shadow .2s;transition-delay:var(--reveal-delay,0ms)}
@media(max-width:760px){.home-hero::before{background-position:60% center}}
@media(prefers-reduced-motion:reduce){.home-hero::before{animation:none;transform:none}#sourcing-tools .sourcing-three article.reveal-ready{opacity:1;transform:none;transition:none}}

/* Coordinated business photography behind the Why Passives Direct cards. */
.intro .why-direct-grid article{isolation:isolate;background:#edf5f6}
.intro .why-direct-grid article:nth-child(n)::before{inset:0;opacity:1;background-image:url('why-business.webp');background-repeat:no-repeat;background-size:300% 100%;background-position:0% center;z-index:0;transform:scale(1);transition:transform .9s ease}
.intro .why-direct-grid article:nth-child(2)::before{background-position:50% center}
.intro .why-direct-grid article:nth-child(3)::before{background-position:100% center}
.intro .why-direct-grid article::after{inset:0;width:auto;height:auto;border:0;border-radius:0;box-shadow:none;background:linear-gradient(180deg,rgba(244,250,251,.67),rgba(244,250,251,.91) 40%,rgba(244,250,251,.96));z-index:0}
.intro .why-direct-grid article:nth-child(n) h3{color:#123d49}.intro .why-direct-grid article:nth-child(n) p{color:#34535e}.intro .why-direct-grid article:nth-child(n) .service-number{color:#007f94}
@media(hover:hover) and (pointer:fine){.intro .why-direct-grid article:hover::before{transform:scale(1.04);opacity:1}}
@media(prefers-reduced-motion:reduce){.intro .why-direct-grid article:nth-child(n)::before{transition:none;transform:none}}

/* Shared second-line heading accent, matching the homepage. */
#main h1 .pd-heading-accent,
#main > .hero .hero-headline .hero-line-third { color: #11bdd1; }

/* Use the homepage typography for every page hero, including legacy pages. */
#main > .hero h1 {
  max-width: 980px;
  font-size: clamp(40px, 4.6vw, 68px);
  line-height: .98;
  letter-spacing: -.035em;
  margin-bottom: 28px;
}
#main > .hero .hero-copy {
  max-width: 600px;
  font-size: clamp(16px, 1.5vw, 20px);
  line-height: 1.6;
  margin-bottom: 36px;
}
@media (max-width: 760px) {
  #main > .hero h1 {
    font-size: clamp(36px, 11vw, 46px);
    letter-spacing: -.03em;
    overflow-wrap: break-word;
  }
}
