/* ============================================================
   CAMPO.CSS — Coordinación del Campo
   Estética: tierra cálida · auténtica · rural con dignidad
   Paleta: verde oliva + siena + crema tostada + ocre
   ============================================================ */

:root {
  --campo-verde:      #3d5a1e;
  --campo-verde-mid:  #4d7a25;
  --campo-verde-lt:   #6aaa2e;
  --campo-verde-pale: #f4f9ec;
  --campo-siena:      #8b4513;
  --campo-siena-lt:   #c1621a;
  --campo-ocre:       #b8860b;
  --campo-ocre-lt:    #daa520;
  --campo-crema:      #fef8ed;
  --campo-tierra:     #d2b48c;
}

/* ── Hero Campo ── */
.campo-hero {
  background: var(--campo-verde);
  padding: 5rem 0 4.5rem;
  position: relative;
  overflow: hidden;
}
.campo-hero::before {
  content: '';
  position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 80% 70% at 0% 60%, rgba(61,90,30,.95) 0%, transparent 65%),
    radial-gradient(ellipse 55% 60% at 100% 10%, rgba(184,134,11,.25) 0%, transparent 55%),
    radial-gradient(ellipse 40% 80% at 50% 100%, rgba(139,69,19,.3) 0%, transparent 60%);
  pointer-events: none;
}
/* Textura de granulado de tierra */
.campo-hero::after {
  content: '';
  position: absolute; inset: 0;
  background-image:
    radial-gradient(circle at 20% 80%, rgba(218,165,32,.08) 0%, transparent 40%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='4' height='4'%3E%3Crect width='1' height='1' fill='rgba(255,255,255,0.03)'/%3E%3C/svg%3E");
  pointer-events: none;
}

.campo-hero__inner {
  position: relative; z-index: 2;
  display: grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 3rem; align-items: center;
}
.campo-hero__eyebrow {
  display: inline-flex; align-items: center; gap: .5rem;
  font-family: var(--font-mono);
  font-size: .7rem; letter-spacing: .18em; text-transform: uppercase;
  color: #bef264;
  border: 1px solid rgba(190,242,100,.25);
  padding: .3em 1em; border-radius: var(--r-pill);
  margin-bottom: 1.2rem;
  background: rgba(190,242,100,.08);
}
.campo-hero__title {
  font-family: var(--font-display);
  font-size: clamp(2.4rem, 5vw, 3.8rem);
  font-weight: 900; color: #fff; line-height: 1.1;
  letter-spacing: -.015em; margin-bottom: 1.1rem;
}
.campo-hero__title .tierra { color: var(--campo-ocre-lt); }
.campo-hero__sub {
  font-size: 1rem; color: rgba(255,255,255,.72);
  line-height: 1.75; margin-bottom: 2rem; max-width: 500px;
}
.campo-hero__btns { display: flex; gap: 1rem; flex-wrap: wrap; }

/* Panel de cifras a la derecha */
.campo-hero__cifras {
  display: grid; grid-template-columns: 1fr 1fr; gap: 1rem;
}
.campo-cifra {
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--r-md);
  padding: 1.2rem;
  text-align: center;
  backdrop-filter: blur(8px);
  transition: background var(--t-mid);
}
.campo-cifra:hover { background: rgba(255,255,255,.12); }
.campo-cifra__num {
  font-family: var(--font-display);
  font-size: 2.2rem; font-weight: 700;
  color: var(--campo-ocre-lt); line-height: 1;
  margin-bottom: .3rem;
}
.campo-cifra__lbl {
  font-size: .75rem; color: rgba(255,255,255,.6);
  font-family: var(--font-mono); text-transform: uppercase; letter-spacing: .08em;
}
.campo-cifra__icon { font-size: 1.4rem; margin-bottom: .4rem; }

/* ── Tabs Campo ── */
.campo-tabs {
  display: flex; border-bottom: 2px solid var(--gris-200);
  margin-bottom: var(--gap-lg); overflow-x: auto;
}
.campo-tab {
  padding: .9rem 1.4rem;
  font-weight: 600; font-size: .9rem; color: var(--gris-400);
  border-bottom: 3px solid transparent; margin-bottom: -2px;
  cursor: pointer; white-space: nowrap; transition: all var(--t-fast);
  background: none; border-top: none; border-left: none; border-right: none;
  font-family: var(--font-body);
}
.campo-tab:hover { color: var(--campo-verde-lt); }
.campo-tab.active { color: var(--campo-verde-lt); border-bottom-color: var(--campo-verde-lt); }
.campo-panel { display: none; }
.campo-panel.active { display: block; }

/* ── Tarjetas de productores ── */
.prod-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.2rem;
}

