/* ===== Estelectric · landing page · estilos globales ===== */

@import url('https://fonts.googleapis.com/css2?family=Anton&family=Manrope:wght@400;500;600;700;800&display=swap');

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: #ffffff;
  -webkit-font-smoothing: antialiased;
  font-family: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  color: #111111;
}
section { scroll-margin-top: 80px; }

@keyframes bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(7px); } }
.bob { animation: bob 1.9s ease-in-out infinite; }

/* ----- estados :hover (reemplazan a los style-hover del diseño) ----- */
.btn-amber { transition: transform .25s, box-shadow .25s; }
.btn-amber:hover { transform: translateY(-2px); box-shadow: 0 18px 32px -10px rgba(242,164,64,0.75); }

.btn-blue { transition: transform .25s, box-shadow .25s; }
.btn-blue:hover { transform: translateY(-2px); box-shadow: 0 20px 36px -12px rgba(45,103,162,0.7); }

.cat-card { transition: transform .35s ease, box-shadow .35s ease; cursor: pointer; }
.cat-card:hover { transform: translateY(-8px); box-shadow: 0 26px 50px -18px rgba(242,164,64,0.55); }

.nav-pill-link:hover { color: #111111 !important; }

/* ----- responsive ----- */
@media (max-width: 880px) {
  #app-content { margin-right: 0 !important; padding-top: 60px !important; padding-bottom: 84px !important; }
  #sidebar { display: none !important; }
  #mobilebar { display: flex !important; }
  #mobilecta { display: flex !important; }
  .use-grid { grid-template-columns: 1fr !important; }
  .use-grid figure { grid-column: auto !important; grid-row: auto !important; }
  figure[data-reveal] { height: 78vw !important; max-height: 560px; }
  .footer-row { flex-direction: column; align-items: flex-start !important; }
  .footer-right { align-items: flex-start !important; text-align: left !important; }
  #inicio { right: 0 !important; }
  .split { flex-direction: column !important; }
  .split img { height: clamp(280px,72vw,460px) !important; }
  .pkg-cols { grid-template-columns: 1fr !important; }
  .pkg-cols img { height: clamp(320px,80vw,520px) !important; }
  #transporte { position: static !important; height: auto !important; display: block !important; padding-top: clamp(64px,12vw,90px) !important; padding-bottom: clamp(64px,12vw,90px) !important; }
}
@media (max-width: 880px) and (min-width: 561px) {
  .cat-grid { grid-template-columns: 1fr 1fr !important; }
}
@media (max-width: 560px) {
  .cat-grid { grid-template-columns: 1fr !important; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .bob { animation: none; }
}