
:root{
  --ink:#0b0f14; --muted:#66717f; --blue:#0877ff; --blue2:#00b7ff;
  --panel:#f4f7fa; --line:#dfe6ed; --white:#fff; --dark:#0a1018;
}
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Segoe UI,Arial,sans-serif;color:var(--ink);background:#fff;line-height:1.55}
a{text-decoration:none;color:inherit}.wrap{width:min(1180px,92%);margin:auto}
.topbar{background:var(--dark);color:#dbe7f4;font-size:.88rem;padding:8px 0;text-align:center}
header{position:sticky;top:0;z-index:10;background:rgba(255,255,255,.96);border-bottom:1px solid var(--line);backdrop-filter:blur(10px)}
.nav{display:flex;align-items:center;gap:24px;min-height:78px}
.brand img{width:220px;display:block}.links {
  display: flex;
  gap: 22px;
  margin-left: 65px;
  align-items: center;
  font-weight: 650;
  font-size: .94rem;
}
.links a:hover{color:var(--blue)}.cart{border:1px solid var(--line);padding:9px 13px;border-radius:10px}
.hero{background:radial-gradient(circle at 78% 35%,#12365f 0,#0b1727 27%,#070c12 63%);color:#fff;overflow:hidden}
.hero-inner{min-height:580px;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:54px}
.eyebrow {color:#66c8ff;text-transform:uppercase;letter-spacing:.16em;font-size: 1.2rem;font-weight:800}
h1{font-size:clamp(2.7rem,5vw,5rem);line-height:.98;margin:14px 0 22px;letter-spacing:-.045em}
.hero p{color:#c7d3df;font-size:1.12rem;max-width:650px}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:13px 20px;border-radius:10px;font-weight:800;border:1px solid transparent}
.btn.primary{background:linear-gradient(90deg,var(--blue),var(--blue2));color:#fff}.btn.secondary{border-color:#496078;color:#fff}
.display-art{border:1px solid #284867;border-radius:22px;padding:30px;background:linear-gradient(145deg,#07101b,#111c29);box-shadow:0 20px 60px #0008}
.digits{font-family:Consolas,monospace;font-size:clamp(2.2rem,5vw,4.8rem);letter-spacing:.08em;color:#ff9d22;text-shadow:0 0 18px #ff8b00;white-space:nowrap}
.board{margin-top:22px;height:190px;border:1px solid #35506b;border-radius:12px;background:repeating-linear-gradient(90deg,#13202c 0 2px,#0b131b 2px 7px);position:relative}
.board:before,.board:after{content:"";position:absolute;border-radius:50%;background:#0d86ff;box-shadow:0 0 16px #0d86ff}.board:before{width:18px;height:18px;left:13%;top:28%}.board:after{width:12px;height:12px;right:16%;bottom:24%}
.trust{border-bottom:1px solid var(--line)}.trust .wrap{display:grid;grid-template-columns:repeat(3,1fr)}
.trust-item{padding:22px;text-align:center;border-right:1px solid var(--line);font-weight:750}.trust-item:last-child{border:0}.trust-item span{display:block;color:var(--muted);font-size:.82rem;font-weight:500}
section{padding:82px 0}.section-head{display:flex;justify-content:space-between;gap:30px;align-items:end;margin-bottom:32px}
h2{font-size:clamp(2rem,3vw,3rem);line-height:1.05;margin:8px 0}.lead{color:var(--muted);max-width:700px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.card{border:1px solid var(--line);border-radius:16px;padding:25px;background:#fff;box-shadow:0 8px 28px #15202b0b}
.card h3{margin:8px 0}.tag{font-size:.75rem;color:var(--blue);font-weight:850;text-transform:uppercase;letter-spacing:.1em}.card p{color:var(--muted)}
.finder{background:var(--panel)}.maker-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.maker{background:#fff;border:1px solid var(--line);border-radius:12px;padding:22px;font-weight:800;text-align:center}.maker:hover{border-color:var(--blue);color:var(--blue)}.maker-logo,.maker-logos{display:flex;align-items:center;justify-content:center}.maker-logo img{max-width:85%;height:48px;object-fit:contain}.maker-logos{gap:8px}.maker-logos img{max-width:45%;height:42px;object-fit:contain}
.product-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.product{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#fff}.product-img{height:180px;background:#0b1119;display:flex;align-items:center;justify-content:center}.mini-digits{font-family:Consolas,monospace;color:#ff9d22;font-size:2rem;text-shadow:0 0 12px #ff8b00}.product-body{padding:22px}.product-body p{color:var(--muted);min-height:75px}.price{font-size:1.3rem;font-weight:850}
.guarantee{background:#08111c;color:#fff}.guarantee .lead{color:#c4d0dc}.guarantee-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:45px;align-items:center}.shield{font-size:6rem;text-align:center}
footer{background:#05090e;color:#aab7c4;padding:50px 0}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px}.footer-grid strong{color:#fff}.footer-grid a{display:block;margin:8px 0}
.note{font-size:.82rem;color:var(--muted);margin-top:24px}
@media(max-width:850px){.links{display:none}.hero-inner,.guarantee-grid{grid-template-columns:1fr}.hero-inner{padding:65px 0}.trust .wrap,.grid,.product-grid{grid-template-columns:1fr}.maker-grid{grid-template-columns:1fr 1fr}.footer-grid{grid-template-columns:1fr}.brand img{width:180px}}

.hero .hero-copy-large{font-size:1.42rem;line-height:1.55;max-width:650px}
.ebay-btn{gap:7px}
.ebay-logo{font-weight:800;font-size:1.18em;letter-spacing:-.08em;line-height:1}.ebay-logo .e{color:#e53238}.ebay-logo .b{color:#0064d2}.ebay-logo .a{color:#f5af02}.ebay-logo .y{color:#86b817}

/* V5: manufacturer buttons reproduced directly from the approved reference image */
.maker-grid-reference{grid-template-columns:repeat(5,1fr)}
.reference-button{padding:0;overflow:hidden;border:0;background:transparent}
.reference-button img{width:100%;height:auto;display:block;object-fit:contain}
@media(max-width:1000px){.maker-grid-reference{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.maker-grid-reference{grid-template-columns:1fr}}

/* V6: approved manufacturer-button changes only */
#finder{background:#fff}
#finder .reference-button{
  background:#fff;
  border:1px solid #000;
  border-radius:12px;
  overflow:hidden;
  padding:0;
  transition:border-color .18s ease, box-shadow .18s ease;
}
#finder .reference-button:hover{
  border-color:#0877ff;
  box-shadow:0 0 0 1px #0877ff,0 0 14px rgba(8,119,255,.55);
}
#finder .reference-button img{
  width:100%;
  height:auto;
  display:block;
}

/* V8: approved Section #2 button set */
#finder .maker-grid-reference{
  grid-template-columns:repeat(7,1fr);
}
#finder .maker-grid-reference .reference-button{
  width:100%;
  min-width:0;
}
#finder .maker-grid-reference .reference-button img{
  width:100%;
  height:100%;
  object-fit:cover;
}
@media(max-width:1100px){
  #finder .maker-grid-reference{grid-template-columns:repeat(4,1fr);}
}
@media(max-width:700px){
  #finder .maker-grid-reference{grid-template-columns:repeat(2,1fr);}
}

/* V9: Section #2 uniform buttons sized to widest logo */
#finder .maker-grid-reference{
  display:grid;
  grid-template-columns:repeat(auto-fit, 247px);
  gap:16px;
  justify-content:center;
}
#finder .maker-grid-reference .reference-button{
  width:247px;
  height:105px;
  min-width:247px;
  box-sizing:border-box;
}
#finder .maker-grid-reference .reference-button img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}
@media(max-width:600px){
  #finder .maker-grid-reference{
    grid-template-columns:1fr;
  }
  #finder .maker-grid-reference .reference-button{
    width:min(247px,100%);
    min-width:0;
    justify-self:center;
  }
}

/* V10 approved manufacturer-button layout */
#finder .v10-maker-grid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:16px;
  justify-content:stretch;
}
#finder .v10-maker-grid .reference-button{
  width:100%;
  height:92px;
  min-width:0;
  padding:5px;
  box-sizing:border-box;
}
#finder .v10-maker-grid .reference-button img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}
@media(max-width:1000px){
  #finder .v10-maker-grid{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:600px){
  #finder .v10-maker-grid{grid-template-columns:1fr;}
}

/* V11: requested manufacturer-button refinements only */
#finder .v10-maker-grid .reference-button{
  padding:2px;
}

/* V12: requested Section #2 alignment/refinement only */
#finder .v10-maker-grid{
  justify-content:start;
  justify-items:stretch;
}
#finder .v10-maker-grid .reference-button {
  width: 87%;
  height: 60px;
  min-width: 0;
  padding: 5px;
  box-sizing: border-box;
}

/* V15: top-navigation cart icon only */
.cart-icon{
  width:22px;
  height:22px;
  display:block;
  fill:none;
  stroke:currentColor;
  stroke-width:1.8;
  stroke-linecap:round;
  stroke-linejoin:round;
}

/* Featured Display Kits */
.featured-kits .section-head{margin-bottom:18px}
.featured-list{display:grid;gap:18px}
.featured-kit{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(280px,.65fr);
  align-items:center;
  gap:28px;
  padding:24px 28px;
  background:#fff;
  border:1px solid #d9dee5;
  border-radius:14px;
  box-shadow:0 5px 18px rgba(0,0,0,.06);
}
.featured-copy h3{margin:0 0 3px;font-size:27px;line-height:1.15}
.featured-copy h4{margin:0 0 14px;color:#0877ff;font-size:18px}
.featured-copy p{margin:8px 0;line-height:1.55}
.featured-photo{display:flex;align-items:center;justify-content:center;min-height:170px}
.featured-photo img{display:block;max-width:100%;max-height:230px;width:auto;height:auto;object-fit:contain}
@media(max-width:800px){
  .featured-kit{grid-template-columns:1fr}
  .featured-photo{order:-1}
}

/* V18 Featured Display Kits */
.featured-logo-title{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.featured-logo-title img {
  display: block;
  width: auto;
  height: 62px;
  max-width: 260px;
  object-fit: contain;
}
.featured-logo-title span{font-size:27px;line-height:1.1}
.featured-logo-title.williams-title img {
  height: 58px;
  max-width: 268px;
}
.featured-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;align-items:center}
.featured-gallery-item{height:150px;display:flex;align-items:center;justify-content:center;background:#fff;border-radius:8px;overflow:hidden}
.featured-gallery-item img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
.featured-kit:last-child .featured-gallery{grid-template-columns:1fr}
.featured-kit:last-child .featured-gallery-item{height:230px}
@media(max-width:1000px){.featured-kit{grid-template-columns:1fr}.featured-gallery{order:2}}
@media(max-width:620px){.featured-gallery{grid-template-columns:1fr}.featured-gallery-item{height:190px}}

/* V19 Featured Display Kits refinements */
.featured-logo-title{gap:10px}
.featured-logo-title .replacement-inline{
  color:#0877ff;
  font-size:18px;
  font-weight:700;
  line-height:1.1;
  white-space:nowrap;
}
.featured-gallery-stacked{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);
  grid-template-rows:1fr 1fr;
  gap:10px;
  height:270px;
}
.featured-gallery-stacked .featured-gallery-item{
  width:100%;
  height:100%;
  min-height:0;
}
.featured-gallery-stacked .featured-gallery-item:nth-child(1){grid-column:1;grid-row:1}
.featured-gallery-stacked .featured-gallery-item:nth-child(2){grid-column:1;grid-row:2}
.featured-gallery-stacked .featured-gallery-item:nth-child(3){grid-column:2;grid-row:1 / span 2}
.featured-gallery-stacked .featured-gallery-item img{
  width:100%;
  height:100%;
  max-width:100%;
  max-height:100%;
  object-fit:contain;
}
@media(max-width:620px){
  .featured-gallery-stacked{
    grid-template-columns:1fr;
    grid-template-rows:auto;
    height:auto;
  }
  .featured-gallery-stacked .featured-gallery-item:nth-child(n){
    grid-column:1;
    grid-row:auto;
    height:190px;
  }
}

/* V20: Featured Display Kits visual refinement only */

/* Narrower text area / wider image area */
.featured-kit{
  grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);
  gap:18px;
  padding:0;
  overflow:hidden;
}

/* Colored left-side treatment while retaining the existing content */
.featured-copy{
  align-self:stretch;
  padding:24px 22px;
  background:linear-gradient(110deg,#eef6ff 0%,#eef6ff 88%,#ffffff 100%);
}
.featured-kit:nth-child(2) .featured-copy{
  background:linear-gradient(110deg,#f1f8f2 0%,#f1f8f2 88%,#ffffff 100%);
}
.featured-kit:nth-child(3) .featured-copy{
  background:linear-gradient(110deg,#fff7df 0%,#fff7df 88%,#ffffff 100%);
}

/* Make Replacement Display Kit part of the same heading visually */
.featured-logo-title .replacement-inline{
  color:inherit;
  font-size:27px;
  font-weight:inherit;
  line-height:1.1;
  white-space:normal;
}

/* Give the actual original-site images more room */
.featured-gallery{
  padding:14px 18px 14px 0;
}
.featured-gallery-stacked{
  height:330px;
  grid-template-columns:minmax(0,.82fr) minmax(0,1.45fr);
  gap:8px;
}
.featured-gallery-stacked .featured-gallery-item{
  border-radius:6px;
}
.featured-kit:last-child .featured-gallery-item{
  height:290px;
}
.featured-gallery-item img{
  max-width:100%;
  max-height:100%;
}

@media(max-width:1000px){
  .featured-kit{grid-template-columns:1fr}
  .featured-copy{padding:22px}
  .featured-gallery{padding:0 18px 18px}
}

/* V21: arrow-ended text panels + larger first two images in section 2 */

/* Create the angled/arrow right edge on the colored description panels. */
.featured-copy{
  position:relative;
  z-index:1;
  margin-right:38px;
  background:#eef6ff;
}
.featured-copy::after{
  content:"";
  position:absolute;
  top:0;
  right:-38px;
  width:39px;
  height:100%;
  background:inherit;
  clip-path:polygon(0 0,100% 50%,0 100%);
  pointer-events:none;
}
.featured-kit:nth-child(2) .featured-copy{background:#f1f8f2}
.featured-kit:nth-child(3) .featured-copy{background:#fff7df}

/* Preserve the wider image area after adding the arrow tip. */
.featured-kit{
  grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);
  gap:0;
}
.featured-gallery{
  padding-left:18px;
}

/* Enlarge the two stacked images specifically in featured section #2. */
.featured-kit:nth-child(2) .featured-gallery-stacked{
  grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);
  height:350px;
}
.featured-kit:nth-child(2) .featured-gallery-stacked .featured-gallery-item:nth-child(1) img,
.featured-kit:nth-child(2) .featured-gallery-stacked .featured-gallery-item:nth-child(2) img{
  width:100%;
  height:100%;
  object-fit:contain;
}

@media(max-width:1000px){
  .featured-copy{
    margin-right:0;
  }
  .featured-copy::after{
    display:none;
  }
  .featured-gallery{
    padding-left:18px;
  }
}

/* V22: approved Featured Display Kits refinements */

/* Manufacturer logos in this section visually inherit the colored panel
   instead of showing their original white image background. */
.featured-copy .featured-logo-title img{
  mix-blend-mode:multiply;
}

/* Manufacturer logo occupies its own first line. */
.featured-logo-title{
  display:grid;
  grid-template-columns:auto 1fr;
  align-items:center;
  column-gap:8px;
  row-gap:7px;
}
.featured-logo-title img{
  grid-column:1 / -1;
}
.featured-logo-title > span:not(.replacement-inline){
  grid-column:1;
}
.featured-logo-title .replacement-inline{
  grid-column:2;
}

/* Make all three product-title lines match in size/style. */
.featured-logo-title > span:not(.replacement-inline),
.featured-logo-title .replacement-inline{
  color:inherit;
  font-size:22px;
  font-weight:700;
  line-height:1.15;
}
.featured-logo-title.williams-title > span:not(.replacement-inline),
.featured-logo-title.williams-title .replacement-inline{
  font-size:22px;
}

/* Enlarge the first two images in featured section #2 further. */
.featured-kit:nth-child(2) .featured-gallery-stacked{
  grid-template-columns:minmax(0,1.18fr) minmax(0,1.28fr);
  height:380px;
  gap:6px;
}
.featured-kit:nth-child(2) .featured-gallery-stacked .featured-gallery-item:nth-child(1),
.featured-kit:nth-child(2) .featured-gallery-stacked .featured-gallery-item:nth-child(2){
  overflow:visible;
}
.featured-kit:nth-child(2) .featured-gallery-stacked .featured-gallery-item:nth-child(1) img,
.featured-kit:nth-child(2) .featured-gallery-stacked .featured-gallery-item:nth-child(2) img{
  width:100%;
  height:100%;
  max-width:none;
  max-height:none;
  object-fit:contain;
}

/* V23: requested Featured Display Kits title + section 2 image refinements */

/* Complimentary blue title treatment for all three featured products. */
.featured-logo-title > span:not(.replacement-inline),
.featured-logo-title .replacement-inline{
  color:#0b63c9;
}

/* Section 3 title explicitly uses two lines after the Williams logo. */
.featured-logo-title.williams-title{
  grid-template-columns:1fr;
}
.featured-logo-title.williams-title img,
.featured-logo-title.williams-title > span:not(.replacement-inline),
.featured-logo-title.williams-title .replacement-inline{
  grid-column:1;
}
.featured-logo-title.williams-title > span:not(.replacement-inline){
  grid-row:2;
}
.featured-logo-title.williams-title .replacement-inline{
  grid-row:3;
}

/* Increase the first two stacked images in featured section #2. */
.featured-kit:nth-child(2) .featured-gallery-stacked{
  grid-template-columns:minmax(0,1.38fr) minmax(0,1.18fr);
  height:410px;
  gap:5px;
}
.featured-kit:nth-child(2) .featured-gallery-stacked .featured-gallery-item:nth-child(1) img,
.featured-kit:nth-child(2) .featured-gallery-stacked .featured-gallery-item:nth-child(2) img{
  width:100%;
  height:100%;
  object-fit:contain;
}

/* V24: circuit-trace backgrounds for Featured Display Kits */
.featured-kit{
  background-color:#e8f3ff;
  background-image:url("circuit-traces.svg");
  background-repeat:repeat;
  background-size:360px 180px;
}
.featured-kit:nth-child(2){
  background-color:#eaf5e9;
}
.featured-kit:nth-child(3){
  background-color:#fff1c9;
}

/* Keep the colored arrow panel readable while allowing the technical pattern
   to remain visible throughout the image side. */
.featured-kit .featured-copy{
  background:#e8f3ff;
}
.featured-kit:nth-child(2) .featured-copy{
  background:#eaf5e9;
}
.featured-kit:nth-child(3) .featured-copy{
  background:#fff1c9;
}

/* V26: user-supplied composite images for Featured Display Kit sections 1 and 2 */
.featured-gallery-item{
  background:transparent;
}
.featured-gallery-composite{
  display:flex;
  align-items:center;
  justify-content:center;
  width:100%;
  height:100%;
  min-height:330px;
  padding:10px 18px 10px 14px;
  box-sizing:border-box;
  background:transparent;
}
.featured-gallery-composite img{
  display:block;
  width:100%;
  height:auto;
  max-width:100%;
  max-height:410px;
  object-fit:contain;
  mix-blend-mode:multiply;
}
.featured-kit:nth-child(2) .featured-gallery-composite{
  min-height:390px;
}
.featured-kit:nth-child(2) .featured-gallery-composite img{
  max-height:440px;
}

/* V28: Featured Display Kits — left content column is exactly 33% */
.featured-kit{
  grid-template-columns: 47% 52%;
}
.featured-kit .featured-copy{
  width:100%;
  box-sizing:border-box;
}

/* V32: darker circuit-board image backgrounds for Featured Display Kits.
   Left title/description colors remain unchanged. */
.featured-kit{
  background-color:#d6e6f4;
  background-image:url("circuit-traces.svg");
  background-repeat:repeat;
  background-size:360px 180px;
}
.featured-kit:nth-child(2){
  background-color:#d9ead7;
}
.featured-kit:nth-child(3){
  background-color:#f0dfad;
}

/* Preserve solid left panels and arrow tips over the patterned image side. */
.featured-kit .featured-copy{
  background:#e8f3ff;
}
.featured-kit:nth-child(2) .featured-copy{
  background:#eaf5e9;
}
.featured-kit:nth-child(3) .featured-copy{
  background:#fff1c9;
}
.featured-kit .featured-copy::after{
  background:inherit;
}

/* Product/image containers stay transparent so the circuit design remains visible. */
.featured-gallery,
.featured-gallery-item,
.featured-gallery-composite{
  background:transparent;
}

/* V33: denser PCB-style image backgrounds and pronounced arrow-point left panels */
.featured-kit{
  position:relative;
  overflow:hidden;
  background-color:#d6e6f4;
  background-image:url("circuit-traces.svg");
  background-repeat:repeat;
  background-size:520px 320px;
}
.featured-kit:nth-child(2){
  background-color:#d9ead7;
}
.featured-kit:nth-child(3){
  background-color:#f0dfad;
}

.featured-kit .featured-copy{
  position:relative;
  z-index:2;
  background:#e8f3ff;
  padding-right:34px;
}
.featured-kit:nth-child(2) .featured-copy{
  background:#eaf5e9;
}
.featured-kit:nth-child(3) .featured-copy{
  background:#fff1c9;
}

/* Solid triangle extending from the right edge of each left title/description panel. */
.featured-kit .featured-copy::after{
  content:"";
  position:absolute;
  z-index:3;
  top:0;
  right:-34px;
  width:35px;
  height:100%;
  background:inherit;
  clip-path:polygon(0 0, 0 100%, 100% 50%);
  pointer-events:none;
}

/* Keep the right-side imagery transparent so the PCB design remains visible. */
.featured-gallery,
.featured-gallery-item,
.featured-gallery-composite{
  position:relative;
  z-index:1;
  background:transparent;
}

/* V34 VERIFIED FINAL OVERRIDES — Featured Display Kits */
.featured-kit{
  grid-template-columns:47% 52%;
  gap:1%;
  position:relative;
  overflow:hidden;
  background-image:url("circuit-traces.svg");
  background-repeat:repeat;
  background-size:520px 320px;
}
.featured-kit:nth-child(1){background-color:#d6e6f4;}
.featured-kit:nth-child(2){background-color:#d9ead7;}
.featured-kit:nth-child(3){background-color:#f0dfad;}

.featured-kit .featured-copy{
  position:relative;
  z-index:2;
  width:100%;
  height:100%;
  margin-right:0;
  box-sizing:border-box;
  padding-right:34px;
}
.featured-kit:nth-child(1) .featured-copy{background:#e8f3ff;}
.featured-kit:nth-child(2) .featured-copy{background:#eaf5e9;}
.featured-kit:nth-child(3) .featured-copy{background:#fff1c9;}

.featured-kit .featured-copy::after{
  content:"";
  display:block !important;
  position:absolute;
  z-index:4;
  top:0;
  right:-35px;
  width:36px;
  height:100%;
  background:inherit;
  clip-path:polygon(0 0,0 100%,100% 50%);
  pointer-events:none;
}

.featured-kit .featured-gallery,
.featured-kit .featured-gallery-item,
.featured-kit .featured-gallery-composite{
  background:transparent !important;
}

/* Keep the arrow visible on responsive layouts; older CSS hid it here. */
@media(max-width:1000px){
  .featured-kit .featured-copy::after{
    display:block !important;
  }
}

/* V35: exact user-supplied PCB pattern, tinted to each approved image-side color.
   Also reduces right padding in left panels so copy sits closer to arrow edge. */
.featured-kit{
  background-repeat:repeat;
  background-size:475px auto;
}
.featured-kit:nth-child(1){
  background-color:#d6e6f4;
  background-image:url("circuit-blue.png");
}
.featured-kit:nth-child(2){
  background-color:#d9ead7;
  background-image:url("circuit-green.png");
}
.featured-kit:nth-child(3){
  background-color:#f0dfad;
  background-image:url("circuit-gold.png");
}

.featured-kit .featured-copy{
  padding-right:14px;
}

/* Preserve the approved right-pointing arrow edge. */
.featured-kit .featured-copy::after{
  content:"";
  display:block !important;
  position:absolute;
  top:0;
  right:-35px;
  width:36px;
  height:100%;
  background:inherit;
  clip-path:polygon(0 0,0 100%,100% 50%);
  z-index:4;
  pointer-events:none;
}

.featured-kit .featured-gallery,
.featured-kit .featured-gallery-item,
.featured-kit .featured-gallery-composite{
  background:transparent !important;
}

/* V36: dynamic top-section option highlight */



.shipping-section{padding:54px 0;}
.shipping-section .section-head{margin-bottom:18px;}
.shipping-copy{max-width:900px;font-size:17px;line-height:1.65;}
.shipping-copy p{margin:0 0 14px;}

/* V37 Assembly Instructions library */
.instructions-btn{display:inline-flex;margin-top:16px;text-decoration:none}
.instructions-page{min-height:70vh}
.instructions-hero{padding:64px 0 34px;background:linear-gradient(135deg,#071522,#0c2943);border-bottom:1px solid #1688d8}
.instructions-hero h1{font-size:clamp(36px,5vw,60px);margin:8px 0 12px}
.manufacturer-jump{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}
.manufacturer-jump a{padding:9px 13px;border:1px solid #1688d8;border-radius:7px;text-decoration:none}
.instruction-library{padding-top:38px;padding-bottom:64px}
.instruction-group{scroll-margin-top:95px;padding:24px 0;border-bottom:1px solid rgba(255,255,255,.12)}
.instruction-group h2{margin:0 0 16px;font-size:28px}
.instruction-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.instruction-link{display:flex;justify-content:space-between;gap:18px;padding:14px 16px;border:1px solid rgba(22,136,216,.55);border-radius:8px;text-decoration:none;background:rgba(10,35,55,.55)}
.instruction-link:hover{border-color:#1688d8;background:rgba(22,136,216,.18)}
@media(max-width:760px){.instruction-links{grid-template-columns:1fr}}

/* V38: simplified Assembly Instructions header and approved blue instruction links */
.instructions-hero h1{
  font-size:clamp(34px,4.6vw,54px);
  font-weight:800;
  letter-spacing:.02em;
  margin:0 0 14px;
}
.instructions-hero .lead{
  max-width:900px;
  font-size:19px;
  line-height:1.6;
  margin:0;
}
.instruction-link{
  background:#0877ff;
  border-color:#0877ff;
  color:#fff !important;
  font-weight:700;
  font-size:16px;
}
.instruction-link:visited{
  color:#fff !important;
}
.instruction-link:hover{
  background:#1688d8;
  border-color:#1688d8;
  color:#fff !important;
}

/* V39: complete No-Fault Guarantee */
.guarantee-terms{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:24px}
.guarantee-term{padding:20px;border:1px solid rgba(22,136,216,.45);border-radius:10px;background:rgba(8,119,255,.06)}
.guarantee-term h3{margin:0 0 10px;font-size:18px;font-weight:800;color:#1688d8}
.guarantee-term p{margin:0;line-height:1.6}
@media(max-width:760px){.guarantee-terms{grid-template-columns:1fr}}

/* V40: Contact Us page */
.contact-page{
  min-height:720px;
  background:#061829;
}
.contact-layout{
  display:grid;
  grid-template-columns:56% 44%;
  min-height:760px;
}
.contact-visual{
  overflow:hidden;
  background:#071522;
}
.contact-visual img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center;
}
.contact-form-panel{
  display:flex;
  align-items:center;
  padding:54px clamp(28px,5vw,78px);
  background-color:#08233b;
  background-image:url("circuit-blue.png");
  background-size:475px auto;
}
.contact-form{
  width:100%;
  max-width:620px;
}
.contact-form h1{
  margin:0;
  font-size:clamp(38px,5vw,62px);
  font-weight:800;
  color:#fff;
}
.contact-heading-rule{
  width:92px;
  height:4px;
  margin:16px 0 28px;
  background:#0877ff;
}
.contact-form label{
  display:block;
  margin:18px 0 7px;
  color:#fff;
  font-size:17px;
  font-weight:700;
}
.contact-form input,
.contact-form textarea{
  width:100%;
  box-sizing:border-box;
  border:1px solid #1688d8;
  border-radius:6px;
  padding:13px 14px;
  background:rgba(4,20,34,.88);
  color:#fff;
  font:inherit;
}
.contact-form textarea{
  resize:vertical;
  min-height:180px;
}
.contact-send{
  width:100%;
  margin-top:22px;
  font-weight:800;
}
.guarantee-support-action{
  margin-top:22px;
}
@media(max-width:900px){
  .contact-layout{grid-template-columns:1fr;}
  .contact-visual{min-height:520px;}
  .contact-form-panel{padding:42px 24px;}
}

/* V41: About Us page */
.about-page{min-height:70vh}
.about-hero{padding:62px 0 46px;background:linear-gradient(135deg,#071522,#0c2943);border-bottom:1px solid #1688d8}
.about-hero h1,.about-displays h2{font-weight:800;letter-spacing:.02em}
.about-hero h1{font-size:clamp(36px,5vw,58px);margin:0 0 24px}
.about-hero p,.about-displays p,.tool-list{max-width:1000px;font-size:18px;line-height:1.7}
.about-displays{padding:52px 0 68px}
.about-displays h2{font-size:clamp(28px,4vw,42px);margin:0 0 22px;color:#1688d8}
.tool-list{padding-left:26px}
.tool-list li{margin:0 0 16px;padding-left:8px}
.about-contact{display:inline-flex;margin-top:18px;text-decoration:none}

/* V42 requested alignment/readability fixes */

/* About Us: all copy inside the blue hero box is white for readability. */
.about-hero,
.about-hero h1,
.about-hero p{
  color:#fff;
}

/* No-Fault Guarantee: align Get Support with the same left edge as the
   guarantee title and term blocks inside the section wrap. */
.guarantee-support-action{
  margin-top:22px;
  margin-left:0;
  padding-left:0;
  width:100%;
  box-sizing:border-box;
}
.guarantee-support-action .btn {
  margin-left: 181px;
}

/* V43: footer navigation matches top navigation */
.footer-nav-matched{
  display:flex;
  flex-direction:column;
  gap:7px;
}
.footer-nav-matched strong{margin-bottom:4px}
.footer-nav-matched a{text-decoration:none}

/* V44: Product Support Contact button */
.support-contact-btn {
  display: inline-flex;
  margin-top: 40px;
  text-decoration: none;
}

/* V45: darker Contact Us form text for stronger contrast against patterned background */
.contact-form h1,
.contact-form label{
  color:#061829;
}
.contact-form input,
.contact-form textarea{
  color:#061829;
  background:rgba(255,255,255,.82);
}

/* V46: align Online Instructions and Product Support buttons */
.resource-card{
  display:flex;
  flex-direction:column;
}
.resource-card .instructions-btn,
.resource-card .support-contact-btn{
  margin-top:auto;
  align-self:flex-start;
}

/* V47: align Get Support button with guarantee text boxes */
.guarantee-support-action{
  margin-left:20px;
  width:calc(100% - 20px);
}

/* V48: force the two Assembly Instructions resource-card buttons to share one bottom baseline */
.resources-grid{
  align-items:stretch;
}
.resources-grid .resource-card{
  display:flex;
  flex-direction:column;
  height:100%;
  box-sizing:border-box;
}
.resources-grid .resource-card .instructions-btn,
.resources-grid .resource-card .support-contact-btn{
  margin-top:auto !important;
  align-self:flex-start;
}

/* V49: refine Get Support horizontal alignment with No-Fault Guarantee boxes */
.guarantee-support-action{
  margin-left:40px;
  width:calc(100% - 40px);
}

/* V50: breadcrumbs + Display Kits catalog */
.breadcrumb{display:flex;gap:9px;align-items:center;padding-top:16px;padding-bottom:16px;font-size:14px}
.breadcrumb a{color:#1688d8;text-decoration:none;font-weight:700}
.display-kits-hero{padding:42px 0;background:linear-gradient(135deg,#071522,#0c2943);border-top:1px solid rgba(22,136,216,.3);border-bottom:1px solid #1688d8}
.display-kits-hero h1{margin:0 0 8px;font-size:clamp(36px,5vw,58px);color:#fff}
.display-kits-hero p{margin:0;color:#fff;font-size:18px}
.display-kits-library{padding-top:36px;padding-bottom:70px}
.manufacturer-section{scroll-margin-top:90px;padding:28px 0 42px;border-bottom:1px solid rgba(22,136,216,.25)}
.manufacturer-heading{min-height:78px;display:flex;align-items:center;margin-bottom:20px}
.manufacturer-heading img{display:block;max-width:310px;max-height:72px;width:auto;height:auto;object-fit:contain}
.text-manufacturer-logo{font-size:32px;font-weight:800;color:#1688d8}
.kit-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.kit-card{display:flex;min-height:190px;border:1px solid rgba(22,136,216,.42);border-radius:12px;overflow:hidden;text-decoration:none;background:rgba(8,119,255,.045)}
.kit-card:hover{border-color:#1688d8;background:rgba(8,119,255,.10);transform:translateY(-1px)}
.kit-card-image{width:34%;min-width:120px;display:flex;align-items:center;justify-content:center;padding:14px;background:rgba(255,255,255,.94)}
.kit-card-image img{width:100%;height:100%;max-height:120px;object-fit:contain}
.kit-card-copy{padding:18px;display:flex;flex-direction:column}
.kit-card h3{margin:0 0 9px;font-size:17px;color:inherit}
.kit-card p{margin:0 0 16px;font-size:14px;line-height:1.45;opacity:.86}
.kit-price{margin-top:auto;color:#1688d8;font-size:20px}
@media(max-width:1050px){.kit-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:680px){.kit-grid{grid-template-columns:1fr}.kit-card{min-height:165px}}

/* V52: product photography from original Wolffpac-Tech listings */
.kit-card-image{background:#fff;overflow:hidden}
.kit-card-image img{width:100%;height:100%;max-height:none;object-fit:contain}

/* V55: Hankin manufacturer identity */
.v10-maker-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
.v10-maker-grid .maker img[src$="hankin.png.svg"]{max-width:88%;max-height:76px}
.manufacturer-heading img[src$="hankin.png.svg"]{max-width:330px;max-height:82px}
@media(max-width:950px){.v10-maker-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.v10-maker-grid{grid-template-columns:1fr}}

/* V56: breadcrumb integrated into upper navigation */
header .breadcrumb{
  padding-top:7px;
  padding-bottom:9px;
  border-top:1px solid rgba(22,136,216,.22);
  font-size:13px;
}
header .breadcrumb a{color:#1688d8;font-weight:700;text-decoration:none}
header .breadcrumb span{opacity:.88}

/* V57: site-wide copyright */
.site-copyright{
  text-align:center;
  padding:18px 20px 20px;
  font-size:13px;
  opacity:.72;
  border-top:1px solid rgba(255,255,255,.08);
}

/* V58 product detail pages */
.kit-card-image{position:relative}
.view-details-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(5,25,43,.82);color:#fff;font-size:18px;font-weight:800;letter-spacing:.03em;opacity:0;transition:opacity .18s ease}
.kit-card:hover .view-details-overlay,.kit-card:focus .view-details-overlay{opacity:1}
.product-page{padding:42px 0 72px}
.product-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr);gap:48px;align-items:start}
.product-gallery{display:grid;grid-template-columns:92px minmax(0,1fr);gap:16px}
.product-thumbs{display:flex;flex-direction:column;gap:10px}
.product-thumb{padding:4px;border:2px solid transparent;border-radius:7px;background:#fff;cursor:pointer}
.product-thumb.active,.product-thumb:hover{border-color:#1688d8}
.product-thumb img{display:block;width:100%;aspect-ratio:1/1;object-fit:contain}
.product-viewer{min-height:480px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(22,136,216,.35);border-radius:12px;background:#fff;padding:20px}
.product-viewer img{display:block;max-width:100%;max-height:620px;object-fit:contain}
.product-description{margin-top:28px;padding-top:22px;border-top:1px solid rgba(22,136,216,.28)}
.product-description h2{color:#1688d8;margin:0 0 16px}
.product-description p{font-size:16px;line-height:1.7;white-space:pre-line}
.product-buy{position:sticky;top:125px;padding:28px;border:1px solid rgba(22,136,216,.4);border-radius:12px;background:rgba(8,35,59,.78)}
.product-buy h1{margin:0 0 15px;font-size:30px;line-height:1.18}
.product-price{font-size:29px;font-weight:800;color:#1688d8;margin-bottom:28px}
.product-buy label{display:block;font-weight:700;margin-bottom:8px}
.quantity-control{display:grid;grid-template-columns:44px 78px 44px;width:max-content;margin-bottom:20px}
.quantity-control button,.quantity-control input{height:42px;border:1px solid #1688d8;background:#fff;color:#061829;text-align:center;font-weight:700}
.quantity-control button{cursor:pointer;font-size:20px}.quantity-control input{width:78px;box-sizing:border-box}
.add-cart{width:100%;justify-content:center;font-size:17px;font-weight:800}
.cart-message{min-height:24px;margin-top:12px;font-weight:700;color:#8fd3ff}
@media(max-width:850px){.product-layout{grid-template-columns:1fr}.product-buy{position:static}.product-gallery{grid-template-columns:1fr}.product-thumbs{flex-direction:row;order:2}.product-thumb{width:76px}.product-viewer{min-height:320px}}

/* V59: source-style product gallery/purchase controls */
.product-gallery{display:flex;flex-direction:column;gap:14px}
.product-viewer{order:1}
.product-thumbs{order:2;display:flex;flex-direction:row;flex-wrap:wrap;gap:10px}
.product-thumb{width:78px;flex:0 0 78px}
.product-buy{
  position:sticky;
  top:125px;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
.product-buy h1{font-size:30px;font-weight:400;line-height:1.25;margin:0 0 18px}
.product-price{font-size:20px;font-weight:400;margin:0 0 34px;color:inherit}
.product-buy label{font-size:14px;font-weight:400;margin:0 0 8px}
.product-option{margin-bottom:22px}
.product-option select{
  width:100%;
  height:44px;
  padding:0 12px;
  border:1px solid rgba(127,127,127,.65);
  background:transparent;
  color:inherit;
  font:inherit;
}
.quantity-control{display:flex;width:max-content;margin:0 0 24px}
.quantity-control button,.quantity-control input{
  height:42px;
  border:1px solid rgba(127,127,127,.65);
  background:transparent;
  color:inherit;
  text-align:center;
  font-weight:400;
}
.quantity-control button{width:42px;font-size:20px;cursor:pointer}
.quantity-control input{width:58px;border-left:0;border-right:0;box-sizing:border-box}
.quantity-control .qty-minus[hidden]{display:none}
.quantity-control .qty-minus[hidden] + input{border-left:1px solid rgba(127,127,127,.65)}
.quantity-control input::-webkit-outer-spin-button,
.quantity-control input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.quantity-control input[type=number]{-moz-appearance:textfield;appearance:textfield}
.add-cart{width:100%;min-height:46px;justify-content:center;font-size:15px;font-weight:600}
@media(max-width:850px){.product-buy{position:static}.product-thumbs{order:2}.product-viewer{order:1}}

/* V60: navigation room + Announcements */
header .nav{justify-content:flex-start;gap:22px}
header .brand{flex:0 0 auto;margin-right:6px}
header .links{margin-left:0;gap:14px;justify-content:flex-start;flex:1}
header .links a{font-size:14px;white-space:nowrap}
.announcements-hero{padding:48px 0;background:linear-gradient(135deg,#071522,#0c2943);border-bottom:1px solid #1688d8}
.announcements-hero h1{margin:5px 0 8px;color:#fff;font-size:clamp(36px,5vw,58px)}
.announcements-hero p{margin:0;color:#fff;font-size:18px}
.announcement-list{padding-top:34px;padding-bottom:70px;display:grid;gap:20px}
.announcement-card{display:grid;grid-template-columns:120px 1fr;gap:25px;padding:26px;border:1px solid rgba(22,136,216,.38);border-radius:12px;background:rgba(8,119,255,.045)}
.announcement-date{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:112px;border-radius:9px;background:#1688d8;color:#fff}
.announcement-date strong{font-size:17px}.announcement-date span{font-size:29px;font-weight:800}.announcement-date small{font-size:14px}
.announcement-type{font-size:12px;font-weight:800;letter-spacing:.12em;color:#1688d8}
.announcement-card h2{margin:5px 0 10px}.announcement-card p{max-width:900px;line-height:1.65}
.announcement-news-icon{display:flex;align-items:center;justify-content:center;min-height:112px;border-radius:9px;border:2px solid #1688d8;color:#1688d8;font-weight:900;letter-spacing:.1em}
@media(max-width:1100px){header .links{gap:9px}header .links a{font-size:12px}}
@media(max-width:700px){.announcement-card{grid-template-columns:1fr}.announcement-date,.announcement-news-icon{max-width:150px}}

/* V61: readability correction for dark/blue sections */
.instructions-hero,
.instructions-hero h1,
.instructions-hero h2,
.instructions-hero p,
.instructions-hero .eyebrow,
.about-hero,
.about-hero h1,
.about-hero h2,
.about-hero p,
.display-kits-hero,
.display-kits-hero h1,
.display-kits-hero h2,
.display-kits-hero p,
.announcements-hero,
.announcements-hero h1,
.announcements-hero h2,
.announcements-hero p,
.announcements-hero .eyebrow{
  color:#fff !important;
}

/* Ensure the Online Assembly Instructions blue intro box is always white text. */
.instructions-page .instructions-hero,
.instructions-page .instructions-hero *{
  color:#fff !important;
}

/* V62: manufacturer instruction shortcuts */
.manufacturer-heading{
  justify-content:space-between;
  gap:24px;
}
.manufacturer-instructions-btn{
  margin-left:auto;
  flex:0 0 auto;
  text-decoration:none;
  white-space:nowrap;
}
[id^="instructions-"]{
  scroll-margin-top:145px;
}
@media(max-width:650px){
  .manufacturer-heading{align-items:flex-start;flex-direction:column}
  .manufacturer-instructions-btn{margin-left:0}
}

/* V64: shopping cart always visible at far right of top navigation */
header .nav{display:flex;align-items:center}
.site-cart-link{
  margin-left:auto;
  display:inline-flex;
  align-items:center;
  gap:6px;
  flex:0 0 auto;
  white-space:nowrap;
  text-decoration:none;
  font-weight:700;
}
.cart-count{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:20px;
  height:20px;
  padding:0 5px;
  border-radius:999px;
  background:#1688d8;
  color:#fff;
  font-size:12px;
  box-sizing:border-box;
}
.cart-page{padding:48px 0 80px}
.cart-line{display:grid;grid-template-columns:1fr auto auto;gap:24px;padding:18px 0;border-bottom:1px solid rgba(22,136,216,.25)}
@media(max-width:1100px){.site-cart-link span:not(.cart-icon):not(.cart-count){display:none}}

/* V65: centered manufacturer assembly-instruction buttons */
.manufacturer-heading{
  position:relative;
}
.manufacturer-instructions-btn{
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  margin-left:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 20px;
  border-radius:7px;
  background:#1688d8;
  color:#fff !important;
  font-weight:700;
  text-decoration:none;
  white-space:nowrap;
  cursor:pointer;
}
.manufacturer-instructions-btn:hover{
  filter:brightness(1.08);
}
@media(max-width:650px){
  .manufacturer-heading{position:static}
  .manufacturer-instructions-btn{
    position:static;
    transform:none;
    align-self:center;
  }
}

/* V67: Pinball Expo announcement artwork */
.announcement-event-image{
  display:block;
  width:100%;
  max-width:620px;
  height:auto;
  margin:0 0 18px;
  border-radius:8px;
}

/* V69: anchor-link offset so tagged section headings remain visible */
html{
  scroll-padding-top: 170px;
}
section[id],
[id^="instructions-"],
#finder,
#shipping{
  scroll-margin-top: 170px;
}

/* V70: compact announcement event layout */
.announcement-card.event > div:last-child{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
}
.announcement-card.event .announcement-event-image{
  width:auto;
  max-width:420px;
  max-height:190px;
  object-fit:contain;
  margin:10px 0 16px;
  border-radius:7px;
}
.announcement-card.event .btn{
  margin-top:auto;
}
@media(max-width:700px){
  .announcement-card.event .announcement-event-image{
    width:100%;
    max-width:100%;
    max-height:180px;
  }
}

/* V71: fixed purchase column + selection-gated Add to Cart */
.product-layout{
  align-items:start;
}
.product-left{
  min-width:0;
}
.product-buy{
  position:sticky !important;
  top:170px !important;
  align-self:start;
  max-height:calc(100vh - 190px);
  overflow:auto;
}
.add-cart:disabled,
.add-cart[aria-disabled="true"]{
  opacity:.42;
  cursor:not-allowed;
  filter:none;
  pointer-events:none;
}
@media(max-width:850px){
  .product-buy{
    position:static !important;
    max-height:none;
    overflow:visible;
  }
}

/* V73: Featured Display Kits manufacturer navigation */
.featured-kit[data-feature-link]{cursor:pointer}
.featured-kit[data-feature-link]:focus-visible{outline:2px solid #1688d8;outline-offset:3px}

/* V74: complete responsive pass */
.mobile-menu-toggle{display:none;margin-left:auto;width:44px;height:40px;border:1px solid rgba(22,136,216,.45);border-radius:6px;background:transparent;padding:8px;cursor:pointer}
.mobile-menu-toggle span{display:block;height:2px;background:currentColor;margin:5px 0}
@media(max-width:1050px){
  header .nav{position:relative;flex-wrap:wrap;gap:10px}
  header .brand img{max-width:210px;height:auto}
  .mobile-menu-toggle{display:block}
  header .links{display:none!important;order:4;width:100%;margin:0!important;padding:10px 0 16px;flex-direction:column;align-items:stretch!important;gap:0!important}
  header .nav.menu-open .links{display:flex!important}
  header .links a{display:block!important;width:100%;box-sizing:border-box;padding:12px 14px;font-size:15px!important;border-top:1px solid rgba(22,136,216,.18)}
  .site-cart-link{margin-left:8px!important}
  header .breadcrumb{overflow-x:auto;white-space:nowrap}
  html{scroll-padding-top:145px}
  section[id],[id^="instructions-"],#finder,#shipping{scroll-margin-top:145px}
}
@media(max-width:820px){
  .wrap{width:min(94%,1200px)}
  .hero-grid,.contact-grid,.about-grid,.featured-kit,.support-grid,.instruction-support-grid{grid-template-columns:1fr!important}
  .featured-kit{display:grid!important}
  .featured-copy,.featured-gallery{clip-path:none!important}
  .featured-gallery{min-height:260px}
  .v10-maker-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .kit-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .manufacturer-heading{position:static!important;display:flex!important;flex-direction:column!important;align-items:center!important;text-align:center}
  .manufacturer-instructions-btn{position:static!important;transform:none!important;margin:12px auto 0!important}
  .product-layout{grid-template-columns:1fr!important;gap:28px}
  .product-buy{position:static!important;max-height:none!important;overflow:visible!important}
  .product-viewer{min-height:300px!important}
  .announcement-card{grid-template-columns:1fr!important}
  .announcement-date,.announcement-news-icon{max-width:150px}
  img{max-width:100%;height:auto}
}
@media(max-width:560px){
  body{overflow-x:hidden}
  header .brand img{max-width:165px}
  .site-cart-link{font-size:0}
  .site-cart-link .cart-icon,.site-cart-link .cart-count{font-size:14px}
  .v10-maker-grid,.kit-grid{grid-template-columns:1fr!important}
  .featured-logo-title img{max-width:210px!important;height:auto!important}
  .featured-copy{padding:24px 20px!important}
  .featured-gallery{padding:18px!important;min-height:220px}
  .product-page{padding-top:24px}
  .product-viewer{min-height:230px!important;padding:10px}
  .product-thumb{width:62px!important;flex-basis:62px!important}
  .product-buy h1{font-size:25px!important}
  .announcement-card{padding:18px!important}
  .announcement-card.event .announcement-event-image{max-height:150px!important}
  .contact-form,.about-content,.instructions-page section{max-width:100%}
  h1{font-size:clamp(30px,10vw,44px)}
}

/* V75: landing-page feature shortcuts */
[data-home-link]{cursor:pointer}
[data-home-link]:focus-visible{outline:2px solid #1688d8;outline-offset:3px}

/* V79: desktop navigation vs tablet/mobile hamburger */
@media (min-width: 1101px){
  header .nav{
    flex-wrap:nowrap !important;
  }
  .mobile-menu-toggle{
    display:none !important;
  }
  header .links{
    display:flex !important;
    flex-direction:row !important;
    width:auto !important;
    order:initial !important;
    margin-left:65px !important;
    padding:0 !important;
    gap:22px !important;
    align-items:center !important;
    flex:1 1 auto !important;
  }
  header .links a{
    display:inline-flex !important;
    width:auto !important;
    padding:0 !important;
    border-top:0 !important;
    font-size:.94rem !important;
    white-space:nowrap;
  }
  .site-cart-link{
    margin-left:auto !important;
  }
  .site-cart-link span:not(.cart-icon):not(.cart-count){
    display:inline !important;
  }
}
@media (max-width:1100px){
  .mobile-menu-toggle{
    display:block !important;
  }
  header .links{
    display:none !important;
  }
  header .nav.menu-open .links{
    display:flex !important;
  }
}

/* V83 — V79 trust strip reorganized; transparent icons/text, no buttons/cards */
.trust .wrap{align-items:stretch}
.trust-item.trust-feature{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  padding:16px 22px !important;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:18px;
  min-height:94px;
  color:#17263a !important;
}
.trust-feature + .trust-feature{border-left:1px solid #c8d1dc !important}
.feature-copy{display:flex;flex-direction:column;align-items:flex-start;text-align:left}
.feature-copy strong{
  color:#17263a !important;
  font-size:1.03rem !important;
  font-weight:800 !important;
  line-height:1.15;
  letter-spacing:.01em;
}
.feature-copy span{
  color:#0879e8 !important;
  font-size:.96rem !important;
  font-weight:500 !important;
  line-height:1.25;
  margin-top:7px;
}
.feature-icon{position:relative;width:62px;height:62px;flex:0 0 62px;color:#0879e8}
.shield-icon{
  width:52px;height:59px;flex-basis:52px;
  border:5px solid #0879e8;border-radius:48% 48% 54% 54% / 22% 22% 64% 64%;
  box-sizing:border-box;
}
.shield-icon span{position:absolute;inset:0;display:grid;place-items:center;color:#0879e8;font-size:30px;font-weight:900}
.truck-icon .truck-body{position:absolute;left:0;top:13px;width:39px;height:30px;border-radius:5px;background:#0879e8}
.truck-icon .truck-cab{position:absolute;left:39px;top:23px;width:19px;height:20px;border:5px solid #0879e8;border-left:3px solid #0879e8;border-radius:2px 6px 3px 2px;box-sizing:border-box}
.truck-icon i,.truck-icon b{position:absolute;bottom:5px;width:14px;height:14px;border-radius:50%;background:#0879e8}
.truck-icon i{left:9px}.truck-icon b{left:43px}
.tools-icon:before,.tools-icon:after{
  content:"";position:absolute;left:27px;top:1px;width:8px;height:60px;border-radius:6px;background:#0879e8;transform:rotate(45deg)
}
.tools-icon:after{transform:rotate(-45deg)}
.tools-icon span,.tools-icon i{position:absolute;width:17px;height:17px;border:6px solid #0879e8;border-radius:50%;box-sizing:border-box;bottom:0}
.tools-icon span{left:0}.tools-icon i{right:0}
.trust-feature[data-home-link]{cursor:pointer}
.trust-feature[data-home-link]:hover .feature-copy strong{text-decoration:underline}
@media(max-width:820px){
 .trust .wrap{display:block}
 .trust-item.trust-feature{justify-content:flex-start;max-width:430px;margin:0 auto;border-left:0 !important;border-top:1px solid #d7dee7 !important}
 .trust-item.trust-feature:first-child{border-top:0 !important}
}

/* V84: exact reference-style benefit icons and typography */
.trust-item.trust-feature{
  color:#111827 !important;
  gap:16px !important;
}
.feature-copy strong{
  color:#172033 !important;
  font-size:1.05rem !important;
  font-weight:800 !important;
  letter-spacing:.01em !important;
}
.feature-copy span{
  color:#0879e8 !important;
  font-size:1rem !important;
  font-weight:500 !important;
  line-height:1.32 !important;
}
.feature-icon{width:66px !important;height:66px !important;flex:0 0 66px !important}
.shield-icon{
  width:57px !important;height:64px !important;flex-basis:57px !important;
  border:5px solid #0879e8 !important;
  border-radius:50% 50% 55% 55% / 18% 18% 65% 65% !important;
  transform:none !important;
}
.shield-check{
  position:absolute;left:14px;top:20px;width:23px;height:12px;
  border-left:7px solid #0879e8;border-bottom:7px solid #0879e8;
  transform:rotate(-45deg);
}
.truck-icon .truck-body{
  left:0 !important;top:13px !important;width:40px !important;height:32px !important;
  border-radius:5px !important;background:#0879e8 !important;
}
.truck-icon .truck-cab{
  left:39px !important;top:23px !important;width:23px !important;height:22px !important;
  background:#0879e8 !important;border:0 !important;
  clip-path:polygon(0 0,65% 0,100% 48%,100% 100%,0 100%);
}
.truck-window{
  position:absolute;left:45px;top:27px;width:10px;height:7px;
  background:#eaf3ff;clip-path:polygon(0 0,65% 0,100% 100%,0 100%);
}
.truck-icon i,.truck-icon b{
  bottom:5px !important;width:15px !important;height:15px !important;
  background:#0879e8 !important;border:2px solid #eef5fc;
}
.truck-icon i{left:10px !important}.truck-icon b{left:44px !important}
.tools-icon:before,.tools-icon:after{display:none !important}
.tools-icon .wrench{
  position:absolute;left:27px;top:2px;width:9px;height:62px;background:#0879e8;border-radius:5px;
  transform:rotate(43deg);
}
.tools-icon .wrench:before{
  content:"";position:absolute;left:-7px;top:-5px;width:23px;height:23px;
  border:7px solid #0879e8;border-top-color:transparent;border-right-color:transparent;
  border-radius:50%;box-sizing:border-box;
}
.tools-icon .wrench:after{
  content:"";position:absolute;left:-4px;bottom:-2px;width:17px;height:17px;
  border:6px solid #0879e8;border-radius:50%;box-sizing:border-box;background:#eef5fc;
}
.tools-icon .screwdriver{
  position:absolute;left:29px;top:1px;width:8px;height:61px;background:#0879e8;border-radius:5px;
  transform:rotate(-43deg);
}
.tools-icon .screwdriver:before{
  content:"";position:absolute;left:-5px;top:-3px;width:18px;height:20px;
  background:#0879e8;clip-path:polygon(25% 0,75% 0,100% 35%,75% 100%,25% 100%,0 35%);
}
.trust-feature + .trust-feature{border-left:1px solid #8e98a5 !important}

/* V85: approved transparent feature graphics */
.trust-item.trust-feature-image{background:transparent!important;border:0!important;box-shadow:none!important;padding:10px 16px!important;min-height:96px;display:flex;align-items:center;justify-content:center;cursor:pointer}
.trust-feature-image + .trust-feature-image{border-left:1px solid #8e98a5!important}
.trust-feature-image img{display:block;width:100%;max-width:430px;height:auto;max-height:104px;object-fit:contain}
@media(max-width:820px){.trust-feature-image + .trust-feature-image{border-left:0!important;border-top:1px solid #d7dee7!important}.trust-feature-image img{max-width:390px;max-height:100px}}

/* V86: uniform compact landing feature graphics */
.trust-item.trust-graphic img,
.trust-item img[src*="no-fault"],
.trust-item img[src*="shipping"],
.trust-item img[src*="easy"]{
  display:block !important;
  width:100% !important;
  max-width:285px !important;
  height:92px !important;
  object-fit:contain !important;
  margin:0 auto !important;
}
.trust-item{
  min-height:112px;
  display:flex;
  align-items:center;
  justify-content:center;
}
@media(max-width:820px){
 .trust-item.trust-graphic img,
 .trust-item img[src*="no-fault"],
 .trust-item img[src*="shipping"],
 .trust-item img[src*="easy"]{
   max-width:260px !important;
   height:84px !important;
 }
}

/* V87: tighter, uniformly aligned landing feature strip */
.trust .wrap{
  align-items:flex-start !important;
}
.trust-item{
  min-height:88px !important;
  height:88px !important;
  padding:8px 14px !important;
  box-sizing:border-box !important;
  align-items:flex-start !important;
}
.trust-item.trust-graphic img,
.trust-item img[src*="no-fault"],
.trust-item img[src*="shipping"],
.trust-item img[src*="easy"]{
  width:240px !important;
  max-width:240px !important;
  height:72px !important;
  min-height:72px !important;
  object-fit:contain !important;
  object-position:center top !important;
  margin:0 auto !important;
}
@media(max-width:820px){
  .trust-item{
    height:82px !important;
    min-height:82px !important;
    padding:7px 10px !important;
  }
  .trust-item.trust-graphic img,
  .trust-item img[src*="no-fault"],
  .trust-item img[src*="shipping"],
  .trust-item img[src*="easy"]{
    width:225px !important;
    max-width:225px !important;
    height:68px !important;
    min-height:68px !important;
  }
}

/* V88: slightly reduce Easy to Install graphic while preserving V87 alignment */
.trust-item:nth-child(3) img[src*="easy"]{
  width:220px !important;
  max-width:220px !important;
  height:66px !important;
  min-height:66px !important;
  object-fit:contain !important;
  object-position:center top !important;
  margin:0 auto !important;
}
@media(max-width:820px){
  .trust-item:nth-child(3) img[src*="easy"]{
    width:207px !important;
    max-width:207px !important;
    height:62px !important;
    min-height:62px !important;
  }
}

/* V89: explicit common top baseline for all three landing feature blocks */
.trust .wrap{
  align-items:flex-start !important;
}
.trust .trust-item.trust-feature-image{
  align-self:flex-start !important;
  align-items:flex-start !important;
  justify-content:center !important;
  padding-top:8px !important;
  margin-top:0 !important;
}
.trust .trust-item.trust-feature-image img{
  display:block !important;
  margin-top:0 !important;
  object-position:center top !important;
}

/* V90: pinball-themed hero artwork */
.hero.hero-v90{padding:0 !important;overflow:hidden}
.hero-v90>.wrap{max-width:none !important;padding:0 !important}
.hero-v90-art{width:100%;line-height:0}
.hero-v90-art img{display:block;width:100%;height:auto;max-height:590px;object-fit:cover;object-position:center}

@media(max-width:820px){
 .hero-v90-art img{min-height:290px;object-fit:cover;object-position:center}
 
}

/* V91: overlay the existing hero action buttons on the bottom of the hero artwork */
.hero.hero-v90 > .wrap{
  position:relative !important;
}
.hero-v90-art{
  position:relative !important;
}

/* preserve mobile usability while keeping the buttons on the artwork */
@media(max-width:820px){
  
}

/* V92: add breathing room above hero message and make inactive hero actions opaque */
.hero-v90-art{
  box-sizing:border-box !important;
  padding-top:14px !important;
  background:#031126 !important;
}
.hero-v90-art img{
  max-height:576px !important;
}

/* Default/unselected action: solid white so the hero artwork cannot show through */


/* Preserve the existing blue focused/hover treatment */


@media(max-width:820px){
  .hero-v90-art{
    padding-top:10px !important;
  }
}

/* V93: hero button state + slightly reduced hero artwork to protect headline */
.hero-v90-art{
  padding-top:18px !important;
  text-align:center !important;
}
.hero-v90-art img{
  width:96% !important;
  max-width:96% !important;
  height:auto !important;
  max-height:none !important;
  margin:0 auto !important;
  object-fit:contain !important;
  object-position:center top !important;
}

/* All hero actions are opaque dark blue by default. */


/* First action is the default light-blue selection whenever none are hovered. */


/* While any action is hovered, all return dark blue first... */


/* ...and only the hovered/focused action receives the lighter blue. */


@media(max-width:820px){
  .hero-v90-art{padding-top:12px !important}
  .hero-v90-art img{width:98% !important;max-width:98% !important}
}

/* V94: raise hero actions and enforce exact default/hover selection behavior */


/* Base state: every action is opaque dark blue. */


/* No hover: first action is the default light-blue selection. */


/* When any action is hovered, reset every action to dark blue. */


/* Then make only the actual hovered action light blue. */


/* Keyboard focus follows the same selected light-blue treatment. */


@media(max-width:820px){
  
}

/* V95: explicitly keep button 1 light blue while button 1 itself is hovered */


/* V96: exact hero action hover behavior and higher artwork overlay */


/* Normal state: first is selected; other two are dark. */



/* Hovering anywhere in the action group resets the default first button. */


/* The button actually under the mouse is always the lighter blue. */


/* Keyboard selection matches mouse selection. */


/* When the mouse leaves the group, the first-button rule above restores default selection. */
@media(max-width:820px){
  
}

/* V97: move actions another 50px upward and force hover colors via JS state classes */



@media(max-width:820px){
  
}


/* ============================================================
   V98 HERO ACTIONS — CLEAN REBUILD
   This is the sole styling/hover logic for the three hero links.
   ============================================================ */

.hero-v90 .dynamic-actions {
  position: absolute !important;
  left: 50% !important;
  bottom: 128px !important;
  transform: translateX(-50%) !important;
  z-index: 20 !important;
  width: calc(100% - 48px) !important;
  max-width: 1180px !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex !important;
  gap: 12px !important;
}

.hero-v90 .dynamic-actions > a.btn {
  flex: 1 1 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: #08284d !important;
  background-image: none !important;
  color: #ffffff !important;
  border: 1px solid #496078 !important;
  opacity: 1 !important;
  transition: background-color .15s ease !important;
}

/* Default selection when the mouse is not over the button row. */
.hero-v90 .dynamic-actions > a.btn:first-child {
  background: #0879e8 !important;
  background-image: none !important;
}

/* As soon as the pointer is anywhere over the row, reset all buttons dark. */
.hero-v90 .dynamic-actions:hover > a.btn {
  background: #08284d !important;
  background-image: none !important;
}

/* The actual button being hovered is always light blue. */
.hero-v90 .dynamic-actions > a.btn:hover {
  background: #0879e8 !important;
  background-image: none !important;
}

/* Keyboard navigation mirrors hover behavior. */
.hero-v90 .dynamic-actions > a.btn:focus-visible {
  background: #0879e8 !important;
  background-image: none !important;
}

@media (max-width: 820px) {
  .hero-v90 .dynamic-actions {
    bottom: 78px !important;
    width: calc(100% - 28px) !important;
  }
}

/* V99: restore compact hero button widths; preserve V98 hover behavior */
.hero-v90 .dynamic-actions{
  width:auto !important;
  max-width:none !important;
  justify-content:center !important;
}
.hero-v90 .dynamic-actions > a.btn{
  flex:0 0 auto !important;
  width:auto !important;
  min-width:0 !important;
}
@media(max-width:820px){
  .hero-v90 .dynamic-actions{
    width:calc(100% - 28px) !important;
  }
}

/* V100: restore left alignment of compact hero buttons; preserve V98/V99 hover and sizing */
.hero-v90 .dynamic-actions{
  left:24px !important;
  transform:none !important;
  justify-content:flex-start !important;
}
@media(max-width:820px){
  .hero-v90 .dynamic-actions{
    left:14px !important;
  }
}

/* V101: responsive hero actions moved into normal flow below hero artwork */
.hero.hero-v90 > .wrap{
  position:relative !important;
}

.hero-v90 .dynamic-actions{
  position:static !important;
  left:auto !important;
  bottom:auto !important;
  transform:none !important;
  z-index:auto !important;

  width:100% !important;
  max-width:none !important;
  box-sizing:border-box !important;

  display:flex !important;
  flex-wrap:wrap !important;
  justify-content:flex-start !important;
  align-items:center !important;
  gap:12px !important;

  margin:0 !important;
  padding:16px 24px 18px !important;
  background:#031126 !important;
}

/* Keep V100 compact desktop button sizing. */
.hero-v90 .dynamic-actions > a.btn{
  flex:0 0 auto !important;
  width:auto !important;
  min-width:0 !important;
}

/* Tablet/mobile: buttons live below the image and reflow without covering it. */
@media(max-width:820px){
  .hero-v90 .dynamic-actions{
    position:static !important;
    left:auto !important;
    bottom:auto !important;
    transform:none !important;
    width:100% !important;
    padding:14px 16px 16px !important;
    gap:10px !important;
  }
}

@media(max-width:560px){
  .hero-v90 .dynamic-actions{
    flex-direction:column !important;
    align-items:stretch !important;
  }
  .hero-v90 .dynamic-actions > a.btn{
    width:100% !important;
    box-sizing:border-box !important;
  }
}

/* V102: true responsive hero actions — always below hero image, compact on mobile */
.hero-v90 .dynamic-actions{
  position:static !important; left:auto !important; right:auto !important; top:auto !important; bottom:auto !important;
  transform:none !important; width:100% !important; max-width:none !important; box-sizing:border-box !important;
  display:flex !important; flex-wrap:wrap !important; justify-content:flex-start !important; align-items:center !important;
  gap:12px !important; margin:0 !important; padding:14px 24px 16px !important; background:#031126 !important;
}
.hero-v90 .dynamic-actions > a.btn{flex:0 0 auto !important;width:auto !important;min-width:0 !important;box-sizing:border-box !important;}
@media(max-width:820px){
 .hero-v90 .dynamic-actions{position:static !important;width:100% !important;padding:12px 16px 14px !important;gap:9px !important;}
 .hero-v90 .dynamic-actions > a.btn{flex:0 1 auto !important;width:auto !important;min-width:0 !important;padding:9px 13px !important;font-size:.82rem !important;line-height:1.15 !important;white-space:nowrap !important;}
}
@media(max-width:560px){
 .hero-v90 .dynamic-actions{flex-direction:row !important;flex-wrap:wrap !important;align-items:center !important;justify-content:flex-start !important;padding:10px 12px 12px !important;gap:7px !important;}
 .hero-v90 .dynamic-actions > a.btn{flex:0 1 auto !important;width:auto !important;min-width:0 !important;max-width:100% !important;padding:8px 10px !important;font-size:.74rem !important;line-height:1.1 !important;}
}