.prod-card {
  background: var(--campo-crema);
  border: 1.5px solid var(--campo-tierra);
  border-radius: var(--r-md);
  overflow: hidden;
  transition: all var(--t-mid);
  display: flex; flex-direction: column;
  position: relative;
}
.prod-card:hover {
  box-shadow: 0 10px 36px rgba(61,90,30,.15);
  transform: translateY(-4px);
  border-color: var(--campo-verde-lt);
}
.prod-card.destacada {
  border-color: var(--campo-ocre);
  background: linear-gradient(160deg, #fefdf5, var(--campo-crema));
}

.prod-card__banner {
  height: 100px;
  display: flex; align-items: center; justify-content: center;
  font-size: 3.2rem; position: relative;
  overflow: hidden;
}
.prod-card__badges {
  position: absolute; top: .6rem; left: .75rem;
  display: flex; gap: .4rem; flex-wrap: wrap;
}
.prod-badge {
  font-size: .62rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .07em; padding: .2em .65em; border-radius: var(--r-pill);
}
.prod-badge--org  { background: #dcfce7; color: #15803d; }
.prod-badge--cert { background: #dbeafe; color: #1e40af; }
.prod-badge--dest { background: var(--campo-ocre); color: #fff; }

.prod-card__body { padding: 1.2rem; flex: 1; display: flex; flex-direction: column; }
.prod-card__tipo-tag {
  display: inline-flex; align-items: center; gap: .35rem;
  font-size: .68rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .08em; padding: .2em .75em; border-radius: var(--r-pill);
  margin-bottom: .6rem;
  background: var(--campo-verde-pale); color: var(--campo-verde-mid);
}
.prod-card__unidad {
  font-family: var(--font-display);
  font-size: 1rem; font-weight: 600; color: var(--azul);
  margin-bottom: .15rem; line-height: 1.25;
}
.prod-card__nombre { font-size: .82rem; color: var(--gris-400); margin-bottom: .5rem; }
.prod-card__desc {
  font-size: .82rem; color: var(--gris-700);
  line-height: 1.6; margin-bottom: .75rem; flex: 1;
}
.prod-card__productos {
  display: flex; gap: .35rem; flex-wrap: wrap; margin-bottom: .65rem;
}
.prod-tag {
  font-size: .7rem; padding: .2em .7em;
  background: rgba(61,90,30,.1); color: var(--campo-verde-mid);
  border-radius: var(--r-pill); border: 1px solid rgba(61,90,30,.2);
}
.prod-card__precio {
  font-family: var(--font-mono);
  font-size: .78rem; color: var(--campo-siena-lt); font-weight: 600;
  margin-bottom: .6rem;
}
.prod-card__meta {
  font-size: .75rem; color: var(--gris-400);
  font-family: var(--font-mono); margin-bottom: .75rem;
  display: flex; gap: .75rem; flex-wrap: wrap;
}
.prod-card__footer {
  border-top: 1px solid var(--campo-tierra);
  padding: .75rem 1.2rem;
  display: flex; gap: .4rem; flex-wrap: wrap;
  background: rgba(0,0,0,.02);
}

/* ── Mapa placeholder con Leaflet ── */
.mapa-campo-wrap {
  background: var(--campo-verde-pale);
  border: 1.5px solid rgba(61,90,30,.2);
  border-radius: var(--r-lg);
  overflow: hidden;
  position: relative;
  min-height: 400px;
}
#mapa-productores {
  width: 100%; height: 420px;
  border-radius: var(--r-lg);
}
.mapa-leyenda {
  position: absolute; bottom: 1rem; right: 1rem;
  background: rgba(255,255,255,.95);
  border-radius: var(--r-md);
  padding: .75rem 1rem;
  box-shadow: var(--sombra-md);
  font-size: .78rem;
  z-index: 500;
}
.mapa-leyenda__item {
  display: flex; align-items: center; gap: .5rem; margin-bottom: .35rem;
}
.mapa-leyenda__dot {
  width: 12px; height: 12px; border-radius: 50%; flex-shrink: 0;
}

/* ── Formulario pre-gestión constancia ── */
.constancia-form-wrap {
  background: var(--campo-verde-pale);
  border: 1.5px solid rgba(61,90,30,.2);
  border-radius: var(--r-lg);
  padding: 2.4rem;
}
.constancia-tipos {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem;
  margin-bottom: 1.5rem;
}
.constancia-tipo-btn {
  border: 2px solid var(--gris-200);
  border-radius: var(--r-md);
  padding: 1.2rem;
  text-align: center; cursor: pointer;
  transition: all var(--t-mid); background: #fff;
  font-family: var(--font-body);
}
.constancia-tipo-btn:hover {
  border-color: var(--campo-verde-lt);
  background: var(--campo-verde-pale);
}
.constancia-tipo-btn.selected {
  border-color: var(--campo-verde-mid);
  background: var(--campo-verde-pale);
  box-shadow: 0 0 0 3px rgba(77,122,37,.15);
}
.constancia-tipo-btn__icon { font-size: 2rem; margin-bottom: .5rem; }
.constancia-tipo-btn__label { font-weight: 600; font-size: .9rem; color: var(--azul); }
.constancia-tipo-btn__sub   { font-size: .72rem; color: var(--gris-400); margin-top: .2rem; }

/* ── Convocatorias campo ── */
.campo-conv-card {
  background: var(--campo-crema);
  border: 1.5px solid var(--campo-tierra);
  border-radius: var(--r-md);
  padding: 1.4rem 1.6rem;
  display: flex; gap: 1.2rem; align-items: flex-start;
  transition: all var(--t-mid);
  position: relative; overflow: hidden;
}
.campo-conv-card::before {
  content: '';
  position: absolute; left: 0; top: 0; bottom: 0; width: 5px;
  background: var(--campo-verde-mid);
  border-radius: 0 3px 3px 0;
}
.campo-conv-card:hover {
  box-shadow: 0 6px 24px rgba(61,90,30,.12);
  transform: translateX(4px);
}

/* ── Drone Agrícola — diseño para baja alfabetización ──────────────
   Principios: texto grande, lenguaje llano, opciones visuales,
   un solo campo obligatorio (WhatsApp), confirmación clara
   ───────────────────────────────────────────────────────────────── */

/* Hero del servicio */
.drone-hero {
  background: linear-gradient(135deg, #1a3a0a 0%, var(--campo-verde) 60%, #2d5a14 100%);
  border-radius: var(--r-lg);
  padding: 2.4rem 2rem;
  display: flex; gap: 1.8rem; align-items: center;
  margin-bottom: 2.5rem; position: relative; overflow: hidden;
}
.drone-hero::after {
  content: '🚁';
  position: absolute; right: 1.5rem; bottom: -1rem;
  font-size: 8rem; opacity: .08; pointer-events: none;
  transform: scaleX(-1);
}
.drone-hero__icon {
  font-size: 4rem; flex-shrink: 0;
  animation: droneFloat 4s ease-in-out infinite;
}
@keyframes droneFloat {
  0%,100% { transform: translateY(0) rotate(-3deg); }
  50%      { transform: translateY(-10px) rotate(3deg); }
}
.drone-hero__eyebrow {
  font-family: var(--font-mono); font-size: .72rem;
  text-transform: uppercase; letter-spacing: .14em;
  color: #bef264; margin-bottom: .4rem;
}
.drone-hero__title {
  font-family: var(--font-display);
  font-size: clamp(1.8rem, 3.5vw, 2.6rem);
  font-weight: 800; color: #fff; line-height: 1.1; margin-bottom: .6rem;
}
.drone-hero__desc {
  font-size: 1rem; color: rgba(255,255,255,.8); line-height: 1.65;
}
.drone-hero__desc strong { color: #bef264; }

/* Pasos ilustrados */
.drone-pasos {
  display: flex; align-items: flex-start;
  gap: 0; margin-bottom: 2rem; flex-wrap: wrap;
}
.drone-paso {
  flex: 1; min-width: 180px;
  background: #fff;
  border: 2px solid var(--gris-200);
  border-radius: var(--r-md);
  padding: 1.6rem 1.2rem;
  text-align: center;
  transition: all var(--t-mid);
  position: relative;
}
.drone-paso:hover {
  border-color: var(--campo-verde-lt);
  box-shadow: 0 6px 24px rgba(61,90,30,.1);
  transform: translateY(-3px);
}
.drone-paso__num {
  position: absolute; top: -14px; left: 50%;
  transform: translateX(-50%);
  width: 28px; height: 28px; border-radius: 50%;
  background: var(--campo-verde-mid); color: #fff;
  font-weight: 800; font-size: .9rem;
  display: flex; align-items: center; justify-content: center;
  border: 3px solid #fff;
  box-shadow: 0 2px 8px rgba(61,90,30,.25);
}
.drone-paso__icono { font-size: 2.8rem; margin-bottom: .6rem; }
.drone-paso__titulo {
  font-family: var(--font-display);
  font-size: 1.05rem; font-weight: 700;
  color: var(--azul); margin-bottom: .4rem;
}
.drone-paso__desc { font-size: .88rem; color: var(--gris-700); line-height: 1.55; }
.drone-paso__flecha {
  align-self: center; font-size: 2rem; color: var(--campo-tierra);
  padding: 0 .5rem; flex-shrink: 0; font-weight: 700;
}

/* Aviso importante */
.drone-aviso {
  display: flex; gap: 1rem; align-items: flex-start;
  background: #fff8e1;
  border: 2px solid #f9a825;
  border-radius: var(--r-md);
  padding: 1.2rem 1.4rem;
  margin-bottom: 2rem;
}
.drone-aviso__icon { font-size: 1.6rem; flex-shrink: 0; }
.drone-aviso__titulo { font-weight: 700; font-size: .95rem; color: #e65100; margin-bottom: .3rem; }
.drone-aviso__texto  { font-size: .9rem; color: #4e342e; line-height: 1.6; }
.drone-aviso__texto strong { color: #bf360c; }

/* Formulario principal */
.drone-form-wrap {
  background: var(--campo-crema);
  border: 2px solid var(--campo-tierra);
  border-radius: var(--r-lg);
  padding: 2.4rem 2rem;
  max-width: 680px;
  margin-bottom: 2.5rem;
}
.drone-form-titulo {
  font-family: var(--font-display);
  font-size: clamp(1.4rem, 3vw, 2rem);
  font-weight: 800; color: var(--campo-verde);
  margin-bottom: .3rem; line-height: 1.2;
}
.drone-form-subtitulo {
  font-size: 1rem; color: var(--gris-700); margin-bottom: 1.8rem;
}

/* Campos del formulario — tamaño aumentado para facilitar uso */
.drone-campo { margin-bottom: 1.8rem; }

.drone-label {
  display: block; font-size: 1.05rem; font-weight: 700;
  color: var(--azul); margin-bottom: .4rem; line-height: 1.4;
}
.drone-label-grande {
  display: block; font-size: 1.2rem; font-weight: 800;
  color: var(--azul); margin-bottom: .4rem; line-height: 1.4;
}
.drone-label-hint {
  font-size: .9rem; color: var(--gris-400); margin-bottom: .5rem; line-height: 1.5;
}
.drone-opcional {
  font-weight: 400; font-size: .88rem; color: var(--gris-400);
}

/* Input principal (WhatsApp) — extra grande */
.drone-campo-principal { margin-bottom: 2rem; }
.drone-input-grande {
  width: 100%;
  padding: 1rem 1.4rem;
  font-size: 1.5rem;          /* Grande para dígitos */
  font-family: var(--font-mono);
  letter-spacing: .15em;
  border: 3px solid var(--campo-tierra);
  border-radius: var(--r-md);
  background: #fff;
  color: var(--negro);
  transition: border-color var(--t-fast), box-shadow var(--t-fast);
  -webkit-appearance: none;
}
.drone-input-grande:focus {
  outline: none;
  border-color: var(--campo-verde-mid);
  box-shadow: 0 0 0 4px rgba(77,122,37,.2);
}
.drone-input-grande::placeholder { color: var(--campo-tierra); opacity: .5; font-size: 1.2rem; }

.drone-input {
  width: 100%;
  padding: .85rem 1.1rem;
  font-size: 1.05rem;
  border: 2px solid var(--campo-tierra);
  border-radius: var(--r-sm);
  background: #fff;
  color: var(--negro);
  transition: border-color var(--t-fast);
  -webkit-appearance: none;
}
.drone-input:focus {
  outline: none;
  border-color: var(--campo-verde-mid);
  box-shadow: 0 0 0 3px rgba(77,122,37,.15);
}

.drone-input-error {
  background: #fef2f2; border-radius: var(--r-sm);
  padding: .5rem .8rem; margin-top: .4rem;
  font-size: .9rem; color: #dc2626; font-weight: 600;
}

/* Opciones de uso — botones grandes con icono */
.drone-opciones {
  display: grid; grid-template-columns: repeat(2, 1fr); gap: .75rem;
  margin-top: .4rem;
}
.drone-opcion { cursor: pointer; }
.drone-opcion input.drone-radio { position: absolute; opacity: 0; width: 0; height: 0; }
.drone-opcion__caja {
  display: flex; flex-direction: column; align-items: center;
  gap: .5rem; padding: 1.1rem .8rem;
  background: #fff; border: 2.5px solid var(--campo-tierra);
  border-radius: var(--r-md); text-align: center;
  transition: all var(--t-fast);
  cursor: pointer;
}
.drone-opcion__caja:hover {
  border-color: var(--campo-verde-lt);
  background: var(--campo-verde-pale);
}
.drone-opcion input.drone-radio:checked + .drone-opcion__caja {
  border-color: var(--campo-verde-mid);
  background: var(--campo-verde-pale);
  box-shadow: 0 0 0 3px rgba(77,122,37,.2);
}
.drone-opcion__icono { font-size: 2.2rem; }
.drone-opcion__texto {
  font-size: .9rem; font-weight: 600; color: var(--azul); line-height: 1.3;
}

/* Botón de envío — muy grande, llamativo, inconfundible */
.drone-btn-enviar {
  display: flex; align-items: center; justify-content: center;
  gap: .75rem;
  width: 100%; padding: 1.3rem 2rem;
  background: linear-gradient(135deg, var(--campo-verde-mid), var(--campo-verde-lt));
  color: #fff; border: none; border-radius: var(--r-pill);
  font-family: var(--font-display);
  font-size: 1.3rem; font-weight: 800;
  cursor: pointer; margin-top: 1.5rem;
  box-shadow: 0 6px 24px rgba(61,90,30,.35);
  transition: all var(--t-mid);
  letter-spacing: .01em;
}
.drone-btn-enviar:hover {
  background: linear-gradient(135deg, var(--campo-verde), var(--campo-verde-mid));
  transform: translateY(-2px);
  box-shadow: 0 10px 32px rgba(61,90,30,.45);
}
.drone-btn-enviar:disabled {
  opacity: .7; cursor: wait; transform: none;
}
.drone-btn-enviar__icono { font-size: 1.6rem; }
.drone-btn-enviar__texto { line-height: 1; }

.drone-aviso-final {
  text-align: center; font-size: .82rem; color: var(--gris-400);
  margin-top: 1rem; line-height: 1.5;
}

/* Pantalla de confirmación */
.drone-confirmacion {
  text-align: center; padding: 2rem 1rem;
  animation: fadeUp .4s ease;
}
.drone-confirmacion__icono { font-size: 5rem; margin-bottom: .75rem; }
.drone-confirmacion__titulo {
  font-family: var(--font-display);
  font-size: 1.8rem; font-weight: 800;
  color: var(--campo-verde); margin-bottom: .75rem;
}
.drone-confirmacion__texto {
  font-size: 1.05rem; color: var(--gris-700); line-height: 1.7;
  max-width: 500px; margin: 0 auto 1.2rem;
}
.drone-confirmacion__folio {
  display: inline-block;
  background: var(--campo-verde); color: #fff;
  border-radius: var(--r-md); padding: .75rem 1.5rem;
  margin: .5rem auto 1.5rem; font-size: .95rem;
}
.drone-confirmacion__nota {
  font-size: .9rem; color: var(--gris-700); line-height: 1.6;
  max-width: 460px; margin: 0 auto 1.5rem;
}
.drone-confirmacion__nota a { color: var(--campo-verde-mid); font-weight: 700; }
.drone-btn-nueva {
  background: transparent; border: 2px solid var(--campo-verde-mid);
  color: var(--campo-verde-mid); border-radius: var(--r-pill);
  padding: .65rem 1.6rem; font-size: .95rem; font-weight: 600;
  cursor: pointer; transition: all var(--t-fast); font-family: var(--font-body);
}
.drone-btn-nueva:hover {
  background: var(--campo-verde-mid); color: #fff;
}

/* FAQ drone */
.drone-faq {
  max-width: 680px; margin-top: 2rem;
}
.drone-faq__titulo {
  font-family: var(--font-display);
  font-size: 1.3rem; color: var(--azul);
  margin-bottom: 1.2rem; padding-bottom: .5rem;
  border-bottom: 2px solid var(--campo-tierra);
}
.drone-faq__item {
  display: flex; gap: 1rem; align-items: flex-start;
  padding: .9rem 0;
  border-bottom: 1px solid var(--campo-tierra);
}
.drone-faq__item:last-child { border-bottom: none; }
.drone-faq__pregunta { font-size: 1.4rem; flex-shrink: 0; }
.drone-faq__q { font-weight: 700; font-size: .98rem; color: var(--azul); margin-bottom: .2rem; }
.drone-faq__a { font-size: .92rem; color: var(--gris-700); line-height: 1.6; }
.drone-faq__a strong { color: var(--campo-verde); }
.drone-faq__a a { color: var(--campo-verde-mid); font-weight: 700; }

/* ── Responsive Drone ── */
@media (max-width: 768px) {
  .drone-hero       { flex-direction: column; text-align: center; }
  .drone-hero__icon { font-size: 3.5rem; }
  .drone-pasos      { flex-direction: column; }
  .drone-paso__flecha{ transform: rotate(90deg); align-self: center; padding: .25rem 0; }
  .drone-opciones   { grid-template-columns: 1fr 1fr; }
  .drone-form-wrap  { padding: 1.6rem 1.2rem; }
}
@media (max-width: 420px) {
  .drone-opciones        { grid-template-columns: 1fr; }
  .drone-btn-enviar      { font-size: 1.1rem; }
  .drone-input-grande    { font-size: 1.2rem; }
}

/* ── Tarjetas de equipo para maquinaria ── */
.maq-equipo-card {
  background: #fff;
  border: 2px solid var(--campo-tierra);
  border-radius: var(--r-md);
  padding: 1.2rem;
  text-align: center;
  cursor: pointer;
  transition: all var(--t-mid);
}
.maq-equipo-card:hover,
.maq-equipo-card.selected {
  border-color: var(--campo-siena);
  background: linear-gradient(160deg, #fdf5f0, #fff);
  box-shadow: 0 6px 20px rgba(139,69,19,.15);
  transform: translateY(-3px);
}
.maq-equipo-card.selected { box-shadow: 0 0 0 3px rgba(139,69,19,.2); }
.maq-equipo-card__icon  { font-size: 2.4rem; margin-bottom: .5rem; }
.maq-equipo-card__nombre {
  font-family: var(--font-display);
  font-size: .9rem; font-weight: 700;
  color: var(--campo-siena); margin-bottom: .3rem;
}
.maq-equipo-card__desc {
  font-size: .78rem; color: var(--gris-700); line-height: 1.5;
}

/* ============================================================
   PROMOCION.CSS — Departamento de Promoción Económica
   Estética: corporativo-oscuro · datos · inversión · potencia
   Paleta: azul medianoche + cian eléctrico + ámbar oro
   ============================================================ */

:root {
  --prom-dark:      #050d1a;
  --prom-navy:      #0a1628;
  --prom-blue:      #1e3a5f;
  --prom-cyan:      #06b6d4;
  --prom-cyan-lt:   #22d3ee;
  --prom-cyan-pale: #ecfeff;
  --prom-gold:      #f59e0b;
  --prom-gold-lt:   #fbbf24;
  --prom-green:     #10b981;
  --prom-red:       #ef4444;
}

/* ── Hero Promoción Económica ── */
.prom-hero {
  background: var(--prom-dark);
  padding: 5.5rem 0 5rem;
  position: relative; overflow: hidden;
  min-height: 540px; display: flex; align-items: center;
}
/* Grilla de puntos - efecto tecnológico */
.prom-hero::before {
  content: '';
  position: absolute; inset: 0;
  background-image:
    radial-gradient(circle at 20% 40%, rgba(6,182,212,.12) 0%, transparent 50%),
    radial-gradient(circle at 80% 70%, rgba(245,158,11,.08) 0%, transparent 45%),
    radial-gradient(circle at 50% 100%, rgba(30,58,95,.6) 0%, transparent 60%);
  pointer-events: none;
}
/* Grid lines decorativas */
.prom-hero::after {
  content: '';
  position: absolute; inset: 0;
  background-image:
    linear-gradient(rgba(6,182,212,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(6,182,212,.04) 1px, transparent 1px);
  background-size: 60px 60px;
  pointer-events: none;
}

.prom-hero__inner {
  position: relative; z-index: 2; width: 100%;
  display: grid; grid-template-columns: 1.1fr .9fr;
  gap: 3.5rem; align-items: center;
}
.prom-hero__eyebrow {
  display: inline-flex; align-items: center; gap: .5rem;
  font-family: var(--font-mono);
  font-size: .7rem; letter-spacing: .2em; text-transform: uppercase;
  color: var(--prom-cyan-lt);
  border: 1px solid rgba(6,182,212,.3);
  padding: .3em 1em; border-radius: var(--r-pill);
  margin-bottom: 1.4rem;
  background: rgba(6,182,212,.06);
}
.prom-hero__title {
  font-family: var(--font-display);
  font-size: clamp(2.2rem, 4.5vw, 3.8rem);
  font-weight: 900; color: #fff; line-height: 1.1;
  letter-spacing: -.02em; margin-bottom: 1.2rem;
}
.prom-hero__title .cyan  { color: var(--prom-cyan); }
.prom-hero__title .gold  { color: var(--prom-gold); }
.prom-hero__sub {
  font-size: 1rem; color: rgba(255,255,255,.65);
  line-height: 1.75; margin-bottom: 2rem; max-width: 500px;
}
.prom-hero__btns { display: flex; gap: 1rem; flex-wrap: wrap; }

/* Métricas en hero */
.prom-hero__metricas {
  display: grid; grid-template-columns: 1fr 1fr; gap: .75rem;
}
.prom-metrica {
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--r-md); padding: 1.2rem 1.4rem;
  transition: all var(--t-mid);
  position: relative; overflow: hidden;
}
.prom-metrica::before {
  content: '';
  position: absolute; bottom: 0; left: 0; right: 0; height: 2px;
  background: linear-gradient(90deg, var(--prom-cyan), transparent);
}
.prom-metrica:hover {
  background: rgba(6,182,212,.06);
  border-color: rgba(6,182,212,.2);
}
.prom-metrica__num {
  font-family: var(--font-display);
  font-size: 2rem; font-weight: 700;
  color: var(--prom-cyan); line-height: 1; margin-bottom: .3rem;
}
.prom-metrica__lbl {
  font-size: .72rem; color: rgba(255,255,255,.5);
  font-family: var(--font-mono); text-transform: uppercase; letter-spacing: .08em;
}
.prom-metrica__trend {
  font-size: .75rem; margin-top: .3rem;
  font-family: var(--font-mono);
}
.trend-up   { color: var(--prom-green); }
.trend-down { color: var(--prom-red); }

/* ── Tabs Promoción ── */
.prom-tabs {
  display: flex; border-bottom: 1px solid rgba(255,255,255,.08);
  margin-bottom: var(--gap-lg); overflow-x: auto;
  background: var(--prom-navy);
  border-radius: var(--r-md) var(--r-md) 0 0;
  padding: 0 1rem;
}
.prom-tab {
  padding: 1rem 1.4rem;
  font-weight: 600; font-size: .88rem;
  color: rgba(255,255,255,.45);
  border-bottom: 3px solid transparent; margin-bottom: -1px;
  cursor: pointer; white-space: nowrap; transition: all var(--t-fast);
  background: none; border-top: none; border-left: none; border-right: none;
  font-family: var(--font-body);
}
.prom-tab:hover { color: rgba(255,255,255,.75); }
.prom-tab.active { color: var(--prom-cyan); border-bottom-color: var(--prom-cyan); }
.prom-panel { display: none; }
.prom-panel.active { display: block; }

/* Wrapper oscuro para sección promoción */
.prom-section {
  background: var(--prom-navy);
  border-radius: var(--r-lg);
  padding: 0;
  margin-bottom: 3rem;
  overflow: hidden;
}
.prom-content {
  padding: 2rem;
}

/* ── Directorio industrial ── */
.emp-dir-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1rem;
}

.emp-dir-card {
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--r-md);
  padding: 1.4rem;
  transition: all var(--t-mid);
  display: flex; gap: 1rem; align-items: flex-start;
  position: relative; overflow: hidden;
  cursor: default;
}
.emp-dir-card::after {
  content: '';
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: var(--color-emp, var(--prom-cyan));
  transform: scaleX(0); transform-origin: left;
  transition: transform var(--t-mid);
}
.emp-dir-card:hover {
  background: rgba(6,182,212,.04);
  border-color: rgba(6,182,212,.2);
}
.emp-dir-card:hover::after { transform: scaleX(1); }

.emp-dir-card__logo {
  width: 52px; height: 52px;
  border-radius: var(--r-sm);
  display: flex; align-items: center; justify-content: center;
  font-size: 1.5rem; flex-shrink: 0;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.08);
}
.emp-dir-card__nombre {
  font-family: var(--font-display);
  font-size: 1rem; font-weight: 600; color: #fff;
  margin-bottom: .15rem; line-height: 1.25;
}
.emp-dir-card__razon { font-size: .75rem; color: rgba(255,255,255,.4); margin-bottom: .4rem; }
.emp-dir-card__sector {
  font-size: .68rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .08em; padding: .2em .7em; border-radius: var(--r-pill);
  background: rgba(6,182,212,.12); color: var(--prom-cyan);
  display: inline-block; margin-bottom: .5rem;
}
.emp-dir-card__desc {
  font-size: .82rem; color: rgba(255,255,255,.55); line-height: 1.55;
  margin-bottom: .75rem;
}
.emp-dir-card__meta {
  display: flex; gap: 1rem; flex-wrap: wrap;
  font-family: var(--font-mono); font-size: .72rem;
  color: rgba(255,255,255,.4);
}
.emp-dir-card__meta-item { display: flex; align-items: center; gap: .3rem; }
.emp-dir-card__vacantes {
  display: inline-flex; align-items: center; gap: .35rem;
  font-size: .72rem; font-weight: 700;
  background: rgba(16,185,129,.15); color: #34d399;
  padding: .2em .7em; border-radius: var(--r-pill);
  margin-top: .5rem;
}
.emp-dir-card__certs {
  display: flex; gap: .35rem; flex-wrap: wrap; margin-top: .5rem;
}
.cert-tag {
  font-size: .65rem; padding: .15em .6em;
  background: rgba(255,255,255,.06); color: rgba(255,255,255,.45);
  border-radius: var(--r-pill); border: 1px solid rgba(255,255,255,.08);
}
.emp-dir-card__actions {
  display: flex; gap: .4rem; margin-top: .75rem; flex-wrap: wrap;
}
.btn-cyan {
  background: rgba(6,182,212,.15); color: var(--prom-cyan);
  border: 1px solid rgba(6,182,212,.3);
  padding: .4rem .9rem; border-radius: var(--r-pill);
  font-size: .78rem; font-weight: 600; cursor: pointer;
  transition: all var(--t-fast); font-family: var(--font-body);
}
.btn-cyan:hover { background: rgba(6,182,212,.25); }

/* ── Zonas industriales ── */
.zona-filter-bar {
  display: flex; gap: .5rem; margin-bottom: 1.5rem; flex-wrap: wrap;
}
.zona-btn {
  padding: .45rem 1rem;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: var(--r-pill);
  font-size: .82rem; font-weight: 500;
  color: rgba(255,255,255,.55); cursor: pointer;
  transition: all var(--t-fast); background: transparent;
  font-family: var(--font-body);
}
.zona-btn:hover { border-color: rgba(6,182,212,.4); color: var(--prom-cyan); }
.zona-btn.active {
  background: rgba(6,182,212,.12);
  border-color: var(--prom-cyan); color: var(--prom-cyan);
}

/* ── Oportunidades de inversión ── */
.oport-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem;
}
.oport-card {
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  border-radius: var(--r-md); padding: 1.6rem;
  transition: all var(--t-mid); position: relative; overflow: hidden;
}
.oport-card::before {
  content: '';
  position: absolute; inset: 0;
  background: radial-gradient(circle at 80% 20%, rgba(6,182,212,.06) 0%, transparent 60%);
  pointer-events: none;
}
.oport-card:hover {
  border-color: rgba(6,182,212,.25);
  background: rgba(6,182,212,.05);
  transform: translateY(-3px);
  box-shadow: 0 12px 40px rgba(0,0,0,.3);
}
.oport-card__icono { font-size: 2rem; margin-bottom: .75rem; }
.oport-card__tipo {
  font-family: var(--font-mono); font-size: .68rem;
  text-transform: uppercase; letter-spacing: .12em;
  color: var(--prom-cyan); margin-bottom: .4rem;
}
.oport-card__titulo {
  font-family: var(--font-display);
  font-size: 1.1rem; font-weight: 600; color: #fff;
  margin-bottom: .5rem; line-height: 1.3;
}
.oport-card__desc {
  font-size: .83rem; color: rgba(255,255,255,.55); line-height: 1.6; margin-bottom: 1rem;
}
.oport-card__dato {
  font-family: var(--font-mono); font-size: .78rem;
  color: var(--prom-gold); margin-bottom: .25rem;
  display: flex; align-items: center; gap: .4rem;
}

/* Formulario inversión */
.inv-form-wrap {
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(6,182,212,.15);
  border-radius: var(--r-lg); padding: 2.4rem;
  margin-top: 2rem;
}
.inv-form-wrap .form-input,
.inv-form-wrap .form-select,
.inv-form-wrap .form-textarea {
  background: rgba(255,255,255,.05);
  border-color: rgba(255,255,255,.1);
  color: #fff;
}
.inv-form-wrap .form-input:focus,
.inv-form-wrap .form-select:focus {
  border-color: var(--prom-cyan);
  box-shadow: 0 0 0 3px rgba(6,182,212,.12);
}
.inv-form-wrap .form-label { color: rgba(255,255,255,.75); }
.inv-form-wrap .form-input::placeholder { color: rgba(255,255,255,.3); }
.inv-form-wrap .form-select option { background: var(--prom-navy); color: #fff; }

/* ── Responsive Campo + Promoción ── */
@media (max-width: 1024px) {
  .campo-hero__inner  { grid-template-columns: 1fr; }
  .campo-hero__cifras { grid-template-columns: repeat(4,1fr); }
  .prom-hero__inner   { grid-template-columns: 1fr; }
  .prom-hero__metricas{ grid-template-columns: repeat(4,1fr); }
  .prod-grid     { grid-template-columns: repeat(2,1fr); }
  .emp-dir-grid  { grid-template-columns: 1fr; }
  .oport-grid    { grid-template-columns: repeat(2,1fr); }
  .constancia-tipos { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
  .prod-grid      { grid-template-columns: 1fr; }
  .oport-grid     { grid-template-columns: 1fr; }
  .campo-hero__cifras  { grid-template-columns: repeat(2,1fr); }
  .prom-hero__metricas { grid-template-columns: repeat(2,1fr); }
  .constancia-tipos    { grid-template-columns: 1fr; }
}
