/* ── Equipment cards ─────────────────────────────────────────────────────────
   index.css has .card { display: flex } (always visible) and the cardImg rule
   targets sector slide images. We scope overrides to .eqGrid to avoid conflicts.
   ──────────────────────────────────────────────────────────────────────────── */
.eqGrid .card { display: none; }
.eqGrid .card.is-visible {
  display: flex;
  flex-direction: column;
  min-height: clamp(220px, 19vw, 280px);
  padding: 0;
  overflow: hidden;
  border: 1px solid transparent;
  border-radius: 0;
  background: #d9d9d9;
  color: #080808;
  text-align: left;
  cursor: pointer;
  scroll-snap-align: center;
  transition: opacity 260ms ease, border-color 220ms ease, transform 220ms ease;
}
.eqGrid .card.is-visible:hover,
.eqGrid .card.is-selected {
  border-color: rgba(255, 196, 0, 0.95);
  transform: translateY(-3px);
}
.eqGrid.has-selection .card.is-visible:not(.is-selected) {
  opacity: 0.42;
  filter: grayscale(1);
}
.eqGrid.has-selection .card.is-visible:not(.is-selected):hover {
  opacity: 0.72;
  filter: grayscale(0.55);
}

/* Restore correct equipment card image layout (index.css cardImg is for sector slides) */
.eqGrid .card .cardImg {
  position: static !important;
  inset: auto !important;
  display: block !important;
  width: 100% !important;
  height: clamp(135px, 23vw, 238px) !important;
  overflow: hidden !important;
  background: #d9d9d9 !important;
  transform: none !important;
  transition: none !important;
  flex-shrink: 0;
}
.eqGrid .card .cardImg img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
  padding: 0 !important;
  background: transparent !important;
  display: block !important;
}
/* Card meta */
.eqGrid .card .cardMeta {
  display: grid !important;
  gap: 8px !important;
  margin-top: auto !important;
  padding: 18px 20px !important;
  background: transparent !important;
}
/* index.css cardEyebrow is yellow (for sector slides); equipment needs dark */
.eqGrid .card .cardEyebrow {
  display: block !important;
  color: rgba(8, 8, 8, 0.62) !important;
  font-size: 0.68rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  margin-bottom: 0 !important;
}
.eqGrid .card .cardName {
  display: grid !important;
  gap: 2px !important;
  color: #1c1c1c !important;
  font-size: 1.05rem !important;
  font-weight: 500 !important;
  letter-spacing: -0.03em !important;
  line-height: 1.15 !important;
}
.eqGrid .card .cardName small {
  color: #1c1c1c !important;
  font-size: 1em !important;
  font-weight: inherit !important;
}

/* Sector slide text — override conflicting dark-card rules from other sections */
.sectorSlide .cardEyebrow {
  color: #ffc400 !important;
  font-size: clamp(.62rem, .68vw, .78rem) !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: .14em !important;
  margin-bottom: 10px !important;
  display: block !important;
}
.sectorSlide .cardTitle {
  color: #fff !important;
  font-size: clamp(2rem, 3vw, 3.7rem) !important;
  font-weight: 400 !important;
  line-height: 1.03 !important;
  letter-spacing: -.045em !important;
  margin: 0 0 10px !important;
}
.sectorSlide .cardSubtitle {
  color: #ffffffd6 !important;
  font-size: clamp(.9rem, .95vw, 1.08rem) !important;
  font-weight: 400 !important;
  line-height: 1.42 !important;
  letter-spacing: -.018em !important;
  margin: 0 !important;
  display: block !important;
}

/* Fix sector slide images (CSS specificity conflict after removing Astro scoping) */
.sectorSlide .cardImg {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  object-fit: cover !important;
  object-position: center !important;
  display: block !important;
  background: none !important;
  overflow: visible !important;
}

/* Category hover preview — position controlled by JS (follows mouse) */
.catHoverPreview {
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 20px 60px rgba(0,0,0,0.5);
}
.catHoverPreview img {
  width: 100%;
  height: auto;
  display: block;
}

/* Nosotros page — ensure data-reveal blur is cleared when block becomes visible */
.aboutStoryBlock.is-visible {
  filter: blur(0) !important;
  opacity: 1 !important;
  transform: translateY(0) !important;
}
.aboutStoryText p {
  color: #333 !important;
}

/* Fix font url to use local static */
@font-face {
  font-family: Astera;
  src: url('/static/fonts/astera/ASTERA-v2.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}