/* ================================
   Montacargas SANY · Landing Jegasa
   Extensiones sobre styles.css / styles2.css originales de jegasa.com
   ================================ */

.montacargas-hero {
  background-image: url('assets/jegasawebheaders6.jpg');
  background-size: cover;
  background-position: center;
}

.hero-sany-badge {
  background: var(--sany);
  color: #fff;
  margin-bottom: 1.5rem;
}

.hero-title {
  position: relative;
  z-index: 2;
  color: #fff;
  font-size: clamp(2rem, 4.5vw, 3.25rem);
  font-weight: 800;
  line-height: 1.2;
  max-width: 900px;
  margin: 0 auto 1.5rem;
  text-shadow: 0 2px 16px rgba(0, 0, 0, 0.55), 0 1px 3px rgba(0, 0, 0, 0.5);
}

.hero-sub {
  position: relative;
  z-index: 2;
  color: #fff;
  font-size: 1.3rem !important;
  max-width: 720px;
  margin: 0 auto;
  line-height: 1.7;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5), 0 1px 2px rgba(0, 0, 0, 0.45);
}

/* Fix: el gradient original de .hero-band se desvanece a transparente en
   el centro, justo donde cae el texto -- en fondos claros (ej. estudio
   fotográfico blanco) el texto se pierde por completo. Overlay uniforme
   y más oscuro para que el texto blanco siempre resalte, sin importar
   la imagen de fondo. */
.hero-band.montacargas-hero .container {
  position: relative;
  z-index: 3;
}

.hero-band.montacargas-hero::after {
  background: linear-gradient(
    180deg,
    hsla(220, 90%, 6%, 0.82) 0%,
    hsla(220, 90%, 6%, 0.72) 45%,
    hsla(220, 90%, 6%, 0.8) 75%,
    hsla(220, 90%, 6%, 0.9) 100%
  );
}

.hero-badges {
  position: relative;
  z-index: 2;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1rem;
  margin-top: 2.5rem;
}

.hero-badge {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.25rem;
  background: hsla(220, 90%, 8%, 0.55);
  border: 1px solid hsla(0, 0%, 100%, 0.35);
  border-radius: 12px;
  padding: 1rem 1.5rem;
  min-width: 150px;
  backdrop-filter: blur(2px);
}

.hero-badge strong {
  font-family: 'Poppins', sans-serif;
  font-size: 1.5rem;
  color: #fff;
}

.hero-badge span {
  font-size: 0.8rem !important;
  color: hsla(0, 0%, 100%, 0.75);
  text-transform: uppercase;
  letter-spacing: 0.05em;
}

.model-chip {
  text-align: center;
  background: var(--primary);
  color: #fff;
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  padding: 0.85rem 0.5rem;
  border-radius: 6px;
}

.advantage-icon {
  max-width: 72px;
  margin: 0 auto;
}

.jegasa-benefits {
  list-style: none;
  display: flex;
  flex-direction: column;
  gap: 0.9rem;
  padding: 0;
  margin: 0;
}

.jegasa-benefits li {
  position: relative;
  padding-left: 1.75rem;
  color: var(--foreground);
  font-size: 1.05rem;
  line-height: 1.6;
}

.jegasa-benefits li::before {
  content: '✓';
  position: absolute;
  left: 0;
  top: 0;
  color: var(--sany);
  font-weight: 700;
}

.contact-form-card {
  background: #fff;
  border-radius: 16px;
  box-shadow: var(--shadow-card);
  padding: clamp(1.5rem, 4vw, 3rem) !important;
}

/* Formulario en dos columnas (form + datos/mapa) dentro de #cotizar */
.cotizar-row .contact-form-wrapper {
  max-width: none;
  margin: 0;
  padding-left: 0;
  padding-right: 0;
}

.jegasa-info-card {
  background: #fff;
  border-radius: 16px;
  box-shadow: var(--shadow-card);
  padding: clamp(1.5rem, 3vw, 2rem);
  margin-bottom: 1.5rem;
}

.info-row {
  display: flex;
  align-items: flex-start;
  gap: 0.9rem;
  margin-bottom: 1.25rem;
}

.info-row .info-icon {
  flex-shrink: 0;
  width: 32px;
  font-size: 1.35rem;
  line-height: 1;
  text-align: center;
}

.info-row strong {
  display: block;
  font-family: 'Poppins', sans-serif;
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--muted-foreground);
  margin-bottom: 0.2rem;
}

.info-row p {
  margin: 0;
  color: var(--foreground);
  font-size: 0.95rem !important;
  line-height: 1.5;
}

.info-row a {
  color: var(--primary);
  font-weight: 600;
}

.info-row a:hover {
  color: var(--primary-glow);
}

.jegasa-map-wrapper {
  border-radius: 16px;
  overflow: hidden;
  box-shadow: var(--shadow-card);
  line-height: 0;
}

.form-group select {
  width: 100%;
  background: #fff;
  border: 1px solid rgba(120, 120, 120, 0.25);
  padding: 0.65rem 0.85rem;
  font-family: 'Inter', sans-serif;
  font-size: max(1rem, 16px);
  color: #1a2a3a;
  outline: none;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.form-group select:focus {
  border-color: #2697fd;
  box-shadow: 0 0 0 2px rgba(38, 151, 253, 0.15);
}

.form-section-label {
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 0.75rem;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  color: var(--sany);
  margin: 1.75rem 0 0.85rem;
}

.form-section-label:first-of-type {
  margin-top: 0;
}

.form-consent {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  margin-top: 1.5rem;
  padding-top: 1.25rem;
  border-top: 1px solid rgba(120, 120, 120, 0.2);
}

.form-consent input[type="checkbox"] {
  margin-top: 0.3rem;
  width: 18px;
  height: 18px;
  flex-shrink: 0;
  accent-color: var(--sany);
  cursor: pointer;
}

.form-consent label {
  font-size: 0.85rem;
  color: #5a6573;
  line-height: 1.5;
  cursor: pointer;
}

.gracias-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 84px;
  height: 84px;
  border-radius: 50%;
  background: hsl(145, 63%, 42%);
  color: #fff;
  font-size: 2.5rem;
  font-weight: 800;
  margin: 0 auto;
}

@media (max-width: 767px) {
  .hero-badge { min-width: 130px; padding: 0.85rem 1rem; }
}

/* ================================
   Fix: el styles.css original de jegasa.com fuerza
   padding-bottom: 0 en .py-5 (pensado para su propio layout de
   varias páginas). En esta landing de una sola página eso deja los
   botones de CTA pegados contra la siguiente sección. Restauramos
   un padding inferior simétrico.
   ================================ */
.py-5 {
  padding-bottom: 3rem !important;
}

@media (max-width: 767px) {
  .py-5 {
    padding-bottom: 2rem !important;
  }
}

.montacargas-hero .page-hero-spacing {
  margin-bottom: clamp(3rem, 12vh, 120px);
}

/* ================================
   Fix: imagen del quote-strip se veía pixeleada al estirarse a
   ancho completo. Se sustituyó la foto por una de mayor resolución
   y se refuerza el overlay oscuro de forma uniforme (el original
   se desvanecía a transparente del lado derecho, exponiendo el
   detalle de la foto).
   ================================ */
.quote-strip::after {
  background: linear-gradient(
    to right,
    hsla(220, 90%, 14%, 0.88),
    hsla(220, 90%, 14%, 0.72) 55%,
    hsla(220, 90%, 14%, 0.6)
  );
}