/* ===== HOT FPGA OFFER — V5.1.6K Compact Grid Layout ===== */

.hot-section{
  max-width:1280px;
  margin:60px auto;
  padding:0 24px;
}

.section-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:24px;
}
.section-header h2{
  font-size:28px;
  font-weight:800;
  color:#0A2540;
  margin:0 0 4px;
}
.section-header p{
  font-size:14px;
  color:#6B7280;
  margin:0;
}

/* Scroll wrap (viewport) */
.hot-scroll-wrap{
  position:relative;
  overflow:hidden;
}

/* Track */
.hot-grid{
  display:flex;
  gap:16px;
  transition:transform .5s cubic-bezier(.25,.46,.45,.94);
  will-change:transform;
  padding:4px 0;
  flex-wrap:nowrap;
}

/* ===== V5.1.6K Card: compact grid ===== */
.hot-card{
  flex:0 0 calc((100% - 80px) / 6);
  min-width:0;
  max-width:none;
  height:170px;
  background:#FFFFFF;
  border:1px solid #E5E7EB;
  border-radius:10px;
  overflow:hidden;
  display:grid;
  grid-template-rows:1fr 40px;
  box-shadow:0 1px 2px rgba(15,23,42,.04);
  transition:border-color .2s, box-shadow .2s, transform .2s;
}

.hot-card:hover{
  border-color:#0F7CCF;
  box-shadow:0 8px 22px rgba(15,124,207,.12);
  transform:translateY(-2px);
}

/* Card body: info left + thumb right */
.hot-card-body{
  display:grid;
  grid-template-columns:minmax(0,1fr) 76px;
  gap:10px;
  padding:14px 12px 10px;
  align-items:start;
}

/* Info column */
.hot-card-info{
  min-width:0;
}

/* Part number — 2-line clamp, uppercase, 12px */
.hot-card-pn{
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  min-height:32px;
  font-size:12px;
  line-height:1.25;
  font-weight:800;
  color:#0A2540;
  text-decoration:none;
  overflow:hidden;
  word-break:break-word;
  text-transform:uppercase;
}
.hot-card-pn:hover{
  color:#0F7CCF;
}

/* Brand */
.hot-card-brand{
  margin-top:5px;
  font-size:11px;
  line-height:1.25;
  color:#0F7CCF;
  font-weight:700;
}

/* Meta — series · package, single line ellipsis */
.hot-card-meta{
  margin-top:3px;
  font-size:11px;
  line-height:1.25;
  color:#6B7280;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* Status */
.hot-card-status{
  margin-top:5px;
  font-size:11px;
  line-height:1.25;
  color:#0A2540;
  font-weight:600;
}

/* Thumbnail — 76×76 container with border */
.hot-card-thumb{
  width:76px;
  height:76px;
  border-radius:8px;
  background:#F8FAFC;
  border:1px solid #EEF2F7;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  text-decoration:none;
}
.hot-card-thumb img{
  width:66px;
  height:66px;
  object-fit:contain;
  display:block;
}

/* Actions row — grid split Details | RFQ */
.hot-card-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  height:40px;
  border-top:1px solid #E5E7EB;
}

.hot-card-details,
.hot-card-rfq{
  height:40px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:12px;
  font-weight:800;
  text-decoration:none;
}

.hot-card-details{
  color:#0A2540;
  background:#FFFFFF;
  border-right:1px solid #E5E7EB;
}
.hot-card-details:hover{
  color:#0F7CCF;
  background:#F8FAFC;
}

.hot-card-rfq{
  color:#FFFFFF;
  background:#0F7CCF;
  border:0;
  cursor:pointer;
  border-radius:0 0 10px 0;
}
.hot-card-rfq:hover{
  background:#005F99;
}

/* Arrows */
.hot-arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:40px;
  height:40px;
  border-radius:50%;
  background:rgba(255,255,255,.95);
  border:1px solid #E5E7EB;
  box-shadow:0 2px 8px rgba(0,0,0,.1);
  font-size:20px;
  cursor:pointer;
  z-index:2;
  transition:all .2s;
}
.hot-arrow:hover{ background:#0F7CCF; color:#fff; }
.hot-arrow-prev{ left:-12px; }
.hot-arrow-next{ right:-12px; }

/* Dots */
.hot-dots{
  display:flex;
  justify-content:center;
  gap:8px;
  margin-top:16px;
}
.hot-dot{
  width:10px;
  height:10px;
  border-radius:50%;
  background:#E5E7EB;
  border:none;
  cursor:pointer;
  transition:all .2s;
  padding:0;
}
.hot-dot.active{
  background:#0F7CCF;
  width:24px;
  border-radius:5px;
}

/* ===== Mobile Responsive ===== */

/* Tablet: 2 columns */
@media(max-width:768px){
  .hot-grid{
    gap:12px;
    flex-wrap:wrap;
  }
  .hot-card{
    flex:0 0 calc((100% - 12px) / 2);
    height:168px;
  }
  .hot-card-body{
    grid-template-columns:minmax(0,1fr) 70px;
    padding:12px 10px 8px;
  }
  .hot-card-thumb{
    width:70px;
    height:70px;
  }
  .hot-card-thumb img{
    width:60px;
    height:60px;
  }
  .hot-card-pn{
    font-size:11.5px;
  }
  .hot-scroll-wrap{
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    padding-bottom:8px;
  }
  .hot-grid{
    flex-wrap:nowrap!important;
  }
  .hot-card{
    flex:0 0 calc(50% - 6px)!important;
  }
  .hot-arrow{
    display:none;
  }
}

/* Mobile: single card 82% */
@media(max-width:480px){
  .hot-card{
    flex:0 0 82%!important;
    height:168px;
  }
  .hot-card-body{
    grid-template-columns:minmax(0,1fr) 70px;
  }
  .hot-card-pn{
    font-size:11.5px;
  }
}
